Stats!

3 files changed, 125 insertions, 0 deletions

diff --git a/views/index.html b/views/index.html
index 9744af8..5373f12 100644
--- a/views/index.html
+++ b/views/index.html
@@ -54,7 +54,12 @@
 		<li>
 			<span class="text-muted"># Mehr Details folgen in Kürze.</span>
 		</li>
+		<li>
+			In der Zwischenzeit: Statistiken! 
+		</li>
 	</ul>
+
+	{{ include('snippets/stats.html') }}
 	<!--
 	<ul class="list-unstyled text-left index-list">
 		<li>
diff --git a/views/snippets/stats.html b/views/snippets/stats.html
new file mode 100644
index 0000000..7311c41
--- /dev/null
+++ b/views/snippets/stats.html
@@ -0,0 +1,104 @@
+	<div id="chartContainerZusagen" style="height: 300px; width: 100%;"></div>
+	<br>
+	<div id="chartContainerAuto" style="height: 300px; width: 100%;"></div>
+	<br>
+	<div id="chartContainerAutoPlätze" style="height: 300px; width: 100%;"></div>
+	<br>
+	<div id="chartContainerEssen" style="height: 300px; width: 100%;"></div>
+
+<script type="text/javascript" src="/js/canvasjs.min.js"></script>
+<script type="text/javascript">
+window.onload = function () {
+	var chartZusagen = new CanvasJS.Chart("chartContainerZusagen",
+	{
+		title:{
+			text: "Zusage / Absage"
+		},
+		legend: {
+			maxWidth: 350,
+			itemWidth: 120
+		},
+		data: [
+		{
+			type: "pie",
+			showInLegend: true,
+			legendText: "{indexLabel}",
+			dataPoints: [
+				{ y: {{ data["zusage"] }}, indexLabel: "Zusage" },
+				{ y: {{ data["absage"] }}, indexLabel: "Absage" }
+			]
+		}
+		]
+	});
+	chartZusagen.render();
+	var chartAuto = new CanvasJS.Chart("chartContainerAuto",
+	{
+		title:{
+			text: "Autofahrer"
+		},
+		legend: {
+			maxWidth: 350,
+			itemWidth: 120
+		},
+		data: [
+		{
+			type: "pie",
+			showInLegend: true,
+			legendText: "{indexLabel}",
+			dataPoints: [
+				{ y: {{ data["kommt_mit_auto"] }}, indexLabel: "Autofahrer" },
+				{ y: {{ data["kommt_ohne_auto"] }}, indexLabel: "Kein Auto" },
+				{ y: {{ data["kommt_eventuell_mit_auto"] }}, indexLabel: "Weiß noch nicht" }
+			]
+		}
+		]
+	});
+	chartAuto.render();
+	var chartAutoPlätze = new CanvasJS.Chart("chartContainerAutoPlätze",
+	{
+		title:{
+			text: "Freie Autoplätze"
+		},
+		legend: {
+			maxWidth: 350,
+			itemWidth: 120
+		},
+		data: [
+		{
+			type: "column",
+			showInLegend: true,
+			legendText: "{indexLabel}",
+			dataPoints: [
+				{ y: {{ data["freie_plätze"] }}, indexLabel: "Freie Autoplätze" },
+				{ y: {{ data["benötigte_auto_plätze"] }}, indexLabel: "Benötigte Autoplätze" }
+			]
+		}
+		]
+	});
+	chartAutoPlätze.render();
+	var chartEssen = new CanvasJS.Chart("chartContainerEssen",
+	{
+		title:{
+			text: "Vegan / Vegetarisch / Ente"
+		},
+		legend: {
+			maxWidth: 350,
+			itemWidth: 120
+		},
+		data: [
+		{
+			type: "pie",
+			showInLegend: true,
+			legendText: "{indexLabel}",
+			dataPoints: [
+				{ y: {{ data["vegetarisch"] }}, indexLabel: "Vegetarisch" },
+				{ y: {{ data["vegan"] }}, indexLabel: "Vegan" },
+				{ y: {{ data["ente"] }}, indexLabel: "Ente" },
+				{ y: {{ data["kinderteller"] }}, indexLabel: "Kinderteller" }
+			]
+		}
+		]
+	});
+	chartEssen.render();
+}
+</script>
diff --git a/views/stats.html b/views/stats.html
new file mode 100644
index 0000000..541639f
--- /dev/null
+++ b/views/stats.html
@@ -0,0 +1,16 @@
+{% extends "snippets/layout.html" %}
+
+{% block title "Stats | Hochzeit" %}
+
+{% block css %}
+{% endblock %}
+
+{% block main %}
+
+<div class="container">
+
+	{{ include('snippets/stats.html') }}
+
+</div>
+
+{% endblock %}