aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r--js/panels/Timeline/Collapser.js2
-rw-r--r--js/panels/Timeline/Keyframe.reel/Keyframe.html7
-rw-r--r--js/panels/Timeline/Keyframe.reel/Keyframe.js43
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.html160
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js221
-rw-r--r--js/panels/Timeline/Layer.reel/css/Layer.css33
-rw-r--r--js/panels/Timeline/Layer.reel/scss/Layer.scss3
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/PropertyTrack.html45
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js290
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/css/PropertyTrack.css9
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/scss/.sass-cache/a26ed2cbe268f8c721d1b1d8dfa075c8c5b47e72/PropertyTrack.scsscbin0 -> 5151 bytes
-rw-r--r--js/panels/Timeline/PropertyTrack.reel/scss/PropertyTrack.scss6
-rw-r--r--js/panels/Timeline/Span.reel/Span.html7
-rw-r--r--js/panels/Timeline/Style.reel/Style.html26
-rw-r--r--js/panels/Timeline/Style.reel/Style.js6
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html90
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js396
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css2
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss2
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html114
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js350
-rw-r--r--js/panels/Timeline/Track.reel/Track.html17
-rw-r--r--js/panels/Timeline/Track.reel/Track.js12
-rw-r--r--js/panels/Timeline/TrackSpacer.reel/TrackSpacer.html9
-rw-r--r--js/panels/Timeline/Tween.reel/Tween.html17
-rw-r--r--js/panels/Timeline/Tween.reel/Tween.js102
26 files changed, 1270 insertions, 699 deletions
diff --git a/js/panels/Timeline/Collapser.js b/js/panels/Timeline/Collapser.js
index 88314c8b..9c8d4434 100644
--- a/js/panels/Timeline/Collapser.js
+++ b/js/panels/Timeline/Collapser.js
@@ -151,7 +151,6 @@ var Montage = require("montage/core/core").Montage,
151 151
152 // isToggling: Bindable property. Set this (to anything) to trigger a toggle. 152 // isToggling: Bindable property. Set this (to anything) to trigger a toggle.
153 _isToggling: { 153 _isToggling: {
154 serializable: true,
155 value: true 154 value: true
156 }, 155 },
157 isToggling: { 156 isToggling: {
@@ -179,7 +178,6 @@ var Montage = require("montage/core/core").Montage,
179 178
180 prepareForDraw: { 179 prepareForDraw: {
181 value: function() { 180 value: function() {
182
183 // Get the original value of the overflow property: 181 // Get the original value of the overflow property:
184 this._origOverflowValue = window.getComputedStyle(this.myContent, null).getPropertyValue("overflow"); 182 this._origOverflowValue = window.getComputedStyle(this.myContent, null).getPropertyValue("overflow");
185 if (this.isCollapsed === false) { 183 if (this.isCollapsed === false) {
diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.html b/js/panels/Timeline/Keyframe.reel/Keyframe.html
index 7e917b5a..4b029874 100644
--- a/js/panels/Timeline/Keyframe.reel/Keyframe.html
+++ b/js/panels/Timeline/Keyframe.reel/Keyframe.html
@@ -1,4 +1,4 @@
1<!DOCTYPE html> 1<!DOCTYPE html>
2<!-- <copyright> 2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/> 3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> 4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
@@ -11,8 +11,7 @@
11 <script type="text/montage-serialization"> 11 <script type="text/montage-serialization">
12 { 12 {
13 "owner": { 13 "owner": {
14 "module": "js/panels/Timeline/Keyframe.reel", 14 "prototype": "js/panels/Timeline/Keyframe.reel",
15 "name": "Keyframe",
16 "properties": { 15 "properties": {
17 "element": {"#": "keyframespace"} 16 "element": {"#": "keyframespace"}
18 } 17 }
@@ -23,7 +22,7 @@
23 </head> 22 </head>
24 <body> 23 <body>
25 24
26 <div id="keyframespace" class="tween_keyframe"> 25 <div data-montage-id="keyframespace" class="tween_keyframe">
27 </div> 26 </div>
28 27
29 </body> 28 </body>
diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.js b/js/panels/Timeline/Keyframe.reel/Keyframe.js
index 859cdfb1..a4f957cf 100644
--- a/js/panels/Timeline/Keyframe.reel/Keyframe.js
+++ b/js/panels/Timeline/Keyframe.reel/Keyframe.js
@@ -31,6 +31,12 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
31 prepareForDraw:{ 31 prepareForDraw:{
32 value:function(){ 32 value:function(){
33 this.element.addEventListener("click", this, false); 33 this.element.addEventListener("click", this, false);
34
35 // Drag and drop event handlers
36 this.element.addEventListener("mouseover", this.handleMouseover.bind(this), false);
37 this.element.addEventListener("mouseout", this.handleMouseout.bind(this), false);
38 this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false);
39 this.element.addEventListener("dragend", this.handleDragend.bind(this), false);
34 } 40 }
35 }, 41 },
36 42
@@ -56,6 +62,41 @@ var Keyframe = exports.Keyframe = Montage.create(Component, {
56 handleClick:{ 62 handleClick:{
57 value:function(ev){ 63 value:function(ev){
58 this.selectKeyframe(); 64 this.selectKeyframe();
65 ev.stopPropagation();
59 } 66 }
60 } 67 },
68
69 handleMouseover: {
70 value: function(event) {
71 this.element.draggable = true;
72 }
73 },
74 handleMouseout: {
75 value: function(event) {
76 this.element.draggable = false;
77 }
78 },
79 handleDragstart: {
80 value: function(event) {
81 //this.parentComponent.parentComponent.dragLayerID = this.layerID;
82 event.dataTransfer.setData('Text', 'Keyframe');
83
84 // Get my index in my track's tween array
85 var i = 0,
86 tweenRepetitionLength = this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents.length,
87 myIndex = null;
88 for (i = 0; i < tweenRepetitionLength; i++) {
89 if (this.parentComponent.parentComponent.parentComponent.tweenRepetition.childComponents[i].uuid === this.parentComponent.uuid) {
90 myIndex = i;
91 }
92 }
93 this.parentComponent.parentComponent.parentComponent.draggingIndex = myIndex;
94 }
95 },
96 handleDragend: {
97 value: function(event) {
98 this.parentComponent.isDragging = false;
99 }
100 }
101
61}); 102});
diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html
index 915e8b89..c7e7b575 100644
--- a/js/panels/Timeline/Layer.reel/Layer.html
+++ b/js/panels/Timeline/Layer.reel/Layer.html
@@ -1,4 +1,4 @@
1<!DOCTYPE html> 1<!DOCTYPE html>
2<!-- <copyright> 2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/> 3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> 4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
@@ -11,26 +11,21 @@
11 <script type="text/montage-serialization"> 11 <script type="text/montage-serialization">
12 { 12 {
13 "owner": { 13 "owner": {
14 "module": "js/panels/Timeline/Layer.reel", 14 "prototype": "js/panels/Timeline/Layer.reel",
15 "name": "Layer",
16 "properties": { 15 "properties": {
17 "element": {"#": "layer"}, 16 "element": {"#": "layer"},
18 "styleRepetition" : {"@":"repetition1"}, 17 "styleRepetition" : {"@":"repetition1"},
19 "dynamicLayerName" : {"@":"dtext1"}, 18 "dynamicLayerName" : {"@":"dtext1"},
20 "dynamicLayerTag" : {"@": "dtext2"}, 19 "dynamicLayerTag" : {"@": "dtext2"},
21 "slotStyle" : {"@":"slot1"},
22 "mainCollapser" : {"@" : "mainCollapser"}, 20 "mainCollapser" : {"@" : "mainCollapser"},
23 "positionCollapser" : {"@" : "positionCollapser"}, 21 "positionCollapser" : {"@" : "positionCollapser"},
24 "transformCollapser" : {"@" : "transformCollapser"},
25 "styleCollapser" : {"@" : "styleCollapser"}, 22 "styleCollapser" : {"@" : "styleCollapser"},
26 "clickerMain" : {"#" : "clicker-main"}, 23 "clickerMain" : {"#" : "clicker-main"},
27 "myLabel" : {"#" : "myLabel"}, 24 "myLabel" : {"#" : "myLabel"}
28 "dragDrop" : {"@" : "DragDrop"}
29 } 25 }
30 }, 26 },
31 "dtext1" : { 27 "dtext1" : {
32 "module" : "montage/ui/dynamic-text.reel", 28 "prototype" : "montage/ui/dynamic-text.reel",
33 "name" : "DynamicText",
34 "properties" : { 29 "properties" : {
35 "element" : {"#" : "layer-label-text"} 30 "element" : {"#" : "layer-label-text"}
36 }, 31 },
@@ -43,8 +38,7 @@
43 } 38 }
44 }, 39 },
45 "dtext2" : { 40 "dtext2" : {
46 "module" : "montage/ui/dynamic-text.reel", 41 "prototype" : "montage/ui/dynamic-text.reel",
47 "name" : "DynamicText",
48 "properties" : { 42 "properties" : {
49 "element" : {"#" : "layer-tag"} 43 "element" : {"#" : "layer-tag"}
50 }, 44