aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--js/panels/Timeline/Keyframe.reel/Keyframe.js71
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js2709
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js10
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js.orig561
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js129
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js588
-rw-r--r--js/panels/Timeline/Tween.reel/Tween.js69
7 files changed, 2266 insertions, 1871 deletions
diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.js b/js/panels/Timeline/Keyframe.reel/Keyframe.js
index f7c936f7..45a2afd3 100644
--- a/js/panels/Timeline/Keyframe.reel/Keyframe.js
+++ b/js/panels/Timeline/Keyframe.reel/Keyframe.js
@@ -9,6 +9,7 @@ var Component = require("montage/ui/component").Component;
9 9
10var Keyframe = exports.Keyframe = Montage.create(Component, { 10var Keyframe = exports.Keyframe = Montage.create(Component, {
11 11
12 // ==== Begin models
12 hasTemplate:{ 13 hasTemplate:{
13 value: true 14 value: true
14 }, 15 },
@@ -42,7 +43,9 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
42 this.needsDraw = true; 43 this.needsDraw = true;
43 } 44 }
44 }, 45 },
46 // ==== End Models
45 47
48 // ==== Begin Draw cycle methods
46 prepareForDraw:{ 49 prepareForDraw:{
47 value:function(){ 50 value:function(){
48 this.element.addEventListener("click", this, false); 51 this.element.addEventListener("click", this, false);
@@ -66,57 +69,31 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
66 this.element.style.left = (this.position - 5) + "px"; 69 this.element.style.left = (this.position - 5) + "px";
67 } 70 }
68 }, 71 },
72 // ==== End Draw cycle methods
69 73
70 deselectKeyframe:{ 74 // ==== 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:{ 75 handleClick:{
98 value:function(ev){ 76 value:function(ev){
99 this.selectKeyframe(); 77 this.selectKeyframe();
100 ev.stopPropagation(); 78 ev.stopPropagation();
101 } 79 }
102 }, 80 },
103 81
104 handleMouseover: { 82 handleMouseover: {
105 value: function(event) { 83 value: function(event) {
106 this.element.draggable = true; 84 this.element.draggable = true;
107 } 85 }
108 }, 86 },
87
109 handleMouseout: { 88 handleMouseout: {
110 value: function(event) { 89 value: function(event) {
111 this.element.draggable = false; 90 this.element.draggable = false;
112 } 91 }
113 }, 92 },
93
114 handleDragstart: { 94 handleDragstart: {
115 value: function(event) { 95 value: function(event) {
116 //this.parentComponent.parentComponent.dragLayerID = this.layerID;
117 event.dataTransfer.setData('Text', 'Keyframe'); 96 event.dataTransfer.setData('Text', 'Keyframe');
118
119 // Get my index in my track's tween array
120 var i = 0, 97 var i = 0,
121 tweenRepetitionLength = this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents.length, 98 tweenRepetitionLength = this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents.length,
122 myIndex = null; 99 myIndex = null;
@@ -129,10 +106,38 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
129 this.selectKeyframe(); 106 this.selectKeyframe();
130 } 107 }
131 }, 108 },
109
132 handleDragend: { 110 handleDragend: {
133 value: function(event) { 111 value: function(event) {
134 this.parentComponent.isDragging = false; 112 this.parentComponent.isDragging = false;
135 } 113 }
136 } 114 },
137 115 // ==== End Event handlers
116
117 // === Begin Controllers
118 selectKeyframe:{
119 value:function(){
120 if(this.isSelected){
121 return;
122 }
123 if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){
124 var tweenID = this.parentComponent.tweenID;
125 var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent;
126 mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe();
127 return;
128 }
129 this.isSelected=true;
130 this.element.style.left = (this.position - 6) + "px";
131 this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty;
132 this.parentComponent.selectTween();
133 }
134 },
135
136 deselectKeyframe:{
137 value:function () {
138 this.isSelected = false;
139 this.element.style.left = (this.position - 5) + "px";
140 }
141 }
142 // ==== End Controllers
138}); 143});
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index 4dd9e88a..f7b66a39 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -1,1372 +1,1339 @@
1/* <copyright> 1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/> 2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> 3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */ 5 </copyright> */
6 6
7var Montage = require("montage/core/core").Montage; 7var Montage = require("montage/core/core").Montage;
8var Component = require("montage/ui/component").Component; 8var Component = require("montage/ui/component").Component;
9var Collapser = require("js/panels/Timeline/Collapser").Collapser; 9var Hintable = require("js/components/hintable.reel").Hintable;
10var Hintable = require("js/components/hintable.reel").Hintable; 10var nj = require("js/lib/NJUtils").NJUtils;
11var LayerStyle = require("js/panels/Timeline/Style.reel").LayerStyle; 11var ElementsMediator = require("js/mediators/element-mediator").ElementMediator;
12var DynamicText = require("montage/ui/dynamic-text.reel").DynamicText; 12
13var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager; 13var Layer = exports.Layer = Montage.create(Component, {
14var nj = require("js/lib/NJUtils").NJUtils; 14
15var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; 15 /* Begin: Models */
16 16
17var Layer = exports.Layer = Montage.create(Component, { 17 _dynamicLayerTag: {
18 18 value: null
19 dynamicLayerTag: { 19 },
20 value: null, 20 dynamicLayerTag: {
21 serializable: true 21 serializable: true,
22 }, 22 get: function() {
23 23 return this._dynamicLayerTag;
24 positionCollapser: { 24 },
25 value: null, 25 set: function(newVal) {
26 serializable: true 26 this._dynamicLayerTag = newVal;
27 }, 27 }
28 28 },
29 transformCollapser: { 29
30 value: null, 30 _positionCollapser: {
31 serializable: true 31 value: null
32 }, 32 },
33 33 positionCollapser: {
34 styleCollapser: { 34 serializable: true,
35 value: null, 35 get: function() {
36 serializable: true 36 return this._positionCollapser;
37 }, 37 },
38 38 set: function(newVal) {
39 clickerMain: { 39 this._positionCollapser = newVal;
40 value: null, 40 }
41 serializable: true 41 },
42 }, 42
43 43 _transformCollapser: {
44 myLabel: { 44 value: null
45 value: null, 45 },
46 serializable: true 46 transformCollapser: {