46 lines
1.1 KiB
JavaScript
46 lines
1.1 KiB
JavaScript
// browser tab visibility state detection
|
|
|
|
import Events from '../_events'
|
|
import Consts from '../_consts'
|
|
import ImageObject from './models/image'
|
|
|
|
export default ((W) => {
|
|
const NAME = 'main.lazy-images'
|
|
const D = document
|
|
const BODY = D.body
|
|
|
|
const loadLazyImages = () => {
|
|
console.log(`${NAME}: Load lazy images`)
|
|
|
|
D.querySelectorAll('[data-lazy-src]').forEach((el) => {
|
|
el.classList.remove('empty')
|
|
|
|
const img = new ImageObject()
|
|
|
|
img.load(el.getAttribute('data-lazy-src'), el)
|
|
.then((result) => {
|
|
el.setAttribute('src', result)
|
|
})
|
|
.catch(() => {
|
|
el.classList.add('empty')
|
|
})
|
|
})
|
|
|
|
D.querySelectorAll('[data-lazy-bg]').forEach((el) => {
|
|
el.classList.remove('empty')
|
|
const img = new ImageObject()
|
|
|
|
img.load(el.getAttribute('data-lazy-bg'), el)
|
|
.then((result) => {
|
|
el.style.backgroundImage = `url(${result})`
|
|
})
|
|
.catch((e) => {
|
|
el.classList.add('empty')
|
|
})
|
|
})
|
|
}
|
|
|
|
W.addEventListener(`${Events.LODEDANDREADY}`, loadLazyImages)
|
|
W.addEventListener(`${Events.AJAX}`, loadLazyImages)
|
|
})(window)
|