aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/Keyframe.reel/Keyframe.js
diff options
context:
space:
mode:
authorKruti Shah2012-02-08 09:45:29 -0800
committerKruti Shah2012-02-08 09:45:29 -0800
commit6787bda807ad3974b29cab77628cc5c3c1b06a9d (patch)
tree61d2439e2edb0dd9c84b5f32fe35e57707b87637 /js/panels/Timeline/Keyframe.reel/Keyframe.js
parent2cfa420f48735e2718cd0824d4e945c72158d0fa (diff)
parent91df2e8030db394060667202a97138db3f871fa5 (diff)
downloadninja-6787bda807ad3974b29cab77628cc5c3c1b06a9d.tar.gz
Merge branch 'refs/heads/Timeline' into Timeline_updated
Diffstat (limited to 'js/panels/Timeline/Keyframe.reel/Keyframe.js')
-rw-r--r--js/panels/Timeline/Keyframe.reel/Keyframe.js31
1 files changed, 18 insertions, 13 deletions
diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.js b/js/panels/Timeline/Keyframe.reel/Keyframe.js
index 1259fa63..b6623dcd 100644
--- a/js/panels/Timeline/Keyframe.reel/Keyframe.js
+++ b/js/panels/Timeline/Keyframe.reel/Keyframe.js
@@ -1,5 +1,6 @@
1var Montage = require("montage/core/core").Montage; 1var Montage = require("montage/core/core").Montage;
2var Component = require("montage/ui/component").Component; 2var Component = require("montage/ui/component").Component;
3var ElementsMediator = require("js/mediators/element-mediator").ElementMediator;
3 4
4var Keyframe = exports.Keyframe = Montage.create(Component, { 5var Keyframe = exports.Keyframe = Montage.create(Component, {
5 6
@@ -77,11 +78,16 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
77 } 78 }
78 }, 79 },
79 80
81 containingSpan:{
82 value: null
83 },
84
80 prepareForDraw:{ 85 prepareForDraw:{
81 value:function(){ 86 value:function(){
82 this.tweenkeyframe.addEventListener("click", this, false); 87 this.tweenkeyframe.addEventListener("click", this, false);
83 this.animatedProperties = new Array(); 88 this.animatedProperties = new Array();
84 89
90 // should element mediator be used here?
85 this.animatedProperties["top"] = this.containingTrack.animatedElement.offsetTop; 91 this.animatedProperties["top"] = this.containingTrack.animatedElement.offsetTop;
86 this.animatedProperties["left"] = this.containingTrack.animatedElement.offsetLeft; 92 this.animatedProperties["left"] = this.containingTrack.animatedElement.offsetLeft;
87 } 93 }
@@ -89,26 +95,25 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
89 95
90 draw:{ 96 draw:{
91 value:function(){ 97 value:function(){
92 this.tweenkeyframe.style.left = (this.position - 2) + "px"; 98 this.tweenkeyframe.style.left = (this.position - 3) + "px";
93 } 99 }
94 }, 100 },
95 101
96 handleElementChange:{ 102 handleElementChange:{
97 value:function (event) { 103 value:function (event) {
98 104
99 if(event.detail.source && event.detail.source !== "pi") { 105 if(event.detail.source && event.detail.source !== "keyframe") {
100 106
101 var items = this.application.ninja.selectedElements; 107 var items = this.application.ninja.selectedElements;
102 108 this.containingSpan.highlightSpan();
103 // update this keyframe's animated properties from the item[0] element props 109 if(items[0]._element.offsetTop != this.animatedProperties["top"] && items[0]._element.offsetLeft != this.animatedProperties["left"]){
104 this.animatedProperties["top"] = items[0]._element.offsetTop; 110 // update this keyframe's animated properties from the item[0] element props
105 this.animatedProperties["left"] = items[0]._element.offsetLeft; 111 this.animatedProperties["top"] = items[0]._element.offsetTop;
106 this.containingTrack.keyFramePropertyData[this.id] = this.animatedProperties; 112 this.animatedProperties["left"] = items[0]._element.offsetLeft;
107 113 this.containingTrack.keyFramePropertyData[this.id] = this.animatedProperties;
108 this.containingTrack.updateKeyframeRule(); 114 this.containingTrack.updateKeyframeRule();
115 }
109 } 116 }
110
111
112 } 117 }
113 }, 118 },
114 119
@@ -131,8 +136,8 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
131 var currentTop = this.animatedProperties["top"] + "px"; 136 var currentTop = this.animatedProperties["top"] + "px";
132 var currentLeft = this.animatedProperties["left"] + "px"; 137 var currentLeft = this.animatedProperties["left"] + "px";
133 138
134 this.containingTrack.ninjaStylesContoller.setElementStyle(this.containingTrack.animatedElement, "top", currentTop); 139 ElementsMediator.setProperty([this.containingTrack.animatedElement], "top", [currentTop], "Change", "keyframe");
135 this.containingTrack.ninjaStylesContoller.setElementStyle(this.containingTrack.animatedElement, "left", currentLeft); 140 ElementsMediator.setProperty([this.containingTrack.animatedElement], "left", [currentLeft], "Change", "keyframe");
136 141
137 // turn on element change event listener 142 // turn on element change event listener
138 this.eventManager.addEventListener("elementChange", this, false); 143 this.eventManager.addEventListener("elementChange", this, false);