diff options
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel')
4 files changed, 523 insertions, 150 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html index 091470f3..79014ae6 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html | |||
| @@ -15,10 +15,12 @@ | |||
| 15 | "properties": { | 15 | "properties": { |
| 16 | "element": {"#": "track"}, | 16 | "element": {"#": "track"}, |
| 17 | "tweenRepetition" : {"@" : "tweenRepetition"}, | 17 | "tweenRepetition" : {"@" : "tweenRepetition"}, |
| 18 | "track_lanes" : {"#" : "track_lanes"}, | ||
| 18 | "tween": {"@" : "tween"}, | 19 | "tween": {"@" : "tween"}, |
| 20 | "positionTracksRepetition" : {"@" : "positionTracksRepetition"}, | ||
| 21 | "positionPropertyTrack" : {"@" : "positionPropertyTrack"}, | ||
| 19 | "mainCollapser" : {"@" : "mainCollapser"}, | 22 | "mainCollapser" : {"@" : "mainCollapser"}, |
| 20 | "positionCollapser" : {"@" : "positionCollapser"}, | 23 | "positionCollapser" : {"@" : "positionCollapser"}, |
| 21 | "transformCollapser" : {"@" : "transformCollapser"}, | ||
| 22 | "styleCollapser" : {"@" : "styleCollapser"} | 24 | "styleCollapser" : {"@" : "styleCollapser"} |
| 23 | } | 25 | } |
| 24 | }, | 26 | }, |
| @@ -51,7 +53,6 @@ | |||
| 51 | } | 53 | } |
| 52 | } | 54 | } |
| 53 | }, | 55 | }, |
| 54 | |||
| 55 | "styleTrackRepetition": { | 56 | "styleTrackRepetition": { |
| 56 | "prototype": "montage/ui/repetition.reel", | 57 | "prototype": "montage/ui/repetition.reel", |
| 57 | "properties": { | 58 | "properties": { |
| @@ -66,10 +67,23 @@ | |||
| 66 | } | 67 | } |
| 67 | } | 68 | } |
| 68 | }, | 69 | }, |
| 70 | "stylePropertyTrack" : { | ||
| 71 | "prototype" : "js/panels/Timeline/PropertyTrack.reel", | ||
| 72 | "properties" : { | ||
| 73 | "element":{"#": "style-track-base"} | ||
| 74 | }, | ||
| 75 | "bindings" : { | ||
| 76 | "propTrackData" : { | ||
| 77 | "boundObject" : {"@" : "styleTrackRepetition"}, | ||
| 78 | "boundObjectPropertyPath" : "objectAtCurrentIteration.propTrackData", | ||
| 79 | "oneway" : false | ||
| 80 | } | ||
| 81 | } | ||
| 82 | }, | ||
| 69 | "positionTracksRepetition": { | 83 | "positionTracksRepetition": { |
| 70 | "prototype": "montage/ui/repetition.reel", | 84 | "prototype": "montage/ui/repetition.reel", |
| 71 | "properties": { | 85 | "properties": { |
| 72 | "element": {"#": "content-position-tracks"}, | 86 | "element": {"#": "content_position_tracks"}, |
| 73 | "isSelectionEnabled" : false | 87 | "isSelectionEnabled" : false |
| 74 | }, | 88 | }, |
| 75 | "bindings": { | 89 | "bindings": { |
| @@ -83,28 +97,15 @@ | |||
| 83 | "positionPropertyTrack" : { | 97 | "positionPropertyTrack" : { |
| 84 | "prototype" : "js/panels/Timeline/PropertyTrack.reel", | 98 | "prototype" : "js/panels/Timeline/PropertyTrack.reel", |
| 85 | "properties" : { | 99 | "properties" : { |
| 86 | "element":{"#": "position-track-base"} | 100 | "element":{"#": "position_track_base"} |
| 87 | } | 101 | }, |
| 88 | }, | 102 | "bindings" : { |
| 89 | "transformTracksRepetition": { | 103 | "propTrackData" : { |
| 90 | "prototype": "montage/ui/repetition.reel", | 104 | "boundObject" : {"@" : "positionTracksRepetition"}, |
| 91 | "properties": { | 105 | "boundObjectPropertyPath" : "objectAtCurrentIteration.propTrackData", |
| 92 | "element": {"#": "content-transform-tracks"}, | 106 | "oneway" : false |
| 93 | "isSelectionEnabled" : false | 107 | } |
| 94 | }, | 108 | } |
| 95 | "bindings": { | ||
| 96 | "objects": { | ||
| 97 | "boundObject": {"@": "owner"}, | ||
| 98 | "boundObjectPropertyPath": "arrTransformTracks", | ||
| 99 | "oneway": false | ||
| 100 | } | ||
| 101 | } | ||
| 102 | }, | ||
| 103 | "transformPropertyTrack" : { | ||
| 104 | "prototype" : "js/panels/Timeline/PropertyTrack.reel", | ||
| 105 | "properties" : { | ||
| 106 | "element":{"#": "transform-track-base"} | ||
| 107 | } | ||
| 108 | }, | 109 | }, |
| 109 | 110 | ||
| 110 | "mainCollapser" : { | 111 | "mainCollapser" : { |
| @@ -135,8 +136,8 @@ | |||
| 135 | "positionCollapser" : { | 136 | "positionCollapser" : { |
| 136 | "prototype" : "js/panels/timeline/Collapser", | 137 | "prototype" : "js/panels/timeline/Collapser", |
| 137 | "properties" : { | 138 | "properties" : { |
| 138 | "element" : {"#" : "content-position-tracks"}, | 139 | "element" : {"#" : "content_position_collapser"}, |
| 139 | "myContent" : {"#":"content-position-tracks"}, | 140 | "myContent" : {"#":"content_position_collapser"}, |
| 140 | "contentHeight" : 40, | 141 | "contentHeight" : 40, |
| 141 | "isLabelClickable" : false, | 142 | "isLabelClickable" : false, |
| 142 | "clicker" : {"#" : "label-position"}, | 143 | "clicker" : {"#" : "label-position"}, |
| @@ -157,31 +158,6 @@ | |||
| 157 | } | 158 | } |
| 158 | }, | 159 | }, |
| 159 | 160 | ||
| 160 | "transformCollapser" : { | ||
| 161 | "prototype" : "js/panels/timeline/Collapser", | ||
| 162 | "properties" : { | ||
| 163 | "element" : {"#" : "content-transform-tracks"}, | ||
| 164 | "myContent" : {"#":"content-transform-tracks"}, | ||
| 165 | "contentHeight" : 40, | ||
| 166 | "isLabelClickable" : false, | ||
| 167 | "clicker" : {"#" : "label-transform"}, | ||
| 168 | "isCollapsed" : true, | ||
| 169 | "isAnimated" : true | ||
| 170 | }, | ||
| 171 | "bindings" : { | ||
| 172 | "isToggling" : { | ||
| 173 | "boundObject" : {"@" : "owner" }, | ||
| 174 | "boundObjectPropertyPath" : "isTransformCollapsed", | ||
| 175 | "oneway" : false | ||
| 176 | }, | ||
| 177 | "bypassAnimation" : { | ||
| 178 | "boundObject" : {"@": "owner"}, | ||
| 179 | "boundObjectPropertyPath" : "bypassAnimation", | ||
| 180 | "oneway" : false | ||
| 181 | } | ||
| 182 | } | ||
| 183 | }, | ||
| 184 | |||
| 185 | "styleCollapser" : { | 161 | "styleCollapser" : { |
| 186 | "prototype" : "js/panels/timeline/Collapser", | 162 | "prototype" : "js/panels/timeline/Collapser", |
| 187 | "properties" : { | 163 | "properties" : { |
| @@ -214,28 +190,26 @@ | |||
| 214 | <body> | 190 | <body> |
| 215 | 191 | ||
| 216 | <div data-montage-id="track" class="timeline-track"> | 192 | <div data-montage-id="track" class="timeline-track"> |
| 217 | <div data-montage-id="track_lanes" class="tracklane"> | 193 | <div data-montage-id="track_lanes" class="tracklane" style="position: relative;"> |
| 218 | <div data-montage-id="track_lane"></div> | 194 | <div data-montage-id="track_lane"></div> |
| 219 | </div> | 195 | </div> |
| 220 | <div class="label-main collapsible-label collapsible-collapsed" data-montage-id="label-main"></div> | 196 | <div class="label-main collapsible-label collapsible-collapsed" data-montage-id="label-main"></div> |
| 221 | <div class="collapsible-content collapsible-collapsed content-main" data-montage-id="content-main"> | 197 | <div class="collapsible-content collapsible-collapsed content-main" data-montage-id="content-main"> |
| 222 | <div class="label-position collapsible-label collapsible-collapsed" data-montage-id="label-position"> | 198 | <div class="label-position collapsible-label collapsible-collapsed" data-montage-id="label-position"> |
| 223 | 199 | ||
| 224 | </div> | 200 | </div> |
| 225 | <div class="content-position collapsible-content collapsible-collapsed" data-montage-id="content-position-tracks"> | 201 | <div class="content-position collapsible-content collapsible-collapsed" |
| 226 | <div data-montage-id="position-track-base"></div> | 202 | data-montage-id="content_position_collapser"> |
| 227 | </div> | 203 | <div data-montage-id="content_position_tracks"> |
| 228 | <div class="label-transform collapsible-label collapsible-collapsed" data-montage-id="label-transform"> | 204 | <div data-montage-id="position_track_base"></div> |
| 229 | 205 | </div> | |
| 230 | </div> | 206 | </div> |
| 231 | <div class="content-transform collapsible-content collapsible-collapsed" data-montage-id="content-transform-tracks"> | 207 | |
| 232 | <div data-montage-id="transform-track-base"></div> | ||
| 233 | </div> | ||
| 234 | <div class="label-styles collapsible-label collapsible-collapsed" data-montage-id="label-styles"> | 208 | <div class="label-styles collapsible-label collapsible-collapsed" data-montage-id="label-styles"> |
| 235 | 209 | ||
| 236 | </div> | 210 | </div> |
| 237 | <div data-montage-id="content-styles" class="content-styles collapsible-content collapsible-collapsed"> | 211 | <div data-montage-id="content-styles" class="content-styles collapsible-content collapsible-collapsed"> |
| 238 | <div class="timeline-track"></div> | 212 | <div data-montage-id="style-track-base"></div> |
| 239 | </div> | 213 | |