aboutsummaryrefslogtreecommitdiff
path: root/js/panels
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels')
-rwxr-xr-xjs/panels/Panel.reel/Panel.js10
-rwxr-xr-xjs/panels/PanelContainer.reel/PanelContainer.html20
-rwxr-xr-xjs/panels/PanelContainer.reel/PanelContainer.js29
-rw-r--r--js/panels/binding-panel.reel/binding-panel.css0
-rw-r--r--js/panels/binding-panel.reel/binding-panel.html28
-rw-r--r--js/panels/binding-panel.reel/binding-panel.js12
-rw-r--r--js/panels/objects.reel/objects.css0
-rw-r--r--js/panels/objects.reel/objects.html28
-rw-r--r--js/panels/objects.reel/objects.js7
9 files changed, 127 insertions, 7 deletions
diff --git a/js/panels/Panel.reel/Panel.js b/js/panels/Panel.reel/Panel.js
index 613bef4b..bd9b4e2f 100755
--- a/js/panels/Panel.reel/Panel.js
+++ b/js/panels/Panel.reel/Panel.js
@@ -13,6 +13,10 @@ exports.Panel = Montage.create(Component, {
13 value: "Panel" 13 value: "Panel"
14 }, 14 },
15 15
16 groups: {
17 value: []
18 },
19
16 _collapsed: { 20 _collapsed: {
17 value: false 21 value: false
18 }, 22 },
@@ -119,6 +123,12 @@ exports.Panel = Montage.create(Component, {
119 this.application.ninja.colorController.colorView = this.application.ninja.colorController.colorPanelBase.create(); 123 this.application.ninja.colorController.colorView = this.application.ninja.colorController.colorPanelBase.create();
120 } 124 }
121 125
126 if(this.groups) {
127 this.groups.forEach(function(className) {
128 this.element.classList.add(className);
129 }.bind(this));
130 }
131
122 if(this.modulePath && this.moduleName) { 132 if(this.modulePath && this.moduleName) {
123 // Load the slot content 133 // Load the slot content
124 var that = this; 134 var that = this;
diff --git a/js/panels/PanelContainer.reel/PanelContainer.html b/js/panels/PanelContainer.reel/PanelContainer.html
index ccefd3ae..f1d1a855 100755
--- a/js/panels/PanelContainer.reel/PanelContainer.html
+++ b/js/panels/PanelContainer.reel/PanelContainer.html
@@ -62,6 +62,20 @@
62 } 62 }
63 }, 63 },
64 64
65 "panel_7": {
66 "prototype": "js/panels/Panel.reel",
67 "properties": {
68 "element": {"#": "panel_7"}
69 }
70 },
71
72 "panel_8": {
73 "prototype": "js/panels/Panel.reel",
74 "properties": {
75 "element": {"#": "panel_8"}
76 }
77 },
78
65 "owner": { 79 "owner": {
66 "prototype": "js/panels/PanelContainer.reel", 80 "prototype": "js/panels/PanelContainer.reel",
67 "properties": { 81 "properties": {
@@ -73,7 +87,9 @@
73 "panel_3": {"@": "panel_3"}, 87 "panel_3": {"@": "panel_3"},
74 "panel_4": {"@": "panel_4"}, 88 "panel_4": {"@": "panel_4"},
75 "panel_5": {"@": "panel_5"}, 89 "panel_5": {"@": "panel_5"},
76 "panel_6": {"@": "panel_6"} 90 "panel_6": {"@": "panel_6"},
91 "panel_7": {"@": "panel_7"},
92 "panel_8": {"@": "panel_8"}
77 }, 93 },
78 "listeners": [ 94 "listeners": [
79 { 95 {
@@ -104,6 +120,8 @@
104 <article data-montage-id="panel_4"></article> 120 <article data-montage-id="panel_4"></article>
105 <article data-montage-id="panel_5"></article> 121 <article data-montage-id="panel_5"></article>
106 <article data-montage-id="panel_6"></article> 122 <article data-montage-id="panel_6"></article>
123 <article data-montage-id="panel_7"></article>
124 <article data-montage-id="panel_8"></article>
107 </article> 125 </article>
108 </section> 126 </section>
109</body> 127</body>
diff --git a/js/panels/PanelContainer.reel/PanelContainer.js b/js/panels/PanelContainer.reel/PanelContainer.js
index 8d1d6a5e..b4f77317 100755
--- a/js/panels/PanelContainer.reel/PanelContainer.js
+++ b/js/panels/PanelContainer.reel/PanelContainer.js
@@ -21,6 +21,18 @@ exports.PanelContainer = Montage.create(Component, {
21 value: [] 21 value: []
22 }, 22 },
23 23
24 panelsAvailable: {
25 value: function() {
26 var pAvail = [];
27 this.panels.forEach(function(obj) {
28 if (window.getComputedStyle(obj.element).display !== "none") {
29 pAvail.push(obj);
30 }
31 });
32 return pAvail;
33 }
34 },
35
24 currentPanelState: { 36 currentPanelState: {
25 value: {} 37 value: {}
26 }, 38 },
@@ -49,6 +61,8 @@ exports.PanelContainer = Montage.create(Component, {
49 this['panel_'+i].modulePath = p.modulePath; 61 this['panel_'+i].modulePath = p.modulePath;
50 this['panel_'+i].moduleName = p.moduleName; 62 this['panel_'+i].moduleName = p.moduleName;
51 this['panel_'+i].disabled = true; 63 this['panel_'+i].disabled = true;
64 this['panel_'+i].groups = p.groups;
65
52 66
53 this.currentPanelState[p.name] = {}; 67 this.currentPanelState[p.name] = {};
54 this.currentPanelState.version = "1.0"; 68 this.currentPanelState.version = "1.0";
@@ -144,15 +158,17 @@ exports.PanelContainer = Montage.create(Component, {
144 158
145 _setPanelsSizes: { 159 _setPanelsSizes: {
146 value: function(panelActivated) { 160 value: function(panelActivated) {
147 var len = this.panels.length, setLocked = true; 161 var availablePanels = this.panelsAvailable();
162 var len = availablePanels.length;
163 var setLocked = true;
148 164
149 for(var i = 0; i < len; i++) { 165 for(var i = 0; i < len; i++) {
150 if(this.panels[i] === panelActivated || panelActivated === null) { 166 if(availablePanels[i] === panelActivated || panelActivated === null) {
151 setLocked = false; 167 setLocked = false;
152 } 168 }
153 169
154 this.panels[i].locked = setLocked; 170 availablePanels[i].locked = setLocked;
155 this.panels[i].needsDraw = true; 171 availablePanels[i].needsDraw = true;
156 } 172 }
157 } 173 }
158 }, 174 },
@@ -160,7 +176,8 @@ exports.PanelContainer = Montage.create(Component, {
160 _redrawPanels: { 176 _redrawPanels: {
161 value: function(panelActivated, unlockPanels) { 177 value: function(panelActivated, unlockPanels) {
162 var maxHeight = this.element.offsetHeight, setLocked = true; 178 var maxHeight = this.element.offsetHeight, setLocked = true;
163 var len = this.panels.length; 179 var availablePanels = this.panelsAvailable();
180 var len = availablePanels.length;
164 181
165 if(unlockPanels === true) { 182 if(unlockPanels === true) {
166 setLocked = false; 183 setLocked = false;
@@ -174,7 +191,7 @@ exports.PanelContainer = Montage.create(Component, {
174 } 191 }
175 192
176 for(var i = 0; i < len; i++) { 193 for(var i = 0; i < len; i++) {
177 var obj = this['panel_'+i]; 194 var obj = availablePanels[i];
178 195
179 if(obj === panelActivated) { 196 if(obj === panelActivated) {
180 setLocked = false; 197 setLocked = false;
diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/js/panels/binding-panel.reel/binding-panel.css
diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html
new file mode 100644
index 00000000..0db7b95f
--- /dev/null
+++ b/js/panels/binding-panel.reel/binding-panel.html
@@ -0,0 +1,28 @@
1<!DOCTYPE html>
2<!-- <copyright>
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/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html lang="en">
8<head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" href="binding-panel.css" type="text/css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "prototype": "js/panels/binding-panel.reel",
15 "properties": {
16 "element": {"#": "binding"}
17 }
18 }
19
20 }
21 </script>
22 </head>
23<body>
24 <div data-montage-id="binding">
25 this is a test
26 </div>
27</body>
28</html> \ No newline at end of file
diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js
new file mode 100644
index 00000000..03fe5723
--- /dev/null
+++ b/js/panels/binding-panel.reel/binding-panel.js
@@ -0,0 +1,12 @@
1var Montage = require("montage/core/core").Montage,
2 Component = require("montage/ui/component").Component;
3
4
5exports.BindingPanel = Montage.create(Component, {
6
7 prepareForDraw: {
8 value: function() {