mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Unminify using 1.5.323
Repo with tag: https://github.com/MediaBrowser/emby-webcomponents/tree/1.5.323
This commit is contained in:
parent
4678528d00
commit
de6ac33ec1
289 changed files with 78483 additions and 54701 deletions
|
@ -1,21 +1,105 @@
|
|||
define(["require", "css!./emby-progressring", "registerElement"], function(require) {
|
||||
"use strict";
|
||||
define(['require', 'css!./emby-progressring', 'registerElement'], function (require) {
|
||||
'use strict';
|
||||
|
||||
var EmbyProgressRing = Object.create(HTMLDivElement.prototype);
|
||||
return EmbyProgressRing.createdCallback = function() {
|
||||
this.classList.add("progressring");
|
||||
|
||||
EmbyProgressRing.createdCallback = function () {
|
||||
|
||||
this.classList.add('progressring');
|
||||
var instance = this;
|
||||
require(["text!./emby-progressring.template.html"], function(template) {
|
||||
instance.innerHTML = template, instance.setProgress(parseFloat(instance.getAttribute("data-progress") || "0"))
|
||||
})
|
||||
}, EmbyProgressRing.setProgress = function(progress) {
|
||||
|
||||
require(['text!./emby-progressring.template.html'], function (template) {
|
||||
instance.innerHTML = template;
|
||||
|
||||
//if (window.MutationObserver) {
|
||||
// // create an observer instance
|
||||
// var observer = new MutationObserver(function (mutations) {
|
||||
// mutations.forEach(function (mutation) {
|
||||
|
||||
// instance.setProgress(parseFloat(instance.getAttribute('data-progress') || '0'));
|
||||
// });
|
||||
// });
|
||||
|
||||
// // configuration of the observer:
|
||||
// var config = { attributes: true, childList: false, characterData: false };
|
||||
|
||||
// // pass in the target node, as well as the observer options
|
||||
// observer.observe(instance, config);
|
||||
|
||||
// instance.observer = observer;
|
||||
//}
|
||||
|
||||
instance.setProgress(parseFloat(instance.getAttribute('data-progress') || '0'));
|
||||
});
|
||||
};
|
||||
|
||||
EmbyProgressRing.setProgress = function (progress) {
|
||||
|
||||
progress = Math.floor(progress);
|
||||
|
||||
var angle;
|
||||
progress < 25 ? (angle = progress / 100 * 360 - 90, this.querySelector(".animate-0-25-b").style.transform = "rotate(" + angle + "deg)", this.querySelector(".animate-25-50-b").style.transform = "rotate(-90deg)", this.querySelector(".animate-50-75-b").style.transform = "rotate(-90deg)", this.querySelector(".animate-75-100-b").style.transform = "rotate(-90deg)") : progress >= 25 && progress < 50 ? (angle = (progress - 25) / 100 * 360 - 90, this.querySelector(".animate-0-25-b").style.transform = "none", this.querySelector(".animate-25-50-b").style.transform = "rotate(" + angle + "deg)", this.querySelector(".animate-50-75-b").style.transform = "rotate(-90deg)", this.querySelector(".animate-75-100-b").style.transform = "rotate(-90deg)") : progress >= 50 && progress < 75 ? (angle = (progress - 50) / 100 * 360 - 90, this.querySelector(".animate-0-25-b").style.transform = "none", this.querySelector(".animate-25-50-b").style.transform = "none", this.querySelector(".animate-50-75-b").style.transform = "rotate(" + angle + "deg)", this.querySelector(".animate-75-100-b").style.transform = "rotate(-90deg)") : progress >= 75 && progress <= 100 && (angle = (progress - 75) / 100 * 360 - 90, this.querySelector(".animate-0-25-b").style.transform = "none", this.querySelector(".animate-25-50-b").style.transform = "none", this.querySelector(".animate-50-75-b").style.transform = "none", this.querySelector(".animate-75-100-b").style.transform = "rotate(" + angle + "deg)"), this.querySelector(".progressring-text").innerHTML = progress + "%"
|
||||
}, EmbyProgressRing.attachedCallback = function() {}, EmbyProgressRing.detachedCallback = function() {
|
||||
|
||||
if (progress < 25) {
|
||||
angle = -90 + (progress / 100) * 360;
|
||||
|
||||
this.querySelector('.animate-0-25-b').style.transform = 'rotate(' + angle + 'deg)';
|
||||
|
||||
this.querySelector('.animate-25-50-b').style.transform = 'rotate(-90deg)';
|
||||
this.querySelector('.animate-50-75-b').style.transform = 'rotate(-90deg)';
|
||||
this.querySelector('.animate-75-100-b').style.transform = 'rotate(-90deg)';
|
||||
}
|
||||
else if (progress >= 25 && progress < 50) {
|
||||
|
||||
angle = -90 + ((progress - 25) / 100) * 360;
|
||||
|
||||
this.querySelector('.animate-0-25-b').style.transform = 'none';
|
||||
this.querySelector('.animate-25-50-b').style.transform = 'rotate(' + angle + 'deg)';
|
||||
|
||||
this.querySelector('.animate-50-75-b').style.transform = 'rotate(-90deg)';
|
||||
this.querySelector('.animate-75-100-b').style.transform = 'rotate(-90deg)';
|
||||
}
|
||||
else if (progress >= 50 && progress < 75) {
|
||||
angle = -90 + ((progress - 50) / 100) * 360;
|
||||
|
||||
this.querySelector('.animate-0-25-b').style.transform = 'none';
|
||||
this.querySelector('.animate-25-50-b').style.transform = 'none';
|
||||
this.querySelector('.animate-50-75-b').style.transform = 'rotate(' + angle + 'deg)';
|
||||
|
||||
this.querySelector('.animate-75-100-b').style.transform = 'rotate(-90deg)';
|
||||
}
|
||||
else if (progress >= 75 && progress <= 100) {
|
||||
angle = -90 + ((progress - 75) / 100) * 360;
|
||||
|
||||
this.querySelector('.animate-0-25-b').style.transform = 'none';
|
||||
this.querySelector('.animate-25-50-b').style.transform = 'none';
|
||||
this.querySelector('.animate-50-75-b').style.transform = 'none';
|
||||
this.querySelector('.animate-75-100-b').style.transform = 'rotate(' + angle + 'deg)';
|
||||
}
|
||||
|
||||
this.querySelector('.progressring-text').innerHTML = progress + '%';
|
||||
};
|
||||
|
||||
EmbyProgressRing.attachedCallback = function () {
|
||||
|
||||
};
|
||||
|
||||
EmbyProgressRing.detachedCallback = function () {
|
||||
|
||||
|
||||
var observer = this.observer;
|
||||
observer && (observer.disconnect(), this.observer = null)
|
||||
}, document.registerElement("emby-progressring", {
|
||||
|
||||
if (observer) {
|
||||
// later, you can stop observing
|
||||
observer.disconnect();
|
||||
|
||||
this.observer = null;
|
||||
}
|
||||
};
|
||||
|
||||
document.registerElement('emby-progressring', {
|
||||
prototype: EmbyProgressRing,
|
||||
extends: "div"
|
||||
}), EmbyProgressRing
|
||||
extends: 'div'
|
||||
});
|
||||
|
||||
return EmbyProgressRing;
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue