mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update image loader
This commit is contained in:
parent
f29a2b4bfd
commit
3d1e5130fe
9 changed files with 140 additions and 152 deletions
|
@ -1,4 +1,4 @@
|
|||
define(['visibleinviewport', 'imageloader'], function (visibleinviewport, imageLoader) {
|
||||
define(['visibleinviewport', 'imageFetcher'], function (visibleinviewport, imageFetcher) {
|
||||
|
||||
var thresholdX = screen.availWidth;
|
||||
var thresholdY = screen.availHeight;
|
||||
|
@ -9,14 +9,33 @@ define(['visibleinviewport', 'imageloader'], function (visibleinviewport, imageL
|
|||
return visibleinviewport(elem, true, thresholdX, thresholdY);
|
||||
}
|
||||
|
||||
var self = {};
|
||||
|
||||
function fillImage(elem) {
|
||||
var source = elem.getAttribute('data-src');
|
||||
if (source) {
|
||||
imageLoader.loadImage(elem, source);
|
||||
if (self.enableFade) {
|
||||
imageFetcher.loadImage(elem, source).then(fadeIn);
|
||||
} else {
|
||||
imageFetcher.loadImage(elem, source);
|
||||
}
|
||||
elem.setAttribute("data-src", '');
|
||||
}
|
||||
}
|
||||
|
||||
function fadeIn(elem) {
|
||||
|
||||
if (elem.classList.contains('noFade')) {
|
||||
return;
|
||||
}
|
||||
|
||||
var keyframes = [
|
||||
{ opacity: '0', offset: 0 },
|
||||
{ opacity: '1', offset: 1 }];
|
||||
var timing = { duration: 300, iterations: 1 };
|
||||
elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function cancelAll(tokens) {
|
||||
for (var i = 0, length = tokens.length; i < length; i++) {
|
||||
|
||||
|
@ -167,9 +186,24 @@ define(['visibleinviewport', 'imageloader'], function (visibleinviewport, imageL
|
|||
return result;
|
||||
}
|
||||
|
||||
return {
|
||||
lazyChildren: lazyChildren,
|
||||
getPrimaryImageAspectRatio: getPrimaryImageAspectRatio
|
||||
};
|
||||
function fillImages(elems) {
|
||||
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
var elem = elems[0];
|
||||
fillImage(elem);
|
||||
}
|
||||
}
|
||||
|
||||
function lazyImage(elem, url) {
|
||||
|
||||
elem.setAttribute('data-src', url);
|
||||
fillImage(elem);
|
||||
}
|
||||
|
||||
self.fillImages = fillImages;
|
||||
self.lazyImage = lazyImage;
|
||||
self.lazyChildren = lazyChildren;
|
||||
self.getPrimaryImageAspectRatio = getPrimaryImageAspectRatio;
|
||||
|
||||
return self;
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue