diff www/martin/index.html @ 79:e4db7d4d1d08

major UI fixes for martin version interface

--- a/www/martin/index.html	Tue Jul 15 17:48:35 2014 +0100
+++ b/www/martin/index.html	Tue Jul 15 23:49:44 2014 +0100
@@ -65,7 +65,7 @@
 	
 	<div id="outerpreview" >
 	  <div class="pview" id="preview-1" >    
-	    <div class="musicianprog" style="background:black; border: 1px solid yellow;" >
+	    <div class="musicianprog" style=" border: 1px solid yellow;" >
 	      <div id="counttitle1" style="display:inline;"></div>
 	      <div id="count1" style=" font-size:2em;"></div>
 	    </div>
@@ -74,18 +74,18 @@
 	  </div>
 	  
 	  <div class="pview" id="preview-2">
-	    <div class="musicianprog" style="background:black; border: 1px solid green; ">
+	    <div class="musicianprog" style="border: 1px solid green; ">
 	      <div id="counttitle2" style="display:inline;"></div>
 	      <div id="count2" style=" font-size:2em;"></div>
 	    </div>
 
-	    <div class="unitseq" id="unitseq1"></div>
+
 	   
 	    <div class="pviewmusic" id="previewbox-2"> </div>
 	  </div>
 	  
 	  <div class="pview" id="preview-3" >
-	    <div class="musicianprog" style="background:black; border: 1px solid aqua; ">
+	    <div class="musicianprog" style="border: 1px solid aqua; ">
 	      <div id="counttitle3" style="display:inline;"></div>
 	      <div id="count3" style=" font-size:2em;"></div>
 	    </div>
@@ -112,104 +112,116 @@
 
   <div class="outermaster">     
 
-    <div id="live"> </div>    
+    <div id="live"> 
+      <div class="svgmusic"></div>
+    </div>    
   
     <div id="info">
-    <div id="comms"> 
-      <div id="chat" title="type here to chat with others connected to network" >
-	<div id="nickname" title="type your login name and press enter" >
-	  <form id="set-nickname" class="wrap">
-	    <p>LOGIN:</p>
+      <div id="comms"> 
+	<div id="chat" title="type here to chat with others connected to network" >
+	  <div id="nickname" title="type your login name and press enter" >
+	    <form id="set-nickname" class="wrap">
+	      <p>LOGIN:</p>
 	    <input id="nick">
-	    <p id="nickname-err">Nickname already in use</p>
+	      <p id="nickname-err">Nickname already in use</p>
+	    </form>
+	  </div>
+	  <div id="connecting">
+	    <div class="wrap">Connecting to socket.io server</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 id="connecting">
-	  <div class="wrap">Connecting to socket.io server</div>
+      </div>    
+      
+      <div id="midfoot">
+	<div id="midcomms">
+	  <div id="counttitle">waiting...</div>
+	  <div id="count"></div>
+	  <div class="unitseq" id="unitseq1"></div>
 	</div>
-	<div id="messages">
-	  <div id="nicknames"></div>
-	  <div id="lines"></div>
+	
+	<div id="remainingtime">
+	  next in:
+	  <div id="totalcountdown">.</div>
 	</div>
-	<form id="send-message">
-	  <input id="message">
-	  <button>Send</button>
-	</form>
+	
+	
+	
+	<div id="current">
+	  <script type="text/javascript">
+	    function setPart(sel) {
+	    //var testSound = new buzz.sound( 'audio/testfile', { formats: [ 'ogg', 'mp3' ] } );
+	    //testSound.play();
+	    
+	    var value = sel.options[sel.selectedIndex].value;  
+	    document.getElementById('group').value=value; 
+	    //$('div#current').text('GROUP ' +value).text='value';
+	    }
+	  </script>
+	  
+
+	</div>      
+	
       </div>
+      
+      <div id="preview"></div>
+      
     </div>    
+    
+    
+
+
+
+  </div>
   
-    <div id="midfoot">
+  
 
-      <div id="midcomms">
-	<div id="counttitle" style="display:inline;"></div>
-	<div id="count"></div>
-	<div class="unitseq" id="unitseq1" style="float:right; width:50px; position:relative; top:-10px; left:40px"></div>
- </div>
-      
-      <div id="remainingtime">
-	next in:
-	<div id="totalcountdown">.</div>
-      </div>
+  
+  
+  
+  <div class="head">
+    <div id="datetime"></div>	   
+    <div class="metrocase" id="metro">
+      <div id="metronome0"></div>
+    </div>
+    <div id="client_latency">Latency: 0ms</div>    
+    <div id="client_chronometer" >00:00:00.0</div>      
+</div>
+  
+  <div class="footx">
+    <div id="transect">.. </div>	
 
-      
-      <div id="timeinfo">
-	<div id="datetime"></div>
-	
-	<div id="client_latency">Latency: 0ms</div>
-      </div>
-
-
-      <div id="current">
-	<script type="text/javascript">
-	  function setPart(sel) {
-	  //var testSound = new buzz.sound( 'audio/testfile', { formats: [ 'ogg', 'mp3' ] } );
-	  //testSound.play();
-	  
-	  var value = sel.options[sel.selectedIndex].value;  
-	  document.getElementById('group').value=value; 
-	  //$('div#current').text('GROUP ' +value).text='value';
-	  }
-	</script>
-
-	<div>
-	  <select id="setPart" onchange="setPart(this)">
-	    <option value="1">Stream 01</option>
-	    <option value="2">Stream 02</option>
-	    <option value="3">Stream 03</option>
-	    <option value="4">Stream 04</option>
-	  </select>
-	</div>
-      </div>      
-      
+    <div id="indexpagetitle">
+      pathways - for guitar, percussion & electronics
     </div>
     
-    
-    <div id="preview"></div>
-    
-    </div>    
-    
-  
-  </div>
-
-
-
-
-    </div>    
+    <div>
+      <select id="setPart" onchange="setPart(this)">
+	<option value="1">Stream 01</option>
+	<option value="2">Stream 02</option>
+	<option value="3">Stream 03</option>
+	<option value="4">Stream 04</option>
+      </select>
+    </div>
     
 
+    
+
+
 
     
-    <div style=" position:fixed; left:30px; bottom: 10px;  font-size:3em; " id="indexpagetitle"
-      <h2>pathways - for guitar, percussion & electronics</h2>
-    </div>
-    
-    <div style="" id="transect">.. </div>	
-    <div id="client_chronometer" >00:00:00.0</div>      
-   
-    <div class="metrocase" id="metro" style=" position:fixed; left:550px; bottom:80px;" >
-      <div id="metronome0"></div>
-    </div>
 
     
+
+    
+  </div>    
+  
 </body>
 </html>