From 5689e3e2deda1b1f7ba32f6007ddab20f6c1fe64 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Fri, 2 Mar 2012 18:17:14 -0800 Subject: Timeline: Serialization of all Collapser components --- .../Timeline/TimelineTrack.reel/TimelineTrack.html | 136 ++++++++++++++++++--- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 32 ++--- 2 files changed, 139 insertions(+), 29 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html index 26d045d6..1cc05f4e 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html @@ -17,7 +17,11 @@ "element": {"#": "track"}, "tweenRepetition" : {"@" : "tweenRepetition"}, "styleTracksRepetition" : {"@" : "styleTracksRepetition"}, - "tween": {"@" : "tween"} + "tween": {"@" : "tween"}, + "_mainCollapser" : {"@" : "mainCollapser"}, + "_positionCollapser" : {"@" : "positionCollapser"}, + "_transformCollapser" : {"@" : "transformCollapser"}, + "_styleCollapser" : {"@" : "styleCollapser"} } }, @@ -145,6 +149,110 @@ "properties" : { "element":{"#": "transform-track-base"} } + }, + + "mainCollapser" : { + "module" : "js/panels/timeline/Collapser.js", + "name" : "Collapser", + "properties" : { + "element" : {"#" : "content-main"}, + "myContent" : {"#":"content-main"}, + "contentHeight" : 60, + "isLabelClickable" : false, + "clicker" : {"#" : "label-main"}, + "isCollapsed" : true, + "isAnimated" : true + }, + "bindings" : { + "isToggling" : { + "boundObject" : {"@" : "owner" }, + "boundObjectPropertyPath" : "isMainCollapsed", + "oneway" : false + }, + "bypassAnimation" : { + "boundObject" : {"@": "owner"}, + "boundObjectPropertyPath" : "bypassAnimation", + "oneway" : false + } + } + }, + + "positionCollapser" : { + "module" : "js/panels/timeline/Collapser.js", + "name" : "Collapser", + "properties" : { + "element" : {"#" : "content-position-tracks"}, + "myContent" : {"#":"content-position-tracks"}, + "contentHeight" : 40, + "isLabelClickable" : false, + "clicker" : {"#" : "label-position"}, + "isCollapsed" : true, + "isAnimated" : true + }, + "bindings" : { + "isToggling" : { + "boundObject" : {"@" : "owner" }, + "boundObjectPropertyPath" : "isPositionCollapsed", + "oneway" : false + }, + "bypassAnimation" : { + "boundObject" : {"@": "owner"}, + "boundObjectPropertyPath" : "bypassAnimation", + "oneway" : false + } + } + }, + + "transformCollapser" : { + "module" : "js/panels/timeline/Collapser.js", + "name" : "Collapser", + "properties" : { + "element" : {"#" : "content-transform-tracks"}, + "myContent" : {"#":"content-transform-tracks"}, + "contentHeight" : 40, + "isLabelClickable" : false, + "clicker" : {"#" : "label-transform"}, + "isCollapsed" : true, + "isAnimated" : true + }, + "bindings" : { + "isToggling" : { + "boundObject" : {"@" : "owner" }, + "boundObjectPropertyPath" : "isTransformCollapsed", + "oneway" : false + }, + "bypassAnimation" : { + "boundObject" : {"@": "owner"}, + "boundObjectPropertyPath" : "bypassAnimation", + "oneway" : false + } + } + }, + + "styleCollapser" : { + "module" : "js/panels/timeline/Collapser.js", + "name" : "Collapser", + "properties" : { + "element" : {"#" : "content-styles"}, + "myContent" : {"#":"content-styles"}, + "contentHeight" : 40, + "isLabelClickable" : false, + "clicker" : {"#" : "label-styles"}, + "isCollapsed" : true, + "isAnimated" : true + }, + "bindings" : { + "isToggling" : { + "boundObject" : {"@" : "owner" }, + "boundObjectPropertyPath" : "isStyleCollapsed", + "oneway" : false + }, + "bypassAnimation" : { + "boundObject" : {"@": "owner"}, + "boundObjectPropertyPath" : "bypassAnimation", + "oneway" : false + } + } } @@ -153,28 +261,28 @@ -
-
-
+
+
+
-
-
-
+
+
+
-
-
+
+
-
+
-
-
+
+
-
+
-
+
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 420be0c9..6e753b9f 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -57,7 +57,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { set:function (newVal) { if (newVal !== this._isTransformCollapsed) { this._isTransformCollapsed = newVal; - this.needsDraw = true; } } }, @@ -71,7 +70,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { set:function (newVal) { if (newVal !== this._isPositionCollapsed) { this._isPositionCollapsed = newVal; - this.needsDraw = true; } } }, @@ -85,21 +83,21 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { set:function (newVal) { if (newVal !== this._isStyleCollapsed) { this._isStyleCollapsed = newVal; - this.needsDraw = true; } } }, - _animateCollapser : { + _bypassAnimation : { serializable: true, value: false }, - animateCollapser : { + bypassAnimation : { serializable: true, get: function() { - return this._animateCollapser; + return this._bypassAnimation; }, set: function(newVal) { - this._animateCollapser = newVal; + //console.log("timelinetrack bypassAnimation setter " + newVal) + this._bypassAnimation = newVal; } }, @@ -582,7 +580,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.arrPositionTracks = [0, 1]; this.arrTransformTracks = [0, 1, 2, 3, 4]; - + /* this.label = this.element.querySelector(".label-main"); this.myContent = this.element.querySelector(".content-main"); this.labelPosition = this.element.querySelector(".label-position"); @@ -605,22 +603,25 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { boundObjectPropertyPath: "isMainCollapsed", oneway: false }); + + Object.defineBinding(this._mainCollapser, "bypassAnimation", { boundObject: this, boundObjectPropertyPath: "animateCollapser", oneway: false, boundValueMutator: function(value) { - return !value; + console.log('mutating') + return !value } }); - + */ /* this._mainCollapser.labelClickEvent = function () { that.isMainCollapsed = that._mainCollapser.isCollapsed; }; */ //this._mainCollapser.needsDraw = true; - +/* this._positionCollapser = Collapser.create(); this._positionCollapser.clicker = this.labelPosition; this._positionCollapser.myContent = this.contentPosition; @@ -634,7 +635,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { boundObjectPropertyPath: "isPositionCollapsed", oneway: false }); - + */ /* this._positionCollapser.labelClickEvent = function () { @@ -642,7 +643,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { }; */ //this._positionCollapser.needsDraw = true; - +/* this._transformCollapser = Collapser.create(); this._transformCollapser.clicker = this.labelTransform; this._transformCollapser.myContent = this.contentTransform; @@ -656,7 +657,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { boundObjectPropertyPath: "isTransformCollapsed", oneway: false }); - + */ /* this._transformCollapser.labelClickEvent = function () { @@ -665,6 +666,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { */ //this._transformCollapser.needsDraw = true; +/* this._styleCollapser = Collapser.create(); this._styleCollapser.clicker = this.labelStyles; this._styleCollapser.myContent = this.contentStyles; @@ -679,7 +681,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { oneway: false }); - + */ /* this._styleCollapser.labelClickEvent = function () { that.isStyleCollapsed = that._styleCollapser.isCollapsed; -- cgit v1.2.3 From bcfb704b04587f95a13c474cf0598ba90ec3b371 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Tue, 6 Mar 2012 18:06:40 -0800 Subject: Timeline: Code cleanup. Fix bug with unfound property in serialization. --- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 108 --------------------- 1 file changed, 108 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 92714c07..669dabef 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -582,114 +582,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.arrPositionTracks = [0, 1]; this.arrTransformTracks = [0, 1, 2, 3, 4]; - /* - this.label = this.element.querySelector(".label-main"); - this.myContent = this.element.querySelector(".content-main"); - this.labelPosition = this.element.querySelector(".label-position"); - this.contentPosition = this.element.querySelector(".content-position"); - this.labelTransform = this.element.querySelector(".label-transform"); - this.contentTransform = this.element.querySelector(".content-transform"); - this.labelStyles = this.element.querySelector(".label-styles"); - this.contentStyles = this.element.querySelector(".content-styles"); - - this._mainCollapser = Collapser.create(); - this._mainCollapser.clicker = this.label; - this._mainCollapser.myContent = this.myContent; - this._mainCollapser.contentHeight = 60; - this._mainCollapser.isLabelClickable = false; - this._mainCollapser.element = this.myContent; - this._mainCollapser.isCollapsed = this.isMainCollapsed; - this._mainCollapser.isAnimated = true; - Object.defineBinding(this._mainCollapser, "isToggling", { - boundObject: this, - boundObjectPropertyPath: "isMainCollapsed", - oneway: false - }); - - - Object.defineBinding(this._mainCollapser, "bypassAnimation", { - boundObject: this, - boundObjectPropertyPath: "animateCollapser", - oneway: false, - boundValueMutator: function(value) { - console.log('mutating') - return !value - } - }); - */ - /* - this._mainCollapser.labelClickEvent = function () { - that.isMainCollapsed = that._mainCollapser.isCollapsed; - }; - */ - //this._mainCollapser.needsDraw = true; -/* - this._positionCollapser = Collapser.create(); - this._positionCollapser.clicker = this.labelPosition; - this._positionCollapser.myContent = this.contentPosition; - this._positionCollapser.contentHeight = 40; - this._positionCollapser.isLabelClickable = true; - this._positionCollapser.element = this.contentPosition; - this._positionCollapser.isCollapsed = this.isPositionCollapsed; - this._positionCollapser.isAnimated = true; - Object.defineBinding(this._positionCollapser, "isToggling", { - boundObject: this, - boundObjectPropertyPath: "isPositionCollapsed", - oneway: false - }); - */ - - /* - this._positionCollapser.labelClickEvent = function () { - that.isPositionCollapsed = that._positionCollapser.isCollapsed; - }; - */ - //this._positionCollapser.needsDraw = true; -/* - this._transformCollapser = Collapser.create(); - this._transformCollapser.clicker = this.labelTransform; - this._transformCollapser.myContent = this.contentTransform; - this._transformCollapser.contentHeight = 100; - this._transformCollapser.isLabelClickable = false; - this._transformCollapser.element = this.contentTransform; - this._transformCollapser.isCollapsed = this.isTransformCollapsed; - this._transformCollapser.isAnimated = true; - Object.defineBinding(this._transformCollapser, "isToggling", { - boundObject: this, - boundObjectPropertyPath: "isTransformCollapsed", - oneway: false - }); - */ - - /* - this._transformCollapser.labelClickEvent = function () { - that.isTransformCollapsed = that._transformCollapser.isCollapsed; - }; - */ - //this._transformCollapser.needsDraw = true; - -/* - this._styleCollapser = Collapser.create(); - this._styleCollapser.clicker = this.labelStyles; - this._styleCollapser.myContent = this.contentStyles; - this._styleCollapser.contentHeight = 0; - this._styleCollapser.isLabelClickable = false; - this._styleCollapser.element = this.contentStyles; - this._styleCollapser.isCollapsed = this.isStyleCollapsed; - this._styleCollapser.isAnimated = true; - Object.defineBinding(this._styleCollapser, "isToggling", { - boundObject: this, - boundObjectPropertyPath: "isStyleCollapsed", - oneway: false - }); - - */ - /* - this._styleCollapser.labelClickEvent = function () { - that.isStyleCollapsed = that._styleCollapser.isCollapsed; - }; - */ - //this._styleCollapser.needsDraw = true; // Register event handler for layer events. //defaultEventManager.addEventListener("layerEvent", this, false); -- cgit v1.2.3