diff options
author | Jonathan Duran | 2012-02-06 13:30:49 -0800 |
---|---|---|
committer | Jonathan Duran | 2012-02-06 13:30:49 -0800 |
commit | a39bad832722a10f6556f91e94c3301a41f59bd5 (patch) | |
tree | e436e919f9f67c56e8bce462aab95ff3804813cc /js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |
parent | 671a27069db6a121507c2b342653aede685cff67 (diff) | |
download | ninja-a39bad832722a10f6556f91e94c3301a41f59bd5.tar.gz |
merge new timeline
Signed-off-by: Jonathan Duran <jduran@motorola.com>
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js')
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 414 |
1 files changed, 414 insertions, 0 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js new file mode 100644 index 00000000..13529115 --- /dev/null +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |||
@@ -0,0 +1,414 @@ | |||
1 | var Montage = require("montage/core/core").Montage; | ||
2 | var Component = require("montage/ui/component").Component; | ||
3 | var Collapser = require("js/panels/Timeline/Collapser").Collapser; | ||
4 | var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager; | ||
5 | |||
6 | var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | ||
7 | |||
8 | hasTemplate:{ | ||
9 | value: true | ||
10 | }, | ||
11 | |||
12 | _trackID:{ | ||
13 | value:null, | ||
14 | writable:true, | ||
15 | serializable:true, | ||
16 | enumerable:true | ||
17 | }, | ||
18 | |||
19 | trackID:{ | ||
20 | serializable:true, | ||
21 | get:function(){ | ||
22 | return this._trackID; | ||
23 | }, | ||
24 | set:function(value){ | ||
25 | this._trackID = value; | ||
26 | this.needsDraw = true; | ||
27 | } | ||
28 | }, | ||
29 | |||
30 | // Are the various collapsers collapsed or not | ||
31 | _isMainCollapsed : { | ||
32 | value: "" | ||
33 | }, | ||
34 | isMainCollapsed : { | ||
35 | get: function() { | ||
36 | return this._isMainCollapsed; | ||
37 | }, | ||
38 | set: function(newVal) { | ||
39 | if (newVal !== this._isMainCollapsed) { | ||
40 | this._isMainCollapsed = newVal; | ||
41 | this.needsDraw = true; | ||
42 | } | ||
43 | |||
44 | } | ||
45 | }, | ||
46 | _isTransformCollapsed : { | ||
47 | value: true | ||
48 | }, | ||
49 | isTransformCollapsed : { | ||
50 | get: function() { | ||
51 | return this._isTransformCollapsed; | ||
52 | }, | ||
53 | set: function(newVal) { | ||
54 | if (newVal !== this._isTransformCollapsed) { | ||
55 | this._isTransformCollapsed = newVal; | ||
56 | this.needsDraw = true; | ||
57 | } | ||
58 | } | ||
59 | }, | ||
60 | _isPositionCollapsed : { | ||
61 | value: true | ||
62 | }, | ||
63 | isPositionCollapsed : { | ||
64 | get: function() { | ||
65 | return this._isPositionCollapsed; | ||
66 | }, | ||
67 | set: function(newVal) { | ||
68 | if (newVal !== this._isPositionCollapsed) { | ||
69 | this._isPositionCollapsed = newVal; | ||
70 | this.needsDraw = true; | ||
71 | } | ||
72 | } | ||
73 | }, | ||
74 | _isStyleCollapsed : { | ||
75 | value: true | ||
76 | }, | ||
77 | isStyleCollapsed : { | ||
78 | get: function() { | ||
79 | return this._isStyleCollapsed; | ||
80 | }, | ||
81 | set: function(newVal) { | ||
82 | if (newVal !== this._isStyleCollapsed) { | ||
83 | this._isStyleCollapsed = newVal; | ||
84 | this.needsDraw = true; | ||
85 | } | ||
86 | } | ||
87 | }, | ||
88 | |||
89 | _tweens:{ | ||
90 | serializable: true, | ||
91 | enumerable: true, | ||
92 | value: [] | ||
93 | }, | ||
94 | |||
95 | tweens:{ | ||
96 | serializable: true, | ||
97 | enumerable: true, | ||
98 | get:function () { | ||
99 | return this._spans; | ||
100 | }, | ||
101 | set:function (newVal) { | ||
102 | this._spans = newVal; | ||
103 | } | ||
104 | }, | ||
105 | |||
106 | _tweenRepetition:{ | ||
107 | serializable:true, | ||
108 | value:null | ||
109 | }, | ||
110 | |||
111 | tweenRepetition:{ | ||
112 | serializable:true, | ||
113 | get:function () { | ||
114 | return this._spanRepetition; | ||
115 | }, | ||
116 | set:function (newVal) { | ||
117 | this._spanRepetition = newVal; | ||
118 | } | ||
119 | }, | ||
120 | |||
121 | trackDuration:{ | ||
122 | value:0 | ||
123 | }, | ||
124 | |||
125 | currentKeyframeRule:{ | ||
126 | value:null | ||
127 | }, | ||
128 | |||
129 | nextKeyframe:{ | ||
130 | value:1 | ||
131 | }, | ||
132 | |||
133 | currentMillisecClicked:{ | ||
134 | value: 0 | ||
135 | }, | ||
136 | |||
137 | isAnimated:{ | ||
138 | value:false | ||
139 | }, | ||
140 | |||
141 | animatedElement:{ | ||
142 | value:null | ||
143 | }, | ||
144 | |||
145 | animationName:{ | ||
146 | value:null | ||
147 | }, | ||
148 | |||
149 | keyFramePropertyData:{ | ||
150 | value:[] | ||
151 | }, | ||
152 | |||
153 | ninjaStylesContoller:{ | ||
154 | value: null | ||
155 | }, | ||
156 | |||
157 | _positionCollapser : { | ||
158 | value: null | ||
159 | }, | ||
160 | _mainCollapser: { | ||
161 | value: null | ||
162 | }, | ||
163 | _transformCollapser: { | ||
164 | value: null | ||
165 | }, | ||
166 | _styleCollapser: { | ||
167 | value: null | ||
168 | }, | ||
169 | |||
170 | prepareForDraw: { | ||
171 | value: function() { | ||
172 | this.init(); | ||
173 | this.ninjaStylesContoller = this.application.ninja.stylesController; | ||
174 | this.track_lane.addEventListener("click", this, false); | ||
175 | this.keyFramePropertyData = new Array(); | ||
176 | //this.insertTween(0); | ||
177 | } | ||
178 | }, | ||
179 | |||
180 | draw: { | ||
181 | value: function() { | ||
182 | if (this._mainCollapser.isCollapsed !== this.isMainCollapsed) { | ||
183 | this._mainCollapser.toggle(false); | ||
184 | } | ||
185 | if (this._positionCollapser.isCollapsed !== this.isPositionCollapsed) { | ||
186 | this._positionCollapser.toggle(false); | ||
187 | } | ||
188 | if (this._transformCollapser.isCollapsed !== this.isTransformCollapsed) { | ||
189 | this._transformCollapser.toggle(false); | ||
190 | } | ||
191 | if (this._styleCollapser.isCollapsed !== this.isStyleCollapsed) { | ||
192 | this._styleCollapser.toggle(false); | ||
193 | } | ||
194 | } | ||
195 | }, | ||
196 | |||
197 | handleClick:{ | ||
198 | value:function (ev) { | ||
199 | // TEMP - if the SHIFT key is down, add a new keyframe or split an existing span | ||
200 | // This needs to move to a keyboard shortcut that is TBD | ||
201 | if (ev.shiftKey) { | ||
202 | if (this.tweens.length < 1) { | ||
203 | this.addAnimationRuleToElement(); | ||
204 | this.insertTween(0); | ||
205 | } | ||
206 | this.handleNewTween(ev); | ||
207 | } | ||
208 | } | ||
209 | }, | ||
210 | |||
211 | handleNewTween:{ | ||
212 | value: function(ev){ | ||
213 | if(ev.offsetX > this.tweens[this.tweens.length-1].keyFramePosition){ | ||
214 | this.insertTween(ev.offsetX); | ||
215 | } else { | ||
216 | this.splitTween(ev); | ||
217 | } | ||
218 | } | ||
219 | }, |