aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/PropertyTrack.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/PropertyTrack.reel')
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js89
1 files changed, 79 insertions, 10 deletions
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
index 59bc14e4..0ad0f34e 100644
--- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
+++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
@@ -30,15 +30,8 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
30 30
31 didDraw:{ 31 didDraw:{
32 value:function () { 32 value:function () {
33 if ((!this.application.ninja.documentController.creatingNewFile) || (!this.application.ninja.currentDocument.setLevel)) { 33 if(this.currentKeyframeRule){
34 if (this.application.ninja.currentDocument.model.documentRoot.children[0]) { 34 this.retrieveStoredStyleTweens();
35 var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID);
36 if (selectedIndex !== false) {
37 if (!this.application.ninja.timeline.arrLayers[selectedIndex].layerData.created) {
38 this.retrieveStoredStyleTweens();
39 }
40 }
41 }
42 } 35 }
43 } 36 }
44 }, 37 },
@@ -178,6 +171,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
178 this.propTweens = this.propTrackData.propTweens; 171 this.propTweens = this.propTrackData.propTweens;
179 this.trackType = this.propTrackData.trackType; 172 this.trackType = this.propTrackData.trackType;
180 this.trackEditorProperty = this.propTrackData.trackEditorProperty; 173 this.trackEditorProperty = this.propTrackData.trackEditorProperty;
174 this.currentKeyframeRule = this.propTrackData.existingRule;
181 this.needsDraw = true; 175 this.needsDraw = true;
182 } 176 }
183 }, 177 },
@@ -315,7 +309,82 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
315 309
316 retrieveStoredStyleTweens:{ 310 retrieveStoredStyleTweens:{
317 value:function(){ 311 value:function(){
318 console.log("retrieve style tweens"); 312 console.log("retrieving style tweens");
313 console.log(this.currentKeyframeRule);
314
315
316 var percentValue, fraction, splitValue;
317 var currentMilliSec, currentMilliSecPerPixel, clickPosition, tempTiming, tempTimingFloat, trackTiming, i = 0;
318
319 if (this.animatedElement !== undefined) {
320
321 //this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name");
322
323 // build tweens for this tracks's keyframe rule
324 if (this.animationName) {
325
326
327
328 trackTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration");
329 this.nextKeyframe = 0;
330
331 this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument.model.views.design.document);
332
333 for (i = 0; this.currentKeyframeRule[i]; i++) {
334 var newTween = {};
335 newTween.tweenData = {};
336
337 var j, styleLength = this.currentKeyframeRule[i].style.length, keyframeStyles = [];
338
339 for (j = 0; j < styleLength; j++) {
340
341 // check for vendor prefixes and skip them for now
342 var firstChar = this.currentKeyframeRule[i].style[j].charAt(0);
343 if (firstChar === "-") {
344 break;
345 } else {
346 var currProp = this.currentKeyframeRule[i].style[j];
347 var propVal = this.currentKeyframeRule[i].style[currProp];
348 keyframeStyles.push([currProp, propVal]);
349 }
350 }
351
352 // recreate tween properties array for timeline tween
353 newTween.tweenData.tweenedProperties = [];
354 for (var k in keyframeStyles) {
355 newTween.tweenData.tweenedProperties[keyframeStyles[k][0]] = keyframeStyles[k][1];
356 }
357
358 if (this.currentKeyframeRule[i].keyText === "0%") {
359 newTween.tweenData.spanWidth = 0;
360 newTween.tweenData.keyFramePosition = 0;
361 newTween.tweenData.keyFrameMillisec = 0;
362 newTween.tweenData.tweenID = 0;
363 newTween.tweenData.spanPosition = 0;
364 this.tweens.push(newTween);
365 }
366 else {
367 tempTiming = trackTiming.split("s");
368 tempTimingFloat = parseFloat(tempTiming[0]);
369 this.trackDuration = tempTimingFloat * 1000;
370 percentValue = this.currentKeyframeRule[i].keyText;
371 splitValue = percentValue.split("%");
372 fraction = splitValue[0] / 100;
373 currentMilliSec = fraction * this.trackDuration;
374 currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
375 clickPosition = currentMilliSec / currentMilliSecPerPixel;
376 newTween.tweenData.spanWidth = clickPosition - this.tweens[this.tweens.length - 1].tweenData.keyFramePosition;
377 newTween.tweenData.keyFramePosition = clickPosition;
378 newTween.tweenData.keyFrameMillisec = currentMilliSec;
379 newTween.tweenData.tweenID = this.nextKeyframe;
380 newTween.tweenData.spanPosition = clickPosition - newTween.tweenData.spanWidth;
381 this.tweens.push(newTween);
382 }
383 this.nextKeyframe += 1;
384 }
385 this.isTrackAnimated = true;
386 }
387 }
319 } 388 }
320 }, 389 },
321 390