jellyfin-web/dashboard-ui/bower_components/emby-webcomponents/emby-button/paper-icon-button-light.js
2016-12-14 15:58:55 -05:00

82 lines
2.0 KiB
JavaScript

define(['browser', 'dom', 'layoutManager', 'css!./emby-button', 'registerElement'], function (browser, dom, layoutManager) {
'use strict';
var EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype);
function enableAnimation() {
if (browser.tv) {
// too slow
return false;
}
return true;
}
function animateButtonInternal(e, btn) {
var div = document.createElement('div');
for (var i = 0, length = btn.classList.length; i < length; i++) {
div.classList.add(btn.classList[i] + '-ripple-effect');
}
var offsetX = e.offsetX || 0;
var offsetY = e.offsetY || 0;
if (offsetX > 0 && offsetY > 0) {
div.style.left = offsetX + 'px';
div.style.top = offsetY + 'px';
}
btn.appendChild(div);
div.addEventListener(dom.whichAnimationEvent(), function () {
div.parentNode.removeChild(div);
}, false);
}
function animateButton(e, btn) {
requestAnimationFrame(function () {
animateButtonInternal(e, btn);
});
}
function onKeyDown(e) {
if (e.keyCode === 13) {
animateButton(e, this);
}
}
function onClick(e) {
animateButton(e, this);
}
EmbyButtonPrototype.createdCallback = function () {
if (this.classList.contains('paper-icon-button-light')) {
return;
}
this.classList.add('paper-icon-button-light');
if (layoutManager.tv) {
this.classList.add('icon-button-focusscale');
}
if (enableAnimation()) {
dom.addEventListener(this, 'keydown', onKeyDown, {
passive: true
});
dom.addEventListener(this, 'click', onClick, {
passive: true
});
}
};
document.registerElement('paper-icon-button-light', {
prototype: EmbyButtonPrototype,
extends: 'button'
});
});