46 lines
1.2 KiB
JavaScript
46 lines
1.2 KiB
JavaScript
|
'use strict';
|
||
|
|
|
||
|
|
import $ from 'jquery';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Runs a callback function when images are fully loaded.
|
||
|
|
* @param {Object} images - Image(s) to check if loaded.
|
||
|
|
* @param {Func} callback - Function to execute when image is fully loaded.
|
||
|
|
*/
|
||
|
|
function onImagesLoaded(images, callback){
|
||
|
|
var self = this,
|
||
|
|
unloaded = images.length;
|
||
|
|
|
||
|
|
if (unloaded === 0) {
|
||
|
|
callback();
|
||
|
|
}
|
||
|
|
|
||
|
|
images.each(function(){
|
||
|
|
// Check if image is loaded
|
||
|
|
if (this.complete && typeof this.naturalWidth !== 'undefined') {
|
||
|
|
singleImageLoaded();
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
// If the above check failed, simulate loading on detached element.
|
||
|
|
var image = new Image();
|
||
|
|
// Still count image as loaded if it finalizes with an error.
|
||
|
|
var events = "load.zf.images error.zf.images";
|
||
|
|
$(image).one(events, function me(event){
|
||
|
|
// Unbind the event listeners. We're using 'one' but only one of the two events will have fired.
|
||
|
|
$(this).off(events, me);
|
||
|
|
singleImageLoaded();
|
||
|
|
});
|
||
|
|
image.src = $(this).attr('src');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
function singleImageLoaded() {
|
||
|
|
unloaded--;
|
||
|
|
if (unloaded === 0) {
|
||
|
|
callback();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export { onImagesLoaded };
|