| <polymer-element name="viewer-button" attributes="src latchable"> |
| <template> |
| <link rel="stylesheet" href="viewer-button.css"> |
| <div id="icon"></div> |
| </template> |
| <script> |
| (function() { |
| var dpi = ''; |
| |
| Polymer('viewer-button', { |
| src: '', |
| latchable: false, |
| ready: function() { |
| if (!dpi) { |
| var mql = window.matchMedia('(-webkit-min-device-pixel-ratio: 1.3'); |
| dpi = mql.matches ? 'hi' : 'low'; |
| } |
| }, |
| srcChanged: function() { |
| if (this.src) { |
| this.$.icon.style.backgroundImage = |
| 'url(' + this.getAttribute('assetpath') + 'img/' + dpi + |
| 'DPI/' + this.src + ')'; |
| } else { |
| this.$.icon.style.backgroundImage = ''; |
| } |
| }, |
| latchableChanged: function() { |
| if (this.latchable) |
| this.classList.add('latchable'); |
| else |
| this.classList.remove('latchable'); |
| }, |
| }); |
| })(); |
| </script> |
| </polymer-element> |