annotate www/m/ctrl.html @ 38:ea8d61c851c0

added chat server and more work on interface
author tzara <rc-web@kiben.net>
date Wed, 22 Aug 2012 12:51:28 +0000
parents
children 3ba24da53406
rev   line source
rc-web@38 1 <!DOCTYPE html>
rc-web@38 2 <html>
rc-web@38 3 <head>
rc-web@38 4 <link href="css/nodescore.css" rel="stylesheet">
rc-web@38 5 <link href="css/chat.css" rel="stylesheet">
rc-web@38 6 <link href="css/menu.css" rel="stylesheet">
rc-web@38 7
rc-web@38 8 <script src="js/jquery-1.7.1.min.js"></script>
rc-web@38 9 <script src="/socket.io/socket.io.js"></script>
rc-web@38 10 <script src="js/nodescore-client.js"></script>
rc-web@38 11 <script src="js/controlseq.js"></script>
rc-web@38 12
rc-web@38 13 </head>
rc-web@38 14
rc-web@38 15 <body onload='document.getElementById("countinnumber").style.visibility="hidden";'>
rc-web@38 16
rc-web@38 17 <input type="hidden" id="group" value='1'>
rc-web@38 18
rc-web@38 19
rc-web@38 20
rc-web@38 21 <div class="outermaster">
rc-web@38 22 <h1 style="position:absolute; background:transparent; left:24px; top:14px;">l i v e :</h1>
rc-web@38 23 <div id="countinnumber"></div>
rc-web@38 24 <div id="livez">
rc-web@38 25 <div class="outersquare">
rc-web@38 26 <div>
rc-web@38 27 <p class="magicsquare" id="1magicsquare0"></p>
rc-web@38 28 <p class="magicsquare" id="1magicsquare1"></p>
rc-web@38 29 <p class="magicsquare" id="1magicsquare2"></p>
rc-web@38 30 <p class="magicsquare" id="1magicsquare3"></p>
rc-web@38 31 <p class="magicsquare" id="1magicsquare4"></p>
rc-web@38 32 <p class="magicsquare" id="1magicsquare5"></p>
rc-web@38 33 </div>
rc-web@38 34 <br><br><br><br>
rc-web@38 35 <div>
rc-web@38 36 <p class="magicsquare" id="2magicsquare0"></p>
rc-web@38 37 <p class="magicsquare" id="2magicsquare1"></p>
rc-web@38 38 <p class="magicsquare" id="2magicsquare2"></p>
rc-web@38 39 <p class="magicsquare" id="2magicsquare3"></p>
rc-web@38 40 <p class="magicsquare" id="2magicsquare4"></p>
rc-web@38 41 <p class="magicsquare" id="2magicsquare5"></p>
rc-web@38 42 </div>
rc-web@38 43 <br><br><br><br>
rc-web@38 44 <div>
rc-web@38 45 <p class="magicsquare" id="3magicsquare0"></p>
rc-web@38 46 <p class="magicsquare" id="3magicsquare1"></p>
rc-web@38 47 <p class="magicsquare" id="3magicsquare2"></p>
rc-web@38 48 <p class="magicsquare" id="3magicsquare3"></p>
rc-web@38 49 <p class="magicsquare" id="3magicsquare4"></p>
rc-web@38 50 <p class="magicsquare" id="3magicsquare5"></p>
rc-web@38 51 </div>
rc-web@38 52 <br><br><br><br>
rc-web@38 53 <div>
rc-web@38 54 <p class="magicsquare" id="4magicsquare0"></p>
rc-web@38 55 <p class="magicsquare" id="4magicsquare1"></p>
rc-web@38 56 <p class="magicsquare" id="4magicsquare2"></p>
rc-web@38 57 <p class="magicsquare" id="4magicsquare3"></p>
rc-web@38 58 <p class="magicsquare" id="4magicsquare4"></p>
rc-web@38 59 <p class="magicsquare" id="4magicsquare5"></p>
rc-web@38 60 </div>
rc-web@38 61 </div>
rc-web@38 62 <br><br><br><br> <br><br><br><br>
rc-web@38 63
rc-web@38 64 <input type="button" value="START" onclick="startSeq();" />
rc-web@38 65 <input type="button" value="STOP" onclick="stopSeq();" />
rc-web@38 66 <input type="button" value="RESET" onclick="resetSeq();" />
rc-web@38 67
rc-web@38 68 <br><br>
rc-web@38 69
rc-web@38 70
rc-web@38 71 </div> </div>
rc-web@38 72
rc-web@38 73 <div id="comms">
rc-web@38 74 <div id="chat">
rc-web@38 75 <div id="nickname">
rc-web@38 76 <form id="set-nickname" class="wrap">
rc-web@38 77 <p>Please type in your nickname and press enter.</p>
rc-web@38 78 <input id="nick">
rc-web@38 79 <p id="nickname-err">Nickname already in use</p>
rc-web@38 80 </form>
rc-web@38 81 </div>
rc-web@38 82 <div id="connecting">
rc-web@38 83 <div class="wrap">Connecting to socket.io server</div>
rc-web@38 84 </div>
rc-web@38 85 <div id="messages">
rc-web@38 86 <div id="nicknames"></div>
rc-web@38 87 <div id="lines"></div>
rc-web@38 88 </div>
rc-web@38 89 <form id="send-message">
rc-web@38 90 <input id="message">
rc-web@38 91 <button>Send</button>
rc-web@38 92 </form>
rc-web@38 93 </div>
rc-web@38 94 </div>
rc-web@38 95
rc-web@38 96 <div id="midcomms"></div>
rc-web@38 97 <div id="preview">
rc-web@38 98 </div>
rc-web@38 99
rc-web@38 100 <div class="footdata">
rc-web@38 101
rc-web@38 102 <div class="metrocase" id="metro">
rc-web@38 103 <div id="metronome0"></div>
rc-web@38 104 <div id="metronome1"></div>
rc-web@38 105 <div id="metronome2"></div>
rc-web@38 106 <div id="metronome3"></div>
rc-web@38 107 </div>
rc-web@38 108
rc-web@38 109 <div id="current">GROUP: 1</div>
rc-web@38 110 <div id="client_latency">Latency: 0ms</div>
rc-web@38 111 <div id="datetime"></div>
rc-web@38 112 <div id="client_chronometer" style="z-index: 2;">00:00:00.0</div>
rc-web@38 113
rc-web@38 114 </div>
rc-web@38 115
rc-web@38 116 </div>
rc-web@38 117
rc-web@38 118 <ul id="nav">
rc-web@38 119 <li><a href="javascript:void(0)">Menu</a>
rc-web@38 120 <ul>
rc-web@38 121 <li><a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='3'">SELECT PART:</a>
rc-web@38 122 <ul>
rc-web@38 123 <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='1'; $('div#current').text('GROUP 1').text='1'">GROUP 1</a>
rc-web@38 124 <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='2'; $('div#current').text('GROUP 2').text='2'">GROUP 2</a>
rc-web@38 125 <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='3'; $('div#current').text('GROUP 3').text='3'">GROUP 3</a>
rc-web@38 126 <a href="javascript:void(0)" onclick="javascript:document.getElementById('group').value='4'; $('div#current').text('GROUP 4').text='4'">GROUP 4</a>
rc-web@38 127 </ul>
rc-web@38 128 </li>
rc-web@38 129 <li><a href="http://nodescore.kiben.net">help</a></li>
rc-web@38 130 <li><a href="http://nodescore.kiben.net:8889/m/controls.html" target="_blank">control panel</a></li>
rc-web@38 131 </ul>
rc-web@38 132 </li>
rc-web@38 133 </ul>
rc-web@38 134
rc-web@38 135
rc-web@38 136
rc-web@38 137
rc-web@38 138 </body>
rc-web@38 139 </html>