From aa2d8afb323e71ea562c74564609604e0480fde4 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Mon, 19 Mar 2012 16:53:29 -0700 Subject: Timeline: Re-enable adding/removing styles to layers. New methods in TimelinePanel for creating new styles on document load. --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 51 ++++++++++++++++++++++ 1 file changed, 51 insertions(+) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index fd297fd3..df018ee3 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -289,6 +289,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { createLayerTemplate:{ value:function () { var returnObj = {}; + returnObj.layerData = {}; returnObj.layerData.layerName = null; returnObj.layerData.layerID = null; @@ -297,6 +298,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { returnObj.layerData.isTransformCollapsed = true; returnObj.layerData.isStyleCollapsed = true; returnObj.layerData.arrLayerStyles = []; + returnObj.layerData.arrLayerStyles = []; returnObj.layerData.elementsList = []; returnObj.layerData.deleted = false; returnObj.layerData.isSelected = false; @@ -312,6 +314,51 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { return returnObj; } }, + + // Create an array of style objects for an element, for use + // in creating a new layer + createLayerStyles : { + value: function(ptrElement) { + // TODO: Create logic to loop through + // CSS properties on element and build + // array of layer styles for return. + // Right now this method just returns an array of one bogus style. + + var returnArray = [], + newStyle = {}, + styleID = "1@0"; // format: layerID + "@" + style counter + + newStyle.styleID = styleID; + newStyle.whichView = "propval"; + newStyle.editorProperty = "top"; + newStyle.editorValue = 0; + newStyle.ruleTweener = false; + newStyle.isSelected = false; + + returnArray.push(newStyle); + + return returnArray; + + } + }, + + // Create an array of style track objects for an element, for use + // in creating a new layer + createStyleTracks : { + value: function(ptrElement) { + // TODO: Create logic to loop through + // CSS properties on element and build + // array of layer styles for return. + // Right now this method just returns an array of one bogus style. + + var returnArray = []; + + returnArray.push("1"); + + return returnArray; + + } + }, // Bind all document-specific events (pass in true to unbind) _bindDocumentEvents:{ @@ -677,6 +724,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { thingToPush.layerData.layerID = this.currentLayerNumber; thingToPush.parentElementUUID = this.hashKey; thingToPush.parentElement = this.application.ninja.currentSelectedContainer; + + // Are there styles to add? + thingToPush.layerData.arrLayerStyles = this.createLayerStyles(); + thingToPush.layerData.arrStyleTracks = this.createStyleTracks(); if (this._openDoc) { ele.uuid = nj.generateRandom(); -- cgit v1.2.3 From 0e24b9dc875cefb1010a9e2b507c19b77e4d9811 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Tue, 20 Mar 2012 17:37:11 -0700 Subject: Timeline: fix layer and style select problems. --- js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index df018ee3..67eae45c 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -913,6 +913,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } else { this.arrLayers[i].layerData.isSelected = false; } + + if (this.arrLayers[i].layerData.triggerBinding === true) { + this.arrLayers[i].layerData.triggerBinding = false; + } else { + this.arrLayers[i].layerData.triggerBinding = true; + } } this.layerRepetition.selectedIndexes = [layerIndex]; -- cgit v1.2.3 From 9d7cd4d067b988a65cdea3059769617487028a22 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Wed, 21 Mar 2012 10:47:48 -0700 Subject: Fix: Change click handler to mousedown for better responsiveness in layer selection UI. --- js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 67eae45c..03d06d98 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -389,7 +389,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { value:function () { this.layout_tracks = this.element.querySelector(".layout-tracks"); this.layout_markers = this.element.querySelector(".layout_markers"); - this.timeline_leftpane.addEventListener("click", this.timelineLeftPaneClick.bind(this), false); + this.timeline_leftpane.addEventListener("mousedown", this.timelineLeftPaneMousedown.bind(this), false); this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false); this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false); this.end_hottext.addEventListener("changing", this.updateTrackContainerWidth.bind(this), false); @@ -495,6 +495,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Clear the repetitions if (this.arrLayers.length > 0) { this.arrLayers = []; + this.arrLayers.length = 0; } } }, @@ -616,7 +617,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - timelineLeftPaneClick:{ + timelineLeftPaneMousedown:{ value:function (event) { var ptrParent = nj.queryParentSelector(event.target, ".container-layer"); if (ptrParent !== false) { -- cgit v1.2.3 From 3669eea4bde3518ce080048e9f53d2dd111fd8be Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Wed, 21 Mar 2012 11:37:48 -0700 Subject: Timeline: Bug fix: style collapsers not staying in synch. Also, removed console.log calls in hintable component. --- js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 03d06d98..0ba49c44 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -915,11 +915,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.arrLayers[i].layerData.isSelected = false; } - if (this.arrLayers[i].layerData.triggerBinding === true) { - this.arrLayers[i].layerData.triggerBinding = false; - } else { - this.arrLayers[i].layerData.triggerBinding = true; - } + this.triggerLayerBinding(i); } this.layerRepetition.selectedIndexes = [layerIndex]; @@ -1077,6 +1073,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } } }, + // Trigger the layer/track data binding + triggerLayerBinding : { + value: function(intIndex) { + if (this.arrLayers[intIndex].layerData.triggerBinding === true) { + this.arrLayers[intIndex].layerData.triggerBinding = false; + } else { + this.arrLayers[intIndex].layerData.triggerBinding = true; + } + } + }, /* === END: Controllers === */ /* === BEGIN: Logging routines === */ -- cgit v1.2.3