annotate www/oi/js/nodescore-slides.js @ 101:52e44ee1c791 tip master

enabled all scores in autostart script
author Rob Canning <rc@kiben.net>
date Tue, 21 Apr 2015 16:20:57 +0100
parents d802954248a7
children
rev   line source
rob@100 1 /////////////////////////////////////////////////
rob@100 2 // connect to websocket
rob@100 3
rob@100 4 var socket = io.connect();
rob@100 5
rob@100 6 function initPage() { socket.emit("initPage");
rob@100 7 console.log("init.client.log")
rob@100 8 }
rob@100 9
rob@100 10 //socket.on("metroPulse", metronomeTick);
rob@100 11 /////////////////////////////////////////////////
rob@100 12 socket.on("metroPulse", pulseInClient);
rob@100 13 function pulseInClient(pulse,groupID,metrobeat){
rob@100 14 var groupPage=document.getElementById('group').value
rob@100 15 if (groupID == groupPage) {
rob@100 16 metronomeTick(1000, groupID, metrobeat);
rob@100 17 }
rob@100 18 }
rob@100 19
rob@100 20 /////////////////////////////////////////////////
rob@100 21 function metroCss(beat, beatcolor,text){
rob@100 22 var color = beatcolor;
rob@100 23 $(".metrocase > div").each(function(){$(this).stop()});
rob@100 24 $(".metrocase > div").each(function(){$(this).css('background-color', beatcolor)});
rob@100 25 $(".metrocase > div").each(function(){$(this).text(" ")});
rob@100 26 }
rob@100 27
rob@100 28 function metronomeTick(pulse, voice,metrobeat) {
rob@100 29 var color = "gray"
rob@100 30 metroCss(0, "red", "4")
rob@100 31 setTimeout(function(){metroCss(0, "black", "4")},150);
rob@100 32 };
rob@100 33
rob@100 34 /////////////////////////////////////////////////
rob@100 35 // update the stopwatch value on the client page in line with server
rob@100 36 socket.on("chronFromServer", function(chron) { $("div#client_chronometer").text(chron); });
rob@100 37
rob@100 38 // server time
rob@100 39 socket.on("dateTime", function(datetime) {
rob@100 40 $("div#datetime").text("" +datetime);
rob@100 41 });
rob@100 42
rob@100 43 /////////////////////////////////////////////////
rob@100 44 // countdown to change
rob@100 45 socket.on("countinFromServer", countinClient);
rob@100 46 function countinClient(groupID, currentseconds,mm,text,colour,background,unit){
rob@100 47 var groupPage=document.getElementById('group').value
rob@100 48 if (groupID == groupPage) {
rob@100 49 $("#counttitle").css('color','black');
rob@100 50 $("#counttitle").text(text);
rob@100 51 $("#count").text(currentseconds);
rob@100 52 document.getElementById("count").style.color=colour;
rob@100 53 }}
rob@100 54
rob@100 55 /////////////////////////////////////////////////
rob@100 56 // countdown to change
rob@100 57 socket.on("counterText", cText);
rob@100 58 function cText(groupID, currentseconds,text){
rob@100 59 $("#totalcountdown"+groupID).text(text);
rob@100 60 var groupPage=document.getElementById('group').value
rob@100 61 if (groupID == groupPage) {
rob@100 62 //console.log(text)
rob@100 63 $("#totalcountdown").text(text);
rob@100 64 }}
rob@100 65
rob@100 66 ///////////////////////////////////////
rob@100 67 //function pageFlip(unit) { $('#sections').trigger('goto', [parseFloat(unit)]); }
rob@100 68
rob@100 69 /////////////////////////////////////////////////
rob@100 70 // call the fancy jquery functions
rob@100 71 function slideTo (target) { $('#sections').trigger('goto', [target]); }
rob@100 72 function pad2(number) { return (number < 10 ? '0' : '') + number }
rob@100 73
rob@100 74 /////////////////////////////////////////////////
rob@100 75 //var testSound = new buzz.sound( 'audio/testfile', { formats: [ 'ogg', 'mp3' ] } );
rob@100 76 socket.on("pageFlipfromserver", pageTurn);
rob@100 77 function pageTurn (group,unit,time,mm,seqcounter,nextunit) {
rob@100 78 var groupPage=document.getElementById('group').value;
rob@100 79 if (group == groupPage) {
rob@100 80 console.log(unit + " ---> " + nextunit)
rob@100 81 $("#live").load("music.html #"+unit);
rob@100 82 $("#preview").html("<h3 style='background:transparent; position: relative; font-size:1.5em;top:14px; left:10px;';> n e x t : </h3><img src='svg/"+ (nextunit) + ".svg" + "' width='305'>")
rob@100 83 //$("#previewbox-"+group).html("<img src='svg/"+(unit) + ".svg" + "' width='515'>")
rob@100 84 }
rob@100 85 else {
rob@100 86 console.log("not for this group... ignoring... for group:" + group );
rob@100 87 }
rob@100 88 }
rob@100 89
rob@100 90 socket.on("pageIni", pageIni);
rob@100 91 function pageIni (group,unit,time,mm,seqcounter,nextunit) {
rob@100 92 console.log(unit + " ---> " + nextunit)
rob@100 93 //$("#live").load("music.html #"+unit);
rob@100 94 //$("#preview").html("<h3 style='background:transparent; position: relative; font-size:1.5em;top:14px; left:10px;';> n e x t : </h3><img src='thumbs/"+ (nextunit) + ".png" + "' width='305'>")
rob@100 95 $("#previewbox-"+group).html("<img src='svg/"+(unit) + ".svg" + "' width='515'>")
rob@100 96 }
rob@100 97
rob@100 98 ////////////////////////////////////////////////
rob@100 99
rob@100 100 /* commented out for now as interferes with chat
rob@100 101 need to introduce metakey...manyana... not so usefull anyway really...
rob@100 102
rob@100 103 keyboard controls
rob@100 104 +++++++++++++++++++++++++
rob@100 105
rob@100 106 SPACE to toggle visibilty of preview
rob@100 107 m to toggle visibilty of metronome
rob@100 108 s to toggle visibilty of stopwatch
rob@100 109 h to hide all above
rob@100 110
rob@100 111
rob@100 112 */
rob@100 113 function toggle_visibility(id) {
rob@100 114 var e = document.getElementById(id);
rob@100 115 if(e.style.display == 'block')
rob@100 116 e.style.display = 'none';
rob@100 117 else
rob@100 118 e.style.display = 'block';
rob@100 119 }
rob@100 120
rob@100 121 $(document).keypress(function(e){
rob@100 122 // "space bar" for next unit preview
rob@100 123 var checkWebkitandIE=(e.which==32 ? 1 : 0);
rob@100 124 var checkMoz=(e.which==32 ? 1 : 0);
rob@100 125 // "m" button for metronome
rob@100 126 var mcheckWebkitandIE=(e.which==109 ? 1 : 0);
rob@100 127 var mcheckMoz=(e.which==109 ? 1 : 0);
rob@100 128 // "s" button for stopwatch/chronometer
rob@100 129 var ccheckWebkitandIE=(e.which==115 ? 1 : 0);
rob@100 130 var ccheckMoz=(e.which==115 ? 1 : 0);
rob@100 131
rob@100 132 // "h" button for hideall
rob@100 133 var hcheckWebkitandIE=(e.which==104 ? 1 : 0);
rob@100 134 var hcheckMoz=(e.which==104 ? 1 : 0);
rob@100 135
rob@100 136 // console.log(e.which);
rob@100 137 // if (checkWebkitandIE || checkMoz) { toggle_visibility('preview') }
rob@100 138 // if (mcheckWebkitandIE || mcheckMoz) { toggle_visibility('comms') }
rob@100 139 // if (ccheckWebkitandIE || ccheckMoz) { toggle_visibility('client_chronometer') }
rob@100 140 if (hcheckWebkitandIE || hcheckMoz) {
rob@100 141 toggle_visibility('info')
rob@100 142 //toggle_visibility('comms')
rob@100 143 //toggle_visibility('preview')
rob@100 144 }
rob@100 145 });
rob@100 146
rob@100 147 //*/
rob@100 148
rob@100 149 ////////////////////////////////////////////////
rob@100 150 // this needs to have a variable to define the websocket
rob@100 151 // otherwise we will pings from all sockets connected
rob@100 152 // no! the server broadcasts the ping and the clients emit the pong!
rob@100 153 // ah but then the time reported back from the server needs to be targeted
rob@100 154 // to specific client..
rob@100 155 //////////////////////////////////////////////
rob@100 156 // Latency "Pong"
rob@100 157 socket.on("timeFromServer", function(n) {
rob@100 158 socket.emit("clientTimeResponse",n); });
rob@100 159
rob@100 160 socket.on("latencyFromServer", function(latency) {
rob@100 161 $("#client_latency").text("Latency: "+latency+"ms.")
rob@100 162
rob@100 163 });
rob@100 164
rob@100 165 function getLatencies(x) { socket.emit("getLatencies", x); }
rob@100 166
rob@100 167 //////////////////////////////////////////////
rob@100 168
rob@100 169
rob@100 170 socket.on('connect', function () {
rob@100 171 $('#chat').addClass('connected');
rob@100 172 });
rob@100 173
rob@100 174 socket.on('announcement', function (msg) {
rob@100 175 $('#lines').append($('<p>').append($('<em>').text(msg)));
rob@100 176 });
rob@100 177
rob@100 178 socket.on('nicknames', function (nicknames) {
rob@100 179 $('#nicknames').empty().append($('<span>Online: </span>'));
rob@100 180 for (var i in nicknames) {
rob@100 181 $('#nicknames').append($('<b>').text(nicknames[i]));
rob@100 182 }
rob@100 183 });
rob@100 184
rob@100 185 socket.on('user message', message);
rob@100 186 socket.on('reconnect', function () {
rob@100 187 $('#lines').remove();
rob@100 188 message('System', 'Reconnected to the server');
rob@100 189 });
rob@100 190
rob@100 191 socket.on('reconnecting', function () {
rob@100 192 message('System', 'Attempting to re-connect to the server');
rob@100 193 });
rob@100 194
rob@100 195 socket.on('error', function (e) {
rob@100 196 message('System', e ? e : 'A unknown error occurred');
rob@100 197 });
rob@100 198
rob@100 199 function message (from, msg) {
rob@100 200 $('#lines').prepend($('<p>').prepend($('<b>').text(from), msg));
rob@100 201 }
rob@100 202
rob@100 203 // dom manipulation
rob@100 204 $(function () {
rob@100 205 $('#set-nickname').submit(function (ev) {
rob@100 206 socket.emit('nickname', $('#nick').val(), function (set) {
rob@100 207 if (!set) {
rob@100 208 clear();
rob@100 209 return $('#chat').addClass('nickname-set');
rob@100 210 }
rob@100 211 $('#nickname-err').css('visibility', 'visible');
rob@100 212 });
rob@100 213 return false;
rob@100 214 });
rob@100 215
rob@100 216 $('#send-message').submit(function () {
rob@100 217 message('me', $('#message').val());
rob@100 218 socket.emit('user message', $('#message').val());
rob@100 219 clear();
rob@100 220 $('#lines').get(0).scrollTop = 10000000;
rob@100 221 return false;
rob@100 222 });
rob@100 223
rob@100 224 function clear () {
rob@100 225 $('#message').val('').focus();
rob@100 226 };
rob@100 227 });