# HG changeset patch # User ymh # Date 1421142365 -3600 # Node ID eff9460bd4f2b4d02c68d6102367c382ddd11d0c # Parent d7c5bffdd2d8a13fb48e15ec8eb6c23185a52668 add new visualization + small corrections diff -r d7c5bffdd2d8 -r eff9460bd4f2 .hgignore --- a/.hgignore Mon Jan 12 17:23:05 2015 +0100 +++ b/.hgignore Tue Jan 13 10:46:05 2015 +0100 @@ -21,8 +21,10 @@ \.orig$ ^client/pianoroll/dist ^client/pianoroll/.tmp -^client/pianoroll/.sass-cache ^client/pianoroll/app/lib +^client/annotviz/dist +^client/annotviz/.tmp +^client/annotviz/app/lib node_modules .DS_Store diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/.bowerrc --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/annotviz/.bowerrc Tue Jan 13 10:46:05 2015 +0100 @@ -0,0 +1,3 @@ +{ + "directory": "app/lib" +} diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/.editorconfig --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/annotviz/.editorconfig Tue Jan 13 10:46:05 2015 +0100 @@ -0,0 +1,13 @@ +# http://editorconfig.org +root = true + +[*] +indent_style = space +indent_size = 4 +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true + +[*.md] +trim_trailing_whitespace = false diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/.gitattributes --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/annotviz/.gitattributes Tue Jan 13 10:46:05 2015 +0100 @@ -0,0 +1,1 @@ +* text=auto \ No newline at end of file diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/.jshintrc --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/annotviz/.jshintrc Tue Jan 13 10:46:05 2015 +0100 @@ -0,0 +1,21 @@ +{ + "node": true, + "esnext": true, + "bitwise": true, + "camelcase": true, + "curly": true, + "eqeqeq": true, + "immed": true, + "indent": 4, + "latedef": true, + "newcap": true, + "noarg": true, + "quotmark": "single", + "regexp": true, + "undef": true, + "unused": true, + "strict": true, + "trailing": true, + "smarttabs": true, + "white": false +} diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/README.md --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/annotviz/README.md Tue Jan 13 10:46:05 2015 +0100 @@ -0,0 +1,1 @@ +# Mons Pianoroll diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/app/img/favicon.ico Binary file client/annotviz/app/img/favicon.ico has changed diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/app/index.html --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/annotviz/app/index.html Tue Jan 13 10:46:05 2015 +0100 @@ -0,0 +1,35 @@ + + + + + + + + + + Piano Roll + + + + + + +

Piano Roll

+ +
+

+ stop intervals + - temps écoulé : +

+

+    
+    
+    
+    
+
+
diff -r d7c5bffdd2d8 -r eff9460bd4f2 client/annotviz/app/js/main.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/client/annotviz/app/js/main.js	Tue Jan 13 10:46:05 2015 +0100
@@ -0,0 +1,198 @@
+/**
+ * scripts/main.js
+ *
+ * This is the starting point for your application.
+ * Take a look at http://browserify.org/ for more info
+ */
+
+'use strict';
+
+
+var PIXI = require('pixi');
+
+// Config vars
+var logger = false;
+var sceneWidth = 1920;
+var prHeight1 = 435;
+var prHeight2 = 645;
+var sceneHeight = prHeight1 + prHeight2;
+var sceneBgColor = 0xFFFFFF;
+var lineColor = 0x444444;
+var pixelsPerSecond1 = Math.floor(sceneWidth / 10); // nb of pixels per second
+var manualFramerate = pixelsPerSecond1 / 4;
+var pixelsPerSecond2 = Math.floor(sceneWidth / 60); // nb of pixels per second
+var lineInterval = 5000; // means line every 5 seconds
+var nbLines = -1;
+var noteHeight = 110;
+var noteColors = [0xB90000, 0x4BDD71, 0xAF931E, 0x1C28BA, 0x536991];
+var colorsReg = {};
+// Vars
+var noteDict = [];
+// Timecode method
+var timePageLoaded = Date.now();
+var offsetMusic = false;
+
+
+//create an new instance of a pixi stage
+var stage = new PIXI.Stage(sceneBgColor);
+
+//create a renderer instance.
+var renderer = PIXI.autoDetectRenderer(sceneWidth, sceneHeight);
+
+//add the renderer view element to the DOM
+document.getElementById('canvasContainer').appendChild(renderer.view);
+
+var uberContainer = new PIXI.DisplayObjectContainer();
+uberContainer.position.x = Math.floor(sceneWidth*9/10);
+uberContainer.position.y = 0;
+stage.addChild(uberContainer);
+
+var PianoRoll = require('./pianoroll.js')
+
+// Init containers
+var containerList = [];
+containerList.push(new PianoRoll(uberContainer, 0, 0, prHeight1, true, pixelsPerSecond1, sceneWidth, noteColors, colorsReg, lineColor, lineInterval, offsetMusic, prHeight1 / 128));
+containerList.push(new PianoRoll(uberContainer, 0, prHeight1, prHeight2, false, pixelsPerSecond2, sceneWidth, noteColors, colorsReg, lineColor, lineInterval, offsetMusic, prHeight2 / 128));
+
+// Line between two containers
+var graphics = new PIXI.Graphics();
+graphics.beginFill(0xFFFF00);
+graphics.lineStyle(1, lineColor);
+graphics.moveTo(0, prHeight1);
+graphics.lineTo(sceneWidth, prHeight1);
+graphics.endFill();
+stage.addChild(graphics);
+
+
+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));
+    for(var i=0;i