diff options
Diffstat (limited to 'js')
4 files changed, 45 insertions, 3 deletions
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 87019cad..703d61f4 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 a328cb65..fd559b24 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 | |||
@@ -144,7 +144,6 @@ exports.StyleSheetsView = Montage.create(Component, { | |||
144 | handleDeleteAction : { | 144 | handleDeleteAction : { |
145 | value: function(sheetComponent) { | 145 | value: function(sheetComponent) { |
146 | this.stylesController.removeStyleSheet(sheetComponent.source); | 146 | this.stylesController.removeStyleSheet(sheetComponent.source); |
147 | this.stylesController._clearCache(); | ||
148 | this._dispatchChange(); | 147 | this._dispatchChange(); |
149 | } | 148 | } |
150 | }, | 149 | }, |
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: { |