108 childIsNowDisplayed = true; |
108 childIsNowDisplayed = true; |
109 //console.log(" childIsNowDisplayed"); |
109 //console.log(" childIsNowDisplayed"); |
110 } |
110 } |
111 i++; |
111 i++; |
112 } |
112 } |
113 }; |
113 //console.log("before : ", nbChilds, ", after : ", _this.container.children.length); |
114 |
114 }; |
|
115 |
|
116 // remove notes each scene width |
|
117 var removeInterval = window.setInterval(this.removePassedObjets, 1000 * sceneWidth / this.pixelsPerSecond ); |
|
118 |
115 } |
119 } |
116 |
120 |
117 // Init containers |
121 // Init containers |
118 var container1 = new PianoRoll(uberContainer, 0, 0, prHeight1, true, pixelsPerSecond1, sceneWidth); |
122 var containerList = []; |
119 var container2 = new PianoRoll(uberContainer, 0, prHeight1, prHeight2, false, pixelsPerSecond2, sceneWidth); |
123 containerList.push(new PianoRoll(uberContainer, 0, 0, prHeight1, true, pixelsPerSecond1, sceneWidth)); |
|
124 containerList.push(new PianoRoll(uberContainer, 0, prHeight1, prHeight2, false, pixelsPerSecond2, sceneWidth)); |
120 |
125 |
121 // Line between two containers |
126 // Line between two containers |
122 var graphics = new PIXI.Graphics(); |
127 var graphics = new PIXI.Graphics(); |
123 graphics.beginFill(0xFFFF00); |
128 graphics.beginFill(0xFFFF00); |
124 graphics.lineStyle(1, lineColor); |
129 graphics.lineStyle(1, lineColor); |
129 |
134 |
130 |
135 |
131 function replaceContainers(){ |
136 function replaceContainers(){ |
132 var diff = (Date.now() - timePageLoaded)/1000;// nb of seconds since page loaded |
137 var diff = (Date.now() - timePageLoaded)/1000;// nb of seconds since page loaded |
133 //console.log("replace ! diff1 = ", container1.x - Math.floor(-diff*pixelsPerSecond1), ", diff 2 = ", container2.x - Math.floor(-diff*pixelsPerSecond2)); |
138 //console.log("replace ! diff1 = ", container1.x - Math.floor(-diff*pixelsPerSecond1), ", diff 2 = ", container2.x - Math.floor(-diff*pixelsPerSecond2)); |
134 container1.moveTo(-diff); |
139 var nb = containerList.length; |
135 container2.moveTo(-diff); |
140 for(var i=0;i<nb;i++){ |
|
141 containerList[i].moveTo(-diff); |
|
142 } |
136 renderer.render(stage); |
143 renderer.render(stage); |
137 } |
144 } |
138 |
145 |
139 function addNotes(data){ |
146 function addNotes(data){ |
140 if(!offsetMusic){ |
147 if(!offsetMusic){ |
150 if(velocity===0){ |
157 if(velocity===0){ |
151 if(typeof noteDict[data.content[2]][note]!=='undefined'){ |
158 if(typeof noteDict[data.content[2]][note]!=='undefined'){ |
152 // We close the note in container one |
159 // We close the note in container one |
153 //console.log("coucou 2", data); |
160 //console.log("coucou 2", data); |
154 var duration = data.content[1] - noteDict[data.content[2]][note].ts; |
161 var duration = data.content[1] - noteDict[data.content[2]][note].ts; |
155 //addNoteInContainer(note, noteDict[data.content[2]][note].ts, duration, noteDict[data.content[2]][note].velocity, pixelsPerSecond1, container1, prHeight1, data.content[2]); |
162 var nb = containerList.length; |
156 // addNote(note, startTime, duration, velocity, canal) |
163 for(var i=0;i<nb;i++){ |
157 container1.addNote(note, noteDict[data.content[2]][note].ts, duration, noteDict[data.content[2]][note].velocity, data.content[2]); |
164 // addNote(note, startTime, duration, velocity, canal) |
158 //addNoteInContainer(note, noteDict[data.content[2]][note].ts, duration, noteDict[data.content[2]][note].velocity, pixelsPerSecond2, container2, prHeight2, data.content[2]); |
165 containerList[i].addNote(note, noteDict[data.content[2]][note].ts, duration, noteDict[data.content[2]][note].velocity, data.content[2]); |
159 container2.addNote(note, noteDict[data.content[2]][note].ts, duration, noteDict[data.content[2]][note].velocity, data.content[2]); |
166 } |
160 // delete entry |
167 // delete entry |
161 delete noteDict[data.content[2]][note]; |
168 delete noteDict[data.content[2]][note]; |
162 } |
169 } |
163 } |
170 } |
164 else{ |
171 else{ |
211 log("Browser does not support WebSocket!"); |
220 log("Browser does not support WebSocket!"); |
212 window.location = "http://autobahn.ws/unsupportedbrowser"; |
221 window.location = "http://autobahn.ws/unsupportedbrowser"; |
213 } |
222 } |
214 |
223 |
215 if (sock) { |
224 if (sock) { |
216 sock.onopen = function(){ |
225 sock.onopen = function(){ |
217 if(logger){ |
226 if(logger){ |
218 log("Connected to " + wsuri); |
227 log("Connected to " + wsuri); |
219 } |
228 } |
220 } |
229 } |
221 |
230 |
222 sock.onclose = function(e) { |
231 sock.onclose = function(e) { |
223 if(logger){ |
232 if(logger){ |
224 log("Connection closed (wasClean = " + e.wasClean + ", code = " + e.code + ", reason = '" + e.reason + "')"); |
233 log("Connection closed (wasClean = " + e.wasClean + ", code = " + e.code + ", reason = '" + e.reason + "')"); |
225 } |
234 } |
226 sock = null; |
235 sock = null; |
227 } |
236 } |
228 |
237 |
229 sock.onmessage = function(e) { |
238 sock.onmessage = function(e) { |
230 if(logger){ |
239 if(logger){ |
231 log("Got message: " + e.data); |
240 log("Got message: " + e.data); |
232 } |
241 } |
233 addNotes(JSON.parse(e.data)); |
242 addNotes(JSON.parse(e.data)); |
234 } |
243 } |
235 } |
244 } |
236 }; |
245 }; |
237 |
246 |
238 |
247 |
239 // Init page and intervals |
248 // Init page and intervals |
240 addLine(); |
249 addLine(); |
241 var moveInterval = window.setInterval(replaceContainers, 1000/manualFramerate); |
250 var moveInterval = window.setInterval(replaceContainers, 1000/manualFramerate); |
242 var verticalLinesInterval = window.setInterval(addLine, lineInterval); |
251 var verticalLinesInterval = window.setInterval(addLine, lineInterval); |
243 var removeInterval1 = window.setInterval(container1.removePassedObjets, 1000 * sceneWidth / pixelsPerSecond1 ); |
|
244 var removeInterval2 = window.setInterval(container2.removePassedObjets, 1000 * sceneWidth / pixelsPerSecond2 ); |
|
245 |
252 |
246 // Little inteval to show time |
253 // Little inteval to show time |
247 var nbSec = 0; |
254 var nbSec = 0; |
248 var mySpan = document.getElementById("myspan"); |
255 var mySpan = document.getElementById("myspan"); |
249 function updateTime(){ |
256 function updateTime(){ |