aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelineTrack.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel')
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html102
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js325
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css62
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss14
4 files changed, 356 insertions, 147 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
index b0d191c2..cabd92c0 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
@@ -11,7 +11,8 @@
11 "properties": { 11 "properties": {
12 "element": {"#": "track"}, 12 "element": {"#": "track"},
13 "tweenRepetition" : {"@" : "tweenRepetition"}, 13 "tweenRepetition" : {"@" : "tweenRepetition"},
14 "track_lane": {"#": "track_lanes"} 14 "styleTracksRepetition" : {"@" : "styleTracksRepetition"},
15 "tween": {"@" : "tween"}
15 } 16 }
16 }, 17 },
17 18
@@ -37,19 +38,24 @@
37 "boundObjectPropertyPath" : "objectAtCurrentIteration.spanPosition", 38 "boundObjectPropertyPath" : "objectAtCurrentIteration.spanPosition",
38 "oneway" : false 39 "oneway" : false
39 }, 40 },
40 "timelineTrack" : { 41 "keyFrameMillisec" : {
41 "boundObject" : {"@": "tweenRepetition"}, 42 "boundObject" : {"@": "tweenRepetition"},
42 "boundObjectPropertyPath" : "objectAtCurrentIteration.timelineTrack", 43 "boundObjectPropertyPath" : "objectAtCurrentIteration.keyFrameMillisec",
43 "oneway" : false 44 "oneway" : false
44 }, 45 },
45 "keyFrameMillisec" : { 46 "tweenID" : {
46 "boundObject" : {"@": "tweenRepetition"}, 47 "boundObject" : {"@": "tweenRepetition"},
47 "boundObjectPropertyPath" : "objectAtCurrentIteration.keyFrameMillisec", 48 "boundObjectPropertyPath" : "objectAtCurrentIteration.tweenID",
49 "oneway" : false
50 },
51 "tweenedProperties" : {
52 "boundObject" : {"@": "tweenRepetition"},
53 "boundObjectPropertyPath" : "objectAtCurrentIteration.tweenedProperties",
48 "oneway" : false 54 "oneway" : false
49 }, 55 },
50 "keyframeID" : { 56 "isTweenAnimated" : {
51 "boundObject" : {"@": "tweenRepetition"}, 57 "boundObject" : {"@": "tweenRepetition"},
52 "boundObjectPropertyPath" : "objectAtCurrentIteration.keyframeID", 58 "boundObjectPropertyPath" : "objectAtCurrentIteration.isTweenAnimated",
53 "oneway" : false 59 "oneway" : false
54 } 60 }
55 } 61 }
@@ -69,7 +75,69 @@
69 "oneway": false 75 "oneway": false
70 } 76 }
71 } 77 }
72 } 78 },
79
80 "styleTrackRepetition": {
81 "module": "montage/ui/repetition.reel",
82 "name": "Repetition",
83 "properties": {
84 "element": {"#": "content-styles"},
85 "isSelectionEnabled" : false
86 },
87 "bindings": {
88 "objects": {
89 "boundObject": {"@": "owner"},
90 "boundObjectPropertyPath": "arrStyleTracks",
91 "oneway": false
92 }
93 }
94 },
95 "positionTracksRepetition": {
96 "module": "montage/ui/repetition.reel",
97 "name": "Repetition",
98 "properties": {
99 "element": {"#": "content-position-tracks"},
100 "isSelectionEnabled" : false
101 },
102 "bindings": {
103 "objects": {
104 "boundObject": {"@": "owner"},
105 "boundObjectPropertyPath": "arrPositionTracks",
106 "oneway": false
107 }
108 }
109 },
110 "positionPropertyTrack" : {
111 "module" : "js/panels/Timeline/PropertyTrack.reel",
112 "name" : "PropertyTrack",
113 "properties" : {
114 "element":{"#": "position-track-base"}
115 }
116 },
117 "transformTracksRepetition": {
118 "module": "montage/ui/repetition.reel",
119 "name": "Repetition",
120 "properties": {
121 "element": {"#": "content-transform-tracks"},
122 "isSelectionEnabled" : false
123 },
124 "bindings": {
125 "objects": {
126 "boundObject": {"@": "owner"},
127 "boundObjectPropertyPath": "arrTransformTracks",
128 "oneway": false
129 }
130 }
131 },
132 "transformPropertyTrack" : {
133 "module" : "js/panels/Timeline/PropertyTrack.reel",
134 "name" : "PropertyTrack",
135 "properties" : {
136 "element":{"#": "transform-track-base"}
137 }
138 }
139
140
73 } 141 }
74 </script> 142 </script>
75 </head> 143 </head>
@@ -84,26 +152,20 @@
84 <div class="label-position collapsible-label collapsible-collapsed"> 152 <div class="label-position collapsible-label collapsible-collapsed">
85 153
86 </div> 154 </div>
87 <div class="content-position collapsible-content collapsible-collapsed"> 155 <div class="content-position collapsible-content collapsible-collapsed" id="content-position-tracks">
88 <div class="timeline-track"></div> 156 <div id="position-track-base"></div>
89 <div class="timeline-track"></div>
90 <div class="timeline-track"></div>
91 </div> 157 </div>
92 <div class="label-transform collapsible-label collapsible-collapsed"> 158 <div class="label-transform collapsible-label collapsible-collapsed">
93 159
94 </div> 160 </div>
95 <div class="content-transform collapsible-content collapsible-collapsed"> 161 <div class="content-transform collapsible-content collapsible-collapsed" id="content-transform-tracks">
96 <div class="timeline-track"></div> 162 <div id="transform-track-base"></div>
97 <div class="timeline-track"></div>
98 <div class="timeline-track"></div>
99 <div class="timeline-track"></div>
100 <div class="timeline-track"></div>
101 </div> 163 </div>
102 <div class="label-styles collapsible-label collapsible-collapsed"> 164 <div class="label-styles collapsible-label collapsible-collapsed">
103 165
104 </div> 166 </div>
105 <div class="content-styles collapsible-content collapsible-collapsed"> 167 <div id="content-styles" class="content-styles collapsible-content collapsible-collapsed">
106 168 <div class="timeline-track"></div>
107 </div> 169 </div>
108 </div> 170 </div>
109 </div> 171 </div>
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 62688825..fddfd170 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -10,10 +10,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
10 }, 10 },
11 11
12 _trackID:{ 12 _trackID:{
13 value:null,
14 writable:true,
15 serializable:true, 13 serializable:true,
16 enumerable:true 14 value:null
17 }, 15 },
18 16
19 trackID:{ 17 trackID:{
@@ -85,21 +83,116 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
85 } 83 }
86 } 84 }
87 }, 85 },
88 86
89 _tweens:{ 87 _arrStyleTracks : {
88 serializable:true,
89 enumerable:true,
90 value: []
91 },
92 arrStyleTracks: {
93 serializable:true,
94 enumerable:true,
95 get: function() {
96 return this._arrStyleTracks;
97 },