From c4e10f32cf46c4fd67b7ec174b0f682faae10814 Mon Sep 17 00:00:00 2001 From: mishrakeshav Date: Mon, 30 Nov 2020 14:21:55 +0530 Subject: [PATCH] add liveboard and update admin template --- src/core/static/admin/admin.css | 31 +++ src/core/static/admin/styles.css | 0 src/core/static/mainapp/css/styles.css | 2 + src/core/static/mainapp/icons/favicon.ico | Bin 0 -> 894 bytes src/core/static/whiteboard/css/style.css | 218 ++++++++++++++++++ .../static/whiteboard/images/grid-pattern.png | Bin 0 -> 4617 bytes src/core/static/whiteboard/js/app.js | 124 ++++++++++ src/core/static/whiteboard/js/app.min.js | 1 + src/core/templates/admin/base_site.html | 17 ++ src/core/templates/landing_page.html | 2 +- src/core/templates/partials/_head.html | 1 + src/core/templates/partials/_sidebar.html | 2 +- .../templates/whiteboard/liveboard.html | 53 +++++ src/whiteboard/urls.py | 1 + src/whiteboard/views.py | 5 + 15 files changed, 455 insertions(+), 2 deletions(-) create mode 100644 src/core/static/admin/admin.css create mode 100644 src/core/static/admin/styles.css create mode 100644 src/core/static/mainapp/icons/favicon.ico create mode 100644 src/core/static/whiteboard/css/style.css create mode 100644 src/core/static/whiteboard/images/grid-pattern.png create mode 100644 src/core/static/whiteboard/js/app.js create mode 100644 src/core/static/whiteboard/js/app.min.js create mode 100644 src/core/templates/admin/base_site.html create mode 100644 src/whiteboard/templates/whiteboard/liveboard.html diff --git a/src/core/static/admin/admin.css b/src/core/static/admin/admin.css new file mode 100644 index 0000000..5a9cd07 --- /dev/null +++ b/src/core/static/admin/admin.css @@ -0,0 +1,31 @@ +#header { + height: 50px; + background: #10284e; + color: #fff; +} + +#branding h1{ + color: #fff; +} + +a:link, +a:visited{ + color: #10284e; +} + +div.breadcrumbs { + background: #30caa0; + color: #10284e; +} +div.breadcrumbs a{ + color: #111; +} + +.module h2, .module caption, .inline-group h2 { + background: #30caa0; +} + +.button, input[type=submit], input[type=button], .submit-row input, a.button { + background: #10284e; + color: #fff; +} \ No newline at end of file diff --git a/src/core/static/admin/styles.css b/src/core/static/admin/styles.css new file mode 100644 index 0000000..e69de29 diff --git a/src/core/static/mainapp/css/styles.css b/src/core/static/mainapp/css/styles.css index 10260ca..d23cbb4 100644 --- a/src/core/static/mainapp/css/styles.css +++ b/src/core/static/mainapp/css/styles.css @@ -27,3 +27,5 @@ } + + diff --git a/src/core/static/mainapp/icons/favicon.ico b/src/core/static/mainapp/icons/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..38941e9689b02d22e851ed3cd9935c54ecaa143a GIT binary patch literal 894 zcmZQzU}Ruq5D);-5)2v43=Con3=A3!3=9Gc3=9ek5OD?&U!O{O)7$Ark zJ#du}27ZemYT(AAapB?+23DhRX~8AVz<}K^xYXkk$7&89#c(gceL+w$vKAs0BWr=M z=}-Ru&%gk~|Nb*D{HbSP_$kl8@OeH1!~63L4CkLSFq}Wn!0>!N1H)%~28JK?3=Dse G^Z)>cK2`Ss literal 0 HcmV?d00001 diff --git a/src/core/static/whiteboard/css/style.css b/src/core/static/whiteboard/css/style.css new file mode 100644 index 0000000..5913939 --- /dev/null +++ b/src/core/static/whiteboard/css/style.css @@ -0,0 +1,218 @@ +* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } +html { + height: 100%; +} +body { + font-family: "Segoe UI Web Light", "Segoe UI Light", "Segoe UI Web Regular", "Segoe UI", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; + font-size: 1.2rem; + margin: 1em; + color: #fff; + background: url(../images/grid-pattern.png) left top repeat, + -webkit-radial-gradient(50% 15%, #2c98dd, #1a5f96) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -moz-radial-gradient(50% 15%, #2c98dd, #1a5f96) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -ms-radial-gradient(50% 15%, #2c98dd, #1a5f96) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -o-radial-gradient(50% 15%, #2c98dd, #1a5f96) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + radial-gradient(circle farthest-side at 50% 15%, #2c98dd, #1a5f96) no-repeat; + background-color: #1a5f96; +} +body.alt { + background: url(../images/grid-pattern.png) left top repeat, + -webkit-radial-gradient(50% 15%, #1c802e, #012e13) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -moz-radial-gradient(50% 15%, #1c802e, #012e13) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -ms-radial-gradient(50% 15%, #1c802e, #012e13) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -o-radial-gradient(50% 15%, #1c802e, #012e13) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + radial-gradient(circle farthest-side at 50% 15%, #1c802e, #012e13) no-repeat; + background-color: #012e13; +} +body.alt2 { + background: url(../images/grid-pattern.png) left top repeat, + -webkit-radial-gradient(50% 15%, #ababab, #505050) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -moz-radial-gradient(50% 15%, #ababab, #505050) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -ms-radial-gradient(50% 15%, #ababab, #505050) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + -o-radial-gradient(50% 15%, #ababab, #505050) no-repeat; + background: url(../images/grid-pattern.png) left top repeat, + radial-gradient(circle farthest-side at 50% 15%, #ababab, #505050) no-repeat; + background-color: #505050; +} +header { + margin-bottom: 1em; +} +h1, h2, h3 { + margin: 0; + font-weight: normal; +} +h1 { + font-size: 3.375rem; + text-transform: lowercase; + text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); +} +h2 { + font-size: 1rem; + text-transform: uppercase; + line-height: 1.6rem; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); +} +a { + color: #fff; + text-decoration: underline; +} +footer { + font-size: .75em; + color: silver; + position: absolute; + bottom: 1em; + right: 1em; +} +#drawCanvas { + -ms-touch-action: none; + position: absolute; + top: 0; + left: 0; +} +#drawCanvas:hover, #drawCanvas:active { + cursor: url('data:image/x-icon;base64,AAACAAEAICAAAAEAAQCoEAAAFgAAACgAAAAgAAAAQAAAAAEAIAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA70aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/4yHh/8aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef9XTEr/v7+//62oqP8aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA71+eXn/V0xK/7+/v/9pXlz/6enp/8jEw/8aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/6urq/+/v7//aV5c/+np6f+rpKL//////87Jyf8aBgO9AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef+rq6v/v7+//9XV1f/p6en/q6Si//////+vqKf/6Obl/xoGA70AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA71+eXn/q6ur/7+/v//V1dX/6enp//j4+P//////r6in/+jm5f97b27/GgYDvQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/6urq/+/v7//1dXV/+np6f/4+Pj////////////o5uX/e29u/87Jyf8aBgO9AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef+rq6v/v7+//9XV1f/p6en/+Pj4/////////////////3tvbv/Oycn/6Obl/xoGA70AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA71+eXn/q6ur/7+/v//V1dX/6enp//j4+P////////////////97b27/zsnJ///////o5uX/GgYDvQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/6urq/+/v7//1dXV/+np6f/4+Pj/////////////////e29u/87Jyf//////6Obl/xoGA70aBgM3AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef+rq6v/v7+//9XV1f/p6en/+Pj4/////////////////3tvbv/Oycn//////+jm5f8aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA71+eXn/q6ur/7+/v//V1dX/6enp//j4+P////////////////97b27/zsnJ///////o5uX/GgYDvRoGAzcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/1dMSv+/v7//1dXV/+np6f/4+Pj/////////////////e29u/87Jyf//////6Obl/xoGA70aBgM3AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef+rq6v/v7+//2leXP/p6en/+Pj4/////////////////3tvbv/Oycn//////+jm5f8aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA71+eXn/q6ur/7+/v//V1dX/6enp/6ukov////////////////97b27/zsnJ///////o5uX/GgYDvRoGAzcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/6urq/+/v7//1dXV/+np6f/4+Pj//////6+op//o5uX/VUZE/87Jyf//////6Obl/xoGA70aBgM3AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef+rq6v/v7+//9XV1f/p6en/+Pj4////////////6Obl/1VGRP9VRkT/zsnJ/+jm5f8aBgO9GgYDNwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgYDGhoGA71+eXn/q6ur/7+/v//V1dX/6enp//j4+P////////////////9VRkT/GgYDNxoGAzcaBgM3GgYDvRoGAzcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABoGAxoaBgO9fnl5/6urq/+/v7//1dXV/+np6f/4+Pj/////////////////VUZE/xoGAzcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaBgMaGgYDvX55ef+rq6v/v7+//9XV1f/p6en/+Pj4/////////////////1VGRP8aBgM3AAAAAAAA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'), + pointer; +} +#colorSwatch { + position: absolute; + bottom: 20px; + right: 20px; +} + + +input[type=radio] { + margin: 0; + display: none; + width: 0; +} +input[type=radio]:checked + label::after { + content: '\2712'; + position: absolute; + left: 8px; +} + +label { + display: inline-block; + width: 48px; height: 48px; + position: relative; + padding-right: 5px; + border-radius: 50%; + text-shadow: 1px 1px 2px #000; + color: #fff; + font-size: 32px; + line-height: 46px; +} +label[for=color01] {background: gold;} +label[for=color02] {background: darkorange;} +label[for=color03] {background: navy;} +label[for=color04] {background: yellowgreen;} +label[for=color05] {background: firebrick;} +label[for=color06] {background: powderblue;} + +footer { + margin-top: 1.5em; +} + +/* Occupancy Animation */ + +.anim { + transform: scale(1.5); +} +header div { + float: left; +} +.bubble { + -webkit-transition: all .5s; + transition: all .5s; +} +.bubble { + position: absolute; + top: 20px; + right: 15px; + min-width: 48px; + height: 48px; + padding: .3em; + display: inline-block; + border-radius: 8px; + line-height: .9em; + color: #fff; + text-align: center; + background: #0142a3; +} +.bubble span { + display: block; + margin: 5px auto; + font-size: 10px; +} +.bubble #occupancy { + font-size: 32px; +} +.github { + display: none; +} + +@media all and (orientation: landscape) { + canvas { + display: inline-block; + margin-right: 10px; + } + #colorSwatch { + display: inline-block; + width: 50px; + top: 120px; + right: 20px; + } + .alt2 #colorSwatch { + top: 30px; + } + .bubble { + top: 0; + position: relative; + min-width: 60px; + height: 60px; + padding: .4em; + margin: 5px 10px 20px 30px; + display: inline-block; + border-radius: 8px; + line-height: 1.05em; + color: #fff; + text-align: center; + background: #0142a3; + } + .bubble:after { + content: ""; + position: absolute; + bottom: -15px; + right: 28px; + border: 0; + border-left-width: 20px; + border-bottom-width: 15px; + border-style: solid; + border-color: transparent #0142a3; + display: block; + width: 0; + } + .bubble span { + display: block; + margin: 5px auto; + font-size: 12px; + } + .bubble #occupancy { + font-size: 40px; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); + } + .github { + display: block; + } +} \ No newline at end of file diff --git a/src/core/static/whiteboard/images/grid-pattern.png b/src/core/static/whiteboard/images/grid-pattern.png new file mode 100644 index 0000000000000000000000000000000000000000..1f036c6fb3905b41d0beed0158fb24945cf4e597 GIT binary patch literal 4617 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 literal 0 HcmV?d00001 diff --git a/src/core/static/whiteboard/js/app.js b/src/core/static/whiteboard/js/app.js new file mode 100644 index 0000000..9b169c3 --- /dev/null +++ b/src/core/static/whiteboard/js/app.js @@ -0,0 +1,124 @@ +(function() { + /* Canvas */ + + var canvas = document.getElementById('drawCanvas'); + var ctx = canvas.getContext('2d'); + var color = document.querySelector(':checked').getAttribute('data-color'); + + canvas.width = Math.min(document.documentElement.clientWidth, window.innerWidth || 300); + canvas.height = Math.min(document.documentElement.clientHeight, window.innerHeight || 300); + + ctx.strokeStyle = color; + ctx.lineWidth = '3'; + ctx.lineCap = ctx.lineJoin = 'round'; + + /* Mouse and touch events */ + + document.getElementById('colorSwatch').addEventListener('click', function() { + color = document.querySelector(':checked').getAttribute('data-color'); + }, false); + + var isTouchSupported = 'ontouchstart' in window; + var isPointerSupported = navigator.pointerEnabled; + var isMSPointerSupported = navigator.msPointerEnabled; + + var downEvent = isTouchSupported ? 'touchstart' : (isPointerSupported ? 'pointerdown' : (isMSPointerSupported ? 'MSPointerDown' : 'mousedown')); + var moveEvent = isTouchSupported ? 'touchmove' : (isPointerSupported ? 'pointermove' : (isMSPointerSupported ? 'MSPointerMove' : 'mousemove')); + var upEvent = isTouchSupported ? 'touchend' : (isPointerSupported ? 'pointerup' : (isMSPointerSupported ? 'MSPointerUp' : 'mouseup')); + + canvas.addEventListener(downEvent, startDraw, false); + canvas.addEventListener(moveEvent, draw, false); + canvas.addEventListener(upEvent, endDraw, false); + + /* PubNub */ + + var channel = 'draw'; + + var pubnub = PUBNUB.init({ + publish_key : 'pub-c-150fdb3a-1221-4a4d-844a-2d200e3ec2fc', + subscribe_key : 'sub-c-cb3013e6-32e5-11eb-9713-12bae088af96', + leave_on_unload : true, + ssl : document.location.protocol === "https:" + }); + + pubnub.subscribe({ + channel: channel, + callback: drawFromStream, + presence: function(m){ + if(m.occupancy > 1){ + document.getElementById('unit').textContent = 'Students Online'; + } + document.getElementById('occupancy').textContent = m.occupancy; + var p = document.getElementById('occupancy').parentNode; + p.classList.add('anim'); + p.addEventListener('transitionend', function(){p.classList.remove('anim');}, false); + } + }); + + function publish(data) { + pubnub.publish({ + channel: channel, + message: data + }); + } + + /* Draw on canvas */ + + function drawOnCanvas(color, plots) { + ctx.strokeStyle = color; + ctx.beginPath(); + ctx.moveTo(plots[0].x, plots[0].y); + + for(var i=1; i1&&(document.getElementById("unit").textContent="doodlers"),document.getElementById("occupancy").textContent=e.occupancy;var t=document.getElementById("occupancy").parentNode;t.classList.add("anim"),t.addEventListener("transitionend",function(){t.classList.remove("anim")},!1)}}),drawHistory&&v.history({channel:p,count:50,callback:function(e){v.each(e[0],n)}});var y=!1,b=[]}(); diff --git a/src/core/templates/admin/base_site.html b/src/core/templates/admin/base_site.html new file mode 100644 index 0000000..a3f3bbc --- /dev/null +++ b/src/core/templates/admin/base_site.html @@ -0,0 +1,17 @@ +{% extends 'admin/base.html' %} +{% load static %} + +{% block branding %} +

+ + Open Classroom +

+{% endblock %} + + +{% block extrastyle %} + + + + +{% endblock %} \ No newline at end of file diff --git a/src/core/templates/landing_page.html b/src/core/templates/landing_page.html index 2c835ba..ae0e5e9 100644 --- a/src/core/templates/landing_page.html +++ b/src/core/templates/landing_page.html @@ -14,7 +14,7 @@ - + diff --git a/src/core/templates/partials/_head.html b/src/core/templates/partials/_head.html index 2b6b466..d6da419 100644 --- a/src/core/templates/partials/_head.html +++ b/src/core/templates/partials/_head.html @@ -19,6 +19,7 @@ + diff --git a/src/core/templates/partials/_sidebar.html b/src/core/templates/partials/_sidebar.html index fabfc67..0d96863 100644 --- a/src/core/templates/partials/_sidebar.html +++ b/src/core/templates/partials/_sidebar.html @@ -4,7 +4,7 @@
- +
OPEN CLASSROOM
diff --git a/src/whiteboard/templates/whiteboard/liveboard.html b/src/whiteboard/templates/whiteboard/liveboard.html new file mode 100644 index 0000000..fadb177 --- /dev/null +++ b/src/whiteboard/templates/whiteboard/liveboard.html @@ -0,0 +1,53 @@ +{% load static %} + + + + + + + CoDoodler + + + + + + + +
+
+

Open Board

+

Live Openboard

+
+
+ 0 + Students Online +
+
+ +
+ Canvas is not supported on this browser! + +
+ + + + + + +
+
+ + + + + + + + + + + + diff --git a/src/whiteboard/urls.py b/src/whiteboard/urls.py index 50bcfde..78a1ce5 100644 --- a/src/whiteboard/urls.py +++ b/src/whiteboard/urls.py @@ -5,4 +5,5 @@ app_name = 'whiteboard' urlpatterns = [ path('', views.whiteboard, name='whiteboard'), + path('liveboard/', views.liveboard, name='liveboard'), ] \ No newline at end of file diff --git a/src/whiteboard/views.py b/src/whiteboard/views.py index 39e5015..e0c5abb 100644 --- a/src/whiteboard/views.py +++ b/src/whiteboard/views.py @@ -5,3 +5,8 @@ from django.contrib.auth.decorators import login_required def whiteboard(request): context = {} return render(request, 'whiteboard/whiteboard.html', context) + +@login_required +def liveboard(request): + context = {} + return render(request, 'whiteboard/liveboard.html', context)