3 * |
3 * |
4 * pianoroll basic component |
4 * pianoroll basic component |
5 * |
5 * |
6 */ |
6 */ |
7 |
7 |
8 /* global window: false */ |
|
9 'use strict'; |
8 'use strict'; |
10 |
9 |
11 |
10 |
12 var PIXI = require('pixi'); |
11 var PIXI = require('pixi'); |
13 var randomColor = require('randomColor'); |
12 var randomColor = require('randomColor'); |
14 var _ = require('lodash'); |
13 var _ = require('lodash'); |
15 |
14 |
|
15 var NTP_EPOCH_DELTA = 2208988800; //c.f. RFC 868 |
16 |
16 |
17 function PianoRoll(options) { |
17 function PianoRoll(options) { |
18 var _this = this; |
18 var _this = this; |
19 this.container = new PIXI.DisplayObjectContainer(); |
19 this.container = new PIXI.DisplayObjectContainer(); |
20 this.container.x = options.xInit; |
20 this.container.x = options.xInit; |
68 graphics.x = x; |
68 graphics.x = x; |
69 graphics.y = y; |
69 graphics.y = y; |
70 graphics.width = width; |
70 graphics.width = width; |
71 graphics.height = height; |
71 graphics.height = height; |
72 return graphics; |
72 return graphics; |
|
73 }; |
|
74 |
|
75 this.addNoteRaw = function(data) { |
|
76 var note = data.content[3]; |
|
77 var velocity = data.content[4]; |
|
78 var ts = (data.content[0] - NTP_EPOCH_DELTA)*1000; |
|
79 var channel = data.content[2]; |
|
80 var sessionTs = data.content[1]; |
|
81 |
|
82 this.addNote(note, ts, sessionTs, velocity, channel, 0); |
73 }; |
83 }; |
74 |
84 |
75 this.addNote = function(note, startTime, sessionTs, velocity, channel, duration) { |
85 this.addNote = function(note, startTime, sessionTs, velocity, channel, duration) { |
76 |
86 |
77 var ts = startTime; |
87 var ts = startTime; |
184 var diff = (this.startTs - Date.now())/1000; |
194 var diff = (this.startTs - Date.now())/1000; |
185 this.moveTo(diff); |
195 this.moveTo(diff); |
186 }; |
196 }; |
187 |
197 |
188 this.removePassedObjets = function(){ |
198 this.removePassedObjets = function(){ |
189 var nbChilds = _this.container.children.length; |
|
190 var childrenToRemove = []; |
199 var childrenToRemove = []; |
191 _(_this.container.children).forEach(function(child) { |
200 _(_this.container.children).forEach(function(child) { |
192 return typeof(child) === 'undefined' |
201 return typeof(child) === 'undefined' || |
193 || (isHidden(child) && childrenToRemove.push(child)); |
202 (isHidden(child) && childrenToRemove.push(child)); |
194 }); |
203 }); |
195 childrenToRemove.forEach(function(child) { |
204 childrenToRemove.forEach(function(child) { |
196 _this.container.removeChild(child); |
205 _this.container.removeChild(child); |
197 }); |
206 }); |
198 }; |
207 }; |
199 |
208 |
200 this.start = function() { |
209 this.start = function() { |
201 if(!started) { |
210 if(!started) { |
202 this.startTs = Date.now(); |
211 this.startTs = Date.now(); |
203 this.addLine(); |
212 this.addLine(); |
204 } |
213 started = true; |
205 var _this = this; |
214 } |
206 this.verticalLinesInterval = window.setInterval(function() { _this.addLine(); }, this.lineInterval); |
215 this.verticalLinesInterval = setInterval(function() { _this.addLine(); }, this.lineInterval); |
207 this.cleanInterval = window.setInterval(function () { _this.removePassedObjets(); }, 1000 * this.width / this.pixelsPerSecond ); |
216 this.cleanInterval = setInterval(function () { _this.removePassedObjets(); }, 1000 * this.width / this.pixelsPerSecond ); |
208 }; |
217 }; |
209 |
218 |
210 this.stop = function() { |
219 this.stop = function() { |
211 //window.clearInterval(this.moveInterval); |
220 //window.clearInterval(this.moveInterval); |
212 window.clearInterval(this.verticalLinesInterval); |
221 clearInterval(this.verticalLinesInterval); |
213 window.clearInterval(this.cleanInterval); |
222 clearInterval(this.cleanInterval); |
214 }; |
223 }; |
215 |
224 |
216 |
225 |
217 } |
226 } |
218 |
227 |