diff options
Diffstat (limited to 'js/panels/Timeline/Keyframe.reel/Keyframe.js')
-rw-r--r-- | js/panels/Timeline/Keyframe.reel/Keyframe.js | 103 |
1 files changed, 66 insertions, 37 deletions
diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.js b/js/panels/Timeline/Keyframe.reel/Keyframe.js index f7c936f7..a52150af 100644 --- a/js/panels/Timeline/Keyframe.reel/Keyframe.js +++ b/js/panels/Timeline/Keyframe.reel/Keyframe.js | |||
@@ -1,14 +1,39 @@ | |||
1 | /* <copyright> | 1 | /* <copyright> |
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | 2 | Copyright (c) 2012, Motorola Mobility, Inc |
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | 3 | All Rights Reserved. |
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | BSD License. |
5 | </copyright> */ | 5 | |
6 | Redistribution and use in source and binary forms, with or without | ||
7 | modification, are permitted provided that the following conditions are met: | ||
8 | |||
9 | - Redistributions of source code must retain the above copyright notice, | ||
10 | this list of conditions and the following disclaimer. | ||
11 | - Redistributions in binary form must reproduce the above copyright | ||
12 | notice, this list of conditions and the following disclaimer in the | ||
13 | documentation and/or other materials provided with the distribution. | ||
14 | - Neither the name of Motorola Mobility nor the names of its contributors | ||
15 | may be used to endorse or promote products derived from this software | ||
16 | without specific prior written permission. | ||
17 | |||
18 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | ||
19 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | ||
20 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | ||
21 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE | ||
22 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | ||
23 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | ||
24 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | ||
25 | INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN | ||
26 | CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) | ||
27 | ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE | ||
28 | POSSIBILITY OF SUCH DAMAGE. | ||
29 | </copyright> */ | ||
6 | 30 | ||
7 | var Montage = require("montage/core/core").Montage; | 31 | var Montage = require("montage/core/core").Montage; |
8 | var Component = require("montage/ui/component").Component; | 32 | var Component = require("montage/ui/component").Component; |
9 | 33 | ||
10 | var Keyframe = exports.Keyframe = Montage.create(Component, { | 34 | var Keyframe = exports.Keyframe = Montage.create(Component, { |
11 | 35 | ||
36 | // ==== Begin models | ||
12 | hasTemplate:{ | 37 | hasTemplate:{ |
13 | value: true | 38 | value: true |
14 | }, | 39 | }, |
@@ -42,7 +67,9 @@ var Keyframe = exports.Keyframe = Montage.create(Component, { | |||
42 | this.needsDraw = true; | 67 | this.needsDraw = true; |
43 | } | 68 | } |
44 | }, | 69 | }, |
70 | // ==== End Models | ||
45 | 71 | ||
72 | // ==== Begin Draw cycle methods | ||
46 | prepareForDraw:{ | 73 | prepareForDraw:{ |
47 | value:function(){ | 74 | value:function(){ |
48 | this.element.addEventListener("click", this, false); | 75 | this.element.addEventListener("click", this, false); |
@@ -66,57 +93,31 @@ var Keyframe = exports.Keyframe = Montage.create(Component, { | |||
66 | this.element.style.left = (this.position - 5) + "px"; | 93 | this.element.style.left = (this.position - 5) + "px"; |
67 | } | 94 | } |
68 | }, | 95 | }, |
96 | // ==== End Draw cycle methods | ||
69 | 97 | ||
70 | deselectKeyframe:{ | 98 | // ==== Begin Event handlers |
71 | value:function(){ | ||
72 | this.isSelected=false; | ||
73 | this.element.style.left = (this.position - 5) + "px"; | ||
74 | } | ||
75 | }, | ||
76 | |||
77 | selectKeyframe:{ | ||
78 | value:function(){ | ||
79 | if(this.isSelected){ | ||
80 | return; | ||
81 | } | ||
82 | |||
83 | if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){ | ||
84 | var tweenID = this.parentComponent.tweenID; | ||
85 | var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; | ||
86 | mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe(); | ||
87 | return; | ||
88 | } | ||
89 | |||
90 | this.isSelected=true; | ||
91 | this.element.style.left = (this.position - 6) + "px"; | ||
92 | this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty; | ||
93 | this.parentComponent.selectTween(); | ||
94 | } | ||
95 | }, | ||
96 | |||
97 | handleClick:{ | 99 | handleClick:{ |
98 | value:function(ev){ | 100 | value:function(ev){ |
99 | this.selectKeyframe(); | 101 | this.selectKeyframe(); |
100 | ev.stopPropagation(); | 102 | ev.stopPropagation(); |
101 | } | 103 | } |
102 | }, | 104 | }, |
103 | 105 | ||
104 | handleMouseover: { | 106 | handleMouseover: { |
105 | value: function(event) { | 107 | value: function(event) { |
106 | this.element.draggable = true; | 108 | this.element.draggable = true; |
107 | } | 109 | } |
108 | }, | 110 | }, |
111 | |||
109 | handleMouseout: { | 112 | handleMouseout: { |
110 | value: function(event) { | 113 | value: function(event) { |
111 | this.element.draggable = false; | 114 | this.element.draggable = false; |
112 | } | 115 | } |
113 | }, | 116 | }, |
117 | |||
114 | handleDragstart: { | 118 | handleDragstart: { |
115 | value: function(event) { | 119 | value: function(event) { |
116 | //this.parentComponent.parentComponent.dragLayerID = this.layerID; | ||
117 | event.dataTransfer.setData('Text', 'Keyframe'); | 120 | event.dataTransfer.setData('Text', 'Keyframe'); |
118 | |||
119 | // Get my index in my track's tween array | ||
120 | var i = 0, | 121 | var i = 0, |
121 | tweenRepetitionLength = this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents.length, | 122 | tweenRepetitionLength = this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents.length, |
122 | myIndex = null; | 123 | myIndex = null; |
@@ -129,10 +130,38 @@ var Keyframe = exports.Keyframe = Montage.create(Component, { | |||
129 | this.selectKeyframe(); | 130 | this.selectKeyframe(); |
130 | } | 131 | } |
131 | }, | 132 | }, |
133 | |||
132 | handleDragend: { | 134 | handleDragend: { |
133 | value: function(event) { | 135 | value: function(event) { |
134 | this.parentComponent.isDragging = false; | 136 | this.parentComponent.isDragging = false; |
135 | } | 137 | } |
136 | } | 138 | }, |
137 | 139 | // ==== End Event handlers | |
140 | |||
141 | // === Begin Controllers | ||
142 | selectKeyframe:{ | ||
143 | value:function(){ | ||
144 | if(this.isSelected){ | ||
145 | return; | ||
146 | } | ||
147 | if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){ | ||
148 | var tweenID = this.parentComponent.tweenID; | ||
149 | var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; | ||
150 | mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe(); | ||
151 | return; | ||
152 | } | ||
153 | this.isSelected=true; | ||
154 | this.element.style.left = (this.position - 6) + "px"; | ||
155 | this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty; | ||
156 | this.parentComponent.selectTween(); | ||
157 | } | ||
158 | }, | ||
159 | |||
160 | deselectKeyframe:{ | ||
161 | value:function () { | ||
162 | this.isSelected = false; | ||
163 | this.element.style.left = (this.position - 5) + "px"; | ||
164 | } | ||
165 | } | ||
166 | // ==== End Controllers | ||
138 | }); | 167 | }); |