changeset 39:3ba24da53406

still trying to sort memory leak... js closures will kill me
addedb screenshot

--- a/nodescore	Wed Aug 22 12:51:28 2012 +0000
+++ b/nodescore	Thu Aug 23 08:40:55 2012 +0000
@@ -26,6 +26,6 @@
 fi
 
 killall node;
-node nodescore.js &
+supervisor nodescore.js &
 sleep 2;
 sh ss2thumb.sh $PROJECT $SERVER;

--- a/nodescore.js	Wed Aug 22 12:51:28 2012 +0000
+++ b/nodescore.js	Thu Aug 23 08:40:55 2012 +0000
@@ -83,38 +83,38 @@
     function pad(number) { return (number < 10 ? '0' : '') + number }
     
     // the chronometer initial states
-    var chronstate = 0; var zecsec = 0; var seconds = -20; 
+    var chronstate = 0; var zecsec = 0; var seconds = 0; 
     var mins = 0; var hours = 0;
  
-    function startChr() { if (chronstate !== 1) {
+    function startChr() { if (chronstate !== 1) { 
 	chronstate = 1; chronometer();} 
 			}      // if not already started start the chronometer    
-    function stopChr() {  chronstate = 0; }  // stop the chronometer
-    function resetChr() {  console.log("reset");
-			   clearInterval();
+    
+    function stopChr() {  chronstate = 0; }  
+    // stop the chronometer
+   
+    function resetChr() {//clearInterval();
 			   chronstate = 0;
 			   zecsec = 0; seconds = 0; 
 			    mins = 0; hours = 0; 
 			    chronstate = 0; 
 			   var chron = pad(hours) +":"+pad(mins)+ ':'+ pad(seconds)+ ":"+ zecsec
+			   // send 0.0.0 values to display
 			   socket.broadcast.emit('chronFromServer', chron)
 			   socket.emit('chronFromServer', chron)
 			}
     
-    var ding
+    var dater
     function dateTime() { 
-
-	ding = setInterval( function () {
+	dater = setInterval( function () {
 	    var datetime= new Date(); 
 	    var now=datetime.toString()
-//	    console.log(now);
 	    socket.broadcast.emit("dateTime", now);
-// 	    socket.emit("dateTime", now);
+ 	    socket.emit("dateTime", now);
 	}, 1000)}
    
-    clearInterval(ding);
+    clearInterval(dater);
     dateTime()
-
     
     function chronometer() {
 	
@@ -156,7 +156,7 @@
     var seqD = { metrobeat:0, voice:4, name: "D", counter: 0, mm: 60, beatsinbar: 4, durations: srcsqr[3], units: [2,3,4,2,3,1]};
     
 
-    var countdowntick = function(seq){
+     var countdowntick = function(seq){
 
 	var outcount = 12; var incount=12;
 	var time = ((seq.durations[seq.counter]+1) *timemultiplier) + 30000 + (outcount*1000);
@@ -166,8 +166,8 @@
 	
 	// initiate first page here
 	socket.broadcast.emit("pageFlipfromserver", seq.voice, unit, time, seq.mm,seq.counter);
-	
-	var tock = setInterval(function(){
+
+	function sequenCer() {
 
 	    if (ztime >= 0 ){
 		
@@ -176,86 +176,98 @@
 		////////////////////////////////////////////
 		
 		var counter = ztime/1000
-		socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
+		//
+		if (counter >= 0 ){
+		    socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
+		    socket.emit('counterText', seq.voice, seq.counter, counter);
+		    
+		    if (counter <= outcount ) {              
+			socket.broadcast.emit('countinFromServer', seq.voice, counter, "","stop in:", "red", "transparent");
+		    }
+		    
+		    if (counter > (totaltime)-incount  && counter <= totaltime ) {
+			socket.broadcast.emit('countinFromServer', seq.voice, counter-(totaltime-incount), "","play in:", "green","transparent");
+			socket.emit('countinFromServer', seq.voice, counter-(totaltime-incount), "","play in:", "green","transparent");
+		    
+		    }
+		    
+		    if (counter == (totaltime)-incount ) {
+			socket.broadcast.emit('countinFromServer', seq.voice, "+", "","playing..", "green","black");
+			socket.emit('countinFromServer', seq.voice, "+", "","playing..", "green","black");
+		    }
+		    
+		// remove displayed number with " " at end of both countin/out
 
-		if (counter > 0 && counter <= outcount ) {              
-		    socket.broadcast.emit('countinFromServer', seq.voice, counter, "","stop in:", "red", "transparent");
-		    socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-		}
+
+		    
+		    if (counter == 0 ) {
+		    socket.broadcast.emit('countinFromServer', seq.voice, "", "","", "green","transparent");
+			socket.broadcast.emit('counterText', seq.voice, seq.counter, "");
+			socket.emit('counterText', seq.voice, seq.counter, "");
+		    }
+		}		    
 		
-		// remove displayed number with " " at end of both countin/out
 		
-		if (counter == 0 ) {
-		    socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-		    socket.broadcast.emit('countinFromServer', seq.voice, "///", "//","/", "green","transparent");
-		}
-		
-		if (counter > (totaltime)-incount  && counter <= totaltime ) {        
+		// on each beat do:
 
-		    socket.broadcast.emit('countinFromServer', seq.voice, counter-(totaltime-incount), "","play in:", "green","black");	    
-		    socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-		}
-		
-		if (counter == (totaltime)-incount ) {
-		    socket.broadcast.emit('countinFromServer', seq.voice, "+", "","playing..", "green","black");
-		    socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-		}
-	    	
 		// push out the pulse to metronome	
-		socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
 		seq.metrobeat = (seq.metrobeat+1)%seq.beatsinbar ;
      		socket.broadcast.emit('metroPulse', tempoms, seq.voice,seq.metrobeat); 
 		socket.emit('metroPulse', tempoms, seq.voice,seq.metrobeat);	
-//	    	socket.broadcast.emit("pageFlipfromserver", seq.voice, unit, time, seq.mm,seq.counter);
+
+
 	    }
 	    
 	    // flip the page
-
+	    
 	    if (ztime == 0){
-		socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-		//socket.emit('counterText', seq.voice, seq.counter, " ");
 		seq.counter = (seq.counter + 1) % seq.durations.length	    		
 		socket.broadcast.emit("pageFlipfromserver", seq.voice, unit, time, seq.mm,seq.counter);
-// 		socket.emit("pageFlipfromserver", seq.voice, unit, time, seq.mm,seq.counter);		
-		delete tock;	
+		//delete tockTock;	
 		step(seq);     
 	    }
-
-	    if (ztime < 0){
-		socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-	    }
-	    	    	    
+	    	    
 	    // decrement the time 
 	    ztime -= 1000
-	    socket.broadcast.emit('counterText', seq.voice, seq.counter, counter);
-				
-	}, tempoms)
+	    
+	}
 
-	  };
+	var boo = setInterval(sequenCer, tempoms);
 
-//	    socket.on('stopSeq', function () {
-//		console.log("sequencer stopping...")	    
-//		clearInterval(tock)
-//		sequencerState=0;  
-//		stopChr();    
-		//		var tock = function(){null}
-	    
-//	    });
+	socket.on('stopSeq', function () {
+	    //donaldduck = mickeymouse + 7
+	    sequenCer.clearInterval
+	    console.log("sequencer stopping...")	    
+	    // grrr why wont this clearInterval work
+	    sequencerState = 0
+	    clearInterval(boo)
+	    stopChr();    
+//	    var countdowntick = "" 
 
+	});
+	
+    };
+    
+////////////////
+    
     socket.on('startSeq', function () { 
 	if (sequencerState == 0) { 
-	    console.log("sequencer starting...")	    
-	    sequencerState=1;
-	    startChr();
-	    step(seqA); step(seqB); step(seqC); step(seqD);	    
-	    ztime =-1;
+	console.log("sequencer starting...")	    
+	startChr();
+	step(seqA); step(seqB); step(seqC); step(seqD);	    
+	ztime =-1;
 	}
 	else console.log("sequencer already started...")
     });
+   
 
+    step = function (seq) {
+	//clearInterval(seq.boo);
+	//clearInterval(countdowntick);
+	countdowntick(seq)
+	sequencerState=1;
 
-
-
+ };    
     
     socket.on('resetSeq', function () { 
 	console.log("reset")
@@ -264,10 +276,7 @@
 
 
     
-    step = function (seq) {
-	clearInterval(countdowntick);
-	countdowntick(seq)
-    };    
+
 
 
     ////////////////////////////////////////////  

Binary file screenshots/nodescore-client-20120823.png has changed

--- a/www/m/css/nodescore.css	Wed Aug 22 12:51:28 2012 +0000
+++ b/www/m/css/nodescore.css	Thu Aug 23 08:40:55 2012 +0000
@@ -134,15 +134,15 @@
 
 
 .outersquare{
-    border-radius: 5px;
-    height: 400px;
-    width: 685px;
-!    border: 1px solid blue;
-    position: absolute;
-    top: 150px;
-    left: 0px;
+    border-radius: 15px;
+    border: 1px solid blue;
+ !   position: absolute;
+    !top: 50px;
+    !left: 110px;
     padding: 1px 1px 1px 1px ;
-    background-color: black;
+    background: black;
+    width: 99%;
+    height: 690px;
 }
 
 .svgmusic {
@@ -150,20 +150,20 @@
     border-radius: 15px;
     margin: 0px;
     width: 100%;
-height: 440px;
+height: 450px;
 }
 
 .magicsquare {
 !    margin: 10px;
-    border-radius: 15px;
+    border-radius: 5px;
     border: 1px solid yellow;
-    padding: 2px 2px 2px 2px;
-    background: DimGray;
-    width: 100px; height: 90px;
-    border-radius: 20px;
+    !padding: 2px 2px 2px 2px;
+    background: transparent;
+    width: 50px; height: 45px;
+    border-radius: 10px;
     float: left;
-    color: black;
-    font-size: 7em;    
+    color: white;
+    font-size: 3em;    
     text-align: center;
 }
 

--- a/www/m/ctrl.html	Wed Aug 22 12:51:28 2012 +0000
+++ b/www/m/ctrl.html	Thu Aug 23 08:40:55 2012 +0000
@@ -12,127 +12,109 @@
 
 </head>
 
-<body onload='document.getElementById("countinnumber").style.visibility="hidden";'>
+<body onload="">
+  
+  <input type="hidden" id="group" value='1'> 
+  
 
-  <input type="hidden" id="group" value='1'> 
+  <div class="outermaster"> 
 
+    <div class="outersquare">      
+  <h1 style=" background:transparent; left:24px; top:14px;">control interface:</h1>      
+      <div>
+	<p class="magicsquare" id="1magicsquare0"></p>
+	<p class="magicsquare" id="1magicsquare1"></p>
+	<p class="magicsquare" id="1magicsquare2"></p>
+	<p class="magicsquare" id="1magicsquare3"></p>
+	<p class="magicsquare" id="1magicsquare4"></p>
+	<p class="magicsquare" id="1magicsquare5"></p>
+      </div>
+      <br><br><br><br>
+      <div>
+	<p class="magicsquare" id="2magicsquare0"></p>
+	<p class="magicsquare" id="2magicsquare1"></p>
+	<p class="magicsquare" id="2magicsquare2"></p>
+	<p class="magicsquare" id="2magicsquare3"></p>
+	<p class="magicsquare" id="2magicsquare4"></p>
+	<p class="magicsquare" id="2magicsquare5"></p>
+      </div>
+      <br><br><br><br>
+      <div>
+	<p class="magicsquare" id="3magicsquare0"></p>
+	<p class="magicsquare" id="3magicsquare1"></p>
+	<p class="magicsquare" id="3magicsquare2"></p>
+	<p class="magicsquare" id="3magicsquare3"></p>
+	<p class="magicsquare" id="3magicsquare4"></p>
+	<p class="magicsquare" id="3magicsquare5"></p>
+      </div>
+      <br><br><br><br>
+      <div>
+	<p class="magicsquare" id="4magicsquare0"></p>
+	<p class="magicsquare" id="4magicsquare1"></p>
+	<p class="magicsquare" id="4magicsquare2"></p>
+	<p class="magicsquare" id="4magicsquare3"></p>
+	<p class="magicsquare" id="4magicsquare4"></p>
+	<p class="magicsquare" id="4magicsquare5"></p>
+      </div>
+     
+      <br/><br/><br/><br/>
 
-  
-  <div class="outermaster"> 
-    <h1 style="position:absolute; background:transparent; left:24px; top:14px;">l i v e :</h1>
-    <div id="countinnumber"></div>    
-    <div id="livez"> 
-	<div class="outersquare">      
-	  <div>
-	    <p class="magicsquare" id="1magicsquare0"></p>
-	    <p class="magicsquare" id="1magicsquare1"></p>
-	    <p class="magicsquare" id="1magicsquare2"></p>
-	    <p class="magicsquare" id="1magicsquare3"></p>
-	    <p class="magicsquare" id="1magicsquare4"></p>
-	    <p class="magicsquare" id="1magicsquare5"></p>
+      <input type="button" value="START" onclick="startSeq();" />
+      <input type="button" value="STOP" onclick="stopSeq();" />
+      <input type="button" value="RESET" onclick="resetSeq();" />    
+    </div>
+          
+
+    
+      <div id="comms"> 
+	<div id="chat">
+	  <div id="nickname">
+	    <form id="set-nickname" class="wrap">
+	      <p>Please type in your nickname and press enter.</p>
+	      <input id="nick">
+	      <p id="nickname-err">Nickname already in use</p>
+	    </form>
 	  </div>
-	  <br><br><br><br>
-	  <div>
-	    <p class="magicsquare" id="2magicsquare0"></p>
-	    <p class="magicsquare" id="2magicsquare1"></p>
-	    <p class="magicsquare" id="2magicsquare2"></p>
-	    <p class="magicsquare" id="2magicsquare3"></p>
-	    <p class="magicsquare" id="2magicsquare4"></p>
-	    <p class="magicsquare" id="2magicsquare5"></p>
+	  <div id="connecting">
+	    <div class="wrap">Connecting to socket.io server</div>
 	  </div>
-	  <br><br><br><br>
-	  <div>
-	    <p class="magicsquare" id="3magicsquare0"></p>
-	    <p class="magicsquare" id="3magicsquare1"></p>
-	    <p class="magicsquare" id="3magicsquare2"></p>
-	    <p class="magicsquare" id="3magicsquare3"></p>
-	    <p class="magicsquare" id="3magicsquare4"></p>
-	    <p class="magicsquare" id="3magicsquare5"></p>
+	  <div id="messages">
+	    <div id="nicknames"></div>
+	    <div id="lines"></div>
 	  </div>
-	  <br><br><br><br>
-	  <div>
-	    <p class="magicsquare" id="4magicsquare0"></p>
-	    <p class="magicsquare" id="4magicsquare1"></p>
-	    <p class="magicsquare" id="4magicsquare2"></p>
-	    <p class="magicsquare" id="4magicsquare3"></p>
-	    <p class="magicsquare" id="4magicsquare4"></p>
-	    <p class="magicsquare" id="4magicsquare5"></p>
-	  </div>
-	</div>
-	  <br><br><br><br>      <br><br><br><br>
-	  
-	  <input type="button" value="START" onclick="startSeq();" />
-	  <input type="button" value="STOP" onclick="stopSeq();" />
-	  <input type="button" value="RESET" onclick="resetSeq();" />
-	  
-	  <br><br>
-
-
-    </div>        </div>    
-    
-    <div id="comms"> 
-      <div id="chat">
-	<div id="nickname">
-	  <form id="set-nickname" class="wrap">
-	    <p>Please type in your nickname and press enter.</p>
-	    <input id="nick">
-	    <p id="nickname-err">Nickname already in use</p>
+	  <form id="send-message">
+	    <input id="message">
+	    <button>Send</button>
 	  </form>
 	</div>
-	<div id="connecting">
-	  <div class="wrap">Connecting to socket.io server</div>
+      </div>    
+      
+      <div id="midcomms"></div>
+      <div id="preview">
+      </div>    
+      
+      <div class="footdata">
+	
+	<div class="metrocase" id="metro">
+	  <div id="metronome0"></div>
+	  <div id="metronome1"></div>
+	  <div id="metronome2"></div>
+	  <div id="metronome3"></div>
 	</div>
-	<div id="messages">
-	  <div id="nicknames"></div>
-	  <div id="lines"></div>
-	</div>
-	<form id="send-message">
-	  <input id="message">
-	  <button>Send</button>
-	</form>
-      </div>
-    </div>    
-      
-    <div id="midcomms"></div>
-    <div id="preview">
-    </div>    
-    
-    <div class="footdata">
-      
-      <div class="metrocase" id="metro">
-	<div id="metronome0"></div>
-	<div id="metronome1"></div>
-	<div id="metronome2"></div>
-	<div id="metronome3"></div>
+	
+	<div id="current">CTRL</div>    
+	<div id="client_latency">Latency: 0ms</div>     
+	<div id="datetime"></div>
+	<div id="client_chronometer"  style="z-index: 2;">00:00:00.0</div>    
+	
       </div>
       
-      <div id="current">GROUP: 1</div>    
-      <div id="client_latency">Latency: 0ms</div>     
-      <div id="datetime"></div>
-      <div id="client_chronometer"  style="z-index: 2;">00:00:00.0</div>    
-      
-    </div>
-
   </div>
 
-    <ul id="nav"> 
-      <li><a href="javascript:void(0)">Menu</a>
-	<ul>
-	  <li><a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='3'">SELECT PART:</a>
-	    <ul>
-	      <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='1'; $('div#current').text('GROUP 1').text='1'">GROUP 1</a>
-	      <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='2'; $('div#current').text('GROUP 2').text='2'">GROUP 2</a>
-	      <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='3'; $('div#current').text('GROUP 3').text='3'">GROUP 3</a>
-	      <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='4'; $('div#current').text('GROUP 4').text='4'">GROUP 4</a>
-	    </ul>
-	  </li> 
-	  <li><a href="http://nodescore.kiben.net">help</a></li>
-	  <li><a href="http://nodescore.kiben.net:8889/m/controls.html" target="_blank">control panel</a></li>
-	</ul>
-      </li>
-    </ul>
+</div>
+  
 
- 
+
 
 
 </body>

--- a/www/m/js/controlseq.js	Wed Aug 22 12:51:28 2012 +0000
+++ b/www/m/js/controlseq.js	Thu Aug 23 08:40:55 2012 +0000
@@ -51,15 +51,16 @@
     var n=6; var x=seq-1; var off=((x%n)+n)%n // thanks claudiusmaximus
     seqnow = "#"+group+"magicsquare"+seq
     turnmeoff = "#"+group+"magicsquare"+off 
-    $(seqnow).css('background-color', 'white');
-    $(turnmeoff).css('background-color', 'blue')
-    console.log("#"+group+"magicsquare"+seq +"     time: " +time + "   %:" + off)
+    $(seqnow).css('background', 'transparent');
+    $(turnmeoff).css('background', 'transparent')
+    //console.log("#"+group+"magicsquare"+seq +"     time: " +time + "   %:" + off)
 
 }
+
 socket.on("counterText", function(group,unit,counter){
-	$("#"+group+"magicsquare"+unit).text(counter);
-    console.log(group+"magicsqjare"+unit+"count:"+counter)
- });
+    $("#"+group+"magicsquare"+unit).text(counter);
+    //console.log(group+"magicsquare"+unit+"count:"+counter)
+});
 
 
 //////////////////////////////////////////////

--- a/www/m/js/nodescore-client.js	Wed Aug 22 12:51:28 2012 +0000
+++ b/www/m/js/nodescore-client.js	Thu Aug 23 08:40:55 2012 +0000
@@ -77,11 +77,11 @@
 /////////////////////////////////////////////////
 // countdown to change
 
-socket.on("counterText", counterText);
-function counterText(groupID, currentseconds,text){
+socket.on("counterText", cText);
+function cText(groupID, currentseconds,text){
     var groupPage=document.getElementById('group').value
     if (groupID == groupPage) {
-	console.log()
+	console.log(text)
 	$("#totalcountdown").text(text);	
     }}
 

--- a/www/m/score.html	Wed Aug 22 12:51:28 2012 +0000
+++ b/www/m/score.html	Thu Aug 23 08:40:55 2012 +0000
@@ -47,7 +47,7 @@
     </div>    
       
     <div id="midcomms">
-      <h2 id="counttitle" style="padding-top:19px;">...</h2>
+      <h2 id="counttitle" style="padding-top:9px; margin:0;">...</h2>
       <p id="count" style="color:white">...</p>
       <div id="totalcountdown">...</div>
     </div>