Initial version of demo

This commit introduces the demo functionality.
The task assignment has been removed at the moment,
as this will be changed in a future commit.

2 files changed, 72 insertions, 0 deletions

diff --git a/app/templates/demo/evaluate.html b/app/templates/demo/evaluate.html
new file mode 100644
index 0000000..b148f66
--- /dev/null
+++ b/app/templates/demo/evaluate.html
@@ -0,0 +1,49 @@
+{% extends "base.html" %}
+{% import 'bootstrap/wtf.html' as wtf %}
+
+{% block styles %}
+{{ super() }}
+<link rel="stylesheet" href="{{url_for('static', filename='css/demo/evaluate.css')}}">
+{% endblock %}
+
+{% block app_content %}
+<h1>{{ title }}</h1>
+
+<div id="lesson" class="row">
+  <div class="col-md-8">
+    {{ text | safe }}
+  </div>
+</div>
+
+<div class="graph-wrapper">
+	<div class="row">
+		<p><b>Your annotation:</b></p>
+	</div>
+	<div id="graph_user"></div>
+	<div class="row">
+		<p><b>Ground truth:</b></p>
+	</div>
+	<div id="graph_true"></div>
+</div>
+
+<div class="row">
+  <div id="next-btn" class="col-md-10">
+    {{ wtf.quick_form(form, button_map={'submit': 'primary'}) }}
+  </div>
+</div>
+
+<script src="//d3js.org/d3.v5.min.js"></script>
+<script src="{{ url_for('static', filename='js/makeChart.js') }}"></script>
+<script>makeChartAnnotated(
+	"#graph_user",
+	{{ data.chart_data | safe }},
+	{{ annotations_user | safe }}
+);
+</script>
+<script>makeChartAnnotated(
+	"#graph_true",
+	{{ data.chart_data | safe }},
+	{{ annotations_true | safe }}
+);
+</script>
+{% endblock %}
diff --git a/app/templates/demo/learn.html b/app/templates/demo/learn.html
new file mode 100644
index 0000000..8d3d6c9
--- /dev/null
+++ b/app/templates/demo/learn.html
@@ -0,0 +1,23 @@
+{% extends "base.html" %}
+{% import 'bootstrap/wtf.html' as wtf %}
+
+{% block styles %}
+{{ super() }}
+<link rel="stylesheet" href="{{url_for('static', filename='css/demo/learn.css')}}">
+{% endblock %}
+
+{% block app_content %}
+<h1>{{ title }}</h1>
+
+<div id="lesson" class="row">
+  <div class="col-md-6">
+    {{ text | safe }}
+  </div>
+</div>
+
+<div class="row">
+  <div id="next-btn" class="col-md-6">
+    {{ wtf.quick_form(form, button_map={'submit': 'primary'}) }}
+  </div>
+</div>
+{% endblock %}