aboutsummaryrefslogtreecommitdiff
path: root/js/panels/css-panel/rule-components
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/css-panel/rule-components')
-rw-r--r--js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.css28
-rw-r--r--js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.html75
-rw-r--r--js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js86
3 files changed, 189 insertions, 0 deletions
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..3ec8901a
--- /dev/null
+++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.css
@@ -0,0 +1,28 @@
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-style-rule-item {
7 position: relative;
8}
9.css-style-rule-item:after {
10 content: "}";
11 padding: 0 0 0 4px;
12 position: relative;
13 top: -10px;
14}
15.style-rule-heading {
16 background-color: #f3f3f3;
17 border: 1px #e7e7e7;
18 border-style: solid none;
19 box-shadow: inset 0 0 1px #FFF;
20 padding: 4px;
21}
22.style-sheet-name {
23 color: #333;
24 position: absolute;
25 right: 8px;
26 text-decoration: none;
27 font-family: "Droid Sans", sans-serif;
28} \ 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..de64f81f
--- /dev/null
+++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.html
@@ -0,0 +1,75 @@
1<!DOCTYPE html>
2<!-- <copyright>
3This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4No 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 "declarationComponent": {"@": "declaration"}
19 }
20 },
21 "sheetName": {
22 "module": "montage/ui/dynamic-text.reel",
23 "name" : "DynamicText",
24 "properties": {
25 "element": {"#": "style-sheet-name"}
26 },
27 "bindings": {
28 "value" : {
29 "boundObject": {"@": "owner"},
30 "boundObjectPropertyPath": "sheetName",
31 "oneway": true
32 }
33 }
34 },
35 "selector": {
36 "module": "montage/ui/dynamic-text.reel",
37 "name" : "DynamicText",
38 "properties": {
39 "element": {"#": "rule-selector"}
40 },
41 "bindings": {
42 "value" : {
43 "boundObject": {"@": "owner"},
44 "boundObjectPropertyPath": "selector",
45 "oneway": true
46 }
47 }
48 },
49 "declaration": {
50 "module": "js/panels/css-panel/declaration.reel",
51 "name": "Declaration",
52 "properties": {
53 "element": {"#": "declaration-list"}
54 }
55 },
56 "sheetLink": {
57 "module": "montage/ui/anchor.reel",
58 "name": "Anchor",
59 "properties": {
60 "element": {"#": "style-sheet-name"}
61 }
62 }
63 }
64 </script>
65</head>
66<body>
67<li id="rule-item" class="css-style-rule-item">
68 <div class="style-rule-heading">
69 <a href="#" id="style-sheet-name" class="style-sheet-name"></a>
70 <span id="rule-selector" class="nj-css-selector"></span>
71 </div>
72 <dl id="declaration-list"></dl>
73</li>
74</body>
75</html> \ No newline at end of file
diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
new file mode 100644
index 00000000..a0ff4b4e
--- /dev/null
+++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
@@ -0,0 +1,86 @@
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
7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component;
9
10exports.CssStyleRule = Montage.create(Component, {
11 cssText: {
12 value: null
13 },
14 hasTemplate: {
15 value: true
16 },
17 _rule : {
18 value : null
19 },
20 rule : {
21 get: function() {
22 return this._rule;
23 },
24 set: function(rule) {
25 this.cssText = rule.cssText;
26 this.sheetName = rule.href || 'Style Tag';
27 this.selector = rule.selectorText;
28
29 this.declaration = rule.style;
30
31 console.log('Rule with selector "' +rule.selectorText+ '" is set on componenet.');
32
33 this._rule = rule;
34 }
35 },
36 declarationComponent: {
37 value: null
38 } ,
39// declarationNodeName: {
40// value: "dl"
41// },
42// declarationElement: {
43// value: null
44// },
45 _declaration: {
46 value: null
47 },
48 declaration: {
49 get: function() {
50 return this._declaration;
51 },
52 set: function(dec) {
53 this._declaration = dec;
54 }
55 },
56 condition: {
57 value: false
58 },
59 templateDidLoad : {
60 value: function() {
61 console.log("css style rule : template did load");
62 if(this._declaration) {
63 this.declarationComponent.declaration = this._declaration;
64 }
65 }
66 },
67 prepareForDraw : {
68 value: function() {
69 console.log("css style rule : prepare for draw");
70
71 if(!this.declarationElement) {
72 ///// Create element to contain declaration
73 this.declarationElement = document.createElement(this.declarationNodeName);
74 }
75
76 if(!this._declaration && this._rule) {
77
78 }
79 }
80 },
81 draw : {
82 value: function() {
83 console.log("css style rule : draw");
84 }
85 }
86});
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-01 13:08:00 +0000