From 40670fd9a723fe6f95fe6c1ceefa0d2435b83aa4 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 9 May 2012 09:47:31 -0700 Subject: sub property additions Signed-off-by: Jonathan Duran --- js/panels/Timeline/Layer.reel/Layer.js | 8 ++--- .../Timeline/PropertyTrack.reel/PropertyTrack.js | 34 ++++++++++++-------- .../Timeline/TimelineTrack.reel/TimelineTrack.html | 9 +++++- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 37 ++++++++++++++++++++-- 4 files changed, 68 insertions(+), 20 deletions(-) (limited to 'js') diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index c9dd5328..9fb33956 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -60,7 +60,7 @@ var Layer = exports.Layer = Montage.create(Component, { } }, _styleCounter : { - value: 0 + value: 4 }, styleCounter:{ serializable:true, @@ -557,7 +557,7 @@ var Layer = exports.Layer = Montage.create(Component, { // Or at the end, if no rule is selected. var newLength = 0, - mySelection = 0, + // mySelection = 0, // newStyle = LayerStyle.create(), newStyle = {}, newEvent = document.createEvent("CustomEvent"); @@ -571,7 +571,7 @@ var Layer = exports.Layer = Montage.create(Component, { newEvent.layerEventType = "newStyle"; newEvent.layerID = this.layerID; newEvent.styleIndex = this.styleCounter; - newEvent.styleID = this.layerID + "@" + this.styleCounter; + newEvent.styleID = this.layerID + "@" + this.styleCounter; // is this property needed? newStyle.styleID = newEvent.styleID; newStyle.whichView = "hintable"; @@ -583,7 +583,7 @@ var Layer = exports.Layer = Montage.create(Component, { // Set up the event info and dispatch the event this.styleCounter += 1; - newEvent.styleSelection = mySelection; + // newEvent.styleSelection = mySelection; defaultEventManager.dispatchEvent(newEvent); } }, diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index 3c648642..8316540b 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js @@ -24,7 +24,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { draw:{ value:function(){ - + console.log(this.trackType); } }, @@ -105,18 +105,18 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { } }, - _styleSelection:{ + _trackType:{ value:null }, - styleSelection:{ + trackType:{ serializable:true, get:function () { - return this._styleSelection; + return this._trackType; }, set:function (value) { - if (value !== this._styleSelection) { - this._styleSelection = value; + if (value !== this._trackType) { + this._trackType = value; } } }, @@ -145,7 +145,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { this.styleIndex = this.propTrackData.styleIndex; this.propTweens = this.propTrackData.propTweens; - this.styleSelection = this.propTrackData.styleSelection; + this.trackType = this.propTrackData.trackType; this.needsDraw = true; } }, @@ -153,21 +153,29 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { handleClick:{ value:function(ev){ if (ev.shiftKey) { + console.log(this.trackType); if (this.propTweens.length < 1) { // check if there is an editor property assigned yet // get this property track's editor prop name from layer data arrays var selectIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); - if (this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[this.styleIndex].editorProperty == null) { - console.log("Please enter a style property for this track before adding keyframes."); - return; - } else { - this.trackEditorProperty = this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[this.styleIndex].editorProperty; - console.log("Property track editorProperty set to: " + this.trackEditorProperty); + if (this.trackType === "style") { + if (this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[this.styleIndex].editorProperty == null) { + console.log("Please enter a style property for this track before adding keyframes."); + return; + } else { + this.trackEditorProperty = this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[this.styleIndex].editorProperty; + console.log("Property track editorProperty set to: " + this.trackEditorProperty); + } + } else if (this.trackType === "position") { + console.log("clicking on position track"); + + console.log(this.trackEditorProperty); } + this.insertPropTween(0); this.addPropAnimationRuleToElement(ev); this.updatePropKeyframeRule(); diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html index 3f3bf24a..b666f921 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html @@ -98,7 +98,14 @@ "prototype" : "js/panels/Timeline/PropertyTrack.reel", "properties" : { "element":{"#": "position-track-base"} - } + }, + "bindings" : { + "propTrackData" : { + "boundObject" : {"@" : "positionTracksRepetition"}, + "boundObjectPropertyPath" : "objectAtCurrentIteration.propTrackData", + "oneway" : false + } + } }, "mainCollapser" : { diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 891feada..2ce1a637 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -801,8 +801,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { // create track objects for position and transform tracks and push into arrays instead of dummy arrays - //this.createPositionTracks(); - this.arrPositionTracks = [0, 1, 2, 3]; + this.createPositionTracks(); + //this.arrPositionTracks = [0, 1, 2, 3]; // get rid of transform tracks //this.arrTransformTracks = [0, 1, 2, 3, 4]; @@ -816,6 +816,38 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { createPositionTracks:{ value:function(){ // create track objects for position and transform tracks and push into arrays + + // create 'top' track + var newTopTrack = {}; + newTopTrack.propTrackData = {}; + newTopTrack.propTrackData.propTweens = []; + newTopTrack.propTrackData.styleIndex = 0; + newTopTrack.propTrackData.trackType = "position"; + this.arrPositionTracks.push(newTopTrack); + + // create 'left' track + var newLeftTrack = {}; + newLeftTrack.propTrackData = {}; + newLeftTrack.propTrackData.propTweens = []; + newLeftTrack.propTrackData.styleIndex = 1; + newLeftTrack.propTrackData.trackType = "position"; + this.arrPositionTracks.push(newLeftTrack); + + // create 'width' track + var newWidthTrack = {}; + newWidthTrack.propTrackData = {}; + newWidthTrack.propTrackData.propTweens = []; + newWidthTrack.propTrackData.styleIndex = 2; + newWidthTrack.propTrackData.trackType = "position"; + this.arrPositionTracks.push(newWidthTrack); + + // create 'height' track + var newHeightTrack = {}; + newHeightTrack.propTrackData = {}; + newHeightTrack.propTrackData.propTweens = []; + newHeightTrack.propTrackData.styleIndex = 3; + newHeightTrack.propTrackData.trackType = "position"; + this.arrPositionTracks.push(newHeightTrack); } }, @@ -831,6 +863,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newStyleTrack.propTrackData = {}; newStyleTrack.propTrackData.styleSelection = layerEvent.styleSelection; newStyleTrack.propTrackData.propTweens = []; + newStyleTrack.propTrackData.trackType = "style"; newStyleTrack.propTrackData.styleIndex = layerEvent.styleIndex; console.log(layerEvent.styleIndex); -- cgit v1.2.3