MontoyaTech/ignite-html-lazyload
MontoyaTech/ignite-html-lazyload
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fixed a potential issue within the lazy loading code. Lazy loading now happens even if there is no src attribute.

Browse Source
This commit is contained in:
MattMo 2021-12-13 18:58:20 -08:00
parent 0a41730792
commit 7eb6f9f9d9
1 changed files with 10 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
ignite-html-lazyload.js
View File

@ -18,24 +18,16 @@ class IgniteLazyLoad {
IgniteLazyLoad.observer = new IntersectionObserver(results => {
results.forEach(result => {
if (result.isIntersecting) {
//Find the watching element
var index = -1;
var watching = null;
//Find the watching element.
for (var i = 0; i < IgniteLazyLoad.watching.length; i++) {
if (IgniteLazyLoad.watching[i].element == result.target) {
index = i;
watching = IgniteLazyLoad.watching[i];
IgniteLazyLoad.watching[i].callback();
IgniteLazyLoad.watching.splice(i, 1);
break;
}
}
//Invoke the callback
watching.callback();
//Remove the watching entry.
IgniteLazyLoad.watching.splice(index, 1);
//Unobserve this element.
//Unobserve this element regardless if we were watching it or not.
IgniteLazyLoad.observer.unobserve(result.target);
}
});
@ -63,11 +55,14 @@ class IgniteLazyLoad {
* @returns {IgniteTemplate} This ignite template.
*/
IgniteTemplate.prototype.lazy = function(placeholder = null, callback = null) {
//See if we have a src attribute already defined.
if (this._attributes["src"]) {
//Save the original source.
this._lazy_src = this._attributes["src"];
//If lazy src is invalid, use a transparent placeholder.
if (!this._lazy_src) {
this._lazy_src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=";
}
//Override the attribute changed function, if someone tries to set src and our lazy_src is set, override that.
//Otherwise we might show the wrong lazy loaded image.
var originalAttributeChanged = this.onAttributeChanged;
@ -102,7 +97,7 @@ class IgniteLazyLoad {
this._attributes["src"] = this._lazy_src;
this.element.setAttribute("src", this._lazy_src);
this._lazy_src = null;
//If we have a callback invoke it.
if (callback instanceof IgniteProperty) {
callback.value();
@ -112,7 +107,6 @@ class IgniteLazyLoad {
}
});
});
}
return this;
}