333 lines
10 KiB
JavaScript
Executable File
333 lines
10 KiB
JavaScript
Executable File
|
|
var socket = io.connect();
|
|
|
|
function startChr() { socket.emit("startChr")}
|
|
|
|
function clearStopwatch() { socket.emit("clearStopwatch")}
|
|
function goStopwatch() { socket.emit("goStopwatch")}
|
|
function stopChr() { socket.emit("stopChr")}
|
|
function resetChr() { socket.emit("resetChr")}
|
|
function stopWatch(state) { socket.emit("stopWatch", state)}
|
|
|
|
// update the stopwatch value on the client page in line with server
|
|
socket.on("chronFromServer", function(chron) {
|
|
$("div#timer").text(chron);
|
|
});
|
|
|
|
var scorewidth = "-10000px"
|
|
var scorewidtha = "-20000px"
|
|
|
|
speed = 300;
|
|
//console.log("speed = ", speed)
|
|
speeda = speed/1.2
|
|
speedb = speed/1.4
|
|
speedc = speed/1.6
|
|
speedd = speed/1.75
|
|
//console.log("speeda = ", speeda)
|
|
|
|
////////////////////////////////////////////////////////
|
|
// send poistion data to server for retramsmit via OSC
|
|
/////////////////////////////////////////////////////////
|
|
//TweenLite.ticker.addEventListener("tick", tickHandler);
|
|
|
|
function tickHandler() {
|
|
var r=Math.floor(Math.random()*11)
|
|
//get score part locations and send data to server
|
|
// var lefta = parseInt(document.getElementById(svga0).style.left);
|
|
socket.emit("parta", r)
|
|
// var leftb = $('#scoresvgb').css("left");
|
|
//socket.emit("partb", leftb)
|
|
//var leftc = $('#scoresvgc').css("left");
|
|
// socket.emit("partc", leftc)
|
|
//var leftd = $('#scoresvgd').css("left");
|
|
// socket.emit("partd", leftd)
|
|
}
|
|
|
|
TweenLite.ticker.addEventListener("tick", tickHandler);
|
|
|
|
var tlx = new TimelineMax();
|
|
var tlplaya = new TimelineMax({repeat:100, yoyo:true});
|
|
|
|
var tla = new TimelineMax({repeat:100});
|
|
var tlb = new TimelineMax({repeat:100});
|
|
var tlc = new TimelineMax({repeat:100});
|
|
var tld = new TimelineMax({repeat:100});
|
|
|
|
tlx.to(title, 1.5, {css:{left:"40px"}},1.5);
|
|
tlx.to(ensemble, 1, {css:{left:"320px"}},-0.5);
|
|
tlx.to(robcanning, 1, {css:{left:"420px"}},-0.5);
|
|
|
|
tlx.to(title, 3, {css:{left:"-1300px"}},2);
|
|
tlx.to(ensemble, 3, {css:{top:"-300px"}},-3);
|
|
tlx.to(robcanning, 3, {css:{left:"1120px"}},-3);
|
|
|
|
tlx.to(playa, 0.1, {css:{left:"300px"}});
|
|
tlx.to(playb, 0.1, {css:{left:"300px"}});
|
|
tlx.to(playc, 0.1, {css:{left:"300px"}});
|
|
tlx.to(playd, 0.1, {css:{left:"300px"}});
|
|
|
|
tlx.to(playzonea, 0.2, {css:{top:"18px"}});
|
|
tlx.to(playzoneb, 0.2, {css:{top:"200px"}});
|
|
tlx.to(playzonec, 0.2, {css:{top:"378px"}});
|
|
tlx.to(playzoned, 0.2, {css:{top:"558px"}});
|
|
|
|
tlx.to(hitstart, 1, {css:{left:"300px"}},-0.2);
|
|
|
|
//tla.insert("positiona", 0);
|
|
//tlb.insert("positiona", 0);
|
|
//tlc.insert("positiona", 0);
|
|
//tld.insert("positiona", 0);
|
|
|
|
var initialwait = 0
|
|
|
|
tla.to(svga0, speeda, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tla.to(svga1, speeda, {css:{left:"0px"},ease:Linear.easeNone},-speeda);
|
|
tla.to(svga1, speedb, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tla.to(svga2, speedb, {css:{left:"0px"},ease:Linear.easeNone},-speedb);
|
|
//tla.to(svga2, speedd, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
//tla.to(svga3, speedd, {css:{left:"0px"},ease:Linear.easeNone},-speedd);
|
|
tla.to(svga2, speedc, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
|
|
tlb.to(svgb0, speedc, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tlb.to(svgb1, speedc, {css:{left:"0px"},ease:Linear.easeNone},-speedc);
|
|
tlb.to(svgb1, speedb, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tlb.to(svgb2, speedb, {css:{left:"0px"},ease:Linear.easeNone},-speedb)
|
|
//tlb.to(svga2, speedd, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
//tlb.to(svga3, speedd, {css:{left:"0px"},ease:Linear.easeNone},-speedd);
|
|
tlb.to(svgb2, speeda, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
|
|
tlc.to(svgc0, speedb, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tlc.to(svgc1, speedb, {css:{left:"0px"},ease:Linear.easeNone},-speedb);
|
|
tlc.to(svgc1, speeda, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tlc.to(svgc2, speeda, {css:{left:"0px"},ease:Linear.easeNone},-speeda);
|
|
//tlc.to(svga2, speedd, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
//tlc.to(svga3, speedd, {css:{left:"0px"},ease:Linear.easeNone},-speedd);
|
|
tlc.to(svgc2, speedc, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
|
|
tld.to(svgd0, speeda, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tld.to(svgd1, speeda, {css:{left:"0px"},ease:Linear.easeNone},-speeda);
|
|
tld.to(svgd1, speedc, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
tld.to(svgd2, speedc, {css:{left:"0px"},ease:Linear.easeNone},-speedc);
|
|
//tld.to(svga2, speedd, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
//tld.to(svga3, speedd, {css:{left:"0px"},ease:Linear.easeNone},-speedd);
|
|
tld.to(svgd2, speedb, {css:{left:scorewidth},ease:Linear.easeNone});
|
|
|
|
tla.pause(); tlb.pause();tlc.pause();tld.pause();
|
|
|
|
|
|
$("#help").mouseover(function() {
|
|
$("#helpcontent").show();
|
|
}).mouseout(function() {
|
|
$("#helpcontent").hide();
|
|
});
|
|
|
|
|
|
//h help
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==72 ){
|
|
toggle('helpText')
|
|
}
|
|
});
|
|
|
|
//s settings
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==83 ){
|
|
toggle('controlPanel')
|
|
}
|
|
});
|
|
|
|
/////////////////
|
|
// set starting points here
|
|
// and stagger offsets if any
|
|
/////////////////
|
|
//0
|
|
|
|
/*
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==48 ){
|
|
clearStopwatch(); goStopwatch();
|
|
document.getElementById('hitstart').style.visibility = 'hidden';
|
|
tla.gotoAndStop(0); setTimeout(function(){tla.play()},00000);
|
|
tlb.gotoAndStop(0); setTimeout(function(){tlb.play()},10000);
|
|
tlc.gotoAndStop(0); setTimeout(function(){tlc.play()},20000);
|
|
tld.gotoAndStop(0); setTimeout(function(){tld.play()},30000);
|
|
}
|
|
});
|
|
*/
|
|
|
|
function playnow() {
|
|
clearStopwatch(); goStopwatch();
|
|
document.getElementById('hitstart').style.visibility = 'hidden';
|
|
tla.gotoAndStop(0); //tla.play();
|
|
tlb.gotoAndStop(0); //tlb.play();
|
|
tlc.gotoAndStop(0); //tlc.play();
|
|
tld.gotoAndStop(0); //tld.play();
|
|
tla.play(); tlb.play();tlc.play();tld.play();
|
|
}
|
|
|
|
socket.on("play", function() {
|
|
console.log("got a play message from server")
|
|
playnow()
|
|
});
|
|
|
|
/////////////////////////////////
|
|
//SPACEBAR
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==32 ){
|
|
socket.emit("play")
|
|
}
|
|
});
|
|
|
|
/////////////////////////////////
|
|
// GLOBAL PAUSE AND RESUME
|
|
|
|
function resumeAll(){ console.log("resumeAll");tla.resume(); tlb.resume();tlc.resume();tld.resume();}
|
|
function pauseAll(){ console.log("pauseAll"); tla.pause(); tlb.pause();tlc.pause();tld.pause();}
|
|
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==188 ){ socket.emit("resumeAll");}});
|
|
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==190 ){ socket.emit("pauseAll"); }});
|
|
|
|
socket.on("pauseAll", function(){pauseAll()})
|
|
socket.on("resumeAll", function(){resumeAll()})
|
|
/////////////////////////////////
|
|
// PAUSE AND RESUME PARTS
|
|
/// pause
|
|
socket.on("pauseA", function() { tla.pause(); });
|
|
socket.on("pauseB", function() { tlb.pause(); });
|
|
socket.on("pauseC", function() { tlc.pause(); });
|
|
socket.on("pauseD", function() { tld.pause(); });
|
|
//// resume
|
|
socket.on("resumeA", function() { tla.resume(); });
|
|
socket.on("resumeB", function() { tlb.resume(); });
|
|
socket.on("resumeC", function() { tlc.resume(); });
|
|
socket.on("resumeD", function() { tld.resume(); });
|
|
|
|
//// TOGGLE DIV CLICK
|
|
$('#playzonea').toggle(function(){socket.emit("pauseA");},function(){socket.emit("resumeA");});
|
|
$('#playzoneb').toggle(function(){socket.emit("pauseB");},function(){socket.emit("resumeB");});
|
|
$('#playzonec').toggle(function(){socket.emit("pauseC");},function(){socket.emit("resumeC");});
|
|
$('#playzoned').toggle(function(){socket.emit("pauseD");},function(){socket.emit("resumeD");});
|
|
|
|
//// KEYUPDOWN NUMBER KEYS 1-4
|
|
$(document).keydown(function(e){
|
|
if (e.keyCode==49 ){socket.emit("pauseA")}
|
|
if (e.keyCode==50 ){socket.emit("pauseB")}
|
|
if (e.keyCode==51 ){socket.emit("pauseC")}
|
|
if (e.keyCode==52 ){socket.emit("pauseD")}
|
|
});
|
|
|
|
$(document).keyup(function(e){
|
|
if (e.keyCode==49 ){socket.emit("resumeA");}
|
|
if (e.keyCode==50 ){socket.emit("resumeB");}
|
|
if (e.keyCode==51 ){socket.emit("resumeC");}
|
|
if (e.keyCode==52 ){socket.emit("resumeD");}
|
|
});
|
|
|
|
////////////////////////////////////////////
|
|
|
|
var av = 1;
|
|
function aplayspeed(xspeed){
|
|
if (xspeed == 1){ av += 0.1; }
|
|
else if (xspeed == -1){ av -= 0.1; }
|
|
return av;
|
|
}
|
|
|
|
var bv = 1;
|
|
function bplayspeed(xspeed){
|
|
if (xspeed == 1){ bv += 0.1; }
|
|
else if (xspeed == -1){ bv -= 0.1; }
|
|
return bv;
|
|
}
|
|
|
|
var cv = 1;
|
|
function cplayspeed(xspeed){
|
|
if (xspeed == 1){ cv += 0.1; }
|
|
else if (xspeed == -1){ cv -= 0.1; }
|
|
return cv;
|
|
}
|
|
|
|
var dv = 1;
|
|
function dplayspeed(xspeed){
|
|
if (xspeed == 1){ dv += 0.1; }
|
|
else if (xspeed == -1){ dv -= 0.1; }
|
|
return dv;
|
|
}
|
|
|
|
///// individual speed controls
|
|
socket.on("speeda", function(s) { tla.timeScale(aplayspeed(s)); } );
|
|
socket.on("speedb", function(s) { tlb.timeScale(bplayspeed(s)); } );
|
|
socket.on("speedc", function(s) { tlc.timeScale(cplayspeed(s)); } );
|
|
socket.on("speedd", function(s) { tld.timeScale(dplayspeed(s)); } );
|
|
|
|
//////////////////////////////
|
|
|
|
// GLOBAL SPEED
|
|
socket.on("globalSpeed", function(x){ globalSpeed(x);})
|
|
function globalSpeed(x){
|
|
console.log("globalSpeed")
|
|
tla.timeScale(aplayspeed(x));
|
|
tlb.timeScale(bplayspeed(x));
|
|
tlc.timeScale(cplayspeed(x));
|
|
tld.timeScale(dplayspeed(x));
|
|
}
|
|
|
|
//=- fasterslower
|
|
$(document).keydown(function(e){
|
|
console.log("globalSpeed",e.keyCode)
|
|
if (e.keyCode==189 ){ socket.emit("globalSpeed", -1);}
|
|
if (e.keyCode==187 ){ socket.emit("globalSpeed", 1);}
|
|
|
|
});
|
|
|
|
//////////////////////////////
|
|
|
|
///////// SEEK
|
|
// [ ] preview fwd back
|
|
var s = 10; var v = 1;
|
|
function cue(direction){
|
|
if (direction == 1){ s += 10; }
|
|
else if (direction == -1){ s -= 10; }
|
|
return s;
|
|
}
|
|
|
|
socket.on("seek", function(seek){ localSeek(cue(seek)) })
|
|
$(document).keydown(function(e){
|
|
/// === seeks around the local score
|
|
// individual musician looking around the score
|
|
if (e.keyCode==222 ){ localSeek(cue(-1)); }
|
|
if (e.keyCode==55 ){ localSeek(cue(1))}
|
|
/// === seeks all the scores
|
|
// ensemble director bringing
|
|
// all musicians to certian point
|
|
if (e.keyCode==219 ){ socket.emit("seek", -1); }
|
|
if (e.keyCode==221 ){ socket.emit("seek", 1); }
|
|
});
|
|
|
|
function localSeek(seek){
|
|
tla.seek(seek);tla.pause();
|
|
tlb.seek(seek);tlb.pause();
|
|
tlc.seek(seek);tlc.pause();
|
|
tld.seek(seek);tld.pause();
|
|
}
|
|
//////////////////////////////////////////////
|
|
|
|
// CLOSE BUTTON FOR DIVS
|
|
//$(document).on('click','.close_box',function(){
|
|
// $(this).parent().fadeTo(300,0,function(){
|
|
// $(this).remove();
|
|
// });
|
|
//});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|