rc-web@63: /////////////////////////////////////////////////
rc-web@63: // connect to websocket
rc-web@63: 
rc-web@63: var socket = io.connect();
rc-web@63: 
rc-web@63: //socket.on("metroPulse", metronomeTick);
rc-web@63: /////////////////////////////////////////////////
rc-web@63: socket.on("metroPulse", pulseInClient);
rc-web@63: function pulseInClient(pulse,groupID,metrobeat){
rc-web@63:     var groupPage=document.getElementById('group').value
rc-web@63:     if (groupID == groupPage) {
rc-web@63: 	metronomeTick(1000, groupID, metrobeat);
rc-web@63:     }
rc-web@63: }
rc-web@63: /////////////////////////////////////////////////
rc-web@63: function  metroCss(beat, beatcolor,text){
rc-web@63:     var color = beatcolor;
rc-web@63:     
rc-web@63:     $(".metrocase > div").each(function(){$(this).stop()});
rc-web@63:     $(".metrocase > div").each(function(){$(this).css('background-color', beatcolor)});
rc-web@63:     $(".metrocase > div").each(function(){$(this).text(" ")});
rc-web@63:     $(".metrocase > div").each(function(){$(this).animate({opacity: 1},
rc-web@63: 							  50,
rc-web@63: 							  function() { $(this).animate({opacity:0.0}); }
rc-web@63: 							 );
rc-web@63: 					 })  
rc-web@63: 	}
rc-web@63: 
rc-web@63: function metronomeTick(pulse, voice,metrobeat) {
rc-web@63:     var color = "gray"
rc-web@63:     metroCss(0, "red", "4")    
rc-web@63: };
rc-web@63: 
rc-web@63: /////////////////////////////////////////////////
rc-web@63: 
rc-web@63: // update the stopwatch value on the client page in line with server
rc-web@63: socket.on("chronFromServer", function(chron) {
rc-web@63:     $("div#client_chronometer").text(chron);
rc-web@63: });
rc-web@63: 
rc-web@63: 
rc-web@63: // server time
rc-web@63: 
rc-web@63: //var groupPage=document.getElementById('group').value
rc-web@63: //if (groupID == groupPage) {
rc-web@63:     socket.on("dateTime", function(datetime) {
rc-web@63: //	console.log(datetime)
rc-web@63: 	$("div#datetime").text("Server Time: " +datetime);
rc-web@63: 	
rc-web@63:     });
rc-web@63: 
rc-web@63: 
rc-web@63: /////////////////////////////////////////////////
rc-web@63: // countdown to change
rc-web@63: 
rc-web@63: socket.on("countinFromServer", countinClient);
rc-web@63: function countinClient(groupID, currentseconds,mm,text,colour,background){
rc-web@63:     var groupPage=document.getElementById('group').value
rc-web@63:     if (groupID == groupPage) {
rc-web@63: 	console.log(groupID, currentseconds,mm,text,colour,background)
rc-web@63: 	document.getElementById("count").style.visibility="visible";
rc-web@63: 	//document.getElementById("count").style.visibility="visible";
rc-web@63: 	$("#counttitle").text(text);
rc-web@63: 	$("#count").text(currentseconds);
rc-web@63: 	//$("#cnt").text(currentseconds);
rc-web@63: 	$("#count").css('background-color', background);	
rc-web@63: 	document.getElementById("count").style.color=colour;
rc-web@63: //	if ( currentseconds == 0) {
rc-web@63: 	    //document.getElementById("midcomms").style.visibility='hidden';
rc-web@63: //	}
rc-web@63:     }}
rc-web@63: /////////////////////////////////////////////////
rc-web@63: 
rc-web@63: /////////////////////////////////////////////////
rc-web@63: // countdown to change
rc-web@63: 
rc-web@63: socket.on("counterText", cText);
rc-web@63: function cText(groupID, currentseconds,text){
rc-web@63: 
rc-web@63:     var groupPage=document.getElementById('group').value
rc-web@63:     if (groupID == groupPage) {
rc-web@63: //	console.log(text)
rc-web@63: 	$("#totalcountdown").text(text);	
rc-web@63:     }}
rc-web@63: 
rc-web@63: ///////////////////////////////////////
rc-web@63: 
rc-web@63: function pageFlip(unit) {
rc-web@63:     console.log("flipping page:"+ unit);
rc-web@63:     $('#sections').trigger('goto', [parseFloat(unit)]); 
rc-web@63: }
rc-web@63: 
rc-web@63: 
rc-web@63: /////////////////////////////////////////////////
rc-web@63: 
rc-web@63: // call the fancy jquery functions
rc-web@63: 
rc-web@63: function slideTo (target) { $('#sections').trigger('goto', [target]); }
rc-web@63: function pad2(number) { return (number < 10 ? '0' : '') + number }       
rc-web@63: 
rc-web@63: /////////////////////////////////////////////////
rc-web@63: 
rc-web@63: socket.on("pageFlipfromserver", pageTurn);
rc-web@63: function pageTurn (group,unit,time,mm) {
rc-web@63:     var groupPage=document.getElementById('group').value;
rc-web@63:     if (group == groupPage) {
rc-web@63: 	var g= pad2(group); 
rc-web@63: 	var p= pad2(unit);
rc-web@63: //	pageFlip(unit); 
rc-web@63: 	pageTurnB(unit)
rc-web@63: 	testSound.play();
rc-web@63:     console.log("flipping page:"+ unit);  
rc-web@63:  }
rc-web@63:     else { 
rc-web@63: 	console.log("not for this group... ignoring... for group:" + group );
rc-web@63:     }
rc-web@63: }
rc-web@63: 
rc-web@63: function pageTurnB(unit) {
rc-web@63:     var units=6;
rc-web@63:     var next=(((unit+1)%units)+units)%units
rc-web@63:     console.log("HOP TURN" + unit+ "next:" + next);
rc-web@63:     $("#live").load("music.html #"+unit +" *"); 
rc-web@63:     $("#preview").html("<h3 style='background:transparent; position: absolute; top:14px; right:14px;';> n e x t : </h3><img src='thumbs/"+next + ".png" + "' width='400'>")
rc-web@63: }
rc-web@63: 
rc-web@63: ////////////////////////////////////////////////
rc-web@63: 
rc-web@63: /* commented out for now as interferes with chat
rc-web@63: need to introduce metakey...manyana... not so usefull anyway really... 
rc-web@63: 
rc-web@63: keyboard controls 
rc-web@63: +++++++++++++++++++++++++
rc-web@63: 
rc-web@63: SPACE to toggle visibilty of preview
rc-web@63: m to toggle visibilty of metronome
rc-web@63: s to toggle visibilty of stopwatch
rc-web@63: h to hide all above
rc-web@63: 
rc-web@63: 
rc-web@63: 
rc-web@63: function toggle_visibility(id) {
rc-web@63:     var e = document.getElementById(id);
rc-web@63:     if(e.style.display == 'block')
rc-web@63:         e.style.display = 'none';
rc-web@63:        else
rc-web@63:            e.style.display = 'block';
rc-web@63: }
rc-web@63: 
rc-web@63: $(document).keypress(function(e){
rc-web@63:     // "space  bar" for next unit preview
rc-web@63:     var checkWebkitandIE=(e.which==32 ? 1 : 0);
rc-web@63:     var checkMoz=(e.which==32 ? 1 : 0);
rc-web@63:     // "m" button for metronome
rc-web@63:     var mcheckWebkitandIE=(e.which==109 ? 1 : 0);
rc-web@63:     var mcheckMoz=(e.which==109 ? 1 : 0);
rc-web@63:     // "s" button for stopwatch/chronometer
rc-web@63:     var ccheckWebkitandIE=(e.which==115 ? 1 : 0);
rc-web@63:     var ccheckMoz=(e.which==115 ? 1 : 0);
rc-web@63: 
rc-web@63:   // "h" button for hideall
rc-web@63:     var hcheckWebkitandIE=(e.which==104 ? 1 : 0);
rc-web@63:     var hcheckMoz=(e.which==104 ? 1 : 0);
rc-web@63: 
rc-web@63: //    console.log(e.which);
rc-web@63:     if (checkWebkitandIE || checkMoz) { toggle_visibility('preview') }   
rc-web@63:     if (mcheckWebkitandIE || mcheckMoz) { toggle_visibility('metro') }   
rc-web@63:     if (ccheckWebkitandIE || ccheckMoz) { toggle_visibility('client_chronometer') }   
rc-web@63:     if (hcheckWebkitandIE || hcheckMoz) { 
rc-web@63: 	toggle_visibility('client_chronometer') 
rc-web@63: 	toggle_visibility('metro') 
rc-web@63: 	toggle_visibility('preview') 
rc-web@63: }
rc-web@63:     });
rc-web@63: 
rc-web@63: */
rc-web@63: 
rc-web@63: ////////////////////////////////////////////////
rc-web@63: // this needs to have a variable to define the websocket
rc-web@63: // otherwise we will pings from all sockets connected
rc-web@63: // no! the server broadcasts the ping and the clients emit the pong!
rc-web@63: // ah but then the time reported back from the server needs to be targeted
rc-web@63: // to specific client..
rc-web@63: //////////////////////////////////////////////
rc-web@63: // Latency "Pong"
rc-web@63: 
rc-web@63: socket.on("timeFromServer", function(n) { 
rc-web@63:     socket.emit("clientTimeResponse",n);
rc-web@63: });
rc-web@63: socket.on("latencyFromServer", function(latency) {
rc-web@63:     $("#client_latency").text("Latency: "+latency+"ms.")
rc-web@63:     //console.log(latency)
rc-web@63: });
rc-web@63: 
rc-web@63: function getLatencies(x) { socket.emit("getLatencies", x); }
rc-web@63: 
rc-web@63: //////////////////////////////////////////////
rc-web@63: 
rc-web@63: 
rc-web@63: socket.on('connect', function () {
rc-web@63:     $('#chat').addClass('connected');
rc-web@63: });
rc-web@63: 
rc-web@63: socket.on('announcement', function (msg) {
rc-web@63:     $('#lines').append($('<p>').append($('<em>').text(msg)));
rc-web@63: });
rc-web@63: 
rc-web@63: socket.on('nicknames', function (nicknames) {
rc-web@63:     $('#nicknames').empty().append($('<span>Online: </span>'));
rc-web@63:     for (var i in nicknames) {
rc-web@63: 	$('#nicknames').append($('<b>').text(nicknames[i]));
rc-web@63:     }
rc-web@63: });
rc-web@63: 
rc-web@63: socket.on('user message', message);
rc-web@63: socket.on('reconnect', function () {
rc-web@63:     $('#lines').remove();
rc-web@63:     message('System', 'Reconnected to the server');
rc-web@63: });
rc-web@63: 
rc-web@63: socket.on('reconnecting', function () {
rc-web@63:     message('System', 'Attempting to re-connect to the server');
rc-web@63: });
rc-web@63: 
rc-web@63: socket.on('error', function (e) {
rc-web@63:     message('System', e ? e : 'A unknown error occurred');
rc-web@63: });
rc-web@63: 
rc-web@63: function message (from, msg) {
rc-web@63:     $('#lines').append($('<p>').append($('<b>').text(from), msg));
rc-web@63: }
rc-web@63: 
rc-web@63: // dom manipulation
rc-web@63: $(function () {
rc-web@63:     $('#set-nickname').submit(function (ev) {
rc-web@63: 	socket.emit('nickname', $('#nick').val(), function (set) {
rc-web@63: 	    if (!set) {
rc-web@63: 		clear();
rc-web@63: 		return $('#chat').addClass('nickname-set');
rc-web@63: 	    }
rc-web@63: 	    $('#nickname-err').css('visibility', 'visible');
rc-web@63: 	});
rc-web@63: 	return false;
rc-web@63:     });
rc-web@63: 
rc-web@63:     $('#send-message').submit(function () {
rc-web@63: 	message('me', $('#message').val());
rc-web@63: 	socket.emit('user message', $('#message').val());
rc-web@63: 	clear();
rc-web@63: 	$('#lines').get(0).scrollTop = 10000000;
rc-web@63: 	return false;
rc-web@63:     });
rc-web@63: 
rc-web@63:     function clear () {
rc-web@63: 	$('#message').val('').focus();
rc-web@63:     };
rc-web@63: });