Create packet aggregate signatures graph

Creates /stats/packet/<packet_id>, which displays a graph of signatures
over time for the given packet

2 files changed, 115 insertions, 0 deletions

diff --git a/packet/routes/upperclassmen.py b/packet/routes/upperclassmen.py
index c8cdd7c..11bc2b1 100644
--- a/packet/routes/upperclassmen.py
+++ b/packet/routes/upperclassmen.py
@@ -1,6 +1,7 @@
 """
 Routes available to CSH users only
 """
+import json
 
 from itertools import chain
 from operator import itemgetter
@@ -10,6 +11,7 @@ from packet import app
 from packet.models import Packet, MiscSignature
 from packet.utils import before_request, packet_auth
 from packet.log_utils import log_cache, log_time
+from packet.stats import packet_stats
 
 
 @app.route('/')
@@ -61,3 +63,44 @@ def upperclassmen_total(info=None):
 
     return render_template('upperclassmen_totals.html', info=info, num_open_packets=len(open_packets),
                            upperclassmen=sorted(upperclassmen.items(), key=itemgetter(1), reverse=True))
+
+
+@app.route('/stats/packet/<packet_id>')
+@packet_auth
+@before_request
+def packet_graphs(packet_id, info=None):
+    stats = packet_stats(packet_id)
+    fresh = []
+    misc = []
+    upper = []
+
+
+    # Make a rolling sum of signatures over time
+    agg = lambda l, attr, date: l.append((l[-1] if l else 0) + len(stats['dates'][date][attr]))
+    dates = list(stats['dates'].keys())
+    for date in dates:
+        agg(fresh, 'fresh', date)
+        agg(misc, 'misc', date)
+        agg(upper, 'upper', date)
+
+    # Stack misc and upper on top of fresh for a nice stacked line graph
+    for i in range(len(dates)):
+        misc[i] = misc[i] + fresh[i]
+        upper[i] = upper[i] + misc[i]
+
+    return render_template('packet_stats.html',
+        info=info,
+        data=json.dumps({
+            'dates':dates,
+            'accum': {
+                'fresh':fresh,
+                'misc':misc,
+                'upper':upper,
+                },
+            'daily': {
+
+                }
+        }),
+        fresh=stats['freshman'],
+        packet=Packet.by_id(packet_id),
+    )
diff --git a/packet/templates/packet_stats.html b/packet/templates/packet_stats.html
new file mode 100644
index 0000000..18517d4
--- /dev/null
+++ b/packet/templates/packet_stats.html
@@ -0,0 +1,72 @@
+{% extends "extend/base.html" %}
+
+{% block head %}
+{{ super() }}
+<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>
+{% endblock %}
+
+{% block body %}
+<div class="container main">
+    <div class="card">
+        <h5 class="card-header bg-primary text-white">Cumulative Signatures Over Time for {{ fresh['name'] }} ({{ fresh['rit_username'] }})</h5>
+        <div class="card-body">
+            <canvas id="myChart" width="400" height="400"></canvas>
+            <script>
+var data = {{ data|safe }};
+// Stack the lines
+var ctx = document.getElementById('myChart');
+var myChart = new Chart(ctx, {
+    type: 'line',
+    data: {
+        labels: data.dates,
+        datasets: [
+            {
+                fill: 'origin',
+                label: 'Fresh Sigs',
+                data: data.accum.fresh,
+                backgroundColor: '#b0197e80',
+                borderColor: '#b0197e',
+                borderWidth: 1,
+                lineTension: 0
+            },
+            {
+                fill: '-1',
+                label: 'Misc Sigs',
+                data: data.accum.misc,
+                backgroundColor: '#0000ff80',
+                borderColor: 'blue',
+                borderWidth: 1,
+                lineTension: 0
+            },
+            {
+                fill: '-1',
+                label: 'Upper Sigs',
+                data: data.accum.upper,
+                backgroundColor: '#00ff0080',
+                borderColor: 'green',
+                borderWidth: 1,
+                lineTension: 0
+            }
+        ]
+    },
+    options: {
+        scales: {
+            xAxes: [{
+                type: 'time',
+                time: {
+                    unit: 'day',
+                },
+            }],
+            yAxes: [{
+                ticks: {
+                    beginAtZero: true
+                }
+            }]
+        }
+    }
+});
+            </script>
+        </div>
+    </div>
+</div>
+{% endblock %}