diff options
Diffstat (limited to 'js/panels')
-rwxr-xr-x | js/panels/Panel.reel/Panel.js | 5 | ||||
-rwxr-xr-x | js/panels/PanelContainer.reel/PanelContainer.html | 11 | ||||
-rwxr-xr-x | js/panels/PanelContainer.reel/PanelContainer.js | 1 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html | 4 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 10 | ||||
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 5 | ||||
-rw-r--r-- | js/panels/Timeline/Tween.reel/Tween.js | 9 | ||||
-rwxr-xr-x | js/panels/components-panel.reel/components-panel.js | 6 | ||||
-rw-r--r-- | js/panels/history-panel/history-item.reel/history-item.css | 0 | ||||
-rw-r--r-- | js/panels/history-panel/history-item.reel/history-item.html | 29 | ||||
-rw-r--r-- | js/panels/history-panel/history-item.reel/history-item.js | 32 | ||||
-rw-r--r-- | js/panels/history-panel/history.reel/history.css | 34 | ||||
-rw-r--r-- | js/panels/history-panel/history.reel/history.html | 106 | ||||
-rw-r--r-- | js/panels/history-panel/history.reel/history.js | 26 | ||||
-rwxr-xr-x | js/panels/properties.reel/properties.js | 5 |
15 files changed, 263 insertions, 20 deletions
diff --git a/js/panels/Panel.reel/Panel.js b/js/panels/Panel.reel/Panel.js index 33f9b3a7..613bef4b 100755 --- a/js/panels/Panel.reel/Panel.js +++ b/js/panels/Panel.reel/Panel.js | |||
@@ -125,7 +125,10 @@ exports.Panel = Montage.create(Component, { | |||
125 | require.async(this.modulePath) | 125 | require.async(this.modulePath) |
126 | .then(function(panelContent) { | 126 | .then(function(panelContent) { |
127 | var componentRequire = panelContent[that.moduleName]; | 127 | var componentRequire = panelContent[that.moduleName]; |
128 | that.panelContent.content = componentRequire.create(); | 128 | var componentInstance = componentRequire.create(); |
129 | |||
130 | componentInstance.ownerComponent = that.ownerComponent; | ||
131 | that.panelContent.content = componentInstance; | ||
129 | }) | 132 | }) |
130 | .end(); | 133 | .end(); |
131 | } | 134 | } |
diff --git a/js/panels/PanelContainer.reel/PanelContainer.html b/js/panels/PanelContainer.reel/PanelContainer.html index 251e86e4..d3673105 100755 --- a/js/panels/PanelContainer.reel/PanelContainer.html +++ b/js/panels/PanelContainer.reel/PanelContainer.html | |||
@@ -62,6 +62,13 @@ | |||
62 | } | 62 | } |
63 | }, | 63 | }, |
64 | 64 | ||
65 | "panel_6": { | ||
66 | "prototype": "js/panels/Panel.reel", | ||
67 | "properties": { | ||
68 | "element": {"#": "panel_6"} | ||
69 | } | ||
70 | }, | ||
71 | |||
65 | "owner": { | 72 | "owner": { |
66 | "module": "js/panels/PanelContainer.reel", | 73 | "module": "js/panels/PanelContainer.reel", |
67 | "name": "PanelContainer", | 74 | "name": "PanelContainer", |
@@ -74,7 +81,8 @@ | |||
74 | "panel_2": {"@": "panel_2"}, | 81 | "panel_2": {"@": "panel_2"}, |
75 | "panel_3": {"@": "panel_3"}, | 82 | "panel_3": {"@": "panel_3"}, |
76 | "panel_4": {"@": "panel_4"}, | 83 | "panel_4": {"@": "panel_4"}, |
77 | "panel_5": {"@": "panel_5"} | 84 | "panel_5": {"@": "panel_5"}, |
85 | "panel_6": {"@": "panel_6"} | ||
78 | }, | 86 | }, |
79 | "listeners": [ | 87 | "listeners": [ |
80 | { | 88 | { |
@@ -104,6 +112,7 @@ | |||
104 | <article data-montage-id="panel_3"></article> | 112 | <article data-montage-id="panel_3"></article> |
105 | <article data-montage-id="panel_4"></article> | 113 | <article data-montage-id="panel_4"></article> |
106 | <article data-montage-id="panel_5"></article> | 114 | <article data-montage-id="panel_5"></article> |
115 | <article data-montage-id="panel_6"></article> | ||
107 | </article> | 116 | </article> |
108 | </section> | 117 | </section> |
109 | </body> | 118 | </body> |
diff --git a/js/panels/PanelContainer.reel/PanelContainer.js b/js/panels/PanelContainer.reel/PanelContainer.js index c40bbc21..8d1d6a5e 100755 --- a/js/panels/PanelContainer.reel/PanelContainer.js +++ b/js/panels/PanelContainer.reel/PanelContainer.js | |||
@@ -45,6 +45,7 @@ exports.PanelContainer = Montage.create(Component, { | |||
45 | this['panel_'+i].minHeight= p.minHeight; | 45 | this['panel_'+i].minHeight= p.minHeight; |
46 | this['panel_'+i].maxHeight = p.maxHeight; | 46 | this['panel_'+i].maxHeight = p.maxHeight; |
47 | this['panel_'+i].flexible = p.flexible; | 47 | this['panel_'+i].flexible = p.flexible; |
48 | this['panel_'+i].collapsed = p.collapsed; | ||
48 | this['panel_'+i].modulePath = p.modulePath; | 49 | this['panel_'+i].modulePath = p.modulePath; |
49 | this['panel_'+i].moduleName = p.moduleName; | 50 | this['panel_'+i].moduleName = p.moduleName; |
50 | this['panel_'+i].disabled = true; | 51 | this['panel_'+i].disabled = true; |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html index 5234b43d..1b7132b9 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html | |||
@@ -185,8 +185,8 @@ | |||
185 | <div class="layer-master">Master Layer | 185 | <div class="layer-master">Master Layer |
186 | <div class="tl-configbutton" data-montage-id="tl-configbutton"> | 186 | <div class="tl-configbutton" data-montage-id="tl-configbutton"> |
187 | <div class="tl-dropdown"> | 187 | <div class="tl-dropdown"> |
188 | <div class="checkable checked" data-montage-id="checkable_relative">Use relative positioning</div> | 188 | <div class="checkable" data-montage-id="checkable_relative">Use relative positioning</div> |
189 | <div class="checkable" data-montage-id="checkable_absolute">Use absolute positioning</div> | 189 | <div class="checkable checked" data-montage-id="checkable_absolute">Use absolute positioning</div> |
190 | <div class="nj-divider divider-horizontal"></div> | 190 | <div class="nj-divider divider-horizontal"></div> |
191 | <div class="checkable" data-montage-id="checkable_animated">Show only animated layers</div> | 191 | <div class="checkable" data-montage-id="checkable_animated">Show only animated layers</div> |
192 | </div> | 192 | </div> |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 7ee0ca16..7fb57396 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -6,10 +6,7 @@ | |||
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage; | 7 | var Montage = require("montage/core/core").Montage; |
8 | var Component = require("montage/ui/component").Component; | 8 | var Component = require("montage/ui/component").Component; |
9 | var Layer = require("js/panels/Timeline/Layer.reel").Layer; | ||
10 | var TimelineTrack = require("js/panels/Timeline/TimelineTrack.reel").TimelineTrack; | ||
11 | var nj = require("js/lib/NJUtils").NJUtils; | 9 | var nj = require("js/lib/NJUtils").NJUtils; |
12 | var ElementMediator = require("js/mediators/element-mediator").ElementMediator; | ||
13 | 10 | ||
14 | var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | 11 | var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { |
15 | 12 | ||
@@ -280,6 +277,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
280 | _scrollTracks: { | 277 | _scrollTracks: { |
281 | value: false | 278 | value: false |
282 | }, | 279 | }, |
280 | useAbsolutePosition:{ | ||
281 | value:true | ||
282 | }, | ||
283 | /* === END: Models === */ | 283 | /* === END: Models === */ |
284 | /* === BEGIN: Draw cycle === */ | 284 | /* === BEGIN: Draw cycle === */ |
285 | prepareForDraw:{ | 285 | prepareForDraw:{ |
@@ -1167,7 +1167,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
1167 | this.handleCheckableClick(event); | 1167 | this.handleCheckableClick(event); |
1168 | } | 1168 | } |
1169 | this.checkable_absolute.classList.remove("checked"); | 1169 | this.checkable_absolute.classList.remove("checked"); |
1170 | // TODO: Use relative positioning | 1170 | this.useAbsolutePosition = false; |
1171 | } | 1171 | } |
1172 | }, | 1172 | }, |
1173 | handleAbsoluteClick: { | 1173 | handleAbsoluteClick: { |
@@ -1176,7 +1176,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
1176 | this.handleCheckableClick(event); | 1176 | this.handleCheckableClick(event); |
1177 | } | 1177 | } |
1178 | this.checkable_relative.classList.remove("checked"); | 1178 | this.checkable_relative.classList.remove("checked"); |
1179 | // TODO: Use absolute positioning. | 1179 | this.useAbsolutePosition = true; |
1180 | } | 1180 | } |
1181 | }, | 1181 | }, |
1182 | handleCheckableClick: { | 1182 | handleCheckableClick: { |
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 145b03ef..aacddd3b 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |||
@@ -548,6 +548,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
548 | handleNewTween:{ | 548 | handleNewTween:{ |
549 | value:function (ev) { | 549 | value:function (ev) { |
550 | if (ev.offsetX > this.tweens[this.tweens.length - 1].tweenData.keyFramePosition) { | 550 | if (ev.offsetX > this.tweens[this.tweens.length - 1].tweenData.keyFramePosition) { |
551 | var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); | ||
552 | this.application.ninja.timeline.selectLayer(selectedIndex, false); | ||
551 | this.insertTween(ev.offsetX); | 553 | this.insertTween(ev.offsetX); |
552 | } else { | 554 | } else { |
553 | this.splitTween(ev); | 555 | this.splitTween(ev); |
@@ -557,6 +559,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
557 | 559 | ||
558 | insertTween:{ | 560 | insertTween:{ |
559 | value:function (clickPos) { | 561 | value:function (clickPos) { |
562 | var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); | ||
563 | this.application.ninja.timeline.selectLayer(selectedIndex, true); | ||
564 | |||
560 | var currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); | 565 | var currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); |
561 | var currentMillisec = currentMillisecPerPixel * clickPos; | 566 | var currentMillisec = currentMillisecPerPixel * clickPos; |
562 | this.trackDuration = currentMillisec; | 567 | this.trackDuration = currentMillisec; |
diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index e4fb42b3..7dcd397c 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js | |||
@@ -6,7 +6,6 @@ | |||
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage; | 7 | var Montage = require("montage/core/core").Montage; |
8 | var Component = require("montage/ui/component").Component; | 8 | var Component = require("montage/ui/component").Component; |
9 | var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; | ||
10 | 9 | ||
11 | var Tween = exports.Tween = Montage.create(Component, { | 10 | var Tween = exports.Tween = Montage.create(Component, { |
12 | 11 | ||
@@ -186,7 +185,7 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
186 | 185 | ||
187 | setAbsoluteTweenProperties:{ | 186 | setAbsoluteTweenProperties:{ |
188 | value:function (eventDetail) { | 187 | value:function (eventDetail) { |
189 | console.log(eventDetail); |