client/annotviz/app/js/annotsvizview.js
author rougeronj
Wed, 21 Jan 2015 20:16:31 +0100
changeset 103 123a611c7903
parent 98 72d767c5142d
child 104 685c5ebc59d0
permissions -rw-r--r--
minor update of options and add annotsvizview
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     1
/**
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     2
* js/annotsvizview.js
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     3
*
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     4
* This is the starting point for your application.
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     5
* Take a look at http://browserify.org/ for more info
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     6
*/
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
     7
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
     8
'use strict';
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
     9
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    10
var PIXI = require('pixi');
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    11
var _ = require('lodash');
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    12
var DoubleRoll = require('./doubleroll.js');
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    13
var AnnotsTimeLine = require('./annotstimeline.js');
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    14
var AnnotsRoll = require('./annotsroll.js');
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    15
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    16
var defaultOptions = {		
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    17
    xInit: 0,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    18
    yInit: 0,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    19
    width: 1080,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    20
    height: 1920,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    21
};
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    22
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    23
function AnnotsVizView(options){
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    24
	var _this = this;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    25
    var opts = _(options).defaults(defaultOptions).value();
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    26
    
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    27
    this.container = new PIXI.DisplayObjectContainer();
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    28
    this.container.x = opts.xInit;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    29
    this.container.y = opts.yInit;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    30
	this.width = opts.width;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    31
	this.height= opts.height;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    32
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    33
	var wsPianoroll = opts.wsPianoroll;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    34
	var wsAnnot = opts.wsAnnot;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    35
	var stageView = opts.stageView;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    36
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    37
	stageView.registerComponent(this);
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    38
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    39
	var timeLine = new AnnotsTimeLine.AnnotsTimeLine({
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    40
    	stageView : stageView,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    41
        logger: logger,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    42
        ws: new annotviz.WsWrapper(wsUriAnnotation, logger),
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    43
        xInit: 0,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    44
        yInit: 0,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    45
        width: 1920 - 435 - 300,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    46
        height: 1080,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    47
        timeBegin: Date.now(),
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    48
        timeEnd: Date.now() + 300000,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    49
        intervalWidth: 6,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    50
        intervalHeight: 10,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    51
        maxCellHeight: 100,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    52
        radius: 400,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    53
        circleX:500,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    54
        circleY:500,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    55
        annotCategories: [{
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    56
       		ts: 0, 
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    57
       		colors: {		
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    58
   	       		'ntm': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    59
   	       	    'iam': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    60
   	       	    'hip': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    61
   	       	    'hop': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    62
   	       	    'rock': '#DE8B53',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    63
   	       	    'rap': '#DE8B53',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    64
   	       	    'classic': '#DE8B53',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    65
   	       	    'drums': '#C5A3CA',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    66
   	       	    'guitar': '#C5A3CA',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    67
   	       	    'bass': '#79BB92',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    68
   	       	   	'default': '#808080'
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    69
			},
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    70
        	order: ['ntm', 'iam', 'hip', 'hop', 'rock', 'rap', 'classic', 'drums', 'guitar', 'bass', 'default']
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    71
       	}]
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    72
    });
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    73
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    74
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    75
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    76
	var doubleRollV = new DoubleRoll.DoubleRoll({
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    77
        stageView : stageView,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    78
    	logger: logger,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    79
        ws: wsPianoroll,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    80
        orientation: 'vertical',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    81
        sceneHeight: 1080,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    82
        pianorolls : [
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    83
            {
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    84
                height: 300,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    85
                timeWidth: 60,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    86
                lineInterval: 5000,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    87
                noteHeight: undefined
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    88
            },
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    89
        ]
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    90
    });
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    91
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    92
	var annotsRoll = new AnnotsRoll.AnnotsRoll({
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    93
    	stageView : stageView,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    94
        logger: logger,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    95
        ws: wsAnnot,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    96
        parentContainer: doubleRollV.stage,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    97
        xInit: 1920 - 300 - 300,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    98
        yInit: 1080,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
    99
        width: 300 + 300,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   100
        height: 1080,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   101
        widthRoll: 300,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   102
        framerate: doubleRollV.framerate,
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   103
        pixelsPerSecond: Math.floor(1920 / 60),
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   104
        annotColors: [{
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   105
        	ts: 0, 
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   106
        	colors: {		
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   107
   	       		'ntm': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   108
   	       	    'iam': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   109
   	       	    'hip': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   110
   	       	    'hop': '#CDC83F',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   111
   	       	    'rock': '#DE8B53',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   112
   	       	    'rap': '#DE8B53',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   113
   	       	    'classic': '#DE8B53',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   114
   	       	    'drums': '#C5A3CA',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   115
   	       	    'guitar': '#C5A3CA',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   116
   	       	    'bass': '#79BB92',
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   117
   	       	   	'default': '#808080'
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   118
			}
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   119
        }]
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   120
    });
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   121
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   122
	var limiter1 = new PIXI.Graphics()
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   123
		.lineStyle(1, 0x000000)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   124
		.moveTo(annotsRoll.container.x, annotsRoll.container.y)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   125
		.lineTo(annotsRoll.container.x, annotsRoll.container.y - annotsRoll.height)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   126
		.endFill();
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   127
	this.container.addChild(limiter1);
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   128
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   129
	var limiter2 = new PIXI.Graphics()
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   130
		.lineStyle(1, 0x000000)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   131
		.moveTo(annotsRoll.container.x + annotsRoll.widthRoll, annotsRoll.container.y)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   132
		.lineTo(annotsRoll.container.x + annotsRoll.widthRoll, annotsRoll.container.y - annotsRoll.height)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   133
		.endFill();
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   134
	this.container.addChild(limiter2);
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   135
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   136
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   137
//	var doubleRollV = new DoubleRoll.DoubleRoll({});
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   138
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   139
	this.init = function(){
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   140
		
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   141
	}
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   142
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   143
	this.start = function() {
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   144
    };
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   145
    
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   146
    this.refresh = function() {
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   147
    };
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   148
    
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   149
    this.stop = function(){
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   150
    };
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   151
    
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   152
    return this;
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   153
	
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   154
}
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   155
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   156
module.exports = {
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   157
	AnnotsVizView: AnnotsVizView
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 98
diff changeset
   158
};