Add HTML formatting to pre-commit

.pre-commit-config.yaml

@@ -85,3 +85,15 @@ repos:
             - "--target-version=py36"
             - "--target-version=py37"
             - "--target-version=py38"
+
+  - repo: https://github.com/Riverside-Healthcare/djLint
+    rev: v1.31.1
+    hooks:
+      - id: djlint-reformat
+        args:
+          - OpenOversight/app/templates
+          - --format-js
+          - --format-css
+          - --profile=jinja
+          - --indent=2
+          - --quiet

OpenOversight/app/templates/403.html

@@ -1,12 +1,12 @@
 {% extends "base.html" %}
-{% block title %}Forbidden{% endblock %}
-
+{% block title %}
+  Forbidden
+{% endblock title %}
 {% block content %}
-
-<div class="container theme-showcase" role="main">
-
-<h1>Forbidden</h1>
-<p>You do not have permissions to view this page. <a href="{{ url_for('main.index') }}">Return to homepage</a>.</p>
-
-</div>
-{% endblock %}
+  <div class="container theme-showcase" role="main">
+    <h1>Forbidden</h1>
+    <p>
+      You do not have permissions to view this page. <a href="{{ url_for("main.index") }}">Return to homepage</a>.
+    </p>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/404.html

@@ -1,12 +1,12 @@
 {% extends "base.html" %}
-{% block title %}Page Not Found{% endblock %}
-
+{% block title %}
+  Page Not Found
+{% endblock title %}
 {% block content %}
-
-<div class="container theme-showcase" role="main">
-
-<h1>Page Not Found</h1>
-<p>We couldn't find the page you are looking for. <a href="{{ url_for('main.index') }}">Return to homepage</a>.</p>
-
-</div>
-{% endblock %}
+  <div class="container theme-showcase" role="main">
+    <h1>Page Not Found</h1>
+    <p>
+      We couldn't find the page you are looking for. <a href="{{ url_for("main.index") }}">Return to homepage</a>.
+    </p>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/413.html

@@ -1,12 +1,12 @@
 {% extends "base.html" %}
-{% block title %}File Too Large{% endblock %}
-
+{% block title %}
+  File Too Large
+{% endblock title %}
 {% block content %}
-
-<div class="container theme-showcase" role="main">
-
-<h1>File Too Large</h1>
-<p>The file you are trying to upload is too large. <a href="{{ url_for('main.index') }}">Return to homepage</a>.</p>
-
-</div>
-{% endblock %}
+  <div class="container theme-showcase" role="main">
+    <h1>File Too Large</h1>
+    <p>
+      The file you are trying to upload is too large. <a href="{{ url_for("main.index") }}">Return to homepage</a>.
+    </p>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/429.html

@@ -1,12 +1,12 @@
 {% extends "base.html" %}
-{% block title %}Too Many Requests{% endblock %}
-
+{% block title %}
+  Too Many Requests
+{% endblock title %}
 {% block content %}
-
-<div class="container theme-showcase" role="main">
-
-<h1>Too Many Requests</h1>
-<p>You're sending requests too fast. Wait a minute and try again. <a href="{{ url_for('main.index') }}">Return to homepage</a>.</p>
-
-</div>
-{% endblock %}
+  <div class="container theme-showcase" role="main">
+    <h1>Too Many Requests</h1>
+    <p>
+      You're sending requests too fast. Wait a minute and try again. <a href="{{ url_for("main.index") }}">Return to homepage</a>.
+    </p>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/500.html

@@ -1,12 +1,12 @@
 {% extends "base.html" %}
-{% block title %}Internal Server Error{% endblock %}
-
+{% block title %}
+  Internal Server Error
+{% endblock title %}
 {% block content %}
-
-<div class="container theme-showcase" role="main">
-
-<h1>Internal Server Error</h1>
-<p>Oops! Something went wrong. <a href="{{ url_for('main.index') }}">Return to homepage</a>.</p>
-
-</div>
-{% endblock %}
+  <div class="container theme-showcase" role="main">
+    <h1>Internal Server Error</h1>
+    <p>
+      Oops! Something went wrong. <a href="{{ url_for("main.index") }}">Return to homepage</a>.
+    </p>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/add_edit_department.html

@@ -1,48 +1,54 @@
 {% extends "base.html" %}
 {% import "bootstrap/wtf.html" as wtf %}
-
-{% block title %}OpenOversight Admin - {% if update %} Update {% else %} Add {% endif %} Department{% endblock %}
-
+{% block title %}
+  OpenOversight Admin -
+  {% if update %}
+    Update
+  {% else %}
+    Add
+  {% endif %}
+  Department
+{% endblock title %}
 {% block content %}
-<div class="container theme-showcase" role="main">
-
-<div class="page-header">
-    <h1>{% if update %} Update {% else %} Add {% endif %} Department</h1>
-</div>
-<div class="col-md-6">
-    <form class="form" method="post" role="form">
+  <div class="container theme-showcase" role="main">
+    <div class="page-header">
+      <h1>
+        {% if update %}
+          Update
+        {% else %}
+          Add
+        {% endif %}
+        Department
+      </h1>
+    </div>
+    <div class="col-md-6">
+      <form class="form" method="post" role="form">
         {{ form.hidden_tag() }}
         {{ wtf.form_errors(form, hiddens="only") }}
-
         {{ wtf.form_field(form.name, autofocus="autofocus") }}
         {{ wtf.form_field(form.short_name) }}
         <div class="sortable sortable-fields">
           <legend>{{ form.jobs.label }}</legend>
           <div>
             <h5>Enter ranks in hierarchical order, from lowest to highest rank:</h5>
           </div>
-          <div class="text-danger">
-            {{ wtf.form_errors(form.jobs, hiddens="only") }}
-          </div>
+          <div class="text-danger">{{ wtf.form_errors(form.jobs, hiddens="only") }}</div>
           {% if form.jobs|length > 1 %}
             {% for subfield in (form.jobs|rejectattr('data.is_sworn_officer','eq',False)|sort(attribute='data.order')|list) %}
-            <fieldset>
-              <div class="input-group {% if subfield.errors %} has-error{% endif -%}
-                         {%- if subfield.flags.required %} required{% endif -%}">
-                <div class="input-group-addon">
-                  <span class="glyphicon glyphicon-sort" aria-hidden="true"></span>
+              <fieldset>
+                <div class="input-group {% if subfield.errors %} has-error{% endif -%} {%- if subfield.flags.required %} required{% endif -%}">
+                  <div class="input-group-addon">
+                    <span class="glyphicon glyphicon-sort" aria-hidden="true"></span>
+                  </div>
+                  {{ subfield(class="form-control") |safe }}
+                  <span class="input-group-btn">
+                    <button class="btn btn-danger js-remove-button" disabled>Remove</button>
+                  </span>
+                  {%- if subfield.errors %}
+                    {%- for error in subfield.errors %}<p class="help-block">{{ error }}</p>{%- endfor %}
+                  {%- endif %}
                 </div>
-                {{ subfield(class="form-control")|safe}}
-                <span class="input-group-btn">
-                  <button class="btn btn-danger js-remove-button" disabled>Remove</button>
-                </span>
-                {%- if subfield.errors %}
-                  {%- for error in subfield.errors %}
-                    <p class="help-block">{{error}}</p>
-                  {%- endfor %}
-                {%- endif %}
-              </div>
-            </fieldset>
+              </fieldset>
             {% endfor %}
           {% else %}
             <fieldset>
@@ -57,9 +63,8 @@ <h5>Enter ranks in hierarchical order, from lowest to highest rank:</h5>
           <button class="btn btn-success js-add-another-button" disabled>Add another rank</button>
         </div>
         {{ wtf.form_field(form.submit, id="submit", button_map={'submit':'primary'}) }}
-    </form>
-    <br>
-</div>
-
-</div>
-{% endblock %}
+      </form>
+      <br>
+    </div>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/add_edit_salary.html

@@ -1,25 +1,39 @@
 {% extends "base.html" %}
 {% import "bootstrap/wtf.html" as wtf %}
-{% block title %}OpenOversight Admin - {% if update %} Edit {% else %} Add {% endif %} Officer Salary{% endblock %}
-
+{% block title %}
+  OpenOversight Admin -
+  {% if update %}
+    Edit
+  {% else %}
+    Add
+  {% endif %}
+  Officer Salary
+{% endblock title %}
 {% block content %}
-<div class="container theme-showcase" role="main">
-
-<div class="page-header">
-    <h1>{% if update %} Edit {% else %} Add {% endif %} Officer Salary</h1>
-</div>
-<div class="col-md-6">
-    <form class="form" method="post" role="form">
+  <div class="container theme-showcase" role="main">
+    <div class="page-header">
+      <h1>
+        {% if update %}
+          Edit
+        {% else %}
+          Add
+        {% endif %}
+        Officer Salary
+      </h1>
+    </div>
+    <div class="col-md-6">
+      <form class="form" method="post" role="form">
         {{ form.hidden_tag() }}
         {{ wtf.form_errors(form, hiddens="only") }}
         {{ wtf.form_field(form.salary) }}
         {{ wtf.form_field(form.overtime_pay) }}
         {{ wtf.form_field(form.year) }}
         {{ wtf.form_field(form.is_fiscal_year) }}
-        <input class="btn btn-primary btn-lg" type="submit" value="{% if update %} Edit {% else %} Add {% endif %}" />
-    </form>
-    <br>
-</div>
-
-</div>
-{% endblock %}
+        <input class="btn btn-primary btn-lg"
+               type="submit"
+               value="{% if update %} Edit {% else %} Add {% endif %}" />
+      </form>
+      <br>
+    </div>
+  </div>
+{% endblock content %}

OpenOversight/app/templates/add_officer.html

@@ -1,15 +1,19 @@
 {% extends "base.html" %}
 {% import "bootstrap/wtf.html" as wtf %}
-{% block title %}OpenOversight Admin - Add New Officer{% endblock %}
-
+{% block title %}
+  OpenOversight Admin - Add New Officer
+{% endblock title %}
 {% block content %}
-<div class="container theme-showcase" role="main">
-
-<div class="page-header">
-    <h1>Add Officer</h1>
-</div>
-<div class="col-md-6">
-    <form class="form" method="post" role="form" id="add-officer-form" data-jobs-url="{{ url_for('main.get_dept_ranks') }}">
+  <div class="container theme-showcase" role="main">
+    <div class="page-header">
+      <h1>Add Officer</h1>
+    </div>
+    <div class="col-md-6">
+      <form class="form"
+            method="post"
+            role="form"
+            id="add-officer-form"
+            data-jobs-url="{{ url_for("main.get_dept_ranks") }}">
         {{ form.hidden_tag() }}
         {{ wtf.form_errors(form, hiddens="only") }}
         {{ wtf.form_field(form.department) }}
@@ -23,35 +27,36 @@ <h1>Add Officer</h1>
         {{ wtf.form_field(form.unique_internal_identifier) }}
         {{ wtf.form_field(form.job_id) }}
         {{ wtf.form_field(form.unit) }}
-        <h4><small><a href="{{ url_for( 'main.add_unit' )}}">Don't see your unit? Add one!</a></small></h4>
+        <h4>
+          <small><a href="{{ url_for("main.add_unit") }}">Don't see your unit? Add one!</a></small>
+        </h4>
         {{ wtf.form_field(form.employment_date) }}
         {{ wtf.form_field(form.birth_year) }}
         <div>
-            <legend>{{ form.salaries.label }}</legend>
-            {% for subform in form.salaries %}
-                {% include "partials/subform.html" %}
-            {% endfor %}
-            <button class="btn btn-success js-add-another-button" disabled>Add another salary</button>
+          <legend>{{ form.salaries.label }}</legend>
+          {% for subform in form.salaries %}
+            {% include "partials/subform.html" %}
+          {% endfor %}
+          <button class="btn btn-success js-add-another-button" disabled>Add another salary</button>
         </div>
         {% include "partials/links_subform.html" %}
         <div>
-            <legend>{{ form.notes.label }}</legend>
-            {% for subform in form.notes %}
-                {% include "partials/subform.html" %}
-            {% endfor %}
-            <button class="btn btn-success js-add-another-button" disabled>Add another note</button>
+          <legend>{{ form.notes.label }}</legend>
+          {% for subform in form.notes %}
+            {% include "partials/subform.html" %}
+          {% endfor %}
+          <button class="btn btn-success js-add-another-button" disabled>Add another note</button>
         </div>
         <div>
-            <legend>{{ form.descriptions.label }}</legend>
-            {% for subform in form.descriptions %}
-                {% include "partials/subform.html" %}
-            {% endfor %}
-            <button class="btn btn-success js-add-another-button" disabled>Add another description</button>
+          <legend>{{ form.descriptions.label }}</legend>
+          {% for subform in form.descriptions %}
+            {% include "partials/subform.html" %}
+          {% endfor %}
+          <button class="btn btn-success js-add-another-button" disabled>Add another description</button>
         </div>
         {{ wtf.form_field(form.submit, id="submit", button_map={'submit':'primary'}) }}
-    </form>
-    <br>
-</div>
-
-</div>
-{% endblock %}
+      </form>
+      <br>
+    </div>
+  </div>
+{% endblock content %}