aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelinePanel.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel')
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html83
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js1590
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css424
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/images/icon-checkmark.pngbin0 -> 1083 bytes
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/images/icon-gear.pngbin0 -> 1397 bytes
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss373
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/config.rb10
7 files changed, 1521 insertions, 959 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 14c5f1c8..f10e9ac9 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.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/>
@@ -13,17 +13,14 @@
13 <script type="text/montage-serialization"> 13 <script type="text/montage-serialization">
14 { 14 {
15 "owner": { 15 "owner": {
16 "module": "js/panels/Timeline/TimelinePanel.reel", 16 "prototype": "js/panels/Timeline/TimelinePanel.reel",
17 "name": "TimelinePanel",
18 "properties": { 17 "properties": {
19 "element": {"#": "timeline_panel"}, 18 "element": {"#": "timeline_panel"},
20 "user_layers": {"#": "user_layers"}, 19 "user_layers": {"#": "user_layers"},
21 "track_container": {"#": "right_inside"}, 20 "track_container": {"#": "right_inside"},
22 "timeline_leftpane" : {"#" : "timeline_leftpane"}, 21 "timeline_leftpane" : {"#" : "leftpane_inside"},
23 "layer_tracks": {"#": "layer_tracks"}, 22 "layer_tracks": {"#": "layer_tracks"},
24 "master_track": {"#": "master_track"}, 23 "master_track": {"#": "master_track"},
25 "newlayer_button": {"#": "newlayer_button"},
26 "deletelayer_button": {"#": "deletelayer_button"},
27 "time_markers" : {"#": "timeline_markers"}, 24 "time_markers" : {"#": "timeline_markers"},
28 "layerRepetition" : {"@": "repetition1"}, 25 "layerRepetition" : {"@": "repetition1"},
29 "trackRepetition" : {"@" : "repetition2"}, 26 "trackRepetition" : {"@" : "repetition2"},
@@ -34,13 +31,16 @@
34 "container_tracks" : {"#" : "container-tracks"}, 31 "container_tracks" : {"#" : "container-tracks"},
35 "end_hottext" : {"@" : "endHottext"}, 32 "end_hottext" : {"@" : "endHottext"},
36 "container_layers" : {"#" : "container-layers"}, 33 "container_layers" : {"#" : "container-layers"},
37 "timeline_disabler" : {"#" : "timeline-disabler"} 34 "timeline_disabler" : {"#" : "timeline-disabler"},
35 "checkable_relative" : {"#" : "checkable_relative"},
36 "checkable_absolute" : {"#" : "checkable_absolute"},
37 "checkable_animated" : {"#" : "checkable_animated"},
38 "tl_configbutton" : {"#" : "tl-configbutton"}
38 } 39 }
39 }, 40 },
40 41
41 "timelineResize" : { 42 "timelineResize" : {
42 "module": "js/panels/Resizer", 43 "prototype": "js/panels/Resizer",
43 "name": "Resizer",
44 "properties": { 44 "properties": {
45 "element": {"#": "layer_resizer"}, 45 "element": {"#": "layer_resizer"},
46 "panel" : {"#" : "timeline_leftpane"}, 46 "panel" : {"#" : "timeline_leftpane"},
@@ -52,8 +52,7 @@
52 52
53 53
54 "repetition1": { 54 "repetition1": {
55 "module": "montage/ui/repetition.reel", 55 "prototype": "montage/ui/repetition.reel",
56 "name": "Repetition",
57 "properties": { 56 "properties": {
58 "element": {"#": "container-layers"}, 57 "element": {"#": "container-layers"},
59 "isSelectionEnabled" : true 58 "isSelectionEnabled" : true
@@ -67,8 +66,7 @@
67 } 66 }
68 }, 67 },
69 "layer" : { 68 "layer" : {
70 "module" : "js/panels/Timeline/Layer.reel", 69 "prototype" : "js/panels/Timeline/Layer.reel",
71 "name" : "Layer",
72 "properties" : { 70 "properties" : {
73 "element": {"#": "container-layer"} 71 "element": {"#": "container-layer"}
74 }, 72 },
@@ -77,13 +75,17 @@
77 "boundObject" : {"@" : "repetition1"}, 75 "boundObject" : {"@" : "repetition1"},
78 "boundObjectPropertyPath" : "objectAtCurrentIteration.layerData", 76 "boundObjectPropertyPath" : "objectAtCurrentIteration.layerData",
79 "oneway" : false 77 "oneway" : false
80 } 78 },
79 "bindingPoint" : {
80 "boundObject" : {"@" : "repetition1"},
81 "boundObjectPropertyPath" : "objectAtCurrentIteration.layerData.triggerBinding",
82 "oneway" : false
83 }
81 } 84 }
82 }, 85 },
83 86
84 "repetition2" : { 87 "repetition2" : {
85 "module": "montage/ui/repetition.reel", 88 "prototype": "montage/ui/repetition.reel",
86 "name": "Repetition",
87 "properties": { 89 "properties": {
88 "element": {"#": "container-tracks"}, 90 "element": {"#": "container-tracks"},
89 "isSelectionEnabled" : false 91 "isSelectionEnabled" : false
@@ -97,8 +99,7 @@
97 } 99 }
98 }, 100 },
99 "track" : { 101 "track" : {
100 "module" : "js/panels/Timeline/TimelineTrack.reel", 102 "prototype" : "js/panels/Timeline/TimelineTrack.reel",
101 "name" : "TimelineTrack",
102 "properties" : { 103 "properties" : {
103 "element": {"#": "container-track"} 104 "element": {"#": "container-track"}
104 }, 105 },
@@ -107,12 +108,34 @@
107 "boundObject" : {"@" : "repetition2"}, 108 "boundObject" : {"@" : "repetition2"},
108 "boundObjectPropertyPath" : "objectAtCurrentIteration.layerData", 109 "boundObjectPropertyPath" : "objectAtCurrentIteration.layerData",
109 "oneway" : false 110 "oneway" : false
111 },
112 "bindingPoint" : {
113 "boundObject" : {"@" : "repetition2"},
114 "boundObjectPropertyPath" : "objectAtCurrentIteration.layerData.triggerBinding",
115 "oneway" : false
110 } 116 }
117
111 } 118 }
112 }, 119 },
120
121 "timelineZoomSlider":{
122 "prototype":"js/components/slider.reel",
123 "properties":{
124 "element":{"#":"tl_slider"},
125 "maxValue" : 10000,
126 "minValue" : 1000
127 },
128 "bindings": {
129 "value": {
130 "boundObject": {"@": "owner"},
131 "boundObjectPropertyPath": "millisecondsOffset",
132 "oneway": false
133 }
134 }
135 },
136
113 "endHottext" : { 137 "endHottext" : {
114 "module": "js/components/hottextunit.reel", 138 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
115 "name": "HotTextUnit",
116 "properties": { 139 "properties": {
117 "element": {"#": "end_hottext"}, 140 "element": {"#": "end_hottext"},
118 "maxValue" : 100000, 141 "maxValue" : 100000,
@@ -151,16 +174,26 @@
151 174
152 <div id="user_layers" class="userlayers"> 175 <div id="user_layers" class="userlayers">
153 <div id="master_layer" class="masterlayer"> 176 <div id="master_layer" class="masterlayer">
154 <div>Master Layer</div> 177 <div class="layer-master">Master Layer
178 <div class="tl-configbutton" data-montage-id="tl-configbutton">
179 <div class="tl-dropdown">
180 <div class="checkable" data-montage-id="checkable_relative">Use relative positioning</div>
181 <div class="checkable checked" data-montage-id="checkable_absolute">Use absolute positioning</div>
182 <div class="nj-divider divider-horizontal"></div>
183 <div class="checkable" data-montage-id="checkable_animated">Show only animated layers</div>
184 </div>
185 </div>
186
187 </div>
188
155 </div> 189 </div>
156 <div id="container-layers"> 190 <div id="container-layers" style="position: relative;" class="container-layers">
157 <div id="container-layer"></div> 191 <div id="container-layer"></div>
158 </div> 192 </div>
159 </div> 193 </div>
160 194
161 <div id="timeline_gutter" class="timelinegutter"> 195 <div id="timeline_gutter" class="timelinegutter">
162 <div id="newlayer_button" class="newlayerbutton"></div> 196 <div id="tl_slider" class="tl_slider"></div>