c36f63baf9
* fix: Reorder conflict review columns Fixes #6528 Also remove some redundant computation while I'm here. * Remove some more stuff that isn't needed * Progress * Delivers current functionality * Add some comments * Handle expired docs * Interim commit * Fix tests * Cleanup * More cleanup * Reduce differences to current view * Interim commit * More progress * Getting close * Make page functional again * Remove unused variable * Suppress mypy warning * Fix #6553 * Log in as secretary to execute new code, and remove redundant check * Remove unneeded code * Fix #6608 by adding link to state description to state heading * Missed part of this change in last commit. Also fix an unrelated template nit while I'm here.
198 lines
8.4 KiB
HTML
198 lines
8.4 KiB
HTML
{% extends "base.html" %}
|
|
{# Copyright The IETF Trust 2015, All Rights Reserved #}
|
|
{% load origin static %}
|
|
{% load ietf_filters %}
|
|
{% block pagehead %}
|
|
<link rel="stylesheet" href="{% static 'ietf/css/list.css' %}">
|
|
<link rel="stylesheet" href="{% static 'ietf/css/highcharts.css' %}">
|
|
{% endblock %}
|
|
{% block morecss %}
|
|
table .border-bottom { border-bottom-color: var(--highcharts-neutral-color-80) !important; }
|
|
.highcharts-container .highcharts-axis-labels { font-size: .7rem; }
|
|
.highcharts-container .highcharts-graph { stroke-width: 2.5; }
|
|
.highcharts-container .highcharts-color-0 {
|
|
fill: var(--bs-primary);
|
|
stroke: var(--bs-primary);
|
|
}
|
|
.highcharts-container .highcharts-data-label text {
|
|
font-size: 1rem;
|
|
font-weight: inherit;
|
|
}
|
|
{% endblock %}
|
|
{% block title %}IESG Dashboard{% endblock %}
|
|
{% block content %}
|
|
{% origin %}
|
|
<h1>IESG Dashboard</h1>
|
|
{% if user|has_role:"Area Director,Secretariat" %}
|
|
<div class="alert alert-info my-3">
|
|
{{ delta }}-day trend graphs
|
|
are only shown to logged-in Area Directors.
|
|
</div>
|
|
{% endif %}
|
|
{% for dt in metadata %}
|
|
<h2 class="mt-5" id="{{ dt.type.0 }}">{{ dt.type.1 }} State Counts</h2>
|
|
<table class="table table-sm table-striped table-bordered tablesorter navskip">
|
|
<thead class="wrap-anywhere">
|
|
<tr>
|
|
<th scope="col" data-sort="name">Area Director</th>
|
|
{% for state, state_name in dt.states %}
|
|
<th scope="col" class="col-1" title=""
|
|
data-sort="{{ state }}-num">
|
|
<a href="{% url 'ietf.doc.views_help.state_help' type='draft-iesg' %}#{{ state }}">
|
|
{{ state_name|split:'/'|join:'/<wbr>' }}
|
|
</a>
|
|
</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody class="table-group-divider">
|
|
{% for ad in dt.ads %}
|
|
<tr>
|
|
<td>
|
|
<a href="{{ ad.dashboard }}">{{ ad.name }}</a>
|
|
</td>
|
|
{% for state, state_name in dt.states %}
|
|
<td class="col-1 align-bottom"
|
|
id="{{ dt.type.0 }}-{{ ad|slugify }}-{{ state }}">
|
|
<div id="chart-{{ dt.type.0 }}-{{ ad|slugify }}-{{ state }}"></div>
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
<tfoot class="table-group-divider">
|
|
<tr>
|
|
<th scope="row">Sum</th>
|
|
{% for state, state_name in dt.states %}
|
|
<td class="align-bottom">
|
|
<div id="chart-{{ dt.type.0 }}-sum-{{ state }}"></div>
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
{% endfor %}
|
|
{% endblock %}
|
|
{% block js %}
|
|
<script src="{% static "ietf/js/list.js" %}"></script>
|
|
<script>
|
|
$(document)
|
|
.ready(function () {
|
|
$("[data-bs-toggle='popover']")
|
|
.popover({
|
|
html: true,
|
|
trigger: "hover focus click"
|
|
});
|
|
});
|
|
</script>
|
|
<script src="{% static "ietf/js/highcharts.js" %}"></script>
|
|
{{ data|json_script:"data" }}
|
|
<script>
|
|
const data = JSON.parse(document.getElementById("data").textContent);
|
|
|
|
Object.entries(data).forEach(([dt, ads]) => {
|
|
max = {};
|
|
Object.entries(ads).forEach(([ad, states]) => {
|
|
Object.entries(states).forEach(([state, buckets]) => {
|
|
buckets.series = buckets.map((x) => x.length);
|
|
if (ad != "sum") {
|
|
max[state] = Math.max(...buckets.series,
|
|
max[state] ? max[state] : 0);
|
|
}
|
|
});
|
|
});
|
|
|
|
Object.entries(ads).forEach(([ad, states]) => {
|
|
Object.entries(states).forEach(([state, buckets]) => {
|
|
const cell = `chart-${dt}-${ad}-${state}`;
|
|
|
|
// if there is only a single datapoint in the
|
|
// bucket, display it without a graph
|
|
if (buckets.series.length == 1) {
|
|
document.getElementById(cell).innerHTML =
|
|
buckets.series[0];
|
|
return;
|
|
}
|
|
|
|
// if a bucket has all zeroes, fake a Highcharts
|
|
// plot with HTML, to reduce the number of plot
|
|
// objects on the page
|
|
if (buckets.series.every((x) => x == 0)) {
|
|
// document.getElementById(cell).innerHTML = `
|
|
// <div class="position-relative">
|
|
// <div class="position-absolute bottom-0 start-0">
|
|
// <div style="font-size: .7rem;" class="ms-1">0</div>
|
|
// </div>
|
|
// <div class="position-absolute bottom-0 end-0 w-100 ps-1">
|
|
// <div class="border-bottom mb-1 ms-3">0</div>
|
|
// </div>
|
|
// </div>
|
|
// `;
|
|
return;
|
|
}
|
|
|
|
// else actually create a graph
|
|
const ymax = Math.max(1, ad != "sum" ? max[state] : Math.max(...buckets.series));
|
|
Highcharts.chart({
|
|
title: { text: undefined },
|
|
chart: {
|
|
type: "line",
|
|
animation: false,
|
|
renderTo: cell,
|
|
panning: { enabled: false },
|
|
spacing: [4, 0, 5, 0],
|
|
height: "45%",
|
|
},
|
|
scrollbar: { enabled: false },
|
|
tooltip: { enabled: false },
|
|
navigator: { enabled: false },
|
|
exporting: { enabled: false },
|
|
legend: { enabled: false },
|
|
credits: { enabled: false },
|
|
xAxis: {
|
|
title: { text: undefined},
|
|
labels: { enabled: false },
|
|
zoomEnabled: false,
|
|
tickLength: 0,
|
|
},
|
|
yAxis: {
|
|
title: { text: undefined},
|
|
zoomEnabled: false,
|
|
tickLength: 0,
|
|
labels: { x: -3 },
|
|
min: 0,
|
|
max: ymax,
|
|
tickInterval: ymax,
|
|
},
|
|
plotOptions: {
|
|
series: {
|
|
animation: false,
|
|
dataLabels: {
|
|
enabled: true,
|
|
inside: true,
|
|
padding: 0,
|
|
formatter: function() {
|
|
// only label the last
|
|
// (= current-day) point in
|
|
// the curve with today's
|
|
// value
|
|
if (this.point.index + 1 ==
|
|
this.series.points.length) {
|
|
return this.y;
|
|
}
|
|
return undefined;
|
|
}
|
|
}
|
|
}
|
|
},
|
|
series: [{
|
|
name: undefined,
|
|
data: buckets.series,
|
|
enableMouseTracking: false,
|
|
}],
|
|
});
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %} |