aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorYingtong Li <runassudo@yingtongli.me>2017-03-22 10:23:32 +1100
committerYingtong Li <runassudo@yingtongli.me>2017-03-22 10:23:32 +1100
commit1e2cfa61e12a920055761eec599b8010b9aa8f3a (patch)
tree4e174eb104212eab614174550a1fa2da6db33ae5
parentaa7c45a633c949199bc82406a3ab94a786d87ba8 (diff)
Colourise drawings
-rw-r--r--pblive/templates/question_draw.html2
-rw-r--r--pblive/templates/question_draw_admin.html26
2 files changed, 26 insertions, 2 deletions
diff --git a/pblive/templates/question_draw.html b/pblive/templates/question_draw.html
index 64bb35c..96e2ab6 100644
--- a/pblive/templates/question_draw.html
+++ b/pblive/templates/question_draw.html
@@ -100,7 +100,7 @@
context.drawImage(image, 0, 0, image.width * scale, image.height * scale);
}
- context.strokeStyle = "#FF0000";
+ context.strokeStyle = "{{ user.colour[1] }}";
context.lineJoin = "round";
context.lineWidth = 5;
diff --git a/pblive/templates/question_draw_admin.html b/pblive/templates/question_draw_admin.html
index 455ff60..fcba0e8 100644
--- a/pblive/templates/question_draw_admin.html
+++ b/pblive/templates/question_draw_admin.html
@@ -26,11 +26,23 @@
{% block base %}
{% if session.questions[question_num].revealed %}
+ <div>
+ <button class="ui button" style="height: 32px; padding-top: 0; padding-bottom: 0;" onclick="userToShow = null; redraw();">All</button>
+ {% for _, user in data.users.items() %}
+ {% if user.session == session and question_num in user.answers %}
+ <button class="ui button" style="background-color: {{ user.colour[1] }}; width: 32px; height: 32px; padding: 0 0;" onclick="userToShow = '{{ user.sid }}'; redraw();">{{ user.colour[0] }}</button>
+ {% endif %}
+ {% endfor %}
+ </div>
+
<canvas id="draw_canvas"></canvas>
<script>
var context = document.getElementById('draw_canvas').getContext("2d");
+ var users = new Array(); // Keep track of users to show/hide
+ var userToShow = null;
+
var images = new Array();
var numToLoad = {{ data.responses_for_question(session, question_num) }} + 1;
var numLoaded = 0;
@@ -45,7 +57,17 @@
context.globalAlpha = 1;
context.drawImage(image, 0, 0, image.width * scale, image.height * scale);
context.globalAlpha = 0.5;
- for (var i = 0; i < numToLoad; i++) {
+ if (userToShow === null) {
+ for (var i = 0; i < images.length; i++) {
+ try {
+ var scale2 = image.height / images[i].height * scale;
+ context.drawImage(images[i], 0, 0, images[i].width * scale2, images[i].height * scale2);
+ } catch (exc) {
+ console.log(exc);
+ }
+ }
+ } else {
+ var i = users.indexOf(userToShow);
try {
var scale2 = image.height / images[i].height * scale;
context.drawImage(images[i], 0, 0, images[i].width * scale2, images[i].height * scale2);
@@ -54,6 +76,7 @@
}
}
}
+ window.redraw = redraw;
function resize_canvas() {
document.getElementById('draw_canvas').width = document.getElementById('session_main').clientWidth;
@@ -84,6 +107,7 @@
tmp.onload = onImageLoad;
tmp.onerror = onImageLoad;
images.push(tmp);
+ users.push('{{ user.sid }}');
{% endif %}
{% endfor %}
</script>
Contact (issues, pull requests, etc.) at git@yingtongli.me. Generated by cgit.