jellyfin-web/dashboard-ui/thirdparty/jquery.unveil-custom.js

116 lines
2.6 KiB
JavaScript
Raw Normal View History

/**
* jQuery Unveil
* A very lightweight jQuery plugin to lazy load images
* http://luis-almeida.github.com/unveil
*
* Licensed under the MIT license.
* Copyright 2013 Luís Almeida
* https://github.com/luis-almeida
*/
2015-05-09 21:29:04 -07:00
(function ($) {
var unveilId = 0;
2015-05-12 21:55:19 -07:00
function getThreshold() {
2015-05-27 22:51:48 -07:00
// If less than 100, the search window ends up not getting images
// If less than 200, this happens on the home page
// Need to fix those before this can be set to 0
return 200;
2015-05-12 21:55:19 -07:00
}
2015-05-11 09:32:15 -07:00
$.fn.unveil = function () {
var $w = $(window),
2015-05-12 21:55:19 -07:00
th = getThreshold(),
2015-05-06 20:11:51 -07:00
attrib = "data-src",
images = this,
loaded;
2015-05-09 21:29:04 -07:00
unveilId++;
var eventNamespace = 'unveil' + unveilId;
this.one("unveil", function () {
2015-05-07 07:04:10 -07:00
var elem = this;
var source = elem.getAttribute(attrib);
if (source) {
2015-05-09 21:29:04 -07:00
ImageStore.setImageInto(elem, source);
2015-05-07 07:04:10 -07:00
elem.setAttribute("data-src", '');
}
});
function unveil() {
var inview = images.filter(function () {
var $e = $(this);
2015-05-09 21:29:04 -07:00
if ($e.is(":hidden")) return;
var wt = $w.scrollTop(),
wb = wt + $w.height(),
et = $e.offset().top,
eb = et + $e.height();
return eb >= wt - th && et <= wb + th;
});
loaded = inview.trigger("unveil");
images = images.not(loaded);
2015-05-09 21:29:04 -07:00
if (!images.length) {
$w.off('scroll.' + eventNamespace);
$w.off('resize.' + eventNamespace);
}
}
2015-05-09 21:29:04 -07:00
$w.on('scroll.' + eventNamespace, unveil);
$w.on('resize.' + eventNamespace, unveil);
unveil();
return this;
};
2015-01-22 23:15:15 -07:00
$.fn.lazyChildren = function () {
2015-05-09 21:29:04 -07:00
var lazyItems = $(".lazy", this);
if (lazyItems.length) {
2015-05-11 09:32:15 -07:00
lazyItems.unveil();
2015-05-09 21:29:04 -07:00
}
2015-01-22 23:15:15 -07:00
return this;
};
2015-05-09 21:29:04 -07:00
$.fn.lazyImage = function (url) {
2015-05-11 09:32:15 -07:00
return this.attr('data-src', url).unveil();
2015-05-09 21:29:04 -07:00
};
})(window.jQuery || window.Zepto);
(function () {
2015-05-11 09:32:15 -07:00
function setImageIntoElement(elem, url) {
if (elem.tagName === "DIV") {
elem.style.backgroundImage = "url('" + url + "')";
} else {
elem.setAttribute("src", url);
}
}
2015-05-09 21:29:04 -07:00
function simpleImageStore() {
var self = this;
2015-05-11 09:32:15 -07:00
self.setImageInto = setImageIntoElement;
2015-05-09 21:29:04 -07:00
}
2015-05-12 21:55:19 -07:00
console.log('creating simpleImageStore');
window.ImageStore = new simpleImageStore();
2015-05-09 21:29:04 -07:00
})();