--- a/annot-server/static/js/pianoroll.js Tue Oct 28 18:11:16 2014 +0100
+++ b/annot-server/static/js/pianoroll.js Wed Oct 29 12:50:30 2014 +0100
@@ -12,12 +12,8 @@
var lineInterval = 5000; // means line every 5 seconds
var nbLines = -1;
var noteHeight = 110;
-var noteColor = [0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991,
- 0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991,
- 0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991,
- 0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991,
- 0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991,
- 0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991];
+var noteColors = [0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991];
+var colorsReg = {}
// Vars
var noteDict = [];
// Timecode method
@@ -40,7 +36,7 @@
stage.addChild(uberContainer);
-function PianoRoll(parentContainer, xInit, yInit, height, linesDown, pixelsPerSecond, width){
+function PianoRoll(parentContainer, xInit, yInit, height, linesDown, pixelsPerSecond, width, noteColors, colorsReg){
var _this = this;
this.container = new PIXI.DisplayObjectContainer();
this.container.position.x = xInit;
@@ -51,6 +47,8 @@
this.height = height;
this.pixelsPerSecond = pixelsPerSecond;
this.width = width;
+ this.noteColors = noteColors;
+ this.colorsReg = colorsReg || {}
this.addNote = function(note, startTime, duration, velocity, canal){
//console.log("coucou 1", note, timeFromZero, ts, velocity, pixelsPerSecond, container, prHeight);
@@ -59,7 +57,17 @@
// We draw the rectangle
var graphics = new PIXI.Graphics();
//console.log("beginX = ", beginX, "canal = ", canal, "color = ", noteColor[canal], "width = ", width, "note = ", note, "velocity = ", velocity);
- graphics.beginFill(noteColor[canal], (velocity / 128));
+ var color = this.colorsReg[canal];
+ if(typeof(color) === 'undefined') {
+ var colorsRegSize = Object.keys(this.colorsReg).length
+ if(colorsRegSize < this.noteColors.length) {
+ color = this.colorsReg[canal] = this.noteColors[colorsRegSize];
+ }
+ else {
+ color = this.colorsReg[canal] = parseInt(randomColor({ luminosity: 'light', hue: 'random', format:'hex'}).replace(/^#/, ''), 16);
+ }
+ }
+ graphics.beginFill(color, (velocity / 128));
var y = (128-note) * this.height / 128; // (128-note) because y = 0 is for note = 128 and y = 128 for note = 0
graphics.drawRect(0, Math.floor(y - (noteHeight/2) + ((this.height / 128)/2)), width, noteHeight);
graphics.endFill();
@@ -112,16 +120,16 @@
}
//console.log("before : ", nbChilds, ", after : ", _this.container.children.length);
};
-
+
// remove notes each scene width
var removeInterval = window.setInterval(this.removePassedObjets, 1000 * sceneWidth / this.pixelsPerSecond );
-
+
}
// Init containers
var containerList = [];
-containerList.push(new PianoRoll(uberContainer, 0, 0, prHeight1, true, pixelsPerSecond1, sceneWidth));
-containerList.push(new PianoRoll(uberContainer, 0, prHeight1, prHeight2, false, pixelsPerSecond2, sceneWidth));
+containerList.push(new PianoRoll(uberContainer, 0, 0, prHeight1, true, pixelsPerSecond1, sceneWidth, noteColors, colorsReg));
+containerList.push(new PianoRoll(uberContainer, 0, prHeight1, prHeight2, false, pixelsPerSecond2, sceneWidth, noteColors, colorsReg));
// Line between two containers
var graphics = new PIXI.Graphics();
@@ -136,8 +144,7 @@
function replaceContainers(){
var diff = (Date.now() - timePageLoaded)/1000;// nb of seconds since page loaded
//console.log("replace ! diff1 = ", container1.x - Math.floor(-diff*pixelsPerSecond1), ", diff 2 = ", container2.x - Math.floor(-diff*pixelsPerSecond2));
- var nb = containerList.length;
- for(var i=0;i<nb;i++){
+ for(var i=0;i<containerList.length;i++){
containerList[i].moveTo(-diff);
}
renderer.render(stage);
@@ -159,8 +166,7 @@
// We close the note in container one
//console.log("coucou 2", data);
var duration = data.content[1] - noteDict[data.content[2]][note].ts;
- var nb = containerList.length;
- for(var i=0;i<nb;i++){
+ for(var i=0;i<containerList.length;i++){
// addNote(note, startTime, duration, velocity, canal)
containerList[i].addNote(note, noteDict[data.content[2]][note].ts, duration, noteDict[data.content[2]][note].velocity, data.content[2]);
}
@@ -178,8 +184,7 @@
function addLine(){
nbLines++;
- var nb = containerList.length;
- for(var i=0;i<nb;i++){
+ for(var i=0;i<containerList.length;i++){
containerList[i].addLine(nbLines);
}
}