view www/m/js/nodescore-client.js @ 19:a56434dee146

toggleable divs and clean up

/////////////////////////////////////////////////
// connect to websocket

var socket = io.connect();

//socket.on("metroPulse", metronomeTick);
/////////////////////////////////////////////////
socket.on("metroPulse", pulseInClient);
function pulseInClient(pulse,groupID,metrobeat){
    var groupPage=document.getElementById('group').value
    if (groupID == groupPage) {
	metronomeTick(1000, groupID, metrobeat);
    }
}
/////////////////////////////////////////////////
function  metroCss(beat, beatcolor,text){
    var color = beatcolor;
    
    $(".metrocase > div").each(function(){$(this).stop()});
    $(".metrocase > div").each(function(){$(this).css('background-color', beatcolor)});
    $(".metrocase > div").each(function(){$(this).text(" ")});
    $(".metrocase > div").each(function(){$(this).animate({opacity: 0.5},
							  50,
							  function() { $(this).animate({opacity:0.0}); }
							 );
					 })  
	}

function metronomeTick(pulse, voice,metrobeat) {
    var color = "gray"
    metroCss(0, "red", "4")    
};

/////////////////////////////////////////////////

// update the stopwatch value on the client page in line with server
socket.on("chronFromServer", function(chron) {
    $("div#client_chronometer").text(chron);
});

/////////////////////////////////////////////////

function pageFlip(unit) {
    console.log("flipping page:"+ unit);
    $('#sections').trigger('goto', [parseFloat(unit)]); 
//    $('#sections-preview').trigger('goto', [parseFloat(unit+1)]); 
    //metroStart(1000); 
    //document.getElementById("countdowncase").style.visibility="hidden";
}



/////////////////////////////////////////////////

// call the fancy jquery functions

function slideTo (target) { $('#sections').trigger('goto', [target]); }
function pad2(number) { return (number < 10 ? '0' : '') + number }       

/////////////////////////////////////////////////

socket.on("pageFlipfromserver", pageTurn);
function pageTurn (group,unit,time,mm) {
    var groupPage=document.getElementById('group').value;
    //console.log("fromservercommand has been executed on client");
    if (group == groupPage) {
	var g= pad2(group); 
	var p= pad2(unit);
//	pageFlip(unit); 
	pageTurnB(p)
 
   }
    else { 
	console.log("not for this group... ignoring... for group:" + group );
    }
}

/////////////////////////////////////////////////

function pageTurnB(unit) {
    console.log("HOP TURN" + unit);
    $("#live").html($("#unit"+unit).html());

}

////////////////////////////////////////////////
// keyboard controls 
// SPACE to toggle visibilty of preview
// etc
// etc
////////////////////////////////////////////////
function toggle_visibility(id) {
    var e = document.getElementById(id);
    if(e.style.display == 'block')
        e.style.display = 'none';
       else
           e.style.display = 'block';
}

$(document).keypress(function(e){
    // "space  bar" for next unit preview
    var checkWebkitandIE=(e.which==32 ? 1 : 0);
    var checkMoz=(e.which==32 ? 1 : 0);
    // "m" button for metronome
    var mcheckWebkitandIE=(e.which==109 ? 1 : 0);
    var mcheckMoz=(e.which==109 ? 1 : 0);
    // "s" button for stopwatch/chronometer
    var ccheckWebkitandIE=(e.which==115 ? 1 : 0);
    var ccheckMoz=(e.which==115 ? 1 : 0);

  // "h" button for hideall
    var hcheckWebkitandIE=(e.which==104 ? 1 : 0);
    var hcheckMoz=(e.which==104 ? 1 : 0);

    console.log(e.which);
    if (checkWebkitandIE || checkMoz) { toggle_visibility('preview') }   
    if (mcheckWebkitandIE || mcheckMoz) { toggle_visibility('metro') }   
    if (ccheckWebkitandIE || ccheckMoz) { toggle_visibility('client_chronometer') }   
    if (hcheckWebkitandIE || hcheckMoz) { 
	toggle_visibility('client_chronometer') 
	toggle_visibility('metro') 
	toggle_visibility('preview') 
}
    });

////////////////////////////////////////////////