Blame view

bower_components/iron-media-query/iron-media-query.html 2.4 KB
eb240478   Luigi Serra   public room cards...
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
  <!--
  Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
  This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
  The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
  The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
  Code distributed by Google as part of the polymer project is also
  subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
  -->
  
  <link rel="import" href="../polymer/polymer.html">
  
  <!--
  `iron-media-query` can be used to data bind to a CSS media query.
  The `query` property is a bare CSS media query.
  The `query-matches` property is a boolean representing whether the page matches that media query.
  
  Example:
  
      <iron-media-query query="(min-width: 600px)" query-matches="{{queryMatches}}"></iron-media-query>
  
  @group Iron Elements
  @demo demo/index.html
  @hero hero.svg
  @element iron-media-query
  -->
  
  <script>
  
    Polymer({
  
      is: 'iron-media-query',
  
      properties: {
  
        /**
         * The Boolean return value of the media query.
         */
        queryMatches: {
          type: Boolean,
          value: false,
          readOnly: true,
          notify: true
        },
  
        /**
         * The CSS media query to evaluate.
         */
        query: {
          type: String,
          observer: 'queryChanged'
        },
c5169e0e   Renato De Donato   a new hope
52
        
eb240478   Luigi Serra   public room cards...
53
54
        /**
         * @type {function(MediaQueryList)}
c5169e0e   Renato De Donato   a new hope
55
         */ 
eb240478   Luigi Serra   public room cards...
56
57
58
59
60
        _boundMQHandler: {
          value: function() {
            return this.queryHandler.bind(this);
          }
        },
c5169e0e   Renato De Donato   a new hope
61
        
eb240478   Luigi Serra   public room cards...
62
63
        /**
         * @type {MediaQueryList}
c5169e0e   Renato De Donato   a new hope
64
         */ 
eb240478   Luigi Serra   public room cards...
65
66
67
68
69
70
        _mq: {
          value: null
        }
      },
  
      attached: function() {
eb240478   Luigi Serra   public room cards...
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
        this.queryChanged();
      },
  
      detached: function() {
        this._remove();
      },
  
      _add: function() {
        if (this._mq) {
          this._mq.addListener(this._boundMQHandler);
        }
      },
  
      _remove: function() {
        if (this._mq) {
          this._mq.removeListener(this._boundMQHandler);
        }
        this._mq = null;
      },
  
      queryChanged: function() {
        this._remove();
        var query = this.query;
        if (!query) {
          return;
        }
c5169e0e   Renato De Donato   a new hope
97
        if (query[0] !== '(') {
eb240478   Luigi Serra   public room cards...
98
99
100
101
102
103
104
105
106
107
108
109
110
111
          query = '(' + query + ')';
        }
        this._mq = window.matchMedia(query);
        this._add();
        this.queryHandler(this._mq);
      },
  
      queryHandler: function(mq) {
        this._setQueryMatches(mq.matches);
      }
  
    });
  
  </script>