aboutsummaryrefslogtreecommitdiff
path: root/js/panels/css-panel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/css-panel')
-rw-r--r--js/panels/css-panel/styles-view-container.reel/styles-view-container.css14
-rw-r--r--js/panels/css-panel/styles-view-container.reel/styles-view-container.html35
-rw-r--r--js/panels/css-panel/styles-view-container.reel/styles-view-container.js83
3 files changed, 34 insertions, 98 deletions
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.css b/js/panels/css-panel/styles-view-container.reel/styles-view-container.css
index 326254ed..ff0b0b25 100644
--- a/js/panels/css-panel/styles-view-container.reel/styles-view-container.css
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.css
@@ -22,4 +22,18 @@
22} 22}
23.styles-view-toolbar-container .toolbar-container { 23.styles-view-toolbar-container .toolbar-container {
24 border-top: 1px solid #5c5c5c; 24 border-top: 1px solid #5c5c5c;
25}
26
27
28.styles-view-container .rule-list li {
29 border-top: 1px solid #CCC;
30 padding: 6px;
31}
32.styles-view-container .rule-list li:first-child {
33 padding-top: 0;
34 border-style: none;
35}
36
37.styles-view-container .rule-list li:after {
38 content: "}";
25} \ No newline at end of file 39} \ No newline at end of file
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.html b/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
index 97c7c889..e8ddb139 100644
--- a/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
@@ -15,7 +15,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
15 "name" : "StylesViewContainer", 15 "name" : "StylesViewContainer",
16 "properties" : { 16 "properties" : {
17 "element" : {"#" : "container"}, 17 "element" : {"#" : "container"},
18 "ruleList": {"@": "ruleList" } 18 "ruleListContainer": {"@": "ruleListContainer" },
19 "substitution": {"@": "substitution" }
19 } 20 }
20 }, 21 },
21 "substitution": { 22 "substitution": {
@@ -24,7 +25,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
24 "properties": { 25 "properties": {
25 "element": {"#": "sub-panel-slot"}, 26 "element": {"#": "sub-panel-slot"},
26 "switchComponents": { 27 "switchComponents": {
27 "rules": {"@": "ruleList"}, 28 "rules": {"@": "ruleListContainer"},
28 "computed": {"@": "computedStyleView"} 29 "computed": {"@": "computedStyleView"}
29 } 30 }
30 }, 31 },
@@ -36,35 +37,13 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
36 } 37 }
37 } 38 }
38 }, 39 },
39 "ruleList": { 40 "ruleListContainer": {
40 "module" : "js/panels/css-panel/rule-list.reel", 41 "module": "js/panels/css-panel/rule-list-container.reel",
41 "name": "RuleList", 42 "name": "RuleListContainer"
42 "properties": {
43 "supportedRules" : {
44 "1" : {"@": "css-style-rule"},
45 "3" : {"@": "css-import-rule"},
46 "4" : {"@": "css-media-rule"},
47 "5" : {"@": "css-font-face-rule"},
48 "6" : {"@": "css-page-rule"},
49 "10" : {"@": "namespace-rule"}
50 }
51 },
52 "bindings": {
53 "contentController" : {
54 "boundObject": {"@": "owner"},
55 "boundObjectPropertyPath": "contentController",
56 "oneway": true
57 }
58 }
59 },
60 "css-style-rule": {
61 "module": "js/panels/css-panel/rule-components/css-style-rule.reel",
62 "name": "CssStyleRule"
63 }, 43 },
64 "computedStyleView": { 44 "computedStyleView": {
65 "module": "js/panels/CSSPanel/ComputedStyleSubPanel.reel", 45 "module": "js/panels/CSSPanel/ComputedStyleSubPanel.reel",
66 "name": "ComputedStyleSubPanel", 46 "name": "ComputedStyleSubPanel"
67 "properties": { }
68 }, 47 },
69 "toolbar": { 48 "toolbar": {
70 "module": "js/components/toolbar.reel", 49 "module": "js/components/toolbar.reel",
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.js b/js/panels/css-panel/styles-view-container.reel/styles-view-container.js
index 6164a14c..5967345a 100644
--- a/js/panels/css-panel/styles-view-container.reel/styles-view-container.js
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.js
@@ -8,9 +8,6 @@ var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component; 8 Component = require("montage/ui/component").Component;
9 9
10exports.StylesViewContainer = Montage.create(Component, { 10exports.StylesViewContainer = Montage.create(Component, {
11 noStylesCondition : {
12 value: true
13 },
14 contentController : { 11 contentController : {
15 value: null 12 value: null
16 }, 13 },
@@ -47,41 +44,31 @@ exports.StylesViewContainer = Montage.create(Component, {
47 44
48 if(elements.length === 0) { 45 if(elements.length === 0) {
49 return false; 46 return false;
50 } else if(elements.length >= 1) { 47 } else if(elements.length > 1) {
51 type = 'ELEMENTS'; 48 type = 'ELEMENTS';
52 selection = elements; 49 selection = elements.map(function(obj) {
50 return obj._element;
51 });
53 } else { 52 } else {
54 type = 'ELEMENTS'; 53 type = 'ELEMENT';
55 selection = elements[0] 54 selection = elements[0]._element;
56 } 55 }
57 56
58 ruleList = this._getRuleList({ 57 ruleList = this.ruleListContainer._getRuleList({
59 selectionType : type, 58 selectionType : type,
60 selection : selection 59 selection : selection
61 }); 60 });
62 61
63 if(ruleList) { 62 if(ruleList) {
64 this.displayedList = ruleList; 63 this.ruleListContainer.displayedList = ruleList;
64 } else {
65 this.ruleListContainer.add(type, selection);
65 } 66 }
67
68 this.hasStyles = true;
66 } 69 }
67 }, 70 },
68 _lastDisplayedList : { 71
69 value: null
70 },
71 _displayedList : {
72 value: null
73 },
74 displayedList : {
75 get: function() {
76 return this._displayedList;
77 },
78 set: function(list) {
79 this._hasStyles = true;
80 this._lastDisplayedList = this._displayedList;
81 this._displayedList = list;
82 this.needsDraw = true;
83 }
84 },
85 _ruleList : { 72 _ruleList : {
86 value: [] 73 value: []
87 }, 74 },
@@ -101,60 +88,16 @@ exports.StylesViewContainer = Montage.create(Component, {
101 }, 88 },
102 prepareForDraw : { 89 prepareForDraw : {
103 value: function() { 90 value: function() {
104 debugger;
105 console.log("styles view container - prepare for draw"); 91 console.log("styles view container - prepare for draw");
106 } 92 }
107 }, 93 },
108 draw : { 94 draw : {
109 value: function() { 95 value: function() {
110 console.log("styles view container - draw");
111console.log("has style = " + this._hasStyles);
112 if(this.hasStyles) { 96 if(this.hasStyles) {
113 this.element.classList.remove('no-styles'); 97 this.element.classList.remove('no-styles');
114 } else { 98 } else {
115 this.element.classList.add('no-styles'); 99 this.element.classList.add('no-styles');
116 } 100 }
117
118 if(this._lastDisplayedList) {
119 //this._lastDisplayedList.style.display = 'none';
120 }
121
122 //this._displayedList.style.display = '';
123 }
124 },
125 _getRuleList : {