| OLD | NEW |
| 1 | 1 Polymer({ |
| 2 | 2 |
| 3 Polymer({ | |
| 4 | |
| 5 is: 'iron-media-query', | 3 is: 'iron-media-query', |
| 6 | 4 |
| 7 properties: { | 5 properties: { |
| 8 | 6 |
| 9 /** | 7 /** |
| 10 * The Boolean return value of the media query. | 8 * The Boolean return value of the media query. |
| 11 */ | 9 */ |
| 12 queryMatches: { | 10 queryMatches: { |
| 13 type: Boolean, | 11 type: Boolean, |
| 14 value: false, | 12 value: false, |
| 15 readOnly: true, | 13 readOnly: true, |
| 16 notify: true | 14 notify: true |
| 17 }, | 15 }, |
| 18 | 16 |
| 19 /** | 17 /** |
| 20 * The CSS media query to evaluate. | 18 * The CSS media query to evaluate. |
| 21 */ | 19 */ |
| 22 query: { | 20 query: { |
| 23 type: String, | 21 type: String, |
| 24 observer: 'queryChanged' | 22 observer: 'queryChanged' |
| 23 }, |
| 24 |
| 25 _boundMQHandler: { |
| 26 value: function() { |
| 27 return this.queryHandler.bind(this); |
| 28 } |
| 25 } | 29 } |
| 26 | |
| 27 }, | 30 }, |
| 28 | 31 |
| 29 created: function() { | 32 attached: function() { |
| 30 this._mqHandler = this.queryHandler.bind(this); | 33 this.queryChanged(); |
| 31 }, | 34 }, |
| 32 | 35 |
| 33 queryChanged: function(query) { | 36 detached: function() { |
| 37 this._remove(); |
| 38 }, |
| 39 |
| 40 _add: function() { |
| 34 if (this._mq) { | 41 if (this._mq) { |
| 35 this._mq.removeListener(this._mqHandler); | 42 this._mq.addListener(this._boundMQHandler); |
| 43 } |
| 44 }, |
| 45 |
| 46 _remove: function() { |
| 47 if (this._mq) { |
| 48 this._mq.removeListener(this._boundMQHandler); |
| 49 } |
| 50 this._mq = null; |
| 51 }, |
| 52 |
| 53 queryChanged: function() { |
| 54 this._remove(); |
| 55 var query = this.query; |
| 56 if (!query) { |
| 57 return; |
| 36 } | 58 } |
| 37 if (query[0] !== '(') { | 59 if (query[0] !== '(') { |
| 38 query = '(' + query + ')'; | 60 query = '(' + query + ')'; |
| 39 } | 61 } |
| 40 this._mq = window.matchMedia(query); | 62 this._mq = window.matchMedia(query); |
| 41 this._mq.addListener(this._mqHandler); | 63 this._add(); |
| 42 this.queryHandler(this._mq); | 64 this.queryHandler(this._mq); |
| 43 }, | 65 }, |
| 44 | 66 |
| 45 queryHandler: function(mq) { | 67 queryHandler: function(mq) { |
| 46 this._setQueryMatches(mq.matches); | 68 this._setQueryMatches(mq.matches); |
| 47 } | 69 } |
| 48 | 70 |
| 49 }); | 71 }); |
| 50 | |
| OLD | NEW |