diff options
Diffstat (limited to 'js/panels/css-panel')
19 files changed, 737 insertions, 68 deletions
diff --git a/js/panels/css-panel/css-panel-container.js b/js/panels/css-panel/css-panel-container.js index aeaa2d13..6110c999 100644 --- a/js/panels/css-panel/css-panel-container.js +++ b/js/panels/css-panel/css-panel-container.js | |||
@@ -9,7 +9,7 @@ var PanelBase = require("js/panels/PanelBase").PanelBase; | |||
9 | var Content = require("js/panels/css-panel/css-panel.reel").CSSPanelNew; | 9 | var Content = require("js/panels/css-panel/css-panel.reel").CSSPanelNew; |
10 | 10 | ||
11 | exports.CSSPanelContainer = Montage.create(PanelBase, { | 11 | exports.CSSPanelContainer = Montage.create(PanelBase, { |
12 | panelName : { value: "CSSPanelNew" }, | 12 | panelName : { value: "CSS Panel" }, |
13 | minHeight : { value: 200 }, | 13 | minHeight : { value: 200 }, |
14 | content : { value: Content } | 14 | content : { value: Content } |
15 | }); \ No newline at end of file | 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 index e69de29b..6d296a8e 100644 --- a/js/panels/css-panel/css-panel.reel/css-panel.css +++ b/js/panels/css-panel/css-panel.reel/css-panel.css | |||
@@ -0,0 +1,49 @@ | |||
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 | .css-panel { | ||
7 | color: #FFF; | ||
8 | display: -webkit-box; | ||
9 | height: 100%; | ||
10 | -webkit-box-orient: vertical; | ||
11 | } | ||
12 | .css-panel > h3 { | ||
13 | background-color: #333; | ||
14 | border-top: 1px solid #3D3D3D; | ||
15 | color: #FFF; | ||
16 | cursor: default; | ||
17 | font-size: 12px; | ||
18 | font-weight: normal; | ||
19 | height: 16px; | ||
20 | margin: 0; | ||
21 | padding: 4px 0 2px 10px; | ||
22 | vertical-align: top; | ||
23 | -webkit-box-flex: 0; | ||
24 | -webkit-user-select: none; | ||
25 | } | ||
26 | .css-panel .style-sheets-view-container { | ||
27 | -webkit-box-flex: 0; | ||
28 | min-height: 41px; | ||
29 | } | ||
30 | .css-panel .styles-view-container { | ||
31 | -webkit-box-flex: 1; | ||
32 | display: -webkit-box; | ||
33 | -webkit-box-orient: vertical; | ||
34 | } | ||
35 | .panel-message { | ||
36 | background-color: rgba(255,255,255, 0.1); | ||
37 | border: 1px dashed rgba(255,255,255, 0.2); | ||
38 | border-radius: 4px; | ||
39 | color: #CCC; | ||
40 | font-size: 11px; | ||
41 | font-weight: normal; | ||
42 | margin: 0 8px; | ||
43 | padding: 5px; | ||
44 | position: relative; | ||
45 | text-shadow: 1px 1px 0px #333; | ||
46 | text-align: center; | ||
47 | top: 8px; | ||
48 | -webkit-box-flex: 0; | ||
49 | } | ||
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.html b/js/panels/css-panel/css-panel.reel/css-panel.html index 86bfbbb7..899c7786 100644 --- a/js/panels/css-panel/css-panel.reel/css-panel.html +++ b/js/panels/css-panel/css-panel.reel/css-panel.html | |||
@@ -14,7 +14,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
14 | "module" : "js/panels/css-panel/css-panel.reel", | 14 | "module" : "js/panels/css-panel/css-panel.reel", |
15 | "name" : "CSSPanel", | 15 | "name" : "CSSPanel", |
16 | "properties" : { | 16 | "properties" : { |
17 | "element" : {"#" : "container"} | 17 | "element" : {"#" : "container"}, |
18 | "controller": {"@": "cssPanelController"} | ||
18 | } | 19 | } |
19 | }, | 20 | }, |
20 | "styleSheetView": { | 21 | "styleSheetView": { |
@@ -36,9 +37,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
36 | </head> | 37 | </head> |
37 | <body> | 38 | <body> |
38 | <section id="container" class="css-panel"> | 39 | <section id="container" class="css-panel"> |
39 | <h2>Style Sheets</h2> | 40 | <h3>Style Sheets</h3> |
40 | <div id="style-sheet-view"></div> | 41 | <div id="style-sheet-view"></div> |
41 | <h2>Styles</h2> | 42 | <h3>Styles</h3> |
42 | <div id="styles-view-container"></div> | 43 | <div id="styles-view-container"></div> |
43 | </section> | 44 | </section> |
44 | </body> | 45 | </body> |
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.js b/js/panels/css-panel/css-panel.reel/css-panel.js index a593f1c4..228e91f6 100644 --- a/js/panels/css-panel/css-panel.reel/css-panel.js +++ b/js/panels/css-panel/css-panel.reel/css-panel.js | |||
@@ -8,16 +8,9 @@ var Montage = require("montage/core/core").Montage, | |||
8 | Component = require("montage/ui/component").Component; | 8 | Component = require("montage/ui/component").Component; |
9 | 9 | ||
10 | exports.CSSPanelNew = Montage.create(Component, { | 10 | exports.CSSPanelNew = Montage.create(Component, { |
11 | hasTemplate: { | ||
12 | value: true | ||
13 | }, | ||
14 | condition: { | ||
15 | value: false | ||
16 | }, | ||
17 | templateDidLoad : { | 11 | templateDidLoad : { |
18 | value: function() { | 12 | value: function() { |
19 | console.log("css panel : template did load"); | 13 | console.log("css panel : template did load"); |
20 | //this.condition = true; | ||
21 | } | 14 | } |
22 | }, | 15 | }, |
23 | prepareForDraw : { | 16 | prepareForDraw : { |
diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.css b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.css new file mode 100644 index 00000000..0441c1cf --- /dev/null +++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.css | |||
@@ -0,0 +1,5 @@ | |||
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> */ \ No newline at end of file | ||
diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.html b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.html new file mode 100644 index 00000000..e8661bf9 --- /dev/null +++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.html | |||
@@ -0,0 +1,57 @@ | |||
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 href="css-style-rule.css" rel="stylesheet" type="text/css"> | ||
11 | <script type="text/montage-serialization"> | ||
12 | { | ||
13 | "owner": { | ||
14 | "module" : "js/panels/css-panel/rule-components/css-style-rule.reel", | ||
15 | "name" : "CssStyleRule", | ||
16 | "properties" : { | ||
17 | "element" : {"#" : "rule-item"} | ||
18 | } | ||
19 | }, | ||
20 | "sheetName": { | ||
21 | "module": "montage/ui/dynamic-text.reel", | ||
22 | "name" : "DynamicText", | ||
23 | "properties": { | ||
24 | "element": {"#": "style-sheet-name"} | ||
25 | }, | ||
26 | "bindings": { | ||
27 | "value" : { | ||
28 | "boundObject": {"@": "owner"}, | ||
29 | "boundObjectPropertyPath": "sheetName", | ||
30 | "oneway": true | ||
31 | } | ||
32 | } | ||
33 | }, | ||
34 | "selector": { | ||
35 | "module": "montage/ui/dynamic-text.reel", | ||
36 | "name" : "DynamicText", | ||
37 | "properties": { | ||
38 | "element": {"#": "rule-selector"} | ||
39 | }, | ||
40 | "bindings": { | ||
41 | "value" : { | ||
42 | "boundObject": {"@": "owner"}, | ||
43 | "boundObjectPropertyPath": "selector", | ||
44 | "oneway": true | ||
45 | } | ||
46 | } | ||
47 | } | ||
48 | } | ||
49 | </script> | ||
50 | </head> | ||
51 | <body> | ||
52 | <div id="rule-item" class="css-style-rule-item"> | ||
53 | <a href="#" id="style-sheet-name"></a> | ||
54 | <span id="rule-selector" class="nj-css-selector"></span> | ||
55 | </div> | ||
56 | </body> | ||
57 | </html> \ No newline at end of file | ||
diff --git a/js/panels/css-panel/rul |