diff -r 30dc3baf1ab9 -r b62fdb81ce6a client/annotviz/app/js/annotsvizview.js --- a/client/annotviz/app/js/annotsvizview.js Fri Jan 23 11:31:51 2015 +0100 +++ b/client/annotviz/app/js/annotsvizview.js Fri Jan 23 15:30:58 2015 +0100 @@ -22,35 +22,35 @@ }; function AnnotsVizView(options){ - var _this = this; + var _this = this; var opts = _(options).defaults(defaultOptions).value(); this.container = new PIXI.DisplayObjectContainer(); this.container.x = opts.xInit; this.container.y = opts.yInit; - this.width = opts.width; - this.height= opts.height; + this.width = opts.width; + this.height= opts.height; this.timeBegin = opts.timeBegin; this.timeEnd = opts.timeEnd; this.annotCategories = []; this.annotCategoriesDay1 = []; - - var wsPianoroll = opts.wsPianoroll; - var wsAnnot = opts.wsAnnot; - var stageView = opts.stageView; - var currentTime = Date.now() + 3600*1000; - var eventCode = opts.eventCode; - var eventCodeSessionDay1 = opts.eventCodeSessionDay1; + + var wsPianoroll = opts.wsPianoroll; + var wsAnnot = opts.wsAnnot; + var stageView = opts.stageView; + var currentTime = Date.now() + 3600*1000; + var eventCode = opts.eventCode; + var eventCodeSessionDay1 = opts.eventCodeSessionDay1; var channel = opts.channel; var serverUrl = opts.serverUrl; - + Utils.getAnnotCategories(opts.urlCategories + eventCode, this.annotCategories); Utils.getAnnotCategories(opts.urlCategories + eventCodeSessionDay1, this.annotCategoriesDay1); - stageView.registerComponent(this); + stageView.registerComponent(this); - var timeLineDay2 = new AnnotsTimeLine.AnnotsTimeLine({ - stageView : stageView, + var timeLineDay2 = new AnnotsTimeLine.AnnotsTimeLine({ + stageView : stageView, logger: logger, ws: wsAnnot, xInit: 0, @@ -68,10 +68,10 @@ serverUrl: serverUrl, annotCategories: this.annotCategories }); - + //Archive day 1 var timeLineDay1 = new AnnotsTimeLine.AnnotsTimeLine({ - stageView : stageView, + stageView : stageView, archive: true, xInit: 0, yInit: 0, @@ -91,7 +91,7 @@ serverUrl: serverUrl, showClockGraphics:false }); - + var currentTimeText = new PIXI.Text("-- : -- : --", { font: '18pt Gothic Standard', fill: '#646464' }); currentTimeText.x = timeLineDay2.circleX - currentTimeText.width/2; currentTimeText.y = timeLineDay2.circleY - currentTimeText.height/2; @@ -99,13 +99,13 @@ var timeLineDay3 = new PIXI.Graphics(); timeLineDay3.lineStyle(1, 0x646464) - .drawCircle(timeLineDay2.circleX, timeLineDay2.circleY, timeLineDay2.radius/3) - .endFill() + .drawCircle(timeLineDay2.circleX, timeLineDay2.circleY, timeLineDay2.radius/3) + .endFill() this.container.addChild(timeLineDay3); - - var doubleRollH = new DoubleRoll.DoubleRoll({ + + var doubleRollH = new DoubleRoll.DoubleRoll({ stageView : stageView, - logger: logger, + logger: logger, ws: wsPianoroll, yInit: (this.height - 200), sceneHeight: 200, @@ -119,12 +119,13 @@ ] }); - var doubleRollV = new DoubleRoll.DoubleRoll({ + var doubleRollV = new DoubleRoll.DoubleRoll({ stageView : stageView, - logger: logger, + logger: logger, ws: wsPianoroll, orientation: 'vertical', sceneHeight: 768-200, + zeroShift: 1.0, pianorolls : [ { height: 200, @@ -134,9 +135,12 @@ }, ] }); + doubleRollV.container.y = doubleRollV.container.y+20; + //doubleRollV.container. - var annotsRoll = new AnnotsRoll.AnnotsRoll({ - stageView : stageView, + + var annotsRoll = new AnnotsRoll.AnnotsRoll({ + stageView : stageView, logger: logger, ws: wsAnnot, parentContainer: doubleRollV.stage, @@ -150,31 +154,31 @@ annotColors: this.annotCategories }); - var limiters = new PIXI.Graphics() - .lineStyle(1, 0x646464) - .moveTo(annotsRoll.container.x, annotsRoll.container.y) - .lineTo(annotsRoll.container.x, annotsRoll.container.y - annotsRoll.height) - .moveTo(annotsRoll.container.x + annotsRoll.widthRoll, annotsRoll.container.y) - .lineTo(annotsRoll.container.x + annotsRoll.widthRoll, annotsRoll.container.y - annotsRoll.height) - .moveTo(0, this.height - 200) - .lineTo(this.width, this.height - 200) - .drawRect(0, 0, this.width -1, this.height -1) - .beginFill(0xECECEC) - .drawRect(1024 - 200, 0, 200, 768-200) - .endFill(); - this.container.addChild(limiters); + var limiters = new PIXI.Graphics() + .lineStyle(1, 0x646464) + .moveTo(annotsRoll.container.x, annotsRoll.container.y) + .lineTo(annotsRoll.container.x, annotsRoll.container.y - annotsRoll.height) + .moveTo(annotsRoll.container.x + annotsRoll.widthRoll, annotsRoll.container.y) + .lineTo(annotsRoll.container.x + annotsRoll.widthRoll, annotsRoll.container.y - annotsRoll.height) + .moveTo(0, this.height - 200) + .lineTo(this.width, this.height - 200) + .drawRect(0, 0, this.width -1, this.height -1) + .beginFill(0xECECEC) + .drawRect(1024 - 200, 0, 200, 768-200) + .endFill(); + this.container.addChild(limiters); - this.init = function(){ - }; + this.init = function(){ + }; - this.updateTime = function(){ + this.updateTime = function(){ currentTimeText.setText(Utils.formatTime(Date.now())); }; var refreshTimeInterval; - - this.start = function() { - refreshTimeInterval = setInterval(function() {_this.updateTime();}, 1000); + + this.start = function() { + refreshTimeInterval = setInterval(function() {_this.updateTime();}, 1000); }; this.refresh = function() { @@ -188,5 +192,5 @@ } module.exports = { - AnnotsVizView: AnnotsVizView + AnnotsVizView: AnnotsVizView };