Skip to content

Commit

Permalink
Incidents, improved detail formatting (OrcaCollective#99)
Browse files Browse the repository at this point in the history
* Add data munging

* Documentation & comments

* Rearrange partials, force column ordering

* Improve long-form text layout

* Only show a cross-street if we have one

* Give the incident detail page more padding on the bottom

* Add ellipses to cut off text

* Only show street name if we have one

* Formatting

* Add "OPA Case" prefix to incident title

* Only show unique internal identifier if it exists

* Add args to just recipes, start stack after fresh start

* Allow incident descriptions to have HTML

* Improve OPA incident description formatting, add officer name

* Remove OPA Case prefix when matching links

* Formatting!

* Remove redundant "Incident" in report number title

* Add "number of known incidents" to general information section

* Allow spaces in incident names (but no other special characters)

* Add known incident count to officer list

* Have acceptance tests be a separate step

This should make it easier to run the regular tests, then the functional ones in dev while not having to run the regular ones twice

* Fix the functional tests based on new description cutoff

* Remove conditional for known incidents
  • Loading branch information
AetherUnbound authored and abandoned-prototype committed Nov 27, 2022
1 parent 8e04f67 commit 4cda564
Show file tree
Hide file tree
Showing 12 changed files with 224 additions and 170 deletions.
4 changes: 2 additions & 2 deletions OpenOversight/app/main/forms.py
Original file line number Diff line number Diff line change
Expand Up @@ -514,8 +514,8 @@ class IncidentForm(DateFieldForm):
report_number = StringField(
validators=[
Regexp(
r"^[a-zA-Z0-9-]*$",
message="Report numbers can contain letters, numbers, and dashes",
r"^[a-zA-Z0-9- ]*$",
message="Report cannot contain special characters (dashes permitted)",
)
],
description="Incident number for the organization tracking incidents",
Expand Down
12 changes: 7 additions & 5 deletions OpenOversight/app/static/js/incidentDescription.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
$(document).ready(function() {
let overflow_length = 500;
$(".incident-description").each(function () {
let description = this;
let incidentId = $( this ).data("incident");
if (description.innerText.length < 300) {
if (description.innerHTML.length < overflow_length) {
$("#description-overflow-row_" + incidentId).hide();
}
if(description.innerText.length > 300) {
let originalDescription = description.innerText;
description.innerText = description.innerText.substring(0, 300);
if(description.innerHTML.length > overflow_length) {
let originalDescription = description.innerHTML;
description.innerHTML = description.innerHTML.substring(0, overflow_length) + "…";
$(`#description-overflow-button_${incidentId}`).on('click', function(event) {
description.innerText = originalDescription;
event.stopImmediatePropagation();
description.innerHTML = originalDescription;
$("#description-overflow-row_" + incidentId).hide();
})
}
Expand Down
32 changes: 16 additions & 16 deletions OpenOversight/app/templates/incident_detail.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@
{% set incident = obj %}
{% block title %}{{ incident.department.name }} incident{% if incident.report_number %} {{incident.report_number}}{% endif %} - OpenOversight{% endblock %}
{% block meta %}
{% if incident.description != None %}
<meta name="description" content="{{ incident.description }}">
{% else %}
<meta name="description" content="View details for {{ incident.department.name }} incident{% if incident.report_number %} {{incident.report_number}}{% endif %}.">
{% endif %}
<!-- Google Breadcrumb https://developers.google.com/search/docs/data-types/breadcrumb -->
<script type="application/ld+json">
{% if incident.description != None %}
<meta name="description" content="{{ incident.description }}">
{% else %}
<meta name="description" content="View details for {{ incident.department.name }} incident{% if incident.report_number %} {{incident.report_number}}{% endif %}.">
{% endif %}
<!-- Google Breadcrumb https://developers.google.com/search/docs/data-types/breadcrumb -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
Expand All @@ -31,7 +31,7 @@
</script>
{% endblock %}
{% block content %}
<main class='container pt-35' role='main'>
<main class='container pt-35 pb-50' role='main'>
<a href="{{ url_for('main.incident_api')}}">All Incidents</a>
{% if incident.department %}
<p>
Expand All @@ -58,12 +58,12 @@ <h1>Incident Description</h1>
{% include 'partials/links_and_videos_row.html' %}
{% if current_user.is_administrator
or (current_user.is_area_coordinator and current_user.ac_department_id == incident.department_id) %}
<div class="row">
<div class="col-sm-12 col-md-6">
<a class="btn btn-primary" href="{{ '{}/edit'.format(url_for('main.incident_api', obj_id=incident.id))}}" role="button">Edit</a>
<a class="btn btn-danger" href="{{ '{}/delete'.format(url_for('main.incident_api', obj_id=incident.id))}}" role="button">Delete</a>
</div>
</div>
{% endif %}
</main>
<div class="row">
<div class="col-sm-12 col-md-6">
<a class="btn btn-primary" href="{{ '{}/edit'.format(url_for('main.incident_api', obj_id=incident.id))}}" role="button">Edit</a>
<a class="btn btn-danger" href="{{ '{}/delete'.format(url_for('main.incident_api', obj_id=incident.id))}}" role="button">Delete</a>
</div>
</div>
{% endif %}
</main>
{% endblock %}
2 changes: 2 additions & 0 deletions OpenOversight/app/templates/list_officer.html
Original file line number Diff line number Diff line change
Expand Up @@ -160,6 +160,8 @@ <h2>
<dd>{{ officer.unit_descrip()|default('Unknown') }}</dd>
<dt>Currently on the Force</dt>
<dd>{{ officer.currently_on_force() }}</dd>
<dt>Known incidents</dt>
<dd>{{ officer.incidents | length }}</dd>
</dl>
</div>
<div class="col-md-6 col-xs-6">
Expand Down
39 changes: 16 additions & 23 deletions OpenOversight/app/templates/officer.html
Original file line number Diff line number Diff line change
Expand Up @@ -109,34 +109,27 @@ <h1>Officer Detail: <b>{{ officer.full_name() }}</b></h1>
<div class="row">
<div class="col-sm-12 col-md-6">
{% include "partials/officer_assignment_history.html" %}
{% if officer.descriptions or is_admin_or_coordinator %}
{% include "partials/officer_descriptions.html" %}
{% endif %}
{# Notes are for internal use #}
{% if is_admin_or_coordinator %}
{% include "partials/officer_notes.html" %}
{% endif %}
{% with obj=officer %}
{% include "partials/links_and_videos_row.html" %}
{% endwith %}
</div> {# end col #}

{% if officer.salaries or is_admin_or_coordinator %}
<div class='col-sm-12 col-md-6'>
<div class='col-sm-12 col-md-6'>
{% if officer.salaries or is_admin_or_coordinator %}
{% include "partials/officer_salary.html" %}
</div>{# end col #}
{% endif %}

{% if officer.incidents or is_admin_or_coordinator %}
<div class='col-sm-12 col-md-6'>
{% endif %}
{% if officer.incidents or is_admin_or_coordinator %}
{% include "partials/officer_incidents.html" %}
</div>{# end col #}
{% endif %}

{% if officer.descriptions or is_admin_or_coordinator %}
<div class='col-sm-12 col-md-6'>
{% include "partials/officer_descriptions.html" %}
</div>{# end col #}
{% endif %}

{% if is_admin_or_coordinator %}
<div class='col-sm-12 col-md-6'>
{% include "partials/officer_notes.html" %}
{% endif %}
</div>{# end col #}
{% endif %}

</div> {# end row #}
{% with obj=officer %}
{% include "partials/links_and_videos_row.html" %}
{% endwith %}
</div> {# end container #}
{% endblock %}
2 changes: 1 addition & 1 deletion OpenOversight/app/templates/partials/incident_fields.html
Original file line number Diff line number Diff line change
Expand Up @@ -94,5 +94,5 @@


{% block js_footer %}
<script src="{{ url_for('static', filename='js/incidentDescription.js') }}"></script>
<script src="{{ url_for('static', filename='js/incidentDescription.js') }}"></script>
{% endblock %}
216 changes: 104 additions & 112 deletions OpenOversight/app/templates/partials/links_and_videos_row.html
Original file line number Diff line number Diff line change
@@ -1,125 +1,117 @@
{% if obj.links|length > 0 or is_admin_or_coordinator %}
<div class='row'>
<div class="col-sm-12 col-md-6">
<h3>Links</h3>
{% for type, list in obj.links|groupby('link_type') %}
{% if type == 'link' %}
<ul class='list-group'>
{% for link in list %}
<li class='list-group-item'>
<a href="{{ link.url }}" rel="noopener noreferrer" target="_blank">{{ link.title or link.url }}</a>
{% if officer and (is_admin_or_coordinator or link.creator_id == current_user.id) %}
<a href="{{ url_for('main.link_api_edit', officer_id=officer.id,
<h3>Links</h3>
{% for type, list in obj.links|groupby('link_type') %}
{% if type == 'link' %}
<ul class='list-group'>
{% for link in list %}
<li class='list-group-item'>
<a href="{{ link.url }}" rel="noopener noreferrer" target="_blank">{{ link.title or link.url }}</a>
{% if officer and (is_admin_or_coordinator or link.creator_id == current_user.id) %}
<a href="{{ url_for('main.link_api_edit', officer_id=officer.id,
obj_id=link.id) }}">
<span class='sr-only'>Edit</span>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</a>
<a href="{{ url_for('main.link_api_delete', officer_id=officer.id,
<span class='sr-only'>Edit</span>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</a>
<a href="{{ url_for('main.link_api_delete', officer_id=officer.id,
obj_id=link.id) }}">
<span class='sr-only'>Delete</span>
<i class="fa fa-trash-o" aria-hidden="true"></i>
</a>
{% endif %}
{% if link.description or link.author %}
<div>
{% if link.description %}
{{ link.description }}
{% endif %}
{% if link.author %}
{% if link.description %}- {% endif %}<em>{{ link.author }}</em>
{% endif %}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
{% endfor %}
{% if officer and (current_user.is_administrator
<span class='sr-only'>Delete</span>
<i class="fa fa-trash-o" aria-hidden="true"></i>
</a>
{% endif %}
{% if link.description or link.author %}
<div>
{% if link.description %}
{{ link.description }}
{% endif %}
{% if link.author %}
{% if link.description %}- {% endif %}<em>{{ link.author }}</em>
{% endif %}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
{% endfor %}
{% if officer and (current_user.is_administrator
or (current_user.is_area_coordinator and current_user.ac_department_id == officer.department_id)) %}
<a href="{{ url_for('main.link_api_new', officer_id=officer.id) }}" class='btn btn-primary'>New Link/Video</a>
{% endif %}
</div>
{% for type, list in obj.links|groupby('link_type') %}
{% if type == 'video' %}
<div class="col-sm-12 col-md-6">
<h3>Videos</h3>
<ul class='list-group'>
{% for link in list %}
{% with link_url = link.url.split('v=')[1] %}
<li class='list-group-item'>
{% if link.title %}
<h5>{{ link.title }}</h5>
{% endif %}
{% if officer and (current_user.is_administrator
<a href="{{ url_for('main.link_api_new', officer_id=officer.id) }}" class='btn btn-primary'>New Link/Video</a>
{% endif %}
{% for type, list in obj.links|groupby('link_type') %}
{% if type == 'video' %}
<h3>Videos</h3>
<ul class='list-group'>
{% for link in list %}
{% with link_url = link.url.split('v=')[1] %}
<li class='list-group-item'>
{% if link.title %}
<h5>{{ link.title }}</h5>
{% endif %}
{% if officer and (current_user.is_administrator
or (current_user.is_area_coordinator and current_user.ac_department_id == officer.department_id)
or link.creator_id == current_user.id) %}
<a href="{{ url_for('main.link_api_edit', officer_id=officer.id,
<a href="{{ url_for('main.link_api_edit', officer_id=officer.id,
obj_id=link.id) }}">
<span class='sr-only'>Edit</span>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</a>
<a href="{{ url_for('main.link_api_delete', officer_id=officer.id,
<span class='sr-only'>Edit</span>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</a>
<a href="{{ url_for('main.link_api_delete', officer_id=officer.id,
obj_id=link.id) }}">
<span class='sr-only'>Delete</span>
<i class="fa fa-trash-o" aria-hidden="true"></i>
</a>
{% endif %}
<div class='video-container'>
<iframe width="560" height="315" src="https://www.youtube.com/embed/{{ link_url }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
{% if link.description or link.author %}
<div>
{% if link.description %}
{{ link.description }}
{% endif %}
{% if link.author %}
{% if link.description %}- {% endif %}<em>{{ link.author }}</em>
{% endif %}
</div>
{% endif %}
</li>
{% endwith%}
{% endfor %}
</ul>
</div>
{% endif %}
{% if type == 'other_video' %}
<div class="col-sm-12 col-md-6">
<h3>Other videos</h3>
<ul class='list-group'>
{% for link in list %}
<li class='list-group-item'>
<a href="{{ link.url }}">{{ link.title or link.url }}</a>
{% if officer and (current_user.is_administrator
<span class='sr-only'>Delete</span>
<i class="fa fa-trash-o" aria-hidden="true"></i>
</a>
{% endif %}
<div class='video-container'>
<iframe width="560" height="315" src="https://www.youtube.com/embed/{{ link_url }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
{% if link.description or link.author %}
<div>
{% if link.description %}
{{ link.description }}
{% endif %}
{% if link.author %}
{% if link.description %}- {% endif %}<em>{{ link.author }}</em>
{% endif %}
</div>
{% endif %}
</li>
{% endwith%}
{% endfor %}
</ul>
{% endif %}
{% if type == 'other_video' %}
<h3>Other videos</h3>
<ul class='list-group'>
{% for link in list %}
<li class='list-group-item'>
<a href="{{ link.url }}">{{ link.title or link.url }}</a>
{% if officer and (current_user.is_administrator
or (current_user.is_area_coordinator and current_user.ac_department_id == officer.department_id)
or link.creator_id == current_user.id) %}
<a href="{{ url_for('main.link_api_edit', officer_id=officer.id,
<a href="{{ url_for('main.link_api_edit', officer_id=officer.id,
obj_id=link.id) }}">
<span class='sr-only'>Edit</span>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</a>
<a href="{{ url_for('main.link_api_delete', officer_id=officer.id,
<span class='sr-only'>Edit</span>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</a>
<a href="{{ url_for('main.link_api_delete', officer_id=officer.id,
obj_id=link.id) }}">
<span class='sr-only'>Delete</span>
<i class="fa fa-trash-o" aria-hidden="true"></i>
</a>
{% endif %}
{% if link.description or link.author %}
<div>
{% if link.description %}
{{ link.description }}
{% endif %}
{% if link.author %}
{% if link.description %}- {% endif %}<em>{{ link.author }}</em>
{% endif %}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
</div>
{% endif %}
{% endfor %}
</div> {# end row #}
<span class='sr-only'>Delete</span>
<i class="fa fa-trash-o" aria-hidden="true"></i>
</a>
{% endif %}
{% if link.description or link.author %}
<div>
{% if link.description %}
{{ link.description }}
{% endif %}
{% if link.author %}
{% if link.description %}- {% endif %}<em>{{ link.author }}</em>
{% endif %}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
{% endfor %}
{% endif %}
Loading

0 comments on commit 4cda564

Please sign in to comment.