Commit 3aa9bfa0 authored by Elger Jonker's avatar Elger Jonker

smoother experience


Former-commit-id: e11f5a55
parent 1f6307c6
......@@ -127,10 +127,7 @@
<div id="footer">
<div class="container">
All entered data can be downloaded from the Failmap Website of your country. For a list, see <a
href="https://failmap.org">failmap.org</a>.
You can then process it further yourself or import it in another open source <a
href="https://gitlab.com/failmap/">failmap instance</a>.
Data can be downloaded from the Failmap Website of your country. For a list, see <a href="https://failmap.org">failmap.org</a>.
</div>
</div>
</body>
......
{% extends 'game/base.html' %}{% load static %}{% load i18n %}
{% extends 'game/base.html' %}{% load static %}{% load i18n %}{% load humanize %}
{% block head %}
......@@ -30,7 +30,7 @@
let debug = document.head.querySelector("[name=debug]").getAttribute('content');
failmap.initialize(mapbox_token, country, debug, false);
views();
views(false);
// todo: add timer that repeats this query every 10 seconds or so.
fetch('/game/data/contest/').then(response => response.json()).then(data => {
......@@ -42,11 +42,82 @@
{% endblock %}
{% block content %}
Contest: {{ contest.name }}
<br><br>
<h1>{{ contest.name }}</h1>
<br><br>
<h2>Submitted organizations</h2>
<p>This is a list of submitted organizations during this contest. Below it also shows the urls that already exist.
This information can help you to quickly determine if an organization is already being investigated and if some
information is still missing.</p>
{% for organization in submitted_organizations %}
{% ifchanged organization.organization_type_name %}
</tbody></table><h3>Layer: {{ organization.organization_type_name }}</h3><table class="table table-sm table-striped table-bordered table-hover">
<thead>
<tr>
<th width="20%">Organization</th>
<th width="30%">Address</th>
<th width="10%">Acceptation</th>
<th width="20%">Added on</th>
</tr>
</thead><tbody>
{% endifchanged %}
<tr style="background-color: {{ organization.added_by_team.color }};" title="Added by {{ organization.added_by_team.name }}">
<td>{{ organization.organization_name }}</td>
<td>{{ organization.organization_address }}</td>
{% if organization.has_been_accepted %}
<td style="color: green;">accepted</td>
{% elif organization.has_been_rejected %}
<td style="color: red;">rejected</td>
{% else %}
<td style="color: gray;">pending</td>
{% endif %}
<td>{{ organization.added_on|naturaltime }}</td>
</tr>
{% empty %}
<tr><td colspan="7">-</td></tr>
{% endfor %}
</tbody>
</table>
<br><br>
<h2>Submitted urls</h2>
{% for url in submitted_urls %}
{% ifchanged url.for_organization %}
</table><h3>{{ url.for_organization }}</h3><table class="table table-sm table-striped table-bordered table-hover">
<tr>
<th width="50%">Url</th>
<th width="10%">Acceptation</th>
<th width="30%">Added when</th>
<th width="10%">Onboarding</th>
</tr>
{% endifchanged %}
<tr style="background-color: {{ url.added_by_team.color }};" title="Added by {{ url.added_by_team.name }}">
<td>{{ url.url }} (try: <a href="http://{{ url.url }}" target="_blank">http</a>,
<a href="https://{{ url.url }}" target="_blank">https</a>)</td>
{% if url.has_been_accepted %}
<td style="color: green;">accepted</td>
{% elif url.has_been_rejected %}
<td style="color: red;">rejected</td>
{% else %}
<td style="color: gray;">pending</td>
{% endif %}
<td>{{ url.added_on|naturaltime }}</td>
<td>{{ url.onboarding_stage }}</td>
</tr>
{% empty %}
<tr><td colspan="7">-</td></tr>
{% endfor %}
</tbody>
</table>
{% endblock %}
{% block fullwidth %}
<section>
<div id='map' style="height: calc(100vh - 55px);"></div>
</section>
......@@ -101,5 +172,4 @@
</div>
</script>
{% endverbatim %}
{% endblock %}
......@@ -15,7 +15,7 @@
{% for organization in submitted_organizations %}
{% ifchanged organization.organization_type_name %}
</tbody></table><h3>{{ organization.organization_type_name }}</h3><table class="table table-sm table-striped table-bordered table-hover">
</tbody></table><h3>Layer: {{ organization.organization_type_name }}</h3><table class="table table-sm table-striped table-bordered table-hover">
<thead>
<tr>
<th width="20%">Organization</th>
......
......@@ -336,9 +336,9 @@ def submitted_organizations(request):
added_by_team__participating_in_contest=contest
).order_by('organization_type_name', 'organization_name')
already_known_organizations = Organization.objects.all().filter(country=contest.target_country).exclude(
id__in=submitted_organizations.values('organization_in_system').filter(organization_in_system__isnull=False)
).select_related('type').order_by('type__name', 'name')
# not excluding the organizations submitted in this contest, as that IN filter will become too large.
already_known_organizations = Organization.objects.all().filter(
country=contest.target_country).select_related('type').order_by('type__name', 'name')
return render(request, 'game/submitted_organizations.html', {
'submitted_organizations': submitted_organizations,
......@@ -385,7 +385,23 @@ def rules_help(request):
def map(request):
contest = get_default_contest(request)
return render(request, 'game/map.html', {'contest': contest, 'team': get_team_info(request)})
# also enrich with submitted urls and orgnaizations
submitted_organizations = OrganizationSubmission.objects.all().filter(
added_by_team__participating_in_contest=contest
).order_by('organization_type_name', 'organization_name')
submitted_urls = UrlSubmission.objects.all().filter(
added_by_team__participating_in_contest=contest).order_by(
'for_organization', '-added_on', 'url'
).select_related('added_by_team', 'for_organization', 'url_in_system')
return render(request, 'game/map.html', {
'contest': contest,
'team': get_team_info(request),
'submitted_urls': submitted_urls,
'submitted_organizations': submitted_organizations
})
@login_required(login_url='/authentication/login/')
......
......@@ -48,7 +48,7 @@ const failmap = {
// don't name this variable location, because that redirects the browser.
loc = this.initial_location(country_code);
this.map = L.map('map',
{ dragging: !L.Browser.mobile, touchZoom: true, tap: false, zoomSnap: 0}
{ dragging: !L.Browser.mobile, touchZoom: true, tap: false, zoomSnap: 0.2}
).setView(loc.coordinates, loc.zoomlevel);
this.map.scrollWheelZoom.disable();
......
......@@ -770,7 +770,7 @@ function germany() {
}
function views() {
function views(autoload_default_map_data=true) {
window.vueGraphs = new Vue({
name: "graphs",
......@@ -1510,7 +1510,7 @@ function views() {
// wait until the default category and default languages have been set...
// initial load.
this.load(0)
// this.load(0)
},
mixins: [state_mixin],
......@@ -1544,10 +1544,19 @@ function views() {
this.displayed_issue = "";
},
set_state: function(country, category, skip_map){
console.log("Set state");
console.log("Set map/site state");
this.country = country;
this.category = category;
// The first time the map is not allowed to load in any regards:
if (!autoload_default_map_data) {
// make sure this only works once
autoload_default_map_data = true;
console.log("Explicitly disabled automatic loading of default map data. Please load map data yourself.");
return;
}
// skip_map is used in loading the defaults, where the map is already (probably) loaded.
// The first time the map loads based on the default settings in the backend. This shows the map
// faster as it saves a roundtrip. Loading the map faster is a better experience for visitors.
......@@ -1591,6 +1600,7 @@ function views() {
// the first time the map defaults are loaded, this saves a trip to the server of what the defaults are
// it's possible that this is slower than the rest of the code, and thus a normal map is loaded.
if (!this.country || !this.category) {
$.getJSON('/data/map_default/' + week * 7 + '/' +
self.displayed_issue + '/' , function (mapdata) {
self.loading = true;
......@@ -1665,9 +1675,7 @@ function views() {
categories: [""],
countries: [""],
selected_category: "",
selected_country: "",
default_category: "",
default_country: ""
selected_country: ""
},
mounted: function() {
......@@ -1680,8 +1688,6 @@ function views() {
fetch('/data/defaults/').then(response => response.json()).then(data => {
this.selected_category = data.category;
this.selected_country = data.country;
this.default_category = data.category;
this.default_country = data.country;
// done in the map.
vueMap.set_state(this.selected_country, this.selected_category, true);
this.get_countries();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment