diff options
Diffstat (limited to 'js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js')
-rw-r--r-- | js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | 474 |
1 files changed, 474 insertions, 0 deletions
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index 175b77f9..66f39b5a 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | |||
@@ -15,7 +15,481 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
15 | 15 | ||
16 | prepareForDraw:{ | 16 | prepareForDraw:{ |
17 | value:function(){ | 17 | value:function(){ |
18 | this.element.addEventListener("click", this, false); | ||
19 | this.trackID = this.parentComponent.parentComponent.parentComponent.trackID; | ||
20 | this.animatedElement = this.parentComponent.parentComponent.parentComponent.animatedElement; | ||
21 | this.ninjaStylesContoller = this.application.ninja.stylesController; | ||
22 | } | ||
23 | }, | ||
24 | |||
25 | draw:{ | ||
26 | value:function(){ | ||
27 | |||
28 | } | ||
29 | }, | ||
30 | |||
31 | didDraw:{ | ||
32 | value:function () { | ||
33 | if(this.currentKeyframeRule){ | ||
34 | this.retrieveStoredStyleTweens(); | ||
35 | } | ||
36 | } | ||
37 | }, | ||
38 | |||
39 | trackEditorProperty:{ | ||
40 | value:"" | ||
41 | }, | ||
42 | |||
43 | animatedElement:{ | ||
44 | value:null | ||
45 | }, | ||
46 | |||
47 | isSubproperty:{ | ||
48 | value:true | ||
49 | }, | ||
50 | |||
51 | _propTweenRepetition:{ | ||
52 | value:null | ||
53 | }, | ||
54 | |||
55 | propTweenRepetition:{ | ||
56 | get:function () { | ||
57 | return this._propTweenRepetition; | ||
58 | }, | ||
59 | set:function (newVal) { | ||
60 | this._propTweenRepetition = newVal; | ||
61 | } | ||
62 | }, | ||
63 | |||
64 | _propTweens:{ | ||
65 | value:[] | ||
66 | }, | ||
67 | |||
68 | propTweens:{ | ||
69 | serializable:true, | ||
70 | get:function () { | ||
71 | return this._propTweens; | ||
72 | }, | ||
73 | set:function (newVal) { | ||
74 | this._propTweens = newVal; | ||
75 | } | ||
76 | }, | ||
77 | |||
78 | _propTrackData:{ | ||
79 | value:false | ||
80 | }, | ||
81 | |||
82 | propTrackData:{ | ||
83 | serializable:true, | ||
84 | get:function () { | ||
85 | return this._propTrackData; | ||
86 | }, | ||
87 | set:function (val) { | ||
88 | this._propTrackData = val; | ||
89 | if (this._propTrackData) { | ||
90 | this.setData(); | ||
91 | } | ||
92 | } | ||
93 | }, | ||
94 | |||
95 | nextKeyframe:{ | ||
96 | value:1 | ||
97 | }, | ||
98 | |||
99 | ninjaStylesContoller:{ | ||
100 | value:null | ||
101 | }, | ||
102 | |||
103 | animationName:{ | ||
104 | value:null | ||
105 | }, | ||
106 | |||
107 | currentKeyframeRule:{ | ||
108 | value:null | ||
109 | }, | ||
110 | |||
111 | trackDuration:{ | ||
112 | value:0 | ||
113 | }, | ||
114 | |||
115 | _trackID:{ | ||
116 | value:null | ||
117 | }, | ||
118 | |||
119 | trackID:{ | ||
120 | serializable:true, | ||
121 | get:function () { | ||
122 | return this._trackID; | ||
123 | }, | ||
124 | set:function (value) { | ||
125 | if (value !== this._trackID) { | ||
126 | this._trackID = value; | ||
127 | } | ||
128 | } | ||
129 | }, | ||
130 | |||
131 | _trackType:{ | ||
132 | value:null | ||
133 | }, | ||
134 | |||
135 | trackType:{ | ||
136 | serializable:true, | ||
137 | get:function () { | ||
138 | return this._trackType; | ||
139 | }, | ||
140 | set:function (value) { | ||
141 | if (value !== this._trackType) { | ||
142 | this._trackType = value; | ||
143 | } | ||
144 | } | ||
145 | }, | ||
146 | |||
147 | _styleIndex:{ | ||
148 | value:null | ||
149 | }, | ||
150 | |||
151 | styleIndex:{ | ||
152 | serializable:true, | ||
153 | get:function () { | ||
154 | return this._styleIndex; | ||
155 | }, | ||
156 | set:function (value) { | ||
157 | if (value !== this._styleIndex) { | ||
158 | this._styleIndex = value; | ||
159 | } | ||
160 | } | ||
161 | }, | ||
162 | |||
163 | setData:{ | ||
164 | value:function () { | ||
165 | if (typeof(this.propTrackData) === "undefined") { | ||
166 | return; | ||
167 | } | ||
168 | |||
169 | this.styleIndex = this.propTrackData.styleIndex; | ||
170 | this.propTweens = this.propTrackData.propTweens; | ||
171 | this.trackType = this.propTrackData.trackType; | ||
172 | this.trackEditorProperty = this.propTrackData.trackEditorProperty; | ||
173 | this.currentKeyframeRule = this.propTrackData.existingRule; | ||
174 | this.needsDraw = true; | ||
175 | } | ||
176 | }, | ||
177 | |||
178 | handleClick:{ | ||
179 | value:function (ev) { | ||
180 | if (ev.shiftKey) { | ||
181 | |||
182 | if (this.trackType == "position") { | ||
183 | this.parentComponent.parentComponent.parentComponent.parentComponent.handleNewTween(ev); | ||
184 | } | ||
185 | |||
186 | if (this.propTweens.length < 1) { | ||
187 | |||
188 | // check if there is an editor property assigned yet | ||
189 | // get this property track's editor prop name from layer data arrays | ||
190 | var selectIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID), | ||
191 | currentSelectedStyleIndex = this.getCurrentSelectedStyleIndex(selectIndex); | ||
192 | |||
193 | if (this.trackType == "style") { | ||
194 | //console.log("PropertyTrack.handleClick; selectIndex = ", selectIndex, "; styleIndex = ", currentSelectedStyleIndex) | ||
195 | if (this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty == null) { | ||
196 | console.log("Please enter a style property for this track before adding keyframes."); | ||
197 | return; | ||
198 | } else { | ||
199 | this.trackEditorProperty = this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty; | ||
200 | //console.log("Property track editorProperty set to: " + this.trackEditorProperty); | ||
201 | } | ||
202 | this.insertPropTween(0); | ||
203 | this.addPropAnimationRuleToElement(ev); | ||
204 | this.updatePropKeyframeRule(); | ||
205 | } else if (this.trackType == "position") { | ||
206 | //console.log("Property track editorProperty set to: " + this.trackEditorProperty); | ||
207 | } | ||
208 | } else { | ||
209 | this.handleNewPropTween(ev); | ||
210 | if (this.trackType == "style") { | ||
211 | this.updatePropKeyframeRule(); | ||
212 | } | ||
213 | } | ||
214 | } | ||
215 | } | ||
216 | }, | ||
217 | |||
218 | getCurrentSelectedStyleIndex: { | ||
219 | value: function(layerIndex) { | ||
220 | var returnVal = false, | ||
221 | i = 0, | ||
222 | arrLayerStylesLength = this.application.ninja.timeline.arrLayers[layerIndex].layerData.arrLayerStyles.length; | ||
223 | for (i = 0; i < arrLayerStylesLength; i++) { | ||
224 | var currItem = this.application.ninja.timeline.arrLayers[layerIndex].layerData.arrLayerStyles[i]; | ||
225 | if (currItem.isSelected === true) { | ||
226 | returnVal = i; | ||
227 | } | ||
228 | } | ||
229 | return returnVal; | ||
230 | } | ||
231 | }, | ||