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