From f6835e48d3597ecb8cf1da8bcc91b58a8227d389 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 7 Mar 2012 11:12:57 -0800 Subject: Optimize Timeline serialization Change all serialized properties into one big object to reduce bindings Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 41 +++++++++++++++++++++++++++++++--- 1 file changed, 38 insertions(+), 3 deletions(-) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 81bd1867..df1770da 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -38,13 +38,11 @@ var Layer = exports.Layer = Montage.create(Component, { _arrLayerStyles : { serializable: true, enumerable: true, - serializable: true, value: [] }, arrLayerStyles : { serializable: true, enumerable: true, - serializable: true, get: function() { return this._arrLayerStyles; }, @@ -386,7 +384,44 @@ var Layer = exports.Layer = Montage.create(Component, { this._bypassAnimation = newVal; } }, - + + _layerData:{ + serializable:true, + value:{} + }, + + layerData:{ + serializable:true, + get:function(){ + return this._layerData; + }, + set:function(val){ + this._layerData = val; + this.setData(); + } + }, + + setData:{ + value:function(){ + this.layerName = this.layerData.layerName; + this.layerID = this.layerData.layerID; + this.arrLayerStyles = this.layerData.arrLayerStyles; + this.isMainCollapsed = this.layerData.isMainCollapsed; + this.isPositionCollapsed = this.layerData.isPositionCollapsed; + this.isTransformCollapsed = this.layerData.isTransformCollapsed; + this.isSelected = this.layerData.isSelected; + this.isActive = this.layerData.isActive; + this.isStyleCollapsed = this.layerData.isStyleCollapsed; + this.bypassAnimation = this.layerData.bypassAnimation; + this.dtextPositionX = this.layerData.dtextPositionX; + this.dtextPositionY = this.layerData.dtextPositionY; + this.dtextSkewX = this.layerData.dtextSkewX; + this.dtextSkewY = this.layerData.dtextSkewY; + this.dtextScaleX = this.layerData.dtextScaleX; + this.dtextScaleY = this.layerData.dtextScaleY; + this.dtextRotate = this.layerData.dtextRotate; + } + }, /* END: Models */ -- cgit v1.2.3 From a1fd19bff814afa2f4a0299f860055b1e338cf3d Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 7 Mar 2012 11:32:37 -0800 Subject: Bugfixes from optimization Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index df1770da..0500ec11 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -108,7 +108,7 @@ var Layer = exports.Layer = Montage.create(Component, { /* Position and Transform hottext values */ _dtextPositionX : { value:null, - serializable: true, + serializable: true }, dtextPositionX:{ @@ -127,7 +127,7 @@ var Layer = exports.Layer = Montage.create(Component, { _dtextPositionY : { value:null, - serializable: true, + serializable: true }, dtextPositionY:{ @@ -146,7 +146,7 @@ var Layer = exports.Layer = Montage.create(Component, { _dtextScaleX : { value:null, - serializable: true, + serializable: true }, dtextScaleX:{ @@ -165,7 +165,7 @@ var Layer = exports.Layer = Montage.create(Component, { _dtextScaleY : { value:null, - serializable: true, + serializable: true }, dtextScaleY:{ @@ -184,7 +184,7 @@ var Layer = exports.Layer = Montage.create(Component, { _dtextSkewX : { value:null, - serializable: true, + serializable: true }, dtextSkewX:{ @@ -203,7 +203,7 @@ var Layer = exports.Layer = Montage.create(Component, { _dtextSkewY : { value:null, - serializable: true, + serializable: true }, dtextSkewY:{ @@ -222,7 +222,7 @@ var Layer = exports.Layer = Montage.create(Component, { _dtextRotate : { value:null, - serializable: true, + serializable: true }, dtextRotate:{ @@ -397,7 +397,9 @@ var Layer = exports.Layer = Montage.create(Component, { }, set:function(val){ this._layerData = val; - this.setData(); + if(this._layerData){ + this.setData(); + } } }, -- cgit v1.2.3 From abdd0542bce89b6b22f0684d00b9cf24e5d0a5e6 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 7 Mar 2012 13:43:41 -0800 Subject: cleanup Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 0500ec11..d65d031f 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -665,7 +665,7 @@ var Layer = exports.Layer = Montage.create(Component, { }, handleMousedown: { value: function(event) { - this.isActive = true; + this.layerData.isActive = true; var ptrParent = nj.queryParentSelector(event.target, ".content-style"); if (ptrParent !== false) { this.selectStyle(this.getActiveStyleIndex()); -- cgit v1.2.3 From b4aa9a46bdf6ed748cbb3fc2a2a4fc226e0e7fd7 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 8 Mar 2012 11:04:59 -0800 Subject: Remove unnecessary needsDraw calls Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 27 ++++++++++++++------------- 1 file changed, 14 insertions(+), 13 deletions(-) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index d65d031f..e561e45d 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -82,8 +82,8 @@ var Layer = exports.Layer = Montage.create(Component, { if (newVal !== this._layerName) { this._layerEditable.value = newVal; this._layerName = newVal; - this._layerEditable.needsDraw = true; - this.needsDraw = true; + //this._layerEditable.needsDraw = true; + //this.needsDraw = true; } } @@ -119,7 +119,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextPositionX !== value) { this._dtextPositionX = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -138,7 +138,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextPositionY !== value) { this._dtextPositionY = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -157,7 +157,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextScaleX !== value) { this._dtextScaleX = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -176,7 +176,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextScaleY !== value) { this._dtextScaleY = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -195,7 +195,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextSkewX !== value) { this._dtextSkewX = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -214,7 +214,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextSkewY !== value) { this._dtextSkewY = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -233,7 +233,7 @@ var Layer = exports.Layer = Montage.create(Component, { set:function(value){ if (this._dtextRotate !== value) { this._dtextRotate = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -259,7 +259,7 @@ var Layer = exports.Layer = Montage.create(Component, { this.selectStyle(false); } this._isSelected = value; - this.needsDraw = true; + //this.needsDraw = true; } } @@ -332,7 +332,7 @@ var Layer = exports.Layer = Montage.create(Component, { set: function(newVal) { if (newVal !== this._isTransformCollapsed) { this._isTransformCollapsed = newVal; - this.needsDraw = true; + //this.needsDraw = true; } } }, @@ -349,7 +349,7 @@ var Layer = exports.Layer = Montage.create(Component, { set: function(newVal) { if (newVal !== this._isPositionCollapsed) { this._isPositionCollapsed = newVal; - this.needsDraw = true; + //this.needsDraw = true; } } }, @@ -366,7 +366,7 @@ var Layer = exports.Layer = Montage.create(Component, { set: function(newVal) { if (newVal !== this._isStyleCollapsed) { this._isStyleCollapsed = newVal; - this.needsDraw = true; + //this.needsDraw = true; } } }, @@ -422,6 +422,7 @@ var Layer = exports.Layer = Montage.create(Component, { this.dtextScaleX = this.layerData.dtextScaleX; this.dtextScaleY = this.layerData.dtextScaleY; this.dtextRotate = this.layerData.dtextRotate; + this.needsDraw = true; } }, -- cgit v1.2.3 From ebe6a42bdf76d53a985dec528ad9702df3738f56 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Fri, 9 Mar 2012 15:34:46 -0800 Subject: Timeline: Fixes for deleting layers, layer selection, persisting layer name edits and selection between document switching. --- js/panels/Timeline/Layer.reel/Layer.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index e561e45d..b41680be 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -82,8 +82,8 @@ var Layer = exports.Layer = Montage.create(Component, { if (newVal !== this._layerName) { this._layerEditable.value = newVal; this._layerName = newVal; - //this._layerEditable.needsDraw = true; - //this.needsDraw = true; + this.layerData.layerName = newVal; + this.log('layerName setter: ' + newVal) } } @@ -259,6 +259,7 @@ var Layer = exports.Layer = Montage.create(Component, { this.selectStyle(false); } this._isSelected = value; + this.layerData.isSelected = value; //this.needsDraw = true; } @@ -405,6 +406,7 @@ var Layer = exports.Layer = Montage.create(Component, { setData:{ value:function(){ + this.log('layer: setData called') this.layerName = this.layerData.layerName; this.layerID = this.layerData.layerID; this.arrLayerStyles = this.layerData.arrLayerStyles; -- cgit v1.2.3 From 4afb5b8c94bbdd00821abf93ce6599bade360a8f Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 15 Mar 2012 15:13:56 -0700 Subject: Timeline: Fix for layer selection problems on file open and switch. Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 19 +++++++++++++++---- 1 file changed, 15 insertions(+), 4 deletions(-) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index b41680be..069d3c4b 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -255,12 +255,11 @@ var Layer = exports.Layer = Montage.create(Component, { if (value !== this._isSelected) { // Only concerned about different values if (value === false) { - // If changing from false to true, we need to deselect any associated styles + // If changing from true to false, we need to deselect any associated styles this.selectStyle(false); } this._isSelected = value; this.layerData.isSelected = value; - //this.needsDraw = true; } } @@ -381,7 +380,6 @@ var Layer = exports.Layer = Montage.create(Component, { return this._bypassAnimation; }, set: function(newVal) { - //console.log("layer.js _bypassAnimation setter " + newVal) this._bypassAnimation = newVal; } }, @@ -406,7 +404,6 @@ var Layer = exports.Layer = Montage.create(Component, { setData:{ value:function(){ - this.log('layer: setData called') this.layerName = this.layerData.layerName; this.layerID = this.layerData.layerID; this.arrLayerStyles = this.layerData.arrLayerStyles; @@ -424,9 +421,13 @@ var Layer = exports.Layer = Montage.create(Component, { this.dtextScaleX = this.layerData.dtextScaleX; this.dtextScaleY = this.layerData.dtextScaleY; this.dtextRotate = this.layerData.dtextRotate; + this._isFirstDraw = this.layerData._isFirstDraw; this.needsDraw = true; } }, + _isFirstDraw : { + value: true + }, /* END: Models */ @@ -482,6 +483,16 @@ var Layer = exports.Layer = Montage.create(Component, { this.element.classList.remove("selected"); } } + }, + didDraw: { + value: function() { + if ((this.isSelected === true) && (this._isFirstDraw === true)) { + // Once we're done drawing the first time we need to tell the TimelinePanel if + // this layer is supposed to be selected. + this.parentComponent.parentComponent.selectedLayerID = this.layerID; + this._isFirstDraw = false; + } + } }, /* End: Draw cycle */ -- cgit v1.2.3 From 47c7ba7a500082af0268b39ebbbbe926fa284920 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 15 Mar 2012 16:02:22 -0700 Subject: Timeline: remove comment. Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 1 + 1 file changed, 1 insertion(+) (limited to 'js/panels/Timeline/Layer.reel') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 069d3c4b..5206ae16 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -260,6 +260,7 @@ var Layer = exports.Layer = Montage.create(Component, { } this._isSelected = value; this.layerData.isSelected = value; + this.needsDraw = true; } } -- cgit v1.2.3