aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rw-r--r--js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js3
-rw-r--r--js/panels/css-panel/styles-view-delegate.js18
2 files changed, 17 insertions, 4 deletions
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
index cfe3c24d..e0ffb1a8 100644
--- 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
@@ -8,6 +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
10exports.CssStyleRule = Montage.create(Component, { 10exports.CssStyleRule = Montage.create(Component, {
11 addClassNameOnChange : {
12 value: null
13 },
11 unappliedClass : { 14 unappliedClass : {
12 value: 'unapplied-css-rule' 15 value: 'unapplied-css-rule'
13 }, 16 },
diff --git a/js/panels/css-panel/styles-view-delegate.js b/js/panels/css-panel/styles-view-delegate.js
index 919f6034..1644460a 100644
--- a/js/panels/css-panel/styles-view-delegate.js
+++ b/js/panels/css-panel/styles-view-delegate.js
@@ -53,17 +53,17 @@ exports.StylesViewDelegate = Montage.create(Component, {
53 return false; 53 return false;
54 } 54 }
55 55
56 if(!ruleComponent.firstChangeHappened) { 56 if(ruleComponent.addClassNameOnChange) {
57 var lastClass = newSelector.substring(newSelector.lastIndexOf('.')+1); 57 var lastClass = this._getClassNameFromSelector(newSelector);
58 58
59 if(lastClass !== newSelector) { 59 if(lastClass) {
60 ///// Add the generated class to each element in selection 60 ///// Add the generated class to each element in selection
61 ///// and check whether it applies to the element 61 ///// and check whether it applies to the element
62 this.ruleListContainer.displayedList.selection.forEach(function(el) { 62 this.ruleListContainer.displayedList.selection.forEach(function(el) {
63 this.stylesController.addClass(el, lastClass); 63 this.stylesController.addClass(el, lastClass);
64 },this); 64 },this);
65 } 65 }
66 ruleComponent.firstChangeHappened = true; 66 ruleComponent.addClassNameOnChange = false;
67 } 67 }
68 68
69 rule.selectorText = newSelector; 69 rule.selectorText = newSelector;
@@ -75,6 +75,13 @@ exports.StylesViewDelegate = Montage.create(Component, {
75 this._dispatchChange(); 75 this._dispatchChange();
76 } 76 }
77 }, 77 },
78 _getClassNameFromSelector : {
79 value: function(selectorText) {
80 var results = /.*\.([A-Za-z0-9_-]+)\:?[A-Za-z0-9_"=-]*$/.exec(selectorText);
81
82 return (results) ? results[1] : null;
83 }
84 },
78 85
79 ///// Returns true if the passed-in selector targets the passed-in element 86 ///// Returns true if the passed-in selector targets the passed-in element
80 _doesSelectorTargetElement : { 87 _doesSelectorTargetElement : {
@@ -249,6 +256,9 @@ exports.StylesViewDelegate = Montage.create(Component, {
249 ///// Add rule directly to the rule list 256 ///// Add rule directly to the rule list
250 this.ruleListContainer.displayedList.component.addRule(newRule, null, applies, function(ruleComponent) { 257 this.ruleListContainer.displayedList.component.addRule(newRule, null, applies, function(ruleComponent) {
251 var rC = ruleComponent; 258 var rC = ruleComponent;
259
260 rC.addClassNameOnChange = true;
261
252 setTimeout(function() { 262 setTimeout(function() {
253 rC.selectorField.start(); 263 rC.selectorField.start();
254 },50); 264 },50);