diff options
Diffstat (limited to 'js/panels')
-rwxr-xr-x | js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js | 2 | ||||
-rwxr-xr-x | js/panels/Panel.reel/Panel.js | 100 | ||||
-rwxr-xr-x | js/panels/PanelContainer.reel/PanelContainer.html | 110 | ||||
-rwxr-xr-x | js/panels/PanelContainer.reel/PanelContainer.js (renamed from js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js) | 75 | ||||
-rwxr-xr-x | js/panels/PanelContainer/PanelContainer.reel/PanelContainer.html | 146 | ||||
-rw-r--r-- | js/panels/drag-drop-composer.js | 2 |
6 files changed, 218 insertions, 217 deletions
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index b4eec771..b6bee37d 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js | |||
@@ -118,7 +118,7 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component | |||
118 | didCreate: { | 118 | didCreate: { |
119 | value: function() { | 119 | value: function() { |
120 | // Setup the drop delegate | 120 | // Setup the drop delegate |
121 | this.application.ninja.dragDropMediator.dropDelegate = this; | 121 | // this.application.ninja.dragDropMediator.dropDelegate = this; |
122 | // Loop through the component and load the JSON data for them | 122 | // Loop through the component and load the JSON data for them |
123 | this._loadComponents(); | 123 | this._loadComponents(); |
124 | } | 124 | } |
diff --git a/js/panels/Panel.reel/Panel.js b/js/panels/Panel.reel/Panel.js index e0bf3f18..2b308258 100755 --- a/js/panels/Panel.reel/Panel.js +++ b/js/panels/Panel.reel/Panel.js | |||
@@ -9,31 +9,52 @@ var Component = require("montage/ui/component").Component; | |||
9 | 9 | ||
10 | exports.Panel = Montage.create(Component, { | 10 | exports.Panel = Montage.create(Component, { |
11 | 11 | ||
12 | name: { value: "Panel" }, | 12 | name: { |
13 | collapsedHeight: {value: 26}, | 13 | value: "Panel" |
14 | _collapsed: {value: false}, | 14 | }, |
15 | _height: { value: 200 }, | 15 | |
16 | minHeight: {value: 200 }, | 16 | _collapsed: { |
17 | maxHeight: { value: null}, | 17 | value: false |
18 | flexible: {value: true}, | 18 | }, |
19 | _locked: { value: false}, | 19 | |
20 | isResizing: {value: false }, | 20 | _height: { |
21 | resizer: {value: null }, | 21 | value: 200 |
22 | modulePath: {value: null}, | 22 | }, |
23 | moduleName: {value: null}, | 23 | |
24 | _contentComponent: {value: null}, | 24 | minHeight: { |
25 | 25 | value: 200 | |
26 | contentComponent: { | 26 | }, |
27 | get: function() { | 27 | |
28 | return this._contentComponent; | 28 | maxHeight: { |
29 | }, | 29 | value: null |
30 | set: function(val) { | 30 | }, |
31 | if (val !== null && val !== this._contentComponent) { | 31 | |
32 | this.panelContent.content = val; | 32 | flexible: { |
33 | this.panelContent.needsDraw = true; | 33 | value: true |
34 | this._contentComponent = val; | 34 | }, |
35 | } | 35 | |
36 | } | 36 | _locked: { |
37 | value: false | ||
38 | }, | ||
39 | |||
40 | isResizing: { | ||
41 | value: false | ||
42 | }, | ||
43 | |||
44 | _resizedHeight: { | ||
45 | value: 0 | ||
46 | }, | ||
47 | |||
48 | resizer: { | ||
49 | value: null | ||
50 | }, | ||
51 | |||
52 | modulePath: { | ||
53 | value: null | ||
54 | }, | ||
55 | |||
56 | moduleName: { | ||
57 | value: null | ||
37 | }, | 58 | }, |
38 | 59 | ||
39 | collapsed: { | 60 | collapsed: { |
@@ -63,10 +84,6 @@ exports.Panel = Montage.create(Component, { | |||
63 | } | 84 | } |
64 | }, | 85 | }, |
65 | 86 | ||
66 | _resizedHeight: { | ||
67 | value: 0 | ||
68 | }, | ||
69 | |||
70 | locked: { | 87 | locked: { |
71 | get: function() { | 88 | get: function() { |
72 | return this._locked; | 89 | return this._locked; |
@@ -94,17 +111,20 @@ exports.Panel = Montage.create(Component, { | |||
94 | 111 | ||
95 | prepareForDraw: { | 112 | prepareForDraw: { |
96 | value: function() { | 113 | value: function() { |
97 | //TODO: This line should not be here this line hits each time a panel is loaded. Will Need to move to instance call; | 114 | if(this.name === "Color") { |
98 | this.application.ninja.colorController.colorView = this.application.ninja.colorController.colorPanelBase.create(); | 115 | this.application.ninja.colorController.colorView = this.application.ninja.colorController.colorPanelBase.create(); |
99 | var myContent; | 116 | } |
100 | var that = this; | 117 | |
101 | 118 | if(this.modulePath && this.moduleName) { | |
102 | myContent = require.async(this.modulePath) | 119 | // Load the slot content |
103 | .then(function(panelContent) { | 120 | var that = this; |
104 | var componentRequire = panelContent[that.moduleName]; | 121 | require.async(this.modulePath) |
105 | that.contentComponent = componentRequire.create(); | 122 | .then(function(panelContent) { |
106 | }) | 123 | var componentRequire = panelContent[that.moduleName]; |
107 | .end(); | 124 | that.panelContent.content = componentRequire.create(); |
125 | }) | ||
126 | .end(); | ||
127 | } | ||
108 | } | 128 | } |
109 | }, | 129 | }, |
110 | 130 | ||
diff --git a/js/panels/PanelContainer.reel/PanelContainer.html b/js/panels/PanelContainer.reel/PanelContainer.html new file mode 100755 index 00000000..251e86e4 --- /dev/null +++ b/js/panels/PanelContainer.reel/PanelContainer.html | |||
@@ -0,0 +1,110 @@ | |||
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 | |||
10 | <script type="text/montage-serialization"> | ||
11 | { | ||
12 | "panelData": { | ||
13 | "module": "js/data/panels-data", | ||
14 | "name": "PanelsData" | ||
15 | }, | ||
16 | |||
17 | "panel_0": { | ||
18 | "module": "js/panels/Panel.reel", | ||
19 | "name": "Panel", | ||
20 | "properties": { | ||
21 | "element": {"#": "panel_0"} | ||
22 | } | ||
23 | }, | ||
24 | |||
25 | "panel_1": { | ||
26 | "module": "js/panels/Panel.reel", | ||
27 | "name": "Panel", | ||
28 | "properties": { | ||
29 | "element": {"#": "panel_1"} | ||
30 | } | ||
31 | }, | ||
32 | |||
33 | "panel_2": { | ||
34 | "module": "js/panels/Panel.reel", | ||
35 | "name": "Panel", | ||
36 | "properties": { | ||
37 | "element": {"#": "panel_2"} | ||
38 | } | ||
39 | }, | ||
40 | |||
41 | "panel_3": { | ||
42 | "module": "js/panels/Panel.reel", | ||
43 | "name": "Panel", | ||
44 | "properties": { | ||
45 | "element": {"#": "panel_3"} | ||
46 | } | ||
47 | }, | ||
48 | |||
49 | "panel_4": { | ||
50 | "module": "js/panels/Panel.reel", | ||
51 | "name": "Panel", | ||
52 | "properties": { | ||
53 | "element": {"#": "panel_4"} | ||
54 | } | ||
55 | }, | ||
56 | |||
57 | "panel_5": { | ||
58 | "module": "js/panels/Panel.reel", | ||
59 | "name": "Panel", | ||
60 | "properties": { | ||
61 | "element": {"#": "panel_5"} | ||
62 | } | ||
63 | }, | ||
64 | |||
65 | "owner": { | ||
66 | "module": "js/panels/PanelContainer.reel", | ||
67 | "name": "PanelContainer", | ||
68 | "properties": { | ||
69 | "element": {"#": "panelContainer"}, | ||
70 | "panelData": {"@": "panelData" }, | ||
71 | "panelController" : {"@": "PanelController"}, | ||
72 | "panel_0": {"@": "panel_0"}, | ||
73 | "panel_1": {"@": "panel_1"}, | ||
74 | "panel_2": {"@": "panel_2"}, | ||
75 | "panel_3": {"@": "panel_3"}, | ||
76 | "panel_4": {"@": "panel_4"}, | ||
77 | "panel_5": {"@": "panel_5"} | ||
78 | }, | ||
79 | "listeners": [ | ||
80 | { | ||
81 | "type": "panelResizing", | ||
82 | "listener": {"@": "owner"} | ||
83 | }, | ||
84 | { | ||
85 | "type": "action", | ||
86 | "listener": {"@": "owner"} | ||
87 | }, | ||
88 | { | ||
89 | "type": "dropped", | ||
90 | "listener": {"@": "owner"} | ||
91 | } | ||
92 | ] | ||
93 | } | ||
94 | } | ||
95 | </script> | ||
96 | |||
97 | </head> | ||
98 | <body> | ||
99 | &l |