diff options
Diffstat (limited to 'js')
4 files changed, 49 insertions, 8 deletions
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 f0c538c8..5bc5c87d 100644 --- a/js/panels/css-panel/css-panel.reel/css-panel.html +++ b/js/panels/css-panel/css-panel.reel/css-panel.html | |||
@@ -32,7 +32,20 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
32 | "name": "StylesViewContainer", | 32 | "name": "StylesViewContainer", |
33 | "properties": { | 33 | "properties": { |
34 | "element": {"#": "styles-view-container" }, | 34 | "element": {"#": "styles-view-container" }, |
35 | "selectionNameLabel": {"#": "selection-name" } | 35 | "selectionName": {"@": "selectionName" } |
36 | } | ||
37 | }, | ||
38 | "selectionName" : { | ||
39 | "prototype": "montage/ui/dynamic-text.reel", | ||
40 | "properties": { | ||
41 | "element": {"#":"selection-name"} | ||
42 | }, | ||
43 | "bindings": { | ||
44 | "value" : { | ||
45 | "boundObject": {"@": "stylesViewContainer"}, | ||
46 | "boundObjectPropertyPath": "selectionNameLabelText", | ||
47 | "oneway": true | ||
48 | } | ||
36 | } | 49 | } |
37 | } | 50 | } |
38 | } | 51 | } |
diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js index 511ff24c..50d69093 100644 --- a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js +++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js | |||
@@ -98,7 +98,9 @@ exports.RuleListContainer = Montage.create(Component, { | |||
98 | value: function(selection) { | 98 | value: function(selection) { |
99 | var rules; | 99 | var rules; |
100 | 100 | ||
101 | if(selection.length === 1) { | 101 | if(selection.length > 1) { |
102 | rules = this.stylesController.getCommonRules(selection); | ||
103 | } else if(selection.length === 1) { | ||
102 | rules = this.stylesController.getMatchingRules(selection[0]); | 104 | rules = this.stylesController.getMatchingRules(selection[0]); |
103 | 105 | ||
104 | ///// Add inline style to rule list | 106 | ///// Add inline style to rule list |
@@ -109,7 +111,7 @@ exports.RuleListContainer = Montage.create(Component, { | |||
109 | style : selection[0].style | 111 | style : selection[0].style |
110 | }); | 112 | }); |
111 | 113 | ||
112 | } //// TODO: support more selection types | 114 | } |
113 | 115 | ||
114 | return rules; | 116 | return rules; |
115 | } | 117 | } |
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 a47b0db1..1372de0c 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 | |||
@@ -14,6 +14,21 @@ exports.StylesViewContainer = Montage.create(Component, { | |||
14 | contentPanel : { | 14 | contentPanel : { |
15 | value: 'rules' | 15 | value: 'rules' |
16 | }, | 16 | }, |
17 | _selectionNameLabelText : { | ||
18 | value: null | ||
19 | }, | ||
20 | selectionNameLabelText : { | ||
21 | get: function() { | ||
22 | return this._selectionNameLabelText; | ||
23 | }, | ||
24 | set: function(value) { | ||
25 | if(value === this._selectionNameLabelText) { return false; } | ||
26 | |||
27 | this._selectionNameLabelText = value; | ||
28 | |||
29 | this.needsDraw = true; | ||
30 | } | ||
31 | }, | ||
17 | _lastSelection : { | 32 | _lastSelection : { |
18 | value: null | 33 | value: null |
19 | }, | 34 | }, |
@@ -62,7 +77,10 @@ exports.StylesViewContainer = Montage.create(Component, { | |||
62 | value: function() { | 77 | value: function() { |
63 | var elements = this.application.ninja.selectedElements; | 78 | var elements = this.application.ninja.selectedElements; |
64 | 79 | ||
65 | if(this._isSameArray(elements, this._lastSelection)) { console.log('new selection is identical');return false; } | 80 | if(this._isSameArray(elements, this._lastSelection) && this.contentPanel === "rules") { |
81 | console.log('new selection is identical'); | ||
82 | return false; | ||
83 | } | ||
66 | 84 | ||
67 | this._lastSelection = elements; | 85 | this._lastSelection = elements; |
68 | 86 | ||
@@ -72,14 +90,20 @@ exports.StylesViewContainer = Montage.create(Component, { | |||
72 | } else if(elements.length === 1) { | 90 | } else if(elements.length === 1) { |
73 | 91 | ||
74 | ///// update the selection status label with the label of the element | 92 | ///// update the selection status label with the label of the element |
75 | this.selectionNameLabel.innerHTML = this._getElementLabel(elements[0]); | 93 | this.selectionNameLabelText = this._getElementLabel(elements[0]); |
76 | 94 | ||
77 | if(this.contentPanel === "rules") { | 95 | if(this.contentPanel === "rules") { |
78 | this.ruleListContainer.displayListForSelection(elements); | 96 | this.ruleListContainer.displayListForSelection(elements); |
79 | } else { | 97 | } else { |
80 | this.computedStyleView.declaration = elements[0]; | 98 | this.computedStyleView.declaration = elements[0]; |
81 | } | 99 | } |
100 | this.toolbar.showButton('computed'); | ||
82 | } else { | 101 | } else { |
102 | this.toolbar.hideButton('computed'); | ||
103 | this.contentPanel = "rules"; | ||
104 | this.selectionNameLabelText = elements.length + " elements selected."; | ||
105 | ///// find common rules | ||
106 | this.ruleListContainer.displayListForSelection(elements); | ||
83 | 107 | ||
84 | } | 108 | } |
85 | 109 | ||
@@ -130,10 +154,12 @@ exports.StylesViewContainer = Montage.create(Component, { | |||
130 | value: function() { | 154 | value: function() { |
131 | if(this.hasStyles) { | 155 | if(this.hasStyles) { |
132 | this.element.classList.remove('no-styles'); | 156 | this.element.classList.remove('no-styles'); |
133 | this.selectionNameLabel.classList.remove('no-styles'); | 157 | //this.selectionNameLabel.classList.remove('no-styles'); |
158 | this.selectionName.element.classList.remove('no-styles'); | ||
134 | } else { | 159 | } else { |
135 | this.element.classList.add('no-styles'); | 160 | this.element.classList.add('no-styles'); |
136 | this.selectionNameLabel.classList.add('no-styles'); | 161 | //this.selectionNameLabel.classList.add('no-styles'); |
162 | this.selectionName.element.classList.add('no-styles'); | ||
137 | } | 163 | } |
138 | } | 164 | } |
139 | }, | 165 | }, |
diff --git a/js/panels/css-panel/styles-view-delegate.js b/js/panels/css-panel/styles-view-delegate.js index aba8c042..1b21f460 100644 --- a/js/panels/css-panel/styles-view-delegate.js +++ b/js/panels/css-panel/styles-view-delegate.js | |||
@@ -267,7 +267,7 @@ exports.StylesViewMediator = Montage.create(Component, { | |||
267 | } | 267 | } |
268 | 268 | ||
269 | container.contentPanel = panelToShow; | 269 | container.contentPanel = panelToShow; |
270 | this.ownerComponent.handleSelectionChange(); | 270 | container.handleSelectionChange(); |
271 | } | 271 | } |
272 | }, | 272 | }, |
273 | 273 | ||