blob: 38bf194dacb39bd1d756358610c1c1dea629397b [file] [log] [blame]
<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>