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 });