window.$claudia = {
    imgAddLoadedEvent: function () {
        var images = document.querySelectorAll('.js-progressive-loading')

        // TODO: type is image ?
        // TODO: read data-backdrop
        function loaded(event) {
            var image = event.currentTarget
            var parent = image.parentElement

            var parentWidth = Math.round(parent.getBoundingClientRect().width)
            var childImgWidth = Math.round(image.getBoundingClientRect().width)

            image.style.opacity = 1

            var isCovered = parentWidth === childImgWidth
            var blurImg = parent.previousElementSibling
            if (isCovered) {
                blurImg.classList.add('is-hidden')
                return
            }
            blurImg.classList.remove('is-hidden')
        }

        function eachImage(noNeedLoadEvt) {
            images.forEach(function (img) {
                if (img.complete) {
                    loaded({ currentTarget: img })
                    return
                }

                if (noNeedLoadEvt) return
                img.addEventListener('load', loaded)
            })
        }

        // 截流
        function throttle(func, time) {
            var wait = false
            return function () {
                if (wait) return
                wait = true
                setTimeout(function () {
                    func()
                    wait = false
                }, time)
            }
        }

        window.addEventListener('resize', throttle(function () { eachImage(true) }, 100))

        eachImage()
    }
}

document.addEventListener('DOMContentLoaded', function () {
    $claudia.imgAddLoadedEvent()
})

window.$claudia = {
    throttle: function (func, time) {
        var wait = false
        return function () {
            if (wait) return
            wait = true

            setTimeout(function () {
                func()
                wait = false
            }, time || 100)
        }
    },
    fadeInImage: function(imgs, imageLoadedCallback) {
        var images = imgs || document.querySelectorAll('.js-img-fadeIn')

        function loaded(event) {
            var image = event.currentTarget
            image.style.transition = 'opacity 320ms'
            image.style.opacity = 1
            imageLoadedCallback && imageLoadedCallback(image)
        }

        images.forEach(function (img) {
            if (img.complete) {
                return loaded({ currentTarget: img })
            }

            img.addEventListener('load', loaded)
        })
    },
    blurBackdropImg: function(image) {
        if (!image.dataset.backdrop) return

        var parent = image.parentElement //TODO: Not finish yes, must be a pure function
        var parentWidth = Math.round(parent.getBoundingClientRect().width)
        var childImgWidth = Math.round(image.getBoundingClientRect().width)

        var isCovered = parentWidth === childImgWidth
        var blurImg = parent.previousElementSibling //TODO: Not finish yes, must be a pure function

        isCovered ? blurImg.classList.add('is-hidden') : blurImg.classList.remove('is-hidden')
    },
}

Change the way a method is called
Change the way a method is called
