diff options
Diffstat (limited to 'js/panels')
-rwxr-xr-x | js/panels/Panel.reel/Panel.html | 20 | ||||
-rwxr-xr-x | js/panels/Panel.reel/Panel.js | 4 | ||||
-rwxr-xr-x | js/panels/PanelContainer.reel/PanelContainer.js | 77 | ||||
-rw-r--r-- | js/panels/Timeline/Collapser.js | 62 | ||||
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.html | 129 | ||||
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 172 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html | 13 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 478 | ||||
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html | 136 | ||||
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 116 |
10 files changed, 587 insertions, 620 deletions
diff --git a/js/panels/Panel.reel/Panel.html b/js/panels/Panel.reel/Panel.html index 04e2930a..43b87940 100755 --- a/js/panels/Panel.reel/Panel.html +++ b/js/panels/Panel.reel/Panel.html | |||
@@ -113,6 +113,21 @@ | |||
113 | } | 113 | } |
114 | }, | 114 | }, |
115 | 115 | ||
116 | "disabledCondition": { | ||
117 | "module": "montage/ui/condition.reel", | ||
118 | "name": "Condition", | ||
119 | "properties": { | ||
120 | "element": {"#": "disabledCondition"} | ||
121 | }, | ||
122 | "bindings": { | ||
123 | "condition": { | ||
124 | "boundObject": {"@": "owner"}, | ||
125 | "boundObjectPropertyPath": "disabled", | ||
126 | "oneway": true | ||
127 | } | ||
128 | } | ||
129 | }, | ||
130 | |||
116 | "owner": { | 131 | "owner": { |
117 | "module": "js/panels/Panel.reel", | 132 | "module": "js/panels/Panel.reel", |
118 | "name": "Panel", | 133 | "name": "Panel", |
@@ -136,9 +151,8 @@ | |||
136 | </div> | 151 | </div> |
137 | <div class="panelBody"> | 152 | <div class="panelBody"> |
138 | <div class="panelBodyContent"> | 153 | <div class="panelBodyContent"> |
139 | <div id="panelObject" class="panelObjects"> | 154 | <div id="disabledCondition" class="panelDisabled"></div> |
140 | 155 | <div id="panelObject" class="panelObjects"></div> | |
141 | </div> | ||
142 | </div> | 156 | </div> |
143 | </div> | 157 | </div> |
144 | <div id="resizeBar" class="resizeBar"></div> | 158 | <div id="resizeBar" class="resizeBar"></div> |
diff --git a/js/panels/Panel.reel/Panel.js b/js/panels/Panel.reel/Panel.js index 2b308258..33f9b3a7 100755 --- a/js/panels/Panel.reel/Panel.js +++ b/js/panels/Panel.reel/Panel.js | |||
@@ -57,6 +57,10 @@ exports.Panel = Montage.create(Component, { | |||
57 | value: null | 57 | value: null |
58 | }, | 58 | }, |
59 | 59 | ||
60 | disabled: { | ||
61 | value:false | ||
62 | }, | ||
63 | |||
60 | collapsed: { | 64 | collapsed: { |
61 | get: function() { | 65 | get: function() { |
62 | return this._collapsed; | 66 | return this._collapsed; |
diff --git a/js/panels/PanelContainer.reel/PanelContainer.js b/js/panels/PanelContainer.reel/PanelContainer.js index dd720bd3..c40bbc21 100755 --- a/js/panels/PanelContainer.reel/PanelContainer.js +++ b/js/panels/PanelContainer.reel/PanelContainer.js | |||
@@ -47,6 +47,7 @@ exports.PanelContainer = Montage.create(Component, { | |||
47 | this['panel_'+i].flexible = p.flexible; | 47 | this['panel_'+i].flexible = p.flexible; |
48 | this['panel_'+i].modulePath = p.modulePath; | 48 | this['panel_'+i].modulePath = p.modulePath; |
49 | this['panel_'+i].moduleName = p.moduleName; | 49 | this['panel_'+i].moduleName = p.moduleName; |
50 | this['panel_'+i].disabled = true; | ||
50 | 51 | ||
51 | this.currentPanelState[p.name] = {}; | 52 | this.currentPanelState[p.name] = {}; |
52 | this.currentPanelState.version = "1.0"; | 53 | this.currentPanelState.version = "1.0"; |
@@ -64,6 +65,8 @@ exports.PanelContainer = Montage.create(Component, { | |||
64 | this.application.localStorage.setItem("panels", this.currentPanelState); | 65 | this.application.localStorage.setItem("panels", this.currentPanelState); |
65 | 66 | ||
66 | 67 | ||
68 | this.eventManager.addEventListener( "onOpenDocument", this, false); | ||
69 | this.eventManager.addEventListener( "closeDocument", this, false); | ||
67 | } | 70 | } |
68 | }, | 71 | }, |
69 | 72 | ||
@@ -81,7 +84,25 @@ exports.PanelContainer = Montage.create(Component, { | |||
81 | 84 | ||
82 | handleResize: { | 85 | handleResize: { |
83 | value: function(e) { | 86 | value: function(e) { |
84 | this._setPanelsSizes(null); | 87 | this._redrawPanels(null, true); |
88 | } | ||
89 | }, | ||
90 | |||
91 | handleOnOpenDocument: { | ||
92 | value: function(){ | ||
93 | this.panels.forEach(function(obj) { | ||
94 | obj.disabled = false; | ||
95 | }); | ||
96 | } | ||
97 | }, | ||
98 | |||
99 | handleCloseDocument: { | ||
100 | value: function(){ | ||
101 | if(!this.application.ninja.documentController.activeDocument) { | ||
102 | this.panels.forEach(function(obj) { | ||
103 | obj.disabled = true; | ||
104 | }); | ||
105 | } | ||
85 | } | 106 | } |
86 | }, | 107 | }, |
87 | 108 | ||
@@ -102,10 +123,21 @@ exports.PanelContainer = Montage.create(Component, { | |||
102 | 123 | ||
103 | if(draggedIndex !== droppedIndex) { | 124 | if(draggedIndex !== droppedIndex) { |
104 | // switch panels | 125 | // switch panels |
105 | this.panels[droppedIndex].element.parentNode.insertBefore(this.panels[draggedIndex].element, this.panels[droppedIndex].element); | 126 | if (droppedIndex === draggedIndex +1) { |
127 | if(this.panels[droppedIndex].element.nextSibling) { | ||
128 | this.panels[droppedIndex].element.parentNode.insertBefore(this.panels[draggedIndex].element, this.panels[droppedIndex].element.nextSibling); | ||
129 | } else { | ||
130 | return this.appendChild(this.panels[draggedIndex].element); | ||
131 | } | ||
132 | } else { | ||
133 | |||
134 | this.panels[droppedIndex].element.parentNode.insertBefore(this.panels[draggedIndex].element, this.panels[droppedIndex].element); | ||
135 | } | ||
136 | var panelRemoved = this.panels.splice(draggedIndex, 1); | ||
137 | this.panels.splice(droppedIndex, 0, panelRemoved[0]); | ||
138 | |||
106 | } | 139 | } |
107 | 140 | ||
108 | this._setPanelsSizes(null); | ||
109 | } | 141 | } |
110 | }, | 142 | }, |
111 | 143 | ||
@@ -114,12 +146,12 @@ exports.PanelContainer = Montage.create(Component, { | |||
114 | var len = this.panels.length, setLocked = true; | 146 | var len = this.panels.length, setLocked = true; |
115 | 147 | ||
116 | for(var i = 0; i < len; i++) { | 148 | for(var i = 0; i < len; i++) { |
117 | if(this['panel_'+i] === panelActivated || panelActivated === null) { | 149 | if(this.panels[i] === panelActivated || panelActivated === null) { |
118 | setLocked = false; | 150 | setLocked = false; |
119 | } | 151 | } |
120 | 152 | ||
121 | this['panel_'+i].locked = setLocked; | 153 | this.panels[i].locked = setLocked; |
122 | this['panel_'+i].needsDraw = true; | 154 | this.panels[i].needsDraw = true; |
123 | } | 155 | } |
124 | } | 156 | } |
125 | }, | 157 | }, |
@@ -133,7 +165,12 @@ exports.PanelContainer = Montage.create(Component, { | |||
133 | setLocked = false; | 165 | setLocked = false; |
134 | } | 166 | } |
135 | 167 | ||
136 | var childrensMinHeights = ((len - 1) * 26) + panelActivated.minHeight; | 168 | var childrensMinHeights = (len * 26); |
169 | if (panelActivated) { | ||
170 | if (!panelActivated.collapsed) { | ||
171 | childrensMinHeights+= panelActivated.minHeight -26; | ||
172 | } | ||
173 | } | ||
137 | 174 | ||
138 | for(var i = 0; i < len; i++) { | 175 | for(var i = 0; i < len; i++) { |
139 | var obj = this['panel_'+i]; | 176 | var obj = this['panel_'+i]; |
@@ -169,25 +206,27 @@ exports.PanelContainer = Montage.create(Component, { | |||
169 | var unlockPanels = true; | 206 | var unlockPanels = true; |
170 | var afterPanel = false; | 207 | var afterPanel = false; |
171 | var panelName = e.target.parentComponent.name; | 208 | var panelName = e.target.parentComponent.name; |
209 | |||
210 | this.panels.forEach(function(obj) { | ||
211 | if(afterPanel) { | ||
212 | if(obj.flexible && obj.collapsed === false) { | ||
213 | unlockPanels = false; | ||
214 | } | ||
215 | } | ||
216 | if (obj.name === panelName) { | ||
217 | afterPanel = true; | ||
218 | } | ||
219 | }); | ||
220 | |||
172 | switch(e.target.identifier) { | 221 | switch(e.target.identifier) { |
173 | case "btnCollapse": | 222 | case "btnCollapse": |
174 | this.currentPanelState[e.target.parentComponent.name].collapsed = e.target.parentComponent.collapsed; | 223 | this.currentPanelState[e.target.parentComponent.name].collapsed = e.target.parentComponent.collapsed; |
175 | this.application.localStorage.setItem("panels", this.currentPanelState); | 224 | this.application.localStorage.setItem("panels", this.currentPanelState); |
176 | this._setPanelsSizes(e.target.parentComponent); | 225 | //this._setPanelsSizes(e.target.parentComponent); |
177 | this._redrawPanels(e.target.parentComponent, unlockPanels); | 226 | this._redrawPanels(e.target.parentComponent, unlockPanels); |
178 | break; | 227 | break; |
179 | case "btnClose": | 228 | case "btnClose": |
180 | this.panelController.content.forEach(function(obj) { | 229 | //this.panelController.removeObjects(obj); |
181 | if(afterPanel) { | ||
182 | if(obj.flexible) { | ||
183 | unlockPanels = false; | ||
184 | } | ||
185 | } | ||
186 | if (obj.name === panelName) { | ||
187 | afterPanel = true; | ||
188 |