aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rw-r--r--js/panels/css-panel/styles-view-delegate.js40
1 files changed, 31 insertions, 9 deletions
diff --git a/js/panels/css-panel/styles-view-delegate.js b/js/panels/css-panel/styles-view-delegate.js
index ccbfecad..c3bfdc75 100644
--- a/js/panels/css-panel/styles-view-delegate.js
+++ b/js/panels/css-panel/styles-view-delegate.js
@@ -21,8 +21,15 @@ exports.StylesViewMediator = Montage.create(Component, {
21 } 21 }
22 }, 22 },
23 23
24 ///// Selector Actions
25 //// -------------------------------------
26
27 ///// Show the targeted elements in the document by applying a class
28 ///// temporarily
24 handleSelectorHover : { 29 handleSelectorHover : {
25 value: function(selector, direction) { 30 value: function(selector, direction) {
31 if(!selector) { return false; }
32
26 var elements = this.stylesController._activeDocument._document.querySelectorAll(selector), 33 var elements = this.stylesController._activeDocument._document.querySelectorAll(selector),
27 method = (direction === "out") ? "remove" : "add"; 34 method = (direction === "out") ? "remove" : "add";
28 35
@@ -32,11 +39,17 @@ exports.StylesViewMediator = Montage.create(Component, {
32 } 39 }
33 }, 40 },
34 41
42 ///// Apply new selector to the rule
43 //// Verify that it applies to the selected elements
44 //// Remove rule if the selector is deleted
35 handleSelectorChange : { 45 handleSelectorChange : {
36 value: function(rule, newSelector, ruleComponent) { 46 value: function(rule, newSelector, ruleComponent) {
37 if(newSelector === "") { 47 if(newSelector === "") {
38 //debugger;
39 ruleComponent.parentComponent.removeRule(ruleComponent); 48 ruleComponent.parentComponent.removeRule(ruleComponent);
49 this.stylesController.deleteRule(rule);
50 ///// Remove the hover style
51 this.handleSelectorHover(rule.selectorText, 'out');
52 this._dispatchChange();
40 return false; 53 return false;
41 } 54 }
42 55
@@ -46,9 +59,20 @@ exports.StylesViewMediator = Montage.create(Component, {
46 return this._doesSelectorTargetElement(newSelector, el); 59 return this._doesSelectorTargetElement(newSelector, el);
47 }, this); 60 }, this);
48 61
62 this._dispatchChange();
63 }
64 },
65
66 ///// Returns true if the passed-in selector targets the passed-in element
67 _doesSelectorTargetElement : {
68 value: function doesSelectorTargetElement(selector, element) {
69 var doc = element.ownerDocument,
70 matchingEls = Array.prototype.slice.call(doc.querySelectorAll(selector));
71 return matchingEls.indexOf(element) !== -1;
49 } 72 }
50 }, 73 },
51 74
75
52 /// Toolbar Button Actions 76 /// Toolbar Button Actions
53 /// ----------------------- 77 /// -----------------------
54 78
@@ -85,6 +109,7 @@ exports.StylesViewMediator = Montage.create(Component, {
85 } 109 }
86 }, 110 },
87 111
112 ///// Show/hide computed style sub panel
88 handleComputedAction : { 113 handleComputedAction : {
89 value: function(e) { 114 value: function(e) {
90 var container = this.ownerComponent, 115 var container = this.ownerComponent,
@@ -102,14 +127,8 @@ exports.StylesViewMediator = Montage.create(Component, {
102 } 127 }
103 }, 128 },
104 129
105 130 ///// Style event handlers
106 _doesSelectorTargetElement : { 131 //// -------------------------------------
107 value: function doesSelectorTargetElement(selector, element) {
108 var doc = element.ownerDocument,
109 matchingEls = Array.prototype.slice.call(doc.querySelectorAll(selector));
110 return matchingEls.indexOf(element) !== -1;
111 }
112 },
113 132
114 ///// Enable/Disable Style when checkbox is clicked 133 ///// Enable/Disable Style when checkbox is clicked
115 handleStyleToggle : { 134 handleStyleToggle : {
@@ -250,6 +269,9 @@ exports.StylesViewMediator = Montage.create(Component, {
250 } 269 }
251 }, 270 },
252 271
272 ///// Utilities
273 //// -------------------------------------
274
253 _dispatchChange : { 275 _dispatchChange : {
254 value: function(property, value) { 276 value: function(property, value) {
255 this.application.ninja.stage.updatedStage = true; 277 this.application.ninja.stage.updatedStage = true;