Mercurial > hg > nodescore

changeset 81:ac6c303fbddc

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
changes to UI for martin version
author Rob Canning <rob@foo.net>
date Sun, 20 Jul 2014 14:26:06 +0100
parents df5128a86598
children af432b335bf0
files nodescore.js www/martin/css/chat-tablet.css www/martin/css/chat.css www/martin/css/nodescore.css www/martin/index.html
diffstat 5 files changed, 81 insertions(+), 71 deletions(-) [+]
line wrap: on
line diff
--- a/nodescore.js	Sat Jul 19 10:23:50 2014 +0100
+++ b/nodescore.js	Sun Jul 20 14:26:06 2014 +0100
@@ -156,7 +156,6 @@
    
     }
 
-
     // if not already started start the chronometer and sequencer    
     function startChr(socket) { chronCtrl(1,100); step(seqA);step(seqB); step(seqC); step(seqD); }
     // stop the chronometer   
--- a/www/martin/css/chat-tablet.css	Sat Jul 19 10:23:50 2014 +0100
+++ b/www/martin/css/chat-tablet.css	Sun Jul 20 14:26:06 2014 +0100
@@ -1,26 +1,29 @@
 #chat,
 #nickname,
 #messages {
-  width: 250px;
+  width: 180px;
+  height:90%;
 }
+
 #chat {
   position: relative;
   border: 0px solid #ccc;
-  background: white;
+  background: gray;
   border-radius: 15px;
+  height:100%;
 }
-#nickname,
+#Nickname,
 #connecting {
   position: absolute;
-  height: 125px;
+  height: 90%;
   z-index: 100;
   left: 0;
   top: 0;
-  background: white;
+  background: gray;
   text-align: center;
   width: 250px;
   font: 15px Georgia;
-  color: black;
+  color: orange;
   display: block;
 }
 #nickname .wrap,
@@ -30,44 +33,49 @@
 #nickname #nickname-err { color: #8b0000; font-size: 12px; visibility: hidden; }
 .connected #connecting { display: none; }
 .nickname-set #nickname { display: none; }
-#messages { height: 100px; background: white; }
-#messages em { color: black; }
+#messages { 
+    height: 100%; 
+    background: gray; 
+}
+
+#messages em { color: white; }
 #messages p {
   padding: 0;
   margin: 0;
   font: 14px Helvetica, Arial;
   padding: 0px 10px;
-  color: black;
+  color: white;
 }
 #messages p b {
   display: inline-block;
   padding-right: 10px;
-  color: black;
+  color: white;
 }
 
 #messages p:nth-child(even) {
-  background: white;
-  color: black;
+  background: gray;
+  color: white;
 }
 #messages #nicknames {
-  background: white;
+  background: gray;
+  border: 1px dashed orange;
   padding: 2px 4px 4px;
+  margin-top:12px;
   font: 11px Helvetica;
-  color: black;
+  color: green;
 }
 #messages #nicknames span {
-  color: #000;
-  color: black;
+  color: orange;
 }
 #messages #nicknames b {
   display: inline-block;
-  background: white;
+  background: gray;
   margin-right: 5px;
-  color: black;
+  color: white;
 }
 #messages #lines {
-  height: 80px;
-  overflow: auto;
+  height: 90%;
+  overflOw: auto;
   overflow-x: hidden;
   overflow-y: auto;
 }
@@ -98,9 +106,12 @@
   -webkit-border-radius: 3px;
 }
 #send-message {
-  background: white;
-  position: relative;
-  border-radius:5px;
+  background: gray;
+  border-radius:1px;
+  border: 1px dashed green;
+  position:relative;
+  bottom:30px;
+  !padding:5px;
 }
 #send-message input {
   border: none;
@@ -108,11 +119,11 @@
   padding: 0 0px;
   line-height: 20px;
   vertical-align: middle;
-  width: 200px;
-  background:white;
-  color: black;
-  border-radius:5px;
-  border: 1px solid white;
+  width: 160px;
+  background:gray;
+  color: white;
+  border-radius:1px;
+ 
 }
 #send-message input:focus {
   outline: 0;
@@ -129,12 +140,12 @@
   user-select: none;
   display: inline-block;
   text-decoration: none;
-  background: white;
+  background: black;
   border: 1px solid #2e70c4;
   -webkit-border-radius: 16px;
   -moz-border-radius: 16px;
   border-radius: 16px;
-  color: black;
+  color: white;
   font-family: "lucida grande", sans-serif;
   font-size: 11px;
   font-weight: normal;
--- a/www/martin/css/chat.css	Sat Jul 19 10:23:50 2014 +0100
+++ b/www/martin/css/chat.css	Sun Jul 20 14:26:06 2014 +0100
@@ -1,8 +1,6 @@
 #chat,
 #nickname,
-#messages {
-  width: 350px;
-}
+#messages {width: 350px; }
 #chat {
   position: relative;
   border: 0px solid #ccc;
@@ -12,7 +10,7 @@
 #nickname,
 #connecting {
   position: absolute;
-  height: 185px;
+  height: 585px;
   z-index: 100;
   left: 0;
   top: 0;
@@ -47,7 +45,7 @@
   display: none;
 }
 #messages {
-  height: 160px;
+  height: 560px;
   !background: #eee;
   background: white;
 }
@@ -90,7 +88,7 @@
   color: yellow;
 }
 #messages #lines {
-  height: 140px;
+  height: 540px;
   overflow: auto;
   overflow-x: hidden;
   overflow-y: auto;
--- a/www/martin/css/nodescore.css	Sat Jul 19 10:23:50 2014 +0100
+++ b/www/martin/css/nodescore.css	Sun Jul 20 14:26:06 2014 +0100
@@ -36,7 +36,7 @@
     width: 1020px;
     border-radius: 15px;
     position: absolute;
-    top:7%;
+    top:10%;
     left: 3000px;
     !margin: 0 auto;
 }
@@ -81,14 +81,20 @@
 }
 
 #comms{
-    border-radius: 15px;
-    height: 120px;
-    width: 250px;
+    position:fixed;
+    top:7%;
+    right: 0px;
+    border-radius: 0px;
+    height: 86%;
+    Width: 180px;
     margin: 0px;
-    border: 1px solid gray;
-    color: black;
-    float:left;
-    padding: 5px 5px 5px 5px;
+    border: 0px solid gray;
+    color: red;
+    padding: 0px 5px 0px 5px;
+    background:gray;
+    !opacity:0.8;
+    z-index:10000;
+    margin-right:0px;
 }
 
 #xcomms{
@@ -196,10 +202,10 @@
 .sqc {height:50%; width:50%; float:left; color: aqua; }
 .sqd {height:50%; width:50%; float:right; color:red;  }
 
-.row {display:inline;}
+.row { display:inline; }
 .row img{ width:160px; display:inline;}
-.row p{display:inline; color:yellow;}
-.rrr {position:relative; display:inline;}
+.row p{ display:inline; color:yellow;}
+.rrr { position:relative; display:inline;}
 
 .sqrow{
     display:inline;
@@ -244,18 +250,11 @@
     padding:0px 0px 10px 0px;
 }
 
-
-
 #fluid {}
 .fluid-img{ height:50%; width:50%; }
 .clear { clear:both; }
 
 #midcomms{
-!width:160px; 
-!height:40px; 
-!background-color:transparent; 
-
-!float:left;
 }
 
 #client_chronometer{ 
@@ -363,7 +362,7 @@
 
 #map { width: 1200px; 
        height: 600px; 
-       padding: 0px 0px 0px 40px; 
+       padding: 0px 0px 0px 5px; 
      }
 
 #outerpreview { 
@@ -392,7 +391,7 @@
 
 .middle { float: left;  
 	  width: 10.8%;  
-	  height: 11%;  
+	  height: 12%;  
 	  padding: 0;  
 	  border: 0;  
 	  margin: 0.33%; 
@@ -430,7 +429,7 @@
 
 .inner-0, .inner-1, .inner-2, .inner-3 { 
     font-size:2em; 
-    float: left; width: 45%; height: 50%; 
+    float: left; width: 45%; height: 45%; 
     padding: 0; border: 1px dashed gray; 
     margin: 0; 
     text-align: center; 
@@ -461,32 +460,35 @@
 .head{
     !border: 1px solid black;
     background:gray;
-    opacity:0.8;
+    opacity:1;
     padding:4px 0px 0px 4px;
-    height:50px;
+    height:7%;
     position:fixed;
     top:0px;
     width:100%;
 }
 
 .footx{
+    margin:0px;
     background:gray;
-    opacity:0.8;
+    opacity:1;
     padding:10px;
-    height:30px;
+    height:7%;
     position:fixed;
     bottom:0px;
     width:100%;
-    padding:10px 0px 15px 10px;
+    padding:0px 0px 0px 10px;
 }
 
 
 #indexpagetitle{
-    font-size:1.2em;
+    font-size:1em;
     float:left;
-    margin-left:30%;
-    padding:0;
+    margin-left:20%;
+    padding:20px;
     margin-bottom:0px;
+    color:white;
+    letter-spacing:4px;
 }
 
 #setPart{
--- a/www/martin/index.html	Sat Jul 19 10:23:50 2014 +0100
+++ b/www/martin/index.html	Sun Jul 20 14:26:06 2014 +0100
@@ -69,9 +69,9 @@
 	
 	<div id="outerpreview" >
 	  <div class="pview" id="preview-1" >    
-	    <div class="musicianprog" style=" border: 1px solid yellow;" >
+	    <div class="musicianprog" style=" border: 1px solid purple;" >
 	      <div id="counttitle1" style="display:inline;"></div>
-	      <div id="count1" style=" font-size:2em;"></div>
+	      <div id="count1" style=" font-size:1em;"></div>
 	    </div>
 	    <div class="unitseq" id="unitseq0"></div>
 	    <div class="pviewmusic" id="previewbox-1"> </div>
@@ -80,7 +80,7 @@
 	  <div class="pview" id="preview-2">
 	    <div class="musicianprog" style="border: 1px solid green; ">
 	      <div id="counttitle2" style="display:inline;"></div>
-	      <div id="count2" style=" font-size:2em;"></div>
+	      <div id="count2" style=" font-size:1em;"></div>
 	    </div>
 
 
@@ -91,7 +91,7 @@
 	  <div class="pview" id="preview-3" >
 	    <div class="musicianprog" style="border: 1px solid aqua; ">
 	      <div id="counttitle3" style="display:inline;"></div>
-	      <div id="count3" style=" font-size:2em;"></div>
+	      <div id="count3" style=" font-size:1em;"></div>
 	    </div>
 	    <div class="unitseq" id="unitseq2"></div>
 	    <div class="pviewmusic" id="previewbox-3"> </div>
@@ -100,7 +100,7 @@
 	  <div class="pview" id="preview-4">
 	    <div class="musicianprog" style=" border: 1px solid red; ">
 	      <div id="counttitle4" style="display:inline;"></div>
-	      <div id="count4" style=" font-size:2em;"></div>
+	      <div id="count4" style=" font-size:1em;"></div>
 	    </div>
 	    <div class="unitseq" id="unitseq3"></div>
 	    <div class="pviewmusic" id="previewbox-4"> </div>