diff options
Diffstat (limited to 'js/panels/Timeline/Tween.reel')
-rw-r--r-- | js/panels/Timeline/Tween.reel/Tween.js | 34 |
1 files changed, 11 insertions, 23 deletions
diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 33fed17a..de6a8d56 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js | |||
@@ -147,7 +147,6 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
147 | 147 | ||
148 | }, | 148 | }, |
149 | 149 | ||
150 | |||
151 | draw:{ | 150 | draw:{ |
152 | value:function () { | 151 | value:function () { |
153 | this.element.style.left = this.spanPosition + "px"; | 152 | this.element.style.left = this.spanPosition + "px"; |
@@ -186,20 +185,14 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
186 | if (this.application.ninja.selectedElements[0] != this.parentComponent.parentComponent.animatedElement) { | 185 | if (this.application.ninja.selectedElements[0] != this.parentComponent.parentComponent.animatedElement) { |
187 | console.log("Wrong element selected for this keyframe track"); | 186 | console.log("Wrong element selected for this keyframe track"); |
188 | } else { | 187 | } else { |
189 | if (useAbsolute) { | 188 | this.setTweenProperties(event.detail); |
190 | this.setAbsoluteTweenProperties(event.detail); | ||
191 | } else { | ||
192 | this.setRelativeTweenProperties(event.detail); | ||
193 | } | ||
194 | } | 189 | } |
195 | } | 190 | } |
196 | |||
197 | |||
198 | } | 191 | } |
199 | } | 192 | } |
200 | }, | 193 | }, |
201 | 194 | ||
202 | setAbsoluteTweenProperties:{ | 195 | setTweenProperties:{ |
203 | value:function (eventDetail) { | 196 | value:function (eventDetail) { |
204 | if(this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"]){ | 197 | if(this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"]){ |
205 | this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; | 198 | this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; |
@@ -215,24 +208,14 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
215 | } | 208 | } |
216 | // tell track to update css rule | 209 | // tell track to update css rule |
217 | this.parentComponent.parentComponent.updateKeyframeRule(); | 210 | this.parentComponent.parentComponent.updateKeyframeRule(); |
218 | |||
219 | // highlight the tween's span | ||
220 | this.tweenspan.highlightSpan(); | ||
221 | this.isTweenAnimated = true; | 211 | this.isTweenAnimated = true; |
222 | } | 212 | } |
223 | }, | 213 | }, |
224 | 214 | ||
225 | setRelativeTweenProperties:{ | ||
226 | value:function(eventDetail){ | ||
227 | //console.log(eventDetail); | ||
228 | } | ||
229 | }, | ||
230 | |||
231 | setStyleTweenProperty:{ | 215 | setStyleTweenProperty:{ |
232 | value:function (eventDetail) { | 216 | value:function (eventDetail) { |
233 | //console.log("Setting style tween properties for: " + this.parentComponent.parentComponent.trackEditorProperty); | 217 | //console.log("Setting style tween properties for: " + this.parentComponent.parentComponent.trackEditorProperty); |
234 | //console.log(eventDetail); | 218 | //console.log(eventDetail); |
235 | |||
236 | if(eventDetail.type == "setProperties"){ | 219 | if(eventDetail.type == "setProperties"){ |
237 | // need to ignore top, left, width, and height | 220 | // need to ignore top, left, width, and height |
238 | //console.log(eventDetail.data.value[0]); | 221 | //console.log(eventDetail.data.value[0]); |
@@ -256,6 +239,14 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
256 | } | 239 | } |
257 | }, | 240 | }, |
258 | 241 | ||
242 | setKeyframeEase:{ | ||
243 | value:function(easeType){ | ||
244 | // easeTypes - ease, ease-out, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) | ||
245 | this.tweenedProperties["-webkit-animation-timing-function"] = easeType; | ||
246 | this.parentComponent.parentComponent.updatePropKeyframeRule(); | ||
247 | } | ||
248 | }, | ||
249 | |||
259 | selectTween:{ | 250 | selectTween:{ |
260 | value: function(){ | 251 | value: function(){ |
261 | // turn on event listener for element change | 252 | // turn on event listener for element change |
@@ -280,7 +271,7 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
280 | // set property specific style on element | 271 | // set property specific style on element |
281 | var currentValue = this.tweenedProperties[this.parentComponent.parentComponent.trackEditorProperty]; | 272 | var currentValue = this.tweenedProperties[this.parentComponent.parentComponent.trackEditorProperty]; |
282 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], this.parentComponent.parentComponent.trackEditorProperty, [currentValue], "Change", "tween"); | 273 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], this.parentComponent.parentComponent.trackEditorProperty, [currentValue], "Change", "tween"); |
283 | //console.log(currentValue); | 274 | console.log(currentValue); |
284 | } else { | 275 | } else { |
285 | // move animated element to correct position on stage | 276 | // move animated element to correct position on stage |
286 | var currentTop = this.tweenedProperties["top"] + "px"; | 277 | var currentTop = this.tweenedProperties["top"] + "px"; |
@@ -292,7 +283,6 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
292 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); | 283 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); |
293 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "width", [currentWidth], "Change", "tween"); | 284 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "width", [currentWidth], "Change", "tween"); |
294 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "height", [currentHeight], "Change", "tween"); | 285 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "height", [currentHeight], "Change", "tween"); |
295 | |||
296 | } | 286 | } |
297 | } | 287 | } |
298 | }, | 288 | }, |
@@ -301,10 +291,8 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
301 | value:function(){ | 291 | value:function(){ |
302 | // turn off event listener for element change | 292 | // turn off event listener for element change |
303 | this.eventManager.removeEventListener("elementChange", this, false); | 293 | this.eventManager.removeEventListener("elementChange", this, false); |
304 | |||
305 | // deselect the keyframe for this tween | 294 | // deselect the keyframe for this tween |
306 | this.keyframe.deselectKeyframe(); | 295 | this.keyframe.deselectKeyframe(); |
307 | } | 296 | } |
308 | } | 297 | } |
309 | |||
310 | }); | 298 | }); |