equal
deleted
inserted
replaced
1 var sock = null; |
|
2 var ellog = null; |
|
3 |
|
4 |
|
5 function log(m) { |
|
6 ellog.innerHTML += m + '\n'; |
|
7 ellog.scrollTop = ellog.scrollHeight; |
|
8 }; |
|
9 |
|
10 // Config vars |
1 // Config vars |
|
2 var logger = false; |
11 var sceneWidth = 1920; |
3 var sceneWidth = 1920; |
12 //var sceneHeight = 128 * 4; // multiple of 128 because of 128 levels in midi signals -> better look |
4 //var sceneHeight = 128 * 4; // multiple of 128 because of 128 levels in midi signals -> better look |
13 var prHeight1 = 435; |
5 var prHeight1 = 435; |
14 var prHeight2 = 645; |
6 var prHeight2 = 645; |
15 var sceneHeight = prHeight1 + prHeight2; |
7 var sceneHeight = prHeight1 + prHeight2; |
16 var sceneBgColor = 0xFFFFFF; |
8 var sceneBgColor = 0xFFFFFF; |
17 var lineColor = 0x444444; |
9 var lineColor = 0x444444; |
18 var manualFramerate = 24; |
10 //var manualFramerate = 24; |
19 var pixelsPerSecond1 = Math.floor(sceneWidth / 30); // nb of pixels per second |
11 var pixelsPerSecond1 = Math.floor(sceneWidth / 30); // nb of pixels per second |
|
12 var manualFramerate = pixelsPerSecond1 / 4; |
20 var pixelsPerSecond2 = Math.floor(sceneWidth / 60); // nb of pixels per second |
13 var pixelsPerSecond2 = Math.floor(sceneWidth / 60); // nb of pixels per second |
21 var lineInterval = 5000; // means line every 5 seconds |
14 var lineInterval = 5000; // means line every 5 seconds |
22 var nbLines = -1; |
15 var nbLines = -1; |
23 var noteHeight = 110; |
16 var noteHeight = 110; |
24 var noteColor = 0xB74141; |
17 var noteColor = 0xB74141; |
75 stage.addChild(graphics); |
68 stage.addChild(graphics); |
76 } |
69 } |
77 } |
70 } |
78 |
71 |
79 var uberContainer = new PIXI.DisplayObjectContainer(); |
72 var uberContainer = new PIXI.DisplayObjectContainer(); |
80 uberContainer.position.x = Math.floor(sceneWidth*4/5); |
73 uberContainer.position.x = Math.floor(sceneWidth*9/10); |
81 uberContainer.position.y = 0; |
74 uberContainer.position.y = 0; |
82 stage.addChild(uberContainer); |
75 stage.addChild(uberContainer); |
83 |
76 |
84 |
77 |
85 var container1 = new PIXI.DisplayObjectContainer(); |
78 var container1 = new PIXI.DisplayObjectContainer(); |
145 else{ |
138 else{ |
146 noteDict[note] = {ts: timeFromZero, velocity:velocity}; |
139 noteDict[note] = {ts: timeFromZero, velocity:velocity}; |
147 } |
140 } |
148 } |
141 } |
149 |
142 |
|
143 // Socket management |
|
144 var sock = null; |
|
145 var ellog = null; |
|
146 function log(m) { |
|
147 if(logger){ |
|
148 ellog.innerHTML += m + '\n'; |
|
149 ellog.scrollTop = ellog.scrollHeight; |
|
150 } |
|
151 } |
150 window.onload = function() { |
152 window.onload = function() { |
151 |
153 |
152 ellog = document.getElementById('log'); |
154 if(logger){ |
|
155 ellog = document.getElementById('log'); |
|
156 } |
|
157 else{ |
|
158 document.body.removeChild(document.getElementById('log')); |
|
159 } |
153 |
160 |
154 var wsuri; |
161 var wsuri; |
155 if (window.location.protocol === "file:") { |
162 if (window.location.protocol === "file:") { |
156 wsuri = "ws://127.0.0.1:8090/broadcast"; |
163 wsuri = "ws://127.0.0.1:8090/broadcast"; |
157 } else { |
164 } else { |
166 window.location = "http://autobahn.ws/unsupportedbrowser"; |
173 window.location = "http://autobahn.ws/unsupportedbrowser"; |
167 } |
174 } |
168 |
175 |
169 if (sock) { |
176 if (sock) { |
170 sock.onopen = function() { |
177 sock.onopen = function() { |
171 log("Connected to " + wsuri); |
178 if(logger){ |
|
179 log("Connected to " + wsuri); |
|
180 } |
172 } |
181 } |
173 |
182 |
174 sock.onclose = function(e) { |
183 sock.onclose = function(e) { |
175 log("Connection closed (wasClean = " + e.wasClean + ", code = " + e.code + ", reason = '" + e.reason + "')"); |
184 if(logger){ |
|
185 log("Connection closed (wasClean = " + e.wasClean + ", code = " + e.code + ", reason = '" + e.reason + "')"); |
|
186 } |
176 sock = null; |
187 sock = null; |
177 } |
188 } |
178 |
189 |
179 sock.onmessage = function(e) { |
190 sock.onmessage = function(e) { |
180 log("Got message: " + e.data); |
191 if(logger){ |
|
192 log("Got message: " + e.data); |
|
193 } |
181 addBunny(JSON.parse(e.data)); |
194 addBunny(JSON.parse(e.data)); |
182 } |
195 } |
183 } |
196 } |
184 }; |
197 }; |
185 |
198 |
219 t.x = x + 2; |
232 t.x = x + 2; |
220 t.y = 2; |
233 t.y = 2; |
221 container2.addChild(t); |
234 container2.addChild(t); |
222 |
235 |
223 } |
236 } |
|
237 addLine(); |
224 var moveInterval = window.setInterval(moveContainer, 1000/manualFramerate); |
238 var moveInterval = window.setInterval(moveContainer, 1000/manualFramerate); |
225 var verticalLinesInterval = false; |
239 var verticalLinesInterval = false; |
226 if(drawVerticalLines){ |
240 if(drawVerticalLines){ |
227 verticalLinesInterval = window.setInterval(addLine, lineInterval); |
241 verticalLinesInterval = window.setInterval(addLine, lineInterval); |
228 } |
242 } |
|
243 var nbSec = 0; |
|
244 var mySpan = document.getElementById("myspan"); |
|
245 function updateTime(){ |
|
246 nbSec++; |
|
247 var hours = parseInt( nbSec / 3600 ) % 24; |
|
248 var minutes = parseInt( nbSec / 60 ) % 60; |
|
249 var seconds = nbSec % 60; |
|
250 var timeStr = (hours < 10 ? "0" + hours : hours) + ":" + (minutes < 10 ? "0" + minutes : minutes) + ":" + (seconds < 10 ? "0" + seconds : seconds); |
|
251 mySpan.innerHTML = timeStr; |
|
252 } |
|
253 var secondInterval = window.setInterval(updateTime, 1000); |