rc-web@5: /////////////////////////////////////////////////
rc-web@5: // connect to websocket
rc-web@5: 
rc-web@5: var socket = io.connect();
rc-web@5: 
rc-web@11: //socket.on("metroPulse", metronomeTick);
rc-web@11: /////////////////////////////////////////////////
rc-web@11: socket.on("metroPulse", pulseInClient);
rc-web@11: function pulseInClient(pulse,groupID,metrobeat){
rc-web@11:     var groupPage=document.getElementById('group').value
rc-web@11:     if (groupID == groupPage) {
rc-web@11: 	metronomeTick(1000, groupID, metrobeat);
rc-web@11:     }
rc-web@11: }
rc-web@11: /////////////////////////////////////////////////
rc-web@11: function  metroCss(beat, beatcolor,text){
rc-web@11:     var color = beatcolor;
rc-web@11:     
rc-web@11:     $(".metrocase > div").each(function(){$(this).stop()});
rc-web@11:     $(".metrocase > div").each(function(){$(this).css('background-color', beatcolor)});
rc-web@11:     $(".metrocase > div").each(function(){$(this).text(" ")});
rc-web@11:     $(".metrocase > div").each(function(){$(this).animate({opacity: 0.5},
rc-web@11: 							  50,
rc-web@11: 							  function() { $(this).animate({opacity:0.0}); }
rc-web@11: 							 );
rc-web@11: 					 })  
rc-web@11: 	}
rc-web@11: 
rc-web@11: 
rc-web@11: 
rc-web@11: function metronomeTick(pulse, voice,metrobeat) {
rc-web@11:     console.log( voice+ "   metronome tick" + metrobeat)
rc-web@11:     var color = "gray"
rc-web@11: 
rc-web@11:     metroCss(0, "red", "4")    
rc-web@11: 
rc-web@11: //if (metrobeat == 0) {
rc-web@11: //	metroCss(0, "gray", "1")
rc-web@11:   //  }   
rc-web@11:     
rc-web@11:     //if (metrobeat == 3) {
rc-web@11: //	metroCss(0, "white", "4")
rc-web@11:   //  }   
rc-web@11: 
rc-web@11: //    if (metrobeat == 1||metrobeat == 2){ 
rc-web@11: //	$("#metronome"+metrobeat).stop();
rc-web@11: //	$("#metronome"+metrobeat).css('background-color', color);
rc-web@11: //	$("#metronome"+metrobeat).text(" ");
rc-web@11: 	//$("#metronome"+metrobeat).text(metrobeat+1);
rc-web@11: //	$("#metronome"+metrobeat).animate({opacity: 1},
rc-web@11: //				      50,
rc-web@11:   //                          function() { $(this).animate({opacity:0.0}); }
rc-web@11: //				     );
rc-web@11:   //  }
rc-web@11: };
rc-web@11: 
rc-web@5: /////////////////////////////////////////////////
rc-web@5: 
rc-web@5: // update the stopwatch value on the client page in line with server
rc-web@5: socket.on("chronFromServer", function(chron) {
rc-web@5:     $("div#client_chronometer").text(chron);
rc-web@5: });
rc-web@5: 
rc-web@5: /////////////////////////////////////////////////
rc-web@5: 
rc-web@5: function pageFlip(unit) {
rc-web@5:     console.log("flipping page:"+ unit);
rc-web@5:     $('#sections').trigger('goto', [parseFloat(unit)]); 
rc-web@5:     //metroStart(1000); 
rc-web@5:     //document.getElementById("countdowncase").style.visibility="hidden";
rc-web@5: }
rc-web@5: 
rc-web@5: /////////////////////////////////////////////////
rc-web@5: // call the fancy jquery functions
rc-web@5: 
rc-web@5: function slideTo (target) { $('#sections').trigger('goto', [target]); }
rc-web@5: function pad2(number) { return (number < 10 ? '0' : '') + number }       
rc-web@5: 
rc-web@5: /////////////////////////////////////////////////
rc-web@5: 
rc-web@5: socket.on("pageFlipfromserver", pageTurn);
rc-web@5: function pageTurn (group,unit,time,mm) {
rc-web@5:     var groupPage=document.getElementById('group').value;
rc-web@5:     console.log("fromservercommand has been executed on client");
rc-web@5:     if (group == groupPage) {
rc-web@5: 	var g= pad2(group); 
rc-web@5: 	var p= pad2(unit);
rc-web@5: 	pageFlip(unit); 
rc-web@5:     }
rc-web@5:     else { 
rc-web@5: 	console.log("not for this group... ignoring... for group:" + group );
rc-web@5:     }
rc-web@5: }
rc-web@5: 
rc-web@5: /////////////////////////////////////////////////