From 8a3fb9c3f9b3497884ec7e898924b13dad1d685a Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 19 Jun 2012 11:37:06 -0700 Subject: Fix position tracks collapser to use unique element Signed-off-by: Jonathan Duran --- .../Timeline/TimelineTrack.reel/TimelineTrack.html | 23 ++++++++++-------- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 27 ++++++++++++++++++---- 2 files changed, 36 insertions(+), 14 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 502c455b..79014ae6 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html @@ -17,6 +17,8 @@ "tweenRepetition" : {"@" : "tweenRepetition"}, "track_lanes" : {"#" : "track_lanes"}, "tween": {"@" : "tween"}, + "positionTracksRepetition" : {"@" : "positionTracksRepetition"}, + "positionPropertyTrack" : {"@" : "positionPropertyTrack"}, "mainCollapser" : {"@" : "mainCollapser"}, "positionCollapser" : {"@" : "positionCollapser"}, "styleCollapser" : {"@" : "styleCollapser"} @@ -81,7 +83,7 @@ "positionTracksRepetition": { "prototype": "montage/ui/repetition.reel", "properties": { - "element": {"#": "content-position-tracks"}, + "element": {"#": "content_position_tracks"}, "isSelectionEnabled" : false }, "bindings": { @@ -95,7 +97,7 @@ "positionPropertyTrack" : { "prototype" : "js/panels/Timeline/PropertyTrack.reel", "properties" : { - "element":{"#": "position-track-base"} + "element":{"#": "position_track_base"} }, "bindings" : { "propTrackData" : { @@ -134,8 +136,8 @@ "positionCollapser" : { "prototype" : "js/panels/timeline/Collapser", "properties" : { - "element" : {"#" : "content-position-tracks"}, - "myContent" : {"#":"content-position-tracks"}, + "element" : {"#" : "content_position_collapser"}, + "myContent" : {"#":"content_position_collapser"}, "contentHeight" : 40, "isLabelClickable" : false, "clicker" : {"#" : "label-position"}, @@ -194,11 +196,14 @@
- -
-
-
-
+ +
+
+
+
+
+
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 84bac2cb..26ccfe09 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -41,6 +41,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this._tween = newVal; } }, + + positionPropertyTrack:{ + value:null + }, _isFirstDraw: { value: true @@ -171,9 +175,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { }, set: function(newVal) { this._arrPositionTracks = newVal; - if (typeof(this.trackData) === "undefined") { - //this.createTrackData(); - } this.trackData.arrPositionTracks = newVal; } @@ -189,8 +190,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this._positionTracksRepetition = newVal; } }, - - + + /* Transform Property Tracks */ _arrTransformTracks : { value: [] @@ -470,6 +471,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.bypassAnimation = this.trackData.bypassAnimation; this.trackID = this.trackData.layerID; this.tweens = this.trackData.tweens; + this.arrPositionTracks = this.trackData.arrPositionTracks; this.animatedElement = this.trackData.animatedElement; this.arrStyleTracks = this.trackData.arrStyleTracks; this.isTrackAnimated = this.trackData.isTrackAnimated; @@ -486,6 +488,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.needsDraw = true; } }, + createTrackData: { value: function() { tempData = {}; @@ -494,6 +497,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { tempData.tweens = this.tweens; tempData.animatedElement = this.animatedElement; tempData.arrStyleTracks = this.arrStyleTracks; + tempData.arrPositionTracks = this.arrPositionTracks; tempData.isTrackAnimated = this.isTrackAnimated; tempData.trackDuration = this.trackDuration; tempData.animationName = this.animationName; @@ -785,10 +789,23 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.nextKeyframe += 1; } + this.createMatchingPositionSizeTweens(clickPos); + this.application.ninja.currentDocument.model.needsSave = true; } }, + createMatchingPositionSizeTweens:{ + value:function (position) { + console.log(this.positionTracksRepetition); + var i; + var posTracks = this.positionTracksRepetition.length; + for (i = 0; i < posTracks; i++) { + + } + } + }, + splitTween:{ value:function (ev) { var clickPos = ev.target.parentElement.offsetLeft + ev.offsetX, -- cgit v1.2.3 From a065caf8793cafe5508bffe572ba95e0017840b8 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 19 Jun 2012 12:44:58 -0700 Subject: Lock Position and Size keyframes to main track keyframes Signed-off-by: Jonathan Duran --- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 20 ++++++++++++-------- 1 file changed, 12 insertions(+), 8 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 26ccfe09..1a8b6f4e 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -763,12 +763,16 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData.keyFrameMillisec = 0; newTween.tweenData.tweenID = 0; newTween.tweenData.spanPosition = 0; + newTween.tweenData.easing = "none"; newTween.tweenData.tweenedProperties = []; newTween.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; newTween.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; newTween.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px"; newTween.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px"; this.tweens.push(newTween); + + this.createMatchingPositionSizeTween(newTween); + } else { newTween.tweenData.spanWidth = clickPos - this.tweens[this.tweens.length - 1].tweenData.keyFramePosition; newTween.tweenData.keyFramePosition = clickPos; @@ -787,21 +791,22 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { var animationDuration = (this.trackDuration / 1000) + "s"; this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); this.nextKeyframe += 1; + + this.createMatchingPositionSizeTween(newTween); } - this.createMatchingPositionSizeTweens(clickPos); + this.application.ninja.currentDocument.model.needsSave = true; } }, - createMatchingPositionSizeTweens:{ - value:function (position) { - console.log(this.positionTracksRepetition); + createMatchingPositionSizeTween:{ + value:function (newTween) { var i; - var posTracks = this.positionTracksRepetition.length; + var posTracks = this.positionTracksRepetition.childComponents.length; for (i = 0; i < posTracks; i++) { - + this.positionTracksRepetition.childComponents[i].propTweens.push(newTween); } } }, @@ -812,8 +817,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { i, tweensLength = this.tweens.length-1, prevTween, nextTween, splitTweenIndex; - - consol.log(ev.target.className) + for(i=0; i