client/annotviz/app/js/annotstimeline.js
changeset 126 13d9a532a0a7
parent 123 d8ef840eaf68
child 127 0386fb9efe27
--- a/client/annotviz/app/js/annotstimeline.js	Thu Jan 22 16:16:54 2015 +0100
+++ b/client/annotviz/app/js/annotstimeline.js	Thu Jan 22 23:58:11 2015 +0100
@@ -16,7 +16,8 @@
     intervalWidth: 10,
     intervalHeight: 5,
     maxCellHeight: 200,
-    radius: 300
+    radius: 300,
+    showClockGraphics: true
 };
 
 
@@ -39,18 +40,18 @@
     this.intervalWidth = opts.intervalWidth;
     this.maxCellHeight = opts.maxCellHeight;
     this.annotCategories = opts.annotCategories;
+    this.showClockGraphics = opts.showClockGraphics;
     
     this.circleX = opts.circleX || (this.width/2);
     this.circleY = opts.circleY || (this.height/2);
     this.radius = opts.radius;
-    this.perimeter = 2*Math.PI* this.radius;
-    this.intervalDuration = (this.intervalWidth * this.duration / this.perimeter);
-
-    var currentTime = Date.now() + 3600*1000;
-    var totalIndex = Math.floor(this.perimeter/this.intervalWidth);
+    var perimeter = 2*Math.PI* this.radius;
+    this.intervalDuration = (this.intervalWidth * this.duration / perimeter);
+    
+    var totalIndex = Math.floor( perimeter/this.intervalWidth);
 
     this.cells = []
-    for (var i=0; i<(this.perimeter/this.intervalWidth) ; i++){
+    for (var i=0; i<(perimeter/this.intervalWidth) ; i++){
     	this.cells[i] = [];
     	this.cells[i].i = i;
     	this.cells[i].totalAnnots = 0;
@@ -64,27 +65,13 @@
     var graphics = new PIXI.Graphics();
     graphics.lineStyle(2, 0x646464)
     	.drawCircle(this.circleX, this.circleY, this.radius - 3)
-    	.lineStyle(1, 0xD7D7D7)
-    	.drawCircle(this.circleX, this.circleY, this.radius*2/3)
-    	.drawCircle(this.circleX, this.circleY, this.radius/3)
-    	.lineStyle(1, 0x646464)
-    	.moveTo(this.circleX, this.circleY - (this.radius/3)/2)
-    	.lineTo(this.circleX, this.circleY - this.radius - this.maxCellHeight - 10)
     	.endFill()
     this.container.addChild(graphics);
 
-    //set time text
-    //TODO : move this to annotsvizview
-    var currentTimeText = new PIXI.Text("-- : -- : --", { font: '18pt Gothic Standard', fill: '#646464' });
-    currentTimeText.x = this.circleX - currentTimeText.width/2;
-    currentTimeText.y = this.circleY - currentTimeText.height/2;
-    this.container.addChild(currentTimeText);
-
     stageView.registerComponent(this);
 
     //Add Annotation to the TimeLine
-    this.addAnnot = function(data){
-    	
+    this.addAnnot = function(data){    	
     	var ts = Date.parse(data.ts);
     	var colorsDef;
     	_(this.annotCategories).eachRight(function(cdef) {
@@ -93,10 +80,8 @@
                 return false;
             }
         });
-    	
-    	if (this.timeEnd > Date.parse(data.ts)){
-	    	var i = Math.floor(((Date.parse(data.ts) + 3600*1000) - this.timeBegin)/(1000*this.intervalDuration));
-
+    	if (this.timeEnd > ts){
+	    	var i = Math.floor((ts - this.timeBegin)/(1000*this.intervalDuration));
 	    	if (typeof(this.cells[i].graphics) === 'undefined'){
 	    		this.initCell(this.cells[i], colorsDef);
 	    	}
@@ -113,7 +98,7 @@
     	}
     };
 
-    this.initTimeTexts = function() {
+    this.initClockGraphics = function() {
 	    var tBeg = new PIXI.Text(Utils.formatTime(this.timeBegin), { font: '12pt Gothic Standard', fill: '#646464' });
 	    tBeg.x = this.circleX + 15;
 	    tBeg.y = this.circleY - this.radius - this.maxCellHeight - 10;
@@ -140,11 +125,17 @@
 	    t45.y = this.circleY + t15.height;
 	    t45.rotation = -Math.PI/2;
 	    this.container.addChild(t45);
+	    
+	    var lineV = new PIXI.Graphics();
+	    lineV.lineStyle(1, 0x646464)
+	    	.moveTo(this.circleX, this.circleY - (this.radius/3)/2)
+	    	.lineTo(this.circleX, this.circleY - this.radius - this.maxCellHeight - 10)
+    	.endFill();
+	    this.container.addChild(lineV);
     }
 
     //Draw the cellule
     this.redrawCell = function(cell, colorsDef){
-    	
     	var y = 0;
 
     	//Check if total height is higher than Max Cell Height
@@ -177,9 +168,11 @@
 				"color": colorsDef.colors[category]
     		};
     	}
-    	cell.categories['default'] = {
-			"count": 0,
-			"color": colorsDef.defaultColor
+    	if (typeof(cell.categories['default']) === 'undefined'){
+			cell.categories['default'] = {
+				"count": 0,
+				"color": colorsDef.defaultColor
+			}
     	}
     }
 
@@ -188,25 +181,11 @@
             _this.addAnnot(data);
         });
 
-    	this.initTimeTexts();
+    	if (this.showClockGraphics){this.initClockGraphics();}
     };
 
-    this.updateTime = function(){
-    	currentTime = Date.now() + 3600*1000;
-
-        var nbSec = currentTime / 1000;
-        var hours = Math.floor( nbSec / 3600 ) % 24;
-        var minutes = Math.floor( nbSec / 60 ) % 60;
-        var seconds = Math.floor(nbSec % 60);
-        var timeStr = (hours < 10 ? '0' + hours : hours) + ':' + (minutes < 10 ? '0' + minutes : minutes) + ':' + (seconds  < 10 ? '0' + seconds : seconds);
-
-        currentTimeText.setText(timeStr);
-    };
-
-    var refreshTimeInterval;
 
     this.start = function() {
-    	refreshTimeInterval = setInterval(function() {_this.updateTime();}, 1000);
     };
 
     this.refresh = function() {