290 lines
8.4 KiB
JavaScript
290 lines
8.4 KiB
JavaScript
|
|
||
|
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();
|
||
|
|
||
|
$('#playzonea').toggle(function(){tla.pause();},function(){tla.play(); } );
|
||
|
$('#playzoneb').toggle(function(){tlb.pause();},function(){tlb.play(); } );
|
||
|
$('#playzonec').toggle(function(){tlc.pause();},function(){tlc.play(); } );
|
||
|
$('#playzoned').toggle(function(){tld.pause();},function(){tld.play(); } );
|
||
|
|
||
|
$("#help").mouseover(function() {
|
||
|
$("#helpcontent").show();
|
||
|
}).mouseout(function() {
|
||
|
$("#helpcontent").hide();
|
||
|
});
|
||
|
|
||
|
$(document).keydown(function(e){
|
||
|
if (e.keyCode==190 ){
|
||
|
tla.pause(); tlb.pause();tlc.pause();tld.pause();
|
||
|
}
|
||
|
});
|
||
|
|
||
|
//h help
|
||
|
$(document).keydown(function(e){
|
||
|
if (e.keyCode==72 ){
|
||
|
toggle('helpText')
|
||
|
}
|
||
|
});
|
||
|
|
||
|
//s settings
|
||
|
$(document).keydown(function(e){
|
||
|
if (e.keyCode==83 ){
|
||
|
toggle('controlPanel')
|
||
|
}
|
||
|
});
|
||
|
|
||
|
|
||
|
$(document).keydown(function(e){
|
||
|
if (e.keyCode==188 ){
|
||
|
tla.resume(); tlb.resume();tlc.resume();tld.resume();
|
||
|
}
|
||
|
});
|
||
|
/////////////////
|
||
|
// 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);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
//SPACEBAR
|
||
|
|
||
|
$(document).keydown(function(e){
|
||
|
if (e.keyCode==32 ){
|
||
|
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();
|
||
|
}
|
||
|
|
||
|
});
|
||
|
|
||
|
$(document).keydown(function(e){
|
||
|
if (e.keyCode==49 ){tla.pause();}
|
||
|
if (e.keyCode==50 ){tlb.pause();}
|
||
|
if (e.keyCode==51 ){tlc.pause();}
|
||
|
if (e.keyCode==52 ){tld.pause();}
|
||
|
});
|
||
|
|
||
|
$(document).keyup(function(e){
|
||
|
if (e.keyCode==49 ){tla.resume();}
|
||
|
if (e.keyCode==50 ){tlb.resume();}
|
||
|
if (e.keyCode==51 ){tlc.resume();}
|
||
|
if (e.keyCode==52 ){tld.resume();}
|
||
|
});
|
||
|
|
||
|
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;
|
||
|
}
|
||
|
|
||
|
|
||
|
function allSpeed(s){
|
||
|
tla.timeScale(s)
|
||
|
tlb.timeScale(s)
|
||
|
tlc.timeScale(s)
|
||
|
tld.timeScale(s)
|
||
|
}
|
||
|
|
||
|
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 ){ globalSpeed(-1); console.log("boo") }
|
||
|
if (e.keyCode==187 ){ globalSpeed(1)}
|
||
|
});
|
||
|
|
||
|
|
||
|
//[] 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;
|
||
|
}
|
||
|
$(document).keydown(function(e){
|
||
|
console.log("globalSpeed",e.keyCode)
|
||
|
if (e.keyCode==219 ){ localSeek(cue(-1)); }
|
||
|
if (e.keyCode==221 ){ localSeek(cue(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();
|
||
|
// });
|
||
|
//});
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|