diff options
16 files changed, 457 insertions, 7 deletions
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 885d710f..e78c1ef1 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js | |||
@@ -94,11 +94,18 @@ var stylesController = exports.StylesController = Montage.create(Component, { | |||
94 | // Returns null if sheet not found (as in non-ninja projects) | 94 | // Returns null if sheet not found (as in non-ninja projects) |
95 | // Setter will handle null case | 95 | // Setter will handle null case |
96 | this.defaultStylesheet = this.getSheetFromElement(this.CONST.DEFAULT_SHEET_ID); | 96 | this.defaultStylesheet = this.getSheetFromElement(this.CONST.DEFAULT_SHEET_ID); |
97 | 97 | ||
98 | //debugger; | 98 | this.userStyleSheets = nj.toArray(document._document.styleSheets).filter(function(sheet) { |
99 | return sheet !== this._stageStylesheet; | ||
100 | }, this); | ||
101 | |||
102 | NJevent('styleSheetsReady', this); | ||
99 | }, | 103 | }, |
100 | enumerable : false | 104 | enumerable : false |
101 | }, | 105 | }, |
106 | userStyleSheets : { | ||
107 | value : null | ||
108 | }, | ||
102 | _stageStylesheet : { | 109 | _stageStylesheet : { |
103 | value : null | 110 | value : null |
104 | }, | 111 | }, |
diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js index 887743c5..49dfd706 100755 --- a/js/lib/NJUtils.js +++ b/js/lib/NJUtils.js | |||
@@ -19,16 +19,18 @@ exports.NJUtils = Object.create(Object.prototype, { | |||
19 | 19 | ||
20 | ///// Quick "getElementById" | 20 | ///// Quick "getElementById" |
21 | $ : { | 21 | $ : { |
22 | value: function(id) { | 22 | value: function(id, doc) { |
23 | return document.getElementById(id); | 23 | doc = doc || document; |
24 | return doc.getElementById(id); | ||
24 | } | 25 | } |
25 | }, | 26 | }, |
26 | 27 | ||
27 | ///// Quick "getElementsByClassName" which also returns as an Array | 28 | ///// Quick "getElementsByClassName" which also returns as an Array |
28 | ///// Can return as NodeList by passing true as second argument | 29 | ///// Can return as NodeList by passing true as second argument |
29 | $$ : { | 30 | $$ : { |
30 | value: function(className, asNodeList) { | 31 | value: function(className, asNodeList, doc) { |
31 | var list = document.getElementsByClassName(className); | 32 | doc = doc || document; |
33 | var list = doc.getElementsByClassName(className); | ||
32 | return (asNodeList) ? list : this.toArray(list); | 34 | return (asNodeList) ? list : this.toArray(list); |
33 | } | 35 | } |
34 | }, | 36 | }, |
diff --git a/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js b/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js index b8223471..db0f494b 100755 --- a/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js +++ b/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js | |||
@@ -16,6 +16,7 @@ var ComponentsPanel = require("js/panels/Components/ComponentsPanel").Components | |||
16 | var ProjectPanel = require("js/panels/Project/ProjectPanel").ProjectPanel; | 16 | var ProjectPanel = require("js/panels/Project/ProjectPanel").ProjectPanel; |
17 | var MaterialsPanel = require("js/panels/Materials/MaterialsPanel").MaterialsPanel; | 17 | var MaterialsPanel = require("js/panels/Materials/MaterialsPanel").MaterialsPanel; |
18 | var PresetsPanel = require("js/panels/presets/presets-panel").PresetsPanel; | 18 | var PresetsPanel = require("js/panels/presets/presets-panel").PresetsPanel; |
19 | var CSSPanelNew = require("js/panels/css-panel/css-panel-container").CSSPanelContainer; | ||
19 | 20 | ||
20 | exports.PanelContainer = Montage.create(Component, { | 21 | exports.PanelContainer = Montage.create(Component, { |
21 | lastOffset: { | 22 | lastOffset: { |
@@ -45,7 +46,7 @@ exports.PanelContainer = Montage.create(Component, { | |||
45 | }, | 46 | }, |
46 | 47 | ||
47 | initPanelOrder: { | 48 | initPanelOrder: { |
48 | value: ['PropertiesPanel','ColorPanel','ComponentsPanel','ProjectPanel','CSSPanel','MaterialsPanel','PresetsPanel'] | 49 | value: ['CSSPanelNew','PropertiesPanel','ColorPanel','ComponentsPanel','ProjectPanel','CSSPanel','MaterialsPanel','PresetsPanel'] |
49 | }, | 50 | }, |
50 | 51 | ||
51 | panelOrder: { | 52 | panelOrder: { |
@@ -101,6 +102,7 @@ exports.PanelContainer = Montage.create(Component, { | |||
101 | this.addEventListener("change@appModel.CSSPanel", this, false); | 102 | this.addEventListener("change@appModel.CSSPanel", this, false); |
102 | this.addEventListener("change@appModel.MaterialsPanel", this, false); | 103 | this.addEventListener("change@appModel.MaterialsPanel", this, false); |
103 | this.addEventListener("change@appModel.PresetsPanel", this, false); | 104 | this.addEventListener("change@appModel.PresetsPanel", this, false); |
105 | this.addEventListener("change@appModel.CSSPanelNew", this, false); | ||
104 | } | 106 | } |
105 | }, | 107 | }, |
106 | 108 | ||
diff --git a/js/panels/css-panel/css-panel-container.js b/js/panels/css-panel/css-panel-container.js new file mode 100644 index 00000000..aeaa2d13 --- /dev/null +++ b/js/panels/css-panel/css-panel-container.js | |||
@@ -0,0 +1,15 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage; | ||
8 | var PanelBase = require("js/panels/PanelBase").PanelBase; | ||
9 | var Content = require("js/panels/css-panel/css-panel.reel").CSSPanelNew; | ||
10 | |||
11 | exports.CSSPanelContainer = Montage.create(PanelBase, { | ||
12 | panelName : { value: "CSSPanelNew" }, | ||
13 | minHeight : { value: 200 }, | ||
14 | content : { value: Content } | ||
15 | }); \ No newline at end of file | ||
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.css b/js/panels/css-panel/css-panel.reel/css-panel.css new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/js/panels/css-panel/css-panel.reel/css-panel.css | |||
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.html b/js/panels/css-panel/css-panel.reel/css-panel.html new file mode 100644 index 00000000..86bfbbb7 --- /dev/null +++ b/js/panels/css-panel/css-panel.reel/css-panel.html | |||
@@ -0,0 +1,45 @@ | |||
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="css-panel.css" type="text/css"> | ||
11 | <script type="text/montage-serialization"> | ||
12 | { | ||
13 | "owner": { | ||
14 | "module" : "js/panels/css-panel/css-panel.reel", | ||
15 | "name" : "CSSPanel", | ||
16 | "properties" : { | ||
17 | "element" : {"#" : "container"} | ||
18 | } | ||
19 | }, | ||
20 | "styleSheetView": { | ||
21 | "module" : "js/panels/css-panel/style-sheets-view.reel", | ||
22 | "name": "StyleSheetsView", | ||
23 | "properties": { | ||
24 | "element": {"#": "style-sheet-view" } | ||
25 | } | ||
26 | }, | ||
27 | "stylesViewContainer": { | ||
28 | "module" : "js/panels/css-panel/styles-view-container.reel", | ||
29 | "name": "StylesViewContainer", | ||
30 | "properties": { | ||
31 | "element": {"#": "styles-view-container" } | ||
32 | } | ||
33 | } | ||
34 | } | ||
35 | </script> | ||
36 | </head> | ||
37 | <body> | ||
38 | <section id="container" class="css-panel"> | ||
39 | <h2>Style Sheets</h2> | ||
40 | <div id="style-sheet-view"></div> | ||
41 | <h2>Styles</h2> | ||
42 | <div id="styles-view-container"></div> | ||
43 | </section> | ||
44 | </body> | ||
45 | </html> \ No newline at end of file | ||
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.js b/js/panels/css-panel/css-panel.reel/css-panel.js new file mode 100644 index 00000000..a593f1c4 --- /dev/null +++ b/js/panels/css-panel/css-panel.reel/css-panel.js | |||
@@ -0,0 +1,33 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component; | ||
9 | |||
10 | exports.CSSPanelNew = Montage.create(Component, { | ||
11 | hasTemplate: { | ||
12 | value: true | ||
13 | }, | ||
14 | condition: { | ||
15 | value: false | ||
16 | }, | ||
17 | templateDidLoad : { | ||
18 | value: function() { | ||
19 | console.log("css panel : template did load"); | ||
20 | //this.condition = true; | ||
21 | } | ||
22 | }, | ||
23 | prepareForDraw : { | ||
24 | value: function() { | ||
25 | console.log("css panel : prepare for draw"); | ||
26 | } | ||
27 | }, | ||
28 | draw : { | ||
29 | value: function() { | ||
30 | console.log("css panel : draw"); | ||
31 | } | ||
32 | } | ||
33 | }); | ||
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.css b/js/panels/css-panel/style-sheet.reel/style-sheet.css new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/js/panels/css-panel/style-sheet.reel/style-sheet.css | |||
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.html b/js/panels/css-panel/style-sheet.reel/style-sheet.html new file mode 100644 index 00000000..43ffec6f --- /dev/null +++ b/js/panels/css-panel/style-sheet.reel/style-sheet.html | |||
@@ -0,0 +1,43 @@ | |||
1 | <!DOCTYPE html> | ||