client/annotviz/app/js/annotstimeline.js
author rougeronj
Thu, 22 Jan 2015 16:16:54 +0100
changeset 123 d8ef840eaf68
parent 121 df6b39f962bc
child 124 b5697bcdbaff
child 126 13d9a532a0a7
permissions -rw-r--r--
get the correct json category depending on the timestamp
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     1
/**
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
     2
* js/annotstimeline
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     3
*
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
     4
* annotstimeline basic component
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     5
*
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     6
*/
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     7
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     8
'use strict';
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
     9
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
    10
var PIXI = require('pixi');
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    11
var Utils = require('./utils.js');
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    12
var _ = require('lodash');
97
545803e685e0 rename components
ymh <ymh.work@gmail.com>
parents: 92
diff changeset
    13
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    14
var defaultOptions = {
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    15
    logger: undefined,
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    16
    intervalWidth: 10,
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    17
    intervalHeight: 5,
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    18
    maxCellHeight: 200,
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    19
    radius: 300
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    20
};
97
545803e685e0 rename components
ymh <ymh.work@gmail.com>
parents: 92
diff changeset
    21
545803e685e0 rename components
ymh <ymh.work@gmail.com>
parents: 92
diff changeset
    22
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    23
function AnnotsTimeLine(options){
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
    24
    var _this = this;
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    25
    var opts = _(options).defaults(defaultOptions).value();
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    26
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    27
    this.container = new PIXI.DisplayObjectContainer();
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    28
    this.container.x = opts.xInit;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    29
    this.container.y = opts.yInit;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    30
    this.container.width = opts.width;
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    31
    this.container.height = opts.height;
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    32
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    33
    this.timeBegin = opts.timeBegin;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    34
    this.timeEnd = opts.timeEnd;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    35
    this.duration = (this.timeEnd - this.timeBegin)/1000;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    36
    this.width = opts.width;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    37
    this.height = opts.height;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    38
    this.intervalHeight = opts.intervalHeight;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    39
    this.intervalWidth = opts.intervalWidth;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    40
    this.maxCellHeight = opts.maxCellHeight;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    41
    this.annotCategories = opts.annotCategories;
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
    42
    
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    43
    this.circleX = opts.circleX || (this.width/2);
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    44
    this.circleY = opts.circleY || (this.height/2);
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    45
    this.radius = opts.radius;
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    46
    this.perimeter = 2*Math.PI* this.radius;
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    47
    this.intervalDuration = (this.intervalWidth * this.duration / this.perimeter);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    48
113
7531e4180915 Minor time correction
rougeronj
parents: 109
diff changeset
    49
    var currentTime = Date.now() + 3600*1000;
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    50
    var totalIndex = Math.floor(this.perimeter/this.intervalWidth);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    51
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
    52
    this.cells = []
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    53
    for (var i=0; i<(this.perimeter/this.intervalWidth) ; i++){
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
    54
    	this.cells[i] = [];
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    55
    	this.cells[i].i = i;
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
    56
    	this.cells[i].totalAnnots = 0;
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
    57
    	this.cells[i].categories = {};
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
    58
    }
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    59
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    60
    var ws = opts.ws;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    61
    var stageView = opts.stageView;
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    62
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    63
    //draw the base - circle and line to locate the scene
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
    64
    var graphics = new PIXI.Graphics();
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    65
    graphics.lineStyle(2, 0x646464)
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    66
    	.drawCircle(this.circleX, this.circleY, this.radius - 3)
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    67
    	.lineStyle(1, 0xD7D7D7)
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    68
    	.drawCircle(this.circleX, this.circleY, this.radius*2/3)
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
    69
    	.drawCircle(this.circleX, this.circleY, this.radius/3)
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    70
    	.lineStyle(1, 0x646464)
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    71
    	.moveTo(this.circleX, this.circleY - (this.radius/3)/2)
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    72
    	.lineTo(this.circleX, this.circleY - this.radius - this.maxCellHeight - 10)
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
    73
    	.endFill()
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
    74
    this.container.addChild(graphics);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    75
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    76
    //set time text
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    77
    //TODO : move this to annotsvizview
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    78
    var currentTimeText = new PIXI.Text("-- : -- : --", { font: '18pt Gothic Standard', fill: '#646464' });
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    79
    currentTimeText.x = this.circleX - currentTimeText.width/2;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    80
    currentTimeText.y = this.circleY - currentTimeText.height/2;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
    81
    this.container.addChild(currentTimeText);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    82
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    83
    stageView.registerComponent(this);
97
545803e685e0 rename components
ymh <ymh.work@gmail.com>
parents: 92
diff changeset
    84
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
    85
    //Add Annotation to the TimeLine
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
    86
    this.addAnnot = function(data){
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
    87
    	
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    88
    	var ts = Date.parse(data.ts);
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    89
    	var colorsDef;
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    90
    	_(this.annotCategories).eachRight(function(cdef) {
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    91
            if(cdef.ts < ts) {
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    92
                colorsDef = cdef;
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    93
                return false;
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    94
            }
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    95
        });
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
    96
    	
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
    97
    	if (this.timeEnd > Date.parse(data.ts)){
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
    98
	    	var i = Math.floor(((Date.parse(data.ts) + 3600*1000) - this.timeBegin)/(1000*this.intervalDuration));
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
    99
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   100
	    	if (typeof(this.cells[i].graphics) === 'undefined'){
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   101
	    		this.initCell(this.cells[i], colorsDef);
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   102
	    	}
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   103
	    	
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   104
	    	if (typeof(colorsDef.colors[data.content.category.code]) !== 'undefined'){
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   105
	    		var annotCode = data.content.category.code;
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   106
	    	} else {
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   107
	    		var annotCode = 'default';
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   108
	    	}
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   109
	    	
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   110
			this.cells[i].categories[annotCode].count += 1;
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   111
			this.cells[i].totalAnnots +=1;
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   112
			this.redrawCell(this.cells[i], colorsDef);
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   113
    	}
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   114
    };
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   115
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   116
    this.initTimeTexts = function() {
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   117
	    var tBeg = new PIXI.Text(Utils.formatTime(this.timeBegin), { font: '12pt Gothic Standard', fill: '#646464' });
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   118
	    tBeg.x = this.circleX + 15;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   119
	    tBeg.y = this.circleY - this.radius - this.maxCellHeight - 10;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   120
	    this.container.addChild(tBeg);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   121
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   122
	    var tEnd = new PIXI.Text(Utils.formatTime(this.timeEnd), { font: '12pt Gothic Standard', fill: '#646464' });
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   123
	    tEnd.x = this.circleX - 15 - tEnd.width;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   124
	    tEnd.y = this.circleY - this.radius - this.maxCellHeight - 10;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   125
	    this.container.addChild(tEnd);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   126
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   127
	    var t15 = new PIXI.Text(Utils.formatTime(((this.timeEnd - this.timeBegin)/4) + this.timeBegin), { font: '12pt Gothic Standard', fill: '#646464' });
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   128
	    t15.x = this.circleX + this.radius + this.maxCellHeight + 10 ;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   129
	    t15.y = this.circleY - t15.height;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   130
	    t15.rotation = Math.PI /2;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   131
	    this.container.addChild(t15);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   132
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   133
	    var t30 = new PIXI.Text(Utils.formatTime(((this.timeEnd - this.timeBegin)/2) + this.timeBegin), { font: '12pt Gothic Standard', fill: '#646464' });
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   134
	    t30.x = this.circleX - t30.width/2;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   135
	    t30.y = this.circleY + this.radius + this.maxCellHeight - 2;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   136
	    this.container.addChild(t30);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   137
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   138
	    var t45 = new PIXI.Text(Utils.formatTime(((this.timeEnd - this.timeBegin)*3/4) + this.timeBegin), { font: '12pt Gothic Standard', fill: '#646464' });
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   139
	    t45.x = this.circleX - this.radius - this.maxCellHeight - 10 ;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   140
	    t45.y = this.circleY + t15.height;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   141
	    t45.rotation = -Math.PI/2;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   142
	    this.container.addChild(t45);
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   143
    }
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   144
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   145
    //Draw the cellule
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   146
    this.redrawCell = function(cell, colorsDef){
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   147
    	
102
cc7b06bfd574 update to circle representation
rougeronj
parents: 100
diff changeset
   148
    	var y = 0;
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   149
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   150
    	//Check if total height is higher than Max Cell Height
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   151
    	if ((cell.totalAnnots*this.intervalHeight) > this.maxCellHeight){
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   152
    		var heightStep = this.maxCellHeight/cell.totalAnnots;
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   153
    	} else {
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   154
    		var heightStep = this.intervalHeight;
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   155
    	}
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   156
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   157
    	//Draw the rect depending on the height step calculated
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   158
    	for (var i=0; i< colorsDef.order.length; i++){
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   159
    		var currentCode = colorsDef.order[i];
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   160
			cell.graphics.beginFill(cell.categories[currentCode].color.replace("#", "0x"))
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
   161
    			.drawRect(0, y, this.intervalWidth-1, -cell.categories[currentCode].count * heightStep)
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   162
    			.endFill();
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   163
    		y -= cell.categories[currentCode].count*heightStep;
99
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   164
    	}
9d968fbcaa2a Add General Time Line + minor change in annotsRoll
rougeronj
parents: 92
diff changeset
   165
    }
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   166
    
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   167
    this.initCell = function(cell, colorsDef){
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   168
    	cell.graphics = new PIXI.Graphics();
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   169
    	cell.graphics.position.x = this.circleX + this.radius * Math.sin(cell.i*(360/totalIndex)*(Math.PI/180));
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   170
    	cell.graphics.position.y = this.circleY - this.radius * Math.cos(cell.i*(360/totalIndex)*(Math.PI/180));
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   171
    	cell.graphics.rotation = (cell.i)*(360/totalIndex)*(Math.PI/180) + (360/(totalIndex*2))*(Math.PI/180);
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   172
    	this.container.addChild(cell.graphics);
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   173
    	
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   174
    	for (var category in colorsDef.colors){
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   175
    		cell.categories[category] = {
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   176
				"count": 0,
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   177
				"color": colorsDef.colors[category]
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   178
    		};
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   179
    	}
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   180
    	cell.categories['default'] = {
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   181
			"count": 0,
123
d8ef840eaf68 get the correct json category depending on the timestamp
rougeronj
parents: 121
diff changeset
   182
			"color": colorsDef.defaultColor
121
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   183
    	}
df6b39f962bc Add getAnnotCategories to utils and propagate the modification to annotsvizview and annotstimeline
rougeronj
parents: 114
diff changeset
   184
    }
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   185
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   186
    this.init = function() {
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   187
    	ws.message(function(data) {
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   188
            _this.addAnnot(data);
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   189
        });
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   190
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   191
    	this.initTimeTexts();
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   192
    };
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   193
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   194
    this.updateTime = function(){
113
7531e4180915 Minor time correction
rougeronj
parents: 109
diff changeset
   195
    	currentTime = Date.now() + 3600*1000;
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   196
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   197
        var nbSec = currentTime / 1000;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   198
        var hours = Math.floor( nbSec / 3600 ) % 24;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   199
        var minutes = Math.floor( nbSec / 60 ) % 60;
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   200
        var seconds = Math.floor(nbSec % 60);
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   201
        var timeStr = (hours < 10 ? '0' + hours : hours) + ':' + (minutes < 10 ? '0' + minutes : minutes) + ':' + (seconds  < 10 ? '0' + seconds : seconds);
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   202
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   203
        currentTimeText.setText(timeStr);
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   204
    };
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   205
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   206
    var refreshTimeInterval;
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   207
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   208
    this.start = function() {
105
25ac8802c189 Improve interface + Add horizontal pianoroll to annotsvizview
rougeronj
parents: 103
diff changeset
   209
    	refreshTimeInterval = setInterval(function() {_this.updateTime();}, 1000);
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
   210
    };
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   211
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   212
    this.refresh = function() {
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   213
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   214
    };
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   215
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   216
    this.stop = function(){
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
   217
    	console.log(this.cells);
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   218
    };
109
8546e2181a73 correct color codes sent by client
ymh <ymh.work@gmail.com>
parents: 105
diff changeset
   219
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 99 98
diff changeset
   220
    return this;
91
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
   221
}
09a9074ea7b0 Add general View fonction for main representation
rougeronj
parents:
diff changeset
   222
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 97
diff changeset
   223
module.exports = {
103
123a611c7903 minor update of options and add annotsvizview
rougeronj
parents: 102
diff changeset
   224
	AnnotsTimeLine: AnnotsTimeLine
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 97
diff changeset
   225
};