diff options
author | Ananya Sen | 2012-07-23 17:01:14 -0700 |
---|---|---|
committer | Ananya Sen | 2012-07-23 17:01:14 -0700 |
commit | 48d9ed19573a07c68da305d14ca6ab3a04d31d64 (patch) | |
tree | b4bf6c48c7fdade2cf531d84cac3359489d38405 /js/panels/Timeline/Keyframe.reel | |
parent | c07a7a9d11bc8299fa9686544b18840cc8e640c2 (diff) | |
parent | afc7ad4f240fdf7890a79c2d4d7f8eb2e7c30a34 (diff) | |
download | ninja-48d9ed19573a07c68da305d14ca6ab3a04d31d64.tar.gz |
Merge branch 'refs/heads/Jose-Document' into Document
Diffstat (limited to 'js/panels/Timeline/Keyframe.reel')
-rw-r--r-- | js/panels/Timeline/Keyframe.reel/Keyframe.js | 104 |
1 files changed, 58 insertions, 46 deletions
diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.js b/js/panels/Timeline/Keyframe.reel/Keyframe.js index e261f926..3efd1584 100644 --- a/js/panels/Timeline/Keyframe.reel/Keyframe.js +++ b/js/panels/Timeline/Keyframe.reel/Keyframe.js | |||
@@ -34,6 +34,7 @@ var Component = require("montage/ui/component").Component; | |||
34 | 34 | ||
35 | var Keyframe = exports.Keyframe = Montage.create(Component, { | 35 | var Keyframe = exports.Keyframe = Montage.create(Component, { |
36 | 36 | ||
37 | // ==== Begin models | ||
37 | hasTemplate:{ | 38 | hasTemplate:{ |
38 | value: true | 39 | value: true |
39 | }, | 40 | }, |
@@ -67,7 +68,9 @@ var Keyframe = exports.Keyframe = Montage.create(Component, { | |||
67 | this.needsDraw = true; | 68 | this.needsDraw = true; |
68 | } | 69 | } |
69 | }, | 70 | }, |
71 | // ==== End Models | ||
70 | 72 | ||
73 | // ==== Begin Draw cycle methods | ||
71 | prepareForDraw:{ | 74 | prepareForDraw:{ |
72 | value:function(){ | 75 | value:function(){ |
73 | this.element.addEventListener("click", this, false); | 76 | this.element.addEventListener("click", this, false); |
@@ -91,73 +94,82 @@ var Keyframe = exports.Keyframe = Montage.create(Component, { | |||
91 | this.element.style.left = (this.position - 5) + "px"; | 94 | this.element.style.left = (this.position - 5) + "px"; |
92 | } | 95 | } |
93 | }, | 96 | }, |
97 | // ==== End Draw cycle methods | ||
94 | 98 | ||
95 | deselectKeyframe:{ | 99 | // ==== Begin Event handlers |
96 | value:function(){ | 100 | handleClick:{ |
97 | this.isSelected=false; | 101 | value:function(ev){ |
98 | this.element.style.left = (this.position - 5) + "px"; | 102 | this.selectKeyframe(); |
103 | ev.stopPropagation(); | ||
99 | } | 104 | } |
100 | }, | 105 | }, |
101 | 106 | ||
107 | handleMouseover: { | ||
108 | value: function(event) { | ||
109 | this.element.draggable = true; | ||
110 | } | ||
111 | }, | ||
112 | |||
113 | handleMouseout: { | ||
114 | value: function(event) { | ||
115 | this.element.draggable = false; | ||
116 | } | ||
117 | }, | ||
118 | |||
119 | handleDragstart: { | ||
120 | value: function(event) { | ||
121 | event.dataTransfer.setData('Text', 'Keyframe'); | ||
122 | var i = 0, | ||
123 | tweenRepetitionLength, | ||
124 | myTrack, | ||
125 | myIndex = null; | ||
126 | if (typeof(this.parentComponent.parentComponent.parentComponent.tweenRepetition) !== "undefined") { | ||
127 | myTrack = this.parentComponent.parentComponent.parentComponent; | ||
128 | } else { | ||
129 | myTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; | ||
130 | } | ||
131 | tweenRepetitionLength = myTrack.tweenRepetition.childComponents.length; | ||
132 | for (i = 0; i < tweenRepetitionLength; i++) { | ||
133 | if (myTrack.tweenRepetition.childComponents[i].uuid === this.parentComponent.uuid) { | ||
134 | myIndex = i; | ||
135 | } | ||
136 | } | ||
137 | myTrack.draggingIndex = myIndex; | ||
138 | this.selectKeyframe(); | ||
139 | } | ||
140 | }, | ||
141 | |||
142 | handleDragend: { | ||
143 | value: function(event) { | ||
144 | this.parentComponent.isDragging = false; | ||
145 | } | ||
146 | }, | ||
147 | // ==== End Event handlers | ||
148 | |||
149 | // === Begin Controllers | ||
102 | selectKeyframe:{ | 150 | selectKeyframe:{ |
103 | value:function(){ | 151 | value:function(){ |
104 | if(this.isSelected){ | 152 | if(this.isSelected){ |
105 | return; | 153 | return; |
106 | } | 154 | } |
107 | |||
108 | if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){ | 155 | if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){ |
109 | var tweenID = this.parentComponent.tweenID; | 156 | var tweenID = this.parentComponent.tweenID; |
110 | var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; | 157 | var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; |
111 | mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe(); | 158 | mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe(); |
112 | return; | 159 | return; |
113 | } | 160 | } |
114 | |||
115 | this.isSelected=true; | 161 | this.isSelected=true; |
116 | this.element.style.left = (this.position - 6) + "px"; | 162 | //this.element.style.left = (this.position - 6) + "px"; Moved to draw cycle. |
117 | this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty; | 163 | this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty; |
118 | this.parentComponent.selectTween(); | 164 | this.parentComponent.selectTween(); |
119 | } | 165 | } |
120 | }, | 166 | }, |
121 | 167 | ||
122 | handleClick:{ | 168 | deselectKeyframe:{ |
123 | value:function(ev){ | 169 | value:function () { |
124 | this.selectKeyframe(); | 170 | this.isSelected = false; |
125 | ev.stopPropagation(); | 171 | // this.element.style.left = (this.position - 5) + "px"; Moved to draw cycle |
126 | } | ||
127 | }, | ||
128 | |||
129 | handleMouseover: { | ||
130 | value: function(event) { | ||
131 | this.element.draggable = true; | ||
132 | } | ||
133 | }, | ||
134 | handleMouseout: { | ||
135 | value: function(event) { | ||
136 | this.element.draggable = false; | ||
137 | } | ||
138 | }, | ||
139 | handleDragstart: { | ||
140 | value: function(event) { | ||
141 | //this.parentComponent.parentComponent.dragLayerID = this.layerID; | ||
142 | event.dataTransfer.setData('Text', 'Keyframe'); | ||
143 | |||
144 | // Get my index in my track's tween array | ||
145 | var i = 0, | ||
146 | tweenRepetitionLength = this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents.length, | ||
147 | myIndex = null; | ||
148 | for (i = 0; i < tweenRepetitionLength; i++) { | ||
149 | if (this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents[i].uuid === this.parentComponent.uuid) { | ||
150 | myIndex = i; | ||
151 | } | ||
152 | } | ||
153 | this.parentComponent.parentComponent.parentComponent.draggingIndex = myIndex; | ||
154 | this.selectKeyframe(); | ||
155 | } | ||
156 | }, | ||
157 | handleDragend: { | ||
158 | value: function(event) { | ||
159 | this.parentComponent.isDragging = false; | ||
160 | } | 172 | } |
161 | } | 173 | } |
162 | 174 | // ==== End Controllers | |
163 | }); | 175 | }); |