aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelineTrack.reel
diff options
context:
space:
mode:
authorValerio Virgillito2012-02-13 21:43:51 -0800
committerValerio Virgillito2012-02-13 21:43:51 -0800
commit081f17954c735fc8b946d72a25b0ee60d370ef9b (patch)
treede7b50f2d02365df897ef4356f953d3833c9cabd /js/panels/Timeline/TimelineTrack.reel
parent47df0aff81c25334b129047bb227ea5015357eda (diff)
parent1d82f1a041612f32bbf6c9f20d9fb14e2d11fcc7 (diff)
downloadninja-081f17954c735fc8b946d72a25b0ee60d370ef9b.tar.gz
Merge branch 'refs/heads/master' into components
Conflicts: js/components/treeview/ninja-leaf.reel/ninja-leaf.js Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel')
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html112
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js433
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css117
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/images/gridline.jpgbin0 -> 724 bytes
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss65
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/scss/config.rb9
6 files changed, 736 insertions, 0 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
new file mode 100644
index 00000000..b0d191c2
--- /dev/null
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
@@ -0,0 +1,112 @@
1<!DOCTYPE html>
2<html lang="en">
3 <head>
4 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
5 <link rel="stylesheet" type="text/css" href="css/TimelineTrack.css">
6 <script type="text/montage-serialization">
7 {
8 "owner": {
9 "module": "js/panels/Timeline/TimelineTrack.reel",
10 "name": "Track",
11 "properties": {
12 "element": {"#": "track"},
13 "tweenRepetition" : {"@" : "tweenRepetition"},
14 "track_lane": {"#": "track_lanes"}
15 }
16 },
17
18 "tween" : {
19 "module" : "js/panels/timeline/Tween.reel",
20 "name" : "Tween",
21 "properties" : {
22 "element":{"#": "track_lane"}
23 },
24 "bindings" : {
25 "spanWidth" : {
26 "boundObject" : {"@": "tweenRepetition"},
27 "boundObjectPropertyPath" : "objectAtCurrentIteration.spanWidth",
28 "oneway" : false
29 },
30 "keyFramePosition" : {
31 "boundObject" : {"@": "tweenRepetition"},
32 "boundObjectPropertyPath" : "objectAtCurrentIteration.keyFramePosition",
33 "oneway" : false
34 },
35 "spanPosition" : {
36 "boundObject" : {"@": "tweenRepetition"},
37 "boundObjectPropertyPath" : "objectAtCurrentIteration.spanPosition",
38 "oneway" : false
39 },
40 "timelineTrack" : {
41 "boundObject" : {"@": "tweenRepetition"},
42 "boundObjectPropertyPath" : "objectAtCurrentIteration.timelineTrack",
43 "oneway" : false
44 },
45 "keyFrameMillisec" : {
46 "boundObject" : {"@": "tweenRepetition"},
47 "boundObjectPropertyPath" : "objectAtCurrentIteration.keyFrameMillisec",
48 "oneway" : false
49 },
50 "keyframeID" : {
51 "boundObject" : {"@": "tweenRepetition"},
52 "boundObjectPropertyPath" : "objectAtCurrentIteration.keyframeID",
53 "oneway" : false
54 }
55 }
56 },
57
58 "tweenRepetition": {
59 "module": "montage/ui/repetition.reel",
60 "name": "Repetition",
61 "properties": {
62 "element": {"#": "track_lanes"},
63 "isSelectionEnabled" : false
64 },
65 "bindings": {
66 "objects": {
67 "boundObject": {"@": "owner"},
68 "boundObjectPropertyPath": "tweens",
69 "oneway": false
70 }
71 }
72 }
73 }
74 </script>
75 </head>
76 <body>
77
78 <div id="track" class="timeline-track">
79 <div id="track_lanes" class="tracklane">
80 <div id="track_lane"></div>
81 </div>
82 <div class="label-main collapsible-label collapsible-collapsed"></div>
83 <div class="collapsible-content collapsible-collapsed content-main">
84 <div class="label-position collapsible-label collapsible-collapsed">
85
86 </div>
87 <div class="content-position collapsible-content collapsible-collapsed">
88 <div class="timeline-track"></div>
89 <div class="timeline-track"></div>
90 <div class="timeline-track"></div>
91 </div>
92 <div class="label-transform collapsible-label collapsible-collapsed">
93
94 </div>
95 <div class="content-transform collapsible-content collapsible-collapsed">
96 <div class="timeline-track"></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>
102 <div class="label-styles collapsible-label collapsible-collapsed">
103
104 </div>
105 <div class="content-styles collapsible-content collapsible-collapsed">
106
107 </div>
108 </div>
109 </div>
110
111 </body>
112</html> \ No newline at end of file
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
new file mode 100644
index 00000000..62688825
--- /dev/null
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -0,0 +1,433 @@
1var Montage = require("montage/core/core").Montage;
2var Component = require("montage/ui/component").Component;
3var Collapser = require("js/panels/Timeline/Collapser").Collapser;
4var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager;
5
6var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
7
8 hasTemplate:{
9 value:true
10 },
11
12 _trackID:{
13 value:null,
14 writable:true,
15 serializable:true,
16 enumerable:true
17 },
18
19 trackID:{
20 serializable:true,
21 get:function () {
22 return this._trackID;
23 },
24 set:function (value) {
25 this._trackID = value;
26 this.needsDraw = true;
27 }
28 },
29
30 // Are the various collapsers collapsed or not
31 _isMainCollapsed:{
32 value:""
33 },
34 isMainCollapsed:{
35 get:function () {
36 return this._isMainCollapsed;
37 },
38 set:function (newVal) {
39 if (newVal !== this._isMainCollapsed) {
40 this._isMainCollapsed = newVal;
41 this.needsDraw = true;
42 }
43
44 }
45 },
46 _isTransformCollapsed:{
47 value:true
48 },
49 isTransformCollapsed:{
50 get:function () {
51 return this._isTransformCollapsed;
52 },
53 set:function (newVal) {
54 if (newVal !== this._isTransformCollapsed) {
55 this._isTransformCollapsed = newVal;
56 this.needsDraw = true;
57 }
58 }
59 },
60 _isPositionCollapsed:{
61 value:true
62 },
63 isPositionCollapsed:{
64 get:function () {
65 return this._isPositionCollapsed;
66 },
67 set:function (newVal) {
68 if (newVal !== this._isPositionCollapsed) {
69 this._isPositionCollapsed = newVal;
70 this.needsDraw = true;
71 }
72 }
73 },
74 _isStyleCollapsed:{
75 value:true
76 },
77 isStyleCollapsed:{
78 get:function () {
79 return this._isStyleCollapsed;
80 },
81 set:function (newVal) {
82 if (newVal !== this._isStyleCollapsed) {
83 this._isStyleCollapsed = newVal;
84 this.needsDraw = true;