diff options
Diffstat (limited to 'js/panels/Timeline')
9 files changed, 303 insertions, 19 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 34c300df..9edd2b35 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -635,6 +635,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
635 | newEvent.layerEventLocale = "styles"; | 635 | newEvent.layerEventLocale = "styles"; |
636 | newEvent.layerEventType = "newStyle"; | 636 | newEvent.layerEventType = "newStyle"; |
637 | newEvent.layerID = this.layerID; | 637 | newEvent.layerID = this.layerID; |
638 | newEvent.styleIndex = this._styleCounter; | ||
638 | newEvent.styleID = this.layerID + "@" + this._styleCounter; | 639 | newEvent.styleID = this.layerID + "@" + this._styleCounter; |
639 | 640 | ||
640 | newStyle.styleID = newEvent.styleID; | 641 | newStyle.styleID = newEvent.styleID; |
@@ -658,7 +659,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
658 | } | 659 | } |
659 | 660 | ||
660 | // Set up the event info and dispatch the event | 661 | // Set up the event info and dispatch the event |
661 | 662 | this._styleCounter += 1; | |
662 | newEvent.styleSelection = mySelection; | 663 | newEvent.styleSelection = mySelection; |
663 | defaultEventManager.dispatchEvent(newEvent); | 664 | defaultEventManager.dispatchEvent(newEvent); |
664 | 665 | ||
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.html b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.html index a4b598c5..40834466 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.html +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.html | |||
@@ -13,16 +13,50 @@ | |||
13 | "owner": { | 13 | "owner": { |
14 | "prototype": "js/panels/Timeline/PropertyTrack.reel", | 14 | "prototype": "js/panels/Timeline/PropertyTrack.reel", |
15 | "properties": { | 15 | "properties": { |
16 | "element": {"#": "property-track"} | 16 | "element": {"#": "property-track"}, |
17 | "propTweenRepetition" : {"@" : "propTweenRepetition"}, | ||
18 | "propTween": {"@" : "propTween"} | ||
17 | } | 19 | } |
18 | } | 20 | }, |
21 | |||
22 | "propTween" : { | ||
23 | "prototype" : "js/panels/timeline/Tween.reel", | ||
24 | "properties" : { | ||
25 | "element":{"#": "prop_track_lane"} | ||
26 | }, | ||
27 | "bindings" : { | ||
28 | "tweenData" : { | ||
29 | "boundObject" : {"@": "propTweenRepetition"}, | ||
30 | "boundObjectPropertyPath" : "objectAtCurrentIteration.tweenData", | ||
31 | "oneway" : false | ||
32 | } | ||
33 | } | ||
34 | }, | ||
19 | 35 | ||
36 | "propTweenRepetition": { | ||
37 | "prototype": "montage/ui/repetition.reel", | ||
38 | "properties": { | ||
39 | "element": {"#": "prop_track_lanes"}, | ||
40 | "isSelectionEnabled" : false | ||
41 | }, | ||
42 | "bindings": { | ||
43 | "objects": { | ||
44 | "boundObject": {"@": "owner"}, | ||
45 | "boundObjectPropertyPath": "propTweens", | ||
46 | "oneway": false | ||
47 | } | ||
48 | } | ||
49 | } | ||
20 | } | 50 | } |
21 | </script> | 51 | </script> |
22 | </head> | 52 | </head> |
23 | <body> | 53 | <body> |
24 | 54 | ||
25 | <div data-montage-id="property-track" class="timeline-track"></div> | 55 | <div data-montage-id="property-track" class="timeline-track"> |
56 | <div data-montage-id="prop_track_lanes" class="prop-track collapsible-content collapsible-collapsed"> | ||
57 | <div data-montage-id="prop_track_lane"></div> | ||
58 | </div> | ||
59 | </div> | ||
26 | 60 | ||
27 | </body> | 61 | </body> |
28 | </html> \ No newline at end of file | 62 | </html> \ No newline at end of file |
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index 175b77f9..f2dbd683 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | |||
@@ -15,7 +15,215 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
15 | 15 | ||
16 | prepareForDraw:{ | 16 | prepareForDraw:{ |
17 | value:function(){ | 17 | value:function(){ |
18 | this.element.addEventListener("click", this, false); | ||
19 | this.trackID = this.parentComponent.parentComponent.parentComponent.trackID; | ||
20 | this.animatedElement = this.parentComponent.parentComponent.parentComponent.animatedElement; | ||
21 | } | ||
22 | }, | ||
23 | |||
24 | draw:{ | ||
25 | value:function(){ | ||
26 | |||
27 | } | ||
28 | }, | ||
29 | |||
30 | trackEditorProperty:{ | ||
31 | value:"" | ||
32 | }, | ||
33 | |||
34 | _propTweenRepetition:{ | ||
35 | value:null | ||
36 | }, | ||
37 | |||
38 | animatedElement:{ | ||
39 | value:null | ||
40 | }, | ||
41 | |||
42 | isSubproperty:{ | ||
43 | value:true | ||
44 | }, | ||
45 | |||
46 | propTweenRepetition:{ | ||
47 | serializable:true, | ||
48 | get:function () { | ||
49 | return this._propTweenRepetition; | ||
50 | }, | ||
51 | set:function (newVal) { | ||
52 | this._propTweenRepetition = newVal; | ||
53 | } | ||
54 | }, | ||
55 | |||
56 | _propTweens:{ | ||
57 | value:[] | ||
58 | }, | ||
59 | |||
60 | propTweens:{ | ||
61 | serializable:true, | ||
62 | get:function () { | ||
63 | return this._propTweens; | ||
64 | }, | ||
65 | set:function (newVal) { | ||
66 | this._propTweens = newVal; | ||
67 | } | ||
68 | }, | ||
69 | |||
70 | _propTrackData:{ | ||
71 | value:false | ||
72 | }, | ||
73 | |||
74 | propTrackData:{ | ||
75 | serializable:true, | ||
76 | get:function () { | ||
77 | return this._propTrackData; | ||
78 | }, | ||
79 | set:function (val) { | ||
80 | this._propTrackData = val; | ||
81 | if (this._propTrackData) { | ||
82 | this.setData(); | ||
83 | } | ||
84 | } | ||
85 | }, | ||
86 | |||
87 | nextKeyframe:{ | ||
88 | value:1 | ||
89 | }, | ||
90 | |||
91 | _trackID:{ | ||
92 | value:null | ||
93 | }, | ||
94 | |||
95 | trackID:{ | ||
96 | serializable:true, | ||
97 | get:function () { | ||
98 | return this._trackID; | ||
99 | }, | ||
100 | set:function (value) { | ||
101 | if (value !== this._trackID) { | ||
102 | this._trackID = value; | ||
103 | } | ||
104 | } | ||
105 | }, | ||
106 | |||
107 | _styleSelection:{ | ||
108 | value:null | ||
109 | }, | ||
110 | |||
111 | styleSelection:{ | ||
112 | serializable:true, | ||
113 | get:function () { | ||
114 | return this._styleSelection; | ||
115 | }, | ||
116 | set:function (value) { | ||
117 | if (value !== this._styleSelection) { | ||
118 | this._styleSelection = value; | ||
119 | } | ||
120 | } | ||
121 | }, | ||
122 | |||
123 | _styleIndex:{ | ||
124 | value:null | ||
125 | }, | ||
126 | |||
127 | styleIndex:{ | ||
128 | serializable:true, | ||
129 | get:function () { | ||
130 | return this._styleIndex; | ||