diff options
author | Jose Antonio Marquez | 2012-07-18 11:43:15 -0700 |
---|---|---|
committer | Jose Antonio Marquez | 2012-07-18 11:43:15 -0700 |
commit | c491c29807d06395f2324adfe4b2f15a32398241 (patch) | |
tree | ece940eb694de3de92c33bc50085c1a7f8eefe84 /js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | |
parent | 8e5438556b35d624131e868f3c4e655d0e7a5f92 (diff) | |
parent | ecc2f1c6296ac5e706b1d6388254c8df24a01066 (diff) | |
download | ninja-c491c29807d06395f2324adfe4b2f15a32398241.tar.gz |
Merge branch 'refs/heads/Ninja-Master' into Document
Diffstat (limited to 'js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js')
-rw-r--r-- | js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | 384 |
1 files changed, 245 insertions, 139 deletions
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index a12128ff..35aa1dc5 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | |||
@@ -34,44 +34,12 @@ var Component = require("montage/ui/component").Component; | |||
34 | 34 | ||
35 | var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | 35 | var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { |
36 | 36 | ||
37 | |||
37 | hasTemplate:{ | 38 | hasTemplate:{ |
38 | value: true | 39 | value: true |
39 | }, | 40 | }, |
40 | 41 | ||
41 | prepareForDraw:{ | 42 | /* Begin: Models */ |
42 | value:function(){ | ||
43 | this.element.addEventListener("click", this, false); | ||
44 | this.trackID = this.parentComponent.parentComponent.parentComponent.parentComponent.trackID; | ||
45 | this.animatedElement = this.parentComponent.parentComponent.parentComponent.parentComponent.animatedElement; | ||
46 | this.ninjaStylesContoller = this.application.ninja.stylesController; | ||
47 | } | ||
48 | }, | ||
49 | |||
50 | draw:{ | ||
51 | value:function(){ | ||
52 | |||
53 | } | ||
54 | }, | ||
55 | |||
56 | didDraw:{ | ||
57 | value:function () { | ||
58 | if(this.currentKeyframeRule){ | ||
59 | this.retrieveStoredStyleTweens(); | ||
60 | } | ||
61 | } | ||
62 | }, | ||
63 | |||
64 | trackEditorProperty:{ | ||
65 | value:"" | ||
66 | }, | ||
67 | |||
68 | animatedElement:{ | ||
69 | value:null | ||
70 | }, | ||
71 | |||
72 | isSubproperty:{ | ||
73 | value:true | ||
74 | }, | ||
75 | 43 | ||
76 | _propTweenRepetition:{ | 44 | _propTweenRepetition:{ |
77 | value:null | 45 | value:null |
@@ -116,27 +84,6 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
116 | } | 84 | } |
117 | } | 85 | } |
118 | }, | 86 | }, |
119 | |||
120 | nextKeyframe:{ | ||
121 | value:1 | ||
122 | }, | ||
123 | |||
124 | ninjaStylesContoller:{ | ||
125 | value:null | ||
126 | }, | ||
127 | |||
128 | animationName:{ | ||
129 | value:null | ||
130 | }, | ||
131 | |||
132 | currentKeyframeRule:{ | ||
133 | value:null | ||
134 | }, | ||
135 | |||
136 | trackDuration:{ | ||
137 | value:0 | ||
138 | }, | ||
139 | |||
140 | _trackID:{ | 87 | _trackID:{ |
141 | value:null | 88 | value:null |
142 | }, | 89 | }, |
@@ -185,6 +132,42 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
185 | } | 132 | } |
186 | }, | 133 | }, |
187 | 134 | ||
135 | trackEditorProperty:{ | ||
136 | value:"" | ||
137 | }, | ||
138 | |||
139 | animatedElement:{ | ||
140 | value:null | ||
141 | }, | ||
142 | |||
143 | isSubproperty:{ | ||
144 | value:true | ||
145 | }, | ||
146 | |||
147 | nextKeyframe:{ | ||
148 | value:1 | ||
149 | }, | ||
150 | |||
151 | ninjaStylesContoller:{ | ||
152 | value:null | ||
153 | }, | ||
154 | |||
155 | animationName:{ | ||
156 | value:null | ||
157 | }, | ||
158 | |||
159 | currentKeyframeRule:{ | ||
160 | value:null | ||
161 | }, | ||
162 | |||
163 | trackDuration:{ | ||
164 | value:0 | ||
165 | }, | ||
166 | |||
167 | timelineTrack:{ | ||
168 | value:null | ||
169 | }, | ||
170 | |||
188 | setData:{ | 171 | setData:{ |
189 | value:function () { | 172 | value:function () { |
190 | if (typeof(this.propTrackData) === "undefined") { | 173 | if (typeof(this.propTrackData) === "undefined") { |
@@ -200,35 +183,72 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
200 | } | 183 | } |
201 | }, | 184 | }, |
202 | 185 | ||
186 | /* End: Models */ | ||
187 | |||
188 | /* Begin: Draw Cycle */ | ||
189 | prepareForDraw:{ | ||
190 | value:function(){ | ||
191 | this.element.addEventListener("click", this, false); | ||
192 | this.timelineTrack = this.parentComponent.parentComponent.parentComponent.parentComponent; | ||
193 | this.trackID = this.timelineTrack.trackID; | ||
194 | this.animatedElement = this.timelineTrack.animatedElement; | ||
195 | this.ninjaStylesContoller = this.application.ninja.stylesController; | ||
196 | this.eventManager.addEventListener("tlZoomSlider", this, false); | ||
197 | |||
198 | // Drag and Drop event handlers | ||
199 | this.element.addEventListener("dragstart", this.handleKeyframeDragstart.bind(this), false); | ||
200 | this.element.addEventListener("dragend", this.handleKeyframeDragstart.bind(this), false); | ||
201 | this.element.addEventListener("drop", this.handleKeyframeDragstart.bind(this), false); | ||
202 | } | ||
203 | }, | ||
204 | |||
205 | didDraw:{ | ||
206 | value:function () { | ||
207 | if(this.currentKeyframeRule){ | ||
208 | this.retrieveStoredStyleTweens(); | ||
209 | } | ||
210 | } | ||
211 | }, | ||
212 | |||
213 | /* End: Draw Cycle */ | ||
214 | |||
215 | /* Begin: Event Handlers */ | ||
216 | |||
217 | handleKeyframeDragstart: { | ||
218 | value: function(event) { | ||
219 | event.stopPropagation(); | ||
220 | return false; | ||
221 | } | ||
222 | }, | ||
223 | |||
203 | handleClick:{ | 224 | handleClick:{ |
204 | value:function (ev) { | 225 | value:function (ev) { |
226 | |||
227 | var selectIndex , | ||
228 | currentSelectedStyleIndex; | ||
229 | |||
205 | if (ev.shiftKey) { | 230 | if (ev.shiftKey) { |
206 | 231 | ||
207 | if (this.trackType == "position") { | 232 | if (this.trackType == "position") { |
208 | this.parentComponent.parentComponent.parentComponent.parentComponent.handleNewTween(ev); | 233 | this.timelineTrack.handleNewTween(ev); |
209 | } | 234 | } |
210 | 235 | ||
211 | if (this.propTweens.length < 1) { | 236 | if (this.propTweens.length < 1) { |
212 | 237 | ||
213 | // check if there is an editor property assigned yet | 238 | selectIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); |
214 | // get this property track's editor prop name from layer data arrays | 239 | currentSelectedStyleIndex = this.getCurrentSelectedStyleIndex(selectIndex); |
215 | var selectIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID), | ||
216 | currentSelectedStyleIndex = this.getCurrentSelectedStyleIndex(selectIndex); | ||
217 | 240 | ||
218 | if (this.trackType == "style") { | 241 | if (this.trackType == "style") { |
219 | //console.log("PropertyTrack.handleClick; selectIndex = ", selectIndex, "; styleIndex = ", currentSelectedStyleIndex) | ||
220 | if (this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty == null) { | 242 | if (this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty == null) { |
221 | console.log("Please enter a style property for this track before adding keyframes."); | 243 | console.log("Please enter a style property for this track before adding keyframes."); |
222 | return; | 244 | return; |
223 | } else { | 245 | } else { |
224 | this.trackEditorProperty = this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty; | 246 | this.trackEditorProperty = this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty; |
225 | //console.log("Property track editorProperty set to: " + this.trackEditorProperty); | ||
226 | } | 247 | } |
227 | this.insertPropTween(0); | 248 | this.insertPropTween(0); |
228 |