aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorEric Guzman2012-07-20 11:30:08 -0700
committerEric Guzman2012-07-20 11:30:08 -0700
commit2f0c50a13258e8abb9325573ed7e0ebe11655fec (patch)
treef5c42b78d2d5f63c45a53590d56bfc6344cc8068 /js
parent9053e2037821a5c8405fabb74db9635deacfe8d5 (diff)
downloadninja-2f0c50a13258e8abb9325573ed7e0ebe11655fec.tar.gz
CSS Panel - Fix updating when media changes, sheets are deleted.
Diffstat (limited to 'js')
-rwxr-xr-xjs/controllers/styles-controller.js39
-rw-r--r--js/panels/css-panel/rule-list.reel/rule-list.js2
-rw-r--r--js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js1
-rw-r--r--js/panels/css-panel/styles-view-container.reel/styles-view-container.js6
4 files changed, 45 insertions, 3 deletions
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js
index b0db1b6a..041794e0 100755
--- a/js/controllers/styles-controller.js
+++ b/js/controllers/styles-controller.js
@@ -106,7 +106,17 @@ var stylesController = exports.StylesController = Montage.create(Component, {
106 this.defaultStylesheet = this.getSheetFromElement(this.CONST.DEFAULT_SHEET_ID); 106 this.defaultStylesheet = this.getSheetFromElement(this.CONST.DEFAULT_SHEET_ID);
107 107
108 this.userStyleSheets = nj.toArray(document.model.views.design.document.styleSheets).filter(function(sheet) { 108 this.userStyleSheets = nj.toArray(document.model.views.design.document.styleSheets).filter(function(sheet) {
109 return sheet !== this._stageStylesheet; 109 if(sheet === this._stageStylesheet) { return false; }
110
111 var media = sheet.ownerNode.getAttribute('media');
112
113 ///// If the media attribute contains a query, we'll watch for changes in media
114 if(/\([0-9A-Za-z-: ]+\)/.test(media)) {
115 this.watchMedia(media);
116 }
117
118 return true;
119
110 }, this); 120 }, this);
111 121
112 this.initializeRootStyles(); 122 this.initializeRootStyles();
@@ -115,6 +125,33 @@ var stylesController = exports.StylesController = Montage.create(Component, {
115 }, 125 },
116 enumerable : false 126 enumerable : false
117 }, 127 },
128
129 _mediaList : {
130 value: []
131 },
132
133 watchMedia : {
134 value: function(mediaQuery, doc) {
135 var _doc = doc || this._currentDocument.model.views.design.document;
136
137 ///// Set a listener for media changes
138 _doc.defaultView.matchMedia(mediaQuery).addListener(function(e) {
139 this.handleMediaChange(e);
140 }.bind(this));
141 }
142 },
143
144 handleMediaChange : {
145 value: function(query) {
146 this._clearCache();
147
148 NJevent('mediaChange', {
149 query: query,
150 source: "stylesController"
151 });
152 }
153 },
154
118 userStyleSheets : { 155 userStyleSheets : {
119 value : null 156 value : null
120 }, 157 },
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 ae0c4611..b9dc2b95 100644
--- a/js/panels/css-panel/rule-list.reel/rule-list.js
+++ b/js/panels/css-panel/rule-list.reel/rule-list.js
@@ -106,7 +106,7 @@ exports.RuleList = Montage.create(Component, {
106 // found rule in our component list, or it's the inline rule 106 // found rule in our component list, or it's the inline rule
107 ruleComponent.update(); 107 ruleComponent.update();
108 foundIndices.push(index); 108 foundIndices.push(index);
109 } else if(!ruleComponent.applied) { /// remove rule (unless unapplied) 109 } else if(ruleComponent.applied) { /// remove rule (unless unapplied)
110 this.rulesToRemove.push(ruleComponent); 110 this.rulesToRemove.push(ruleComponent);
111 } 111 }
112 }, this); 112 }, this);
diff --git a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
index cd86261c..2effb429 100644
--- a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
+++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
@@ -141,7 +141,6 @@ exports.StyleSheetsView = Montage.create(Component, {
141 handleDeleteAction : { 141 handleDeleteAction : {
142 value: function(sheetComponent) { 142 value: function(sheetComponent) {
143 this.stylesController.removeStyleSheet(sheetComponent.source); 143 this.stylesController.removeStyleSheet(sheetComponent.source);
144 this.stylesController._clearCache();
145 this._dispatchChange(); 144 this._dispatchChange();
146 } 145 }
147 }, 146 },
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 bba178f2..94abb4b0 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
@@ -141,6 +141,12 @@ exports.StylesViewContainer = Montage.create(Component, {
141 value: function() { 141 value: function() {
142 this.eventManager.addEventListener('styleSheetsReady', this, false); 142 this.eventManager.addEventListener('styleSheetsReady', this, false);
143 this.eventManager.addEventListener('elementChange', this, false); 143 this.eventManager.addEventListener('elementChange', this, false);
144 this.eventManager.addEventListener('mediaChange', this, false);
145 }
146 },
147 handleMediaChange : {
148 value: function(e) {
149 this.ruleListContainer.update();
144 } 150 }
145 }, 151 },
146 handleStyleSheetsReady: { 152 handleStyleSheetsReady: {