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/rule-components/css-style-rule.reel/css-style-rule.js2
-rw-r--r--js/panels/css-panel/rule-list-container.reel/rule-list-container.js2
-rw-r--r--js/panels/css-panel/rule-list.reel/rule-list.js26
-rw-r--r--js/panels/css-panel/styles-view-delegate.js4
4 files changed, 25 insertions, 9 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 c74502c0..ac714bfa 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
@@ -29,7 +29,7 @@ exports.CssStyleRule = Montage.create(Component, {
29 return this._applied; 29 return this._applied;
30 }, 30 },
31 set: function(value) { 31 set: function(value) {
32 if(this._applied === value) { return false; } 32 if(this._applied === value || value === undefined || value === null) { return false; }
33 33
34 this._applied = value; 34 this._applied = value;
35 this.needsDraw = true; 35 this.needsDraw = true;
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 9cf8b875..511ff24c 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
@@ -30,8 +30,6 @@ exports.RuleListContainer = Montage.create(Component, {
30 30
31 if(!list) { 31 if(!list) {
32 list = this.add(selection); 32 list = this.add(selection);
33 } else {
34 console.log("rule list found!");
35 } 33 }
36 34
37 this.displayedList = list; 35 this.displayedList = list;
diff --git a/js/panels/css-panel/rule-list.reel/rule-list.js b/js/panels/css-panel/rule-list.reel/rule-list.js
index 5f6afee5..bca298df 100644
--- a/js/panels/css-panel/rule-list.reel/rule-list.js
+++ b/js/panels/css-panel/rule-list.reel/rule-list.js
@@ -83,19 +83,28 @@ exports.RuleList = Montage.create(Component, {
83 }, 83 },
84 84
85 addRule: { 85 addRule: {
86 value: function(rule, atIndex) { 86 value: function(rule, atIndex, applies, drawCallback) {
87 var insertIndex = atIndex || this.childComponents.length; 87 var insertIndex = atIndex || this.childComponents.length;
88 88
89 this.rulesToDraw.push({ 89 this.rulesToDraw.push({
90 rule: rule, 90 rule: rule,
91 index: insertIndex, 91 index: insertIndex,
92 instance : null 92 instance : null,
93 applies : applies,
94 callback : drawCallback
93 }); 95 });
94 96
95 this.needsDraw = true; 97 this.needsDraw = true;
96 } 98 }
97 }, 99 },
98 100
101 removeRule: {
102 value: function(ruleComponent) {
103 this.rulesToRemove.push(ruleComponent);
104 this.needsDraw = true;
105 }
106 },
107
99 willDraw : { 108 willDraw : {
100 value: function() { 109 value: function() {
101 this.rulesToDraw.forEach(function(ruleObj) { 110 this.rulesToDraw.forEach(function(ruleObj) {
@@ -110,6 +119,7 @@ exports.RuleList = Montage.create(Component, {
110 instance = Montage.create(componentBase); 119 instance = Montage.create(componentBase);
111 instance.element = document.createElement(this.ruleNodeName); 120 instance.element = document.createElement(this.ruleNodeName);
112 instance.rule = ruleObj.rule; 121 instance.rule = ruleObj.rule;
122 instance.applied = ruleObj.applies;
113 123
114 if(this.focusDelegate) { 124 if(this.focusDelegate) {
115 instance.focusDelegate = this.focusDelegate; 125 instance.focusDelegate = this.focusDelegate;
@@ -156,17 +166,23 @@ exports.RuleList = Montage.create(Component, {
156 ruleObj.instance.needsDraw = true; 166 ruleObj.instance.needsDraw = true;
157 }, this); 167 }, this);
158 168
159 ///// Null out any rules that were just drawn
160 this.rulesToDraw.length = 0;
161
162 } 169 }
163 }, 170 },
164 171
165 didDraw : { 172 didDraw : {
166 value: function() { 173 value: function() {
174 this.rulesToDraw.forEach(function(ruleObj) {
175 if(typeof ruleObj.callback === 'function') {
176 ruleObj.callback(ruleObj.instance);
177 }
178 });
179
167 this.rulesToRemove.forEach(function(ruleObj) { 180 this.rulesToRemove.forEach(function(ruleObj) {
168 ruleObj.instance = null; 181 ruleObj.instance = null;
169 }, this); 182 }, this);
183
184 ///// Null out any rules that were just drawn
185 this.rulesToDraw.length = 0;
170 this.rulesToRemove.length = 0; 186 this.rulesToRemove.length = 0;
171 } 187 }
172 } 188 }
diff --git a/js/panels/css-panel/styles-view-delegate.js b/js/panels/css-panel/styles-view-delegate.js
index 3f29ba27..aba8c042 100644
--- a/js/panels/css-panel/styles-view-delegate.js
+++ b/js/panels/css-panel/styles-view-delegate.js
@@ -246,7 +246,9 @@ exports.StylesViewMediator = Montage.create(Component, {
246 },this); 246 },this);
247 247
248 ///// Add rule directly to the rule list 248 ///// Add rule directly to the rule list
249 this.ruleListContainer.displayedList.component.addRule(newRule).applied = applies; 249 this.ruleListContainer.displayedList.component.addRule(newRule, null, applies, function(ruleComponent) {
250 ruleComponent.selectorField.start();
251 });
250 252
251 } 253 }
252 }, 254 },