From 112ba5f5beea03010d40a53a64bfa9595e0faa88 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 9 Feb 2012 09:09:01 -0800 Subject: Cleaning up more code and adding more models for timeline Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 18 ++++++++++++++---- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 13 ++++++++----- js/panels/Timeline/Tween.reel/Tween.js | 10 +++++----- 3 files changed, 27 insertions(+), 14 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 6f0b0b58..3c4cfa2e 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -50,6 +50,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, + currentLayerSelected:{ + value: null + }, + + currentTrackSelected:{ + value: null + }, + millisecondsOffset:{ value:1000 }, @@ -291,7 +299,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleNewLayer:{ value:function (event) { // Add a new layer. It should be added above the currently selected layer, - // Or at the end, if no layer is selected. + // Or at the top, if no layer is selected. var hashIndex = 0 , hashVariable = 0, layerResult, trackResult, layerObject, trackObject, dLayer, parentNode; this._arrLayersNonEmpty = true; @@ -520,8 +528,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleElementAdded:{ value:function (event) { this.currentLayerSelected.element.push(event.detail); - //console.log(this.currentLayerSelected.layerPosition); - //console.log(this.arrTracks); } }, @@ -719,10 +725,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Next, update this.layerRepetition.selectedIndexes and this.currentLayerSelected. if (layerIndex !== false) { this.layerRepetition.selectedIndexes = [layerIndex]; - this.currentLayerSelected = this.arrLayers[layerIndex] + this.trackRepetition.selectedIndexes = [layerIndex]; + this.currentLayerSelected = this.arrLayers[layerIndex]; + this.currentTrackSelected = this.arrTracks[layerIndex]; } else { this.layerRepetition.selectedIndexes = null; + this.trackRepetition.selectedIndexes = null; this.currentLayerSelected = null; + this.currentTrackSelected = null; } } }, diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index f9d3ad6b..dde01a2c 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -173,7 +173,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.ninjaStylesContoller = this.application.ninja.stylesController; this.track_lane.addEventListener("click", this, false); this.keyFramePropertyData = new Array(); - //this.insertTween(0); } }, @@ -202,9 +201,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { if (this.application.ninja.timeline.arrLayers[this.trackID - 1].element.length == 1) { if (this.tweens.length < 1) { this.insertTween(0); - this.addAnimationRuleToElement(); + this.addAnimationRuleToElement(ev); + } else { + this.handleNewTween(ev); } - this.handleNewTween(ev); } else { alert("There must be exactly one element in an animated layer.") } @@ -266,12 +266,13 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { splitTween:{ value:function (ev) { - console.log("splitting tween at span offsetX: " + ev.offsetX); + alert("Splitting an existing span with a new keyframe is not yet supported.") + //console.log("splitting tween at span offsetX: " + ev.offsetX); } }, addAnimationRuleToElement:{ - value:function () { + value:function (tweenEvent) { var theElement = this.application.ninja.timeline.arrLayers[this.trackID - 1].element[0]; this.animatedElement = theElement; @@ -293,6 +294,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.currentKeyframeRule = this.ninjaStylesContoller.addRule(initRule); this.isAnimated = true; + + this.insertTween(tweenEvent.offsetX); } }, diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 64e998c3..eddf1b17 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -92,17 +92,17 @@ var Tween = exports.Tween = Montage.create(Component, { }, prepareForDraw:{ - value:function(){ + value:function () { this.keyframe.containingTrack = this.timelineTrack; + this.keyframe.position = this.spanWidth; + this.keyframe.timelinePosition = this.keyFramePosition; + this.keyframe.id = this.keyframeID; } }, draw:{ - value:function(){ + value:function () { this.span.spanWidth = this.spanWidth; - this.keyframe.position = this.spanWidth; - this.keyframe.timelinePosition = this.keyFramePosition; - this.keyframe.id = this.keyframeID; this.tweencontainer.style.left = this.spanPosition + "px"; } } -- cgit v1.2.3