{"version":3,"sources":["responsivecloudinaryimages.js"],"names":["cloudinaryIsScrolling","halfWindowHeight","window","outerHeight","halfWindowWidth","outerWidth","ResponsiveCloudinaryImages","[object Object]","this","AddListeners","lastWidth","scope","Array","from","querySelectorAll","filter","NotLoaded","bind","InView","ElementIsVisible","forEach","ProcessImage","innerWidth","image","source","dataset","height","undefined","clientHeight","width","clientWidth","cropPointX","hasAttribute","cropPointY","imageHeight","imageWidth","autoHeight","autoWidth","resizeMode","toLowerCase","transformations","transformed","toFixed","GetDPR","SplitUrlIntoParts","then","parts","base","file","parsedUrl","AddUrlToElement","_","AddSizesToElement","event","Event","dispatchEvent","setAttribute","url","style","backgroundImage","dpr","devicePixelRatio","dprString","toString","match","boundingClientRect","getBoundingClientRect","elementTop","top","elementRight","right","elementLeft","left","innerHeight","element","offsetWidth","offsetHeight","elementStyles","getComputedStyle","display","opacity","parentElement","groups","container","elm","ResetImage","removeAttribute","ClearAll","Run","AddVisibilityChange","AddResizeChange","AddScrollListener","document","addEventListener","hidden","checker","setInterval","clearInterval","cloudinaryProcessor","ReRun","once","clearTimeout","setTimeout"],"mappings":"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","sourcesContent":["let cloudinaryIsScrolling;\r\nconst halfWindowHeight = window.outerHeight / 2;\r\nconst halfWindowWidth = window.outerWidth / 2;\r\nconst ResponsiveCloudinaryImages = class {\r\n    constructor() {\r\n        this.AddListeners();\r\n        this.lastWidth = 0;\r\n    }\r\n\r\n    Run(scope) {\r\n        Array.from(scope.querySelectorAll('[data-resource-processor=\"cloudinary\"]')).filter(this.NotLoaded.bind(this)).filter(this.InView.bind(this)).filter(this.ElementIsVisible.bind(this)).forEach(this.ProcessImage.bind(this));\r\n        this.lastWidth = window.innerWidth;\r\n    }\r\n\r\n    ProcessImage(image) {\r\n        const source = image.dataset['src'];\r\n        const height = image.clientHeight !== undefined && image.clientHeight !== null ? image.clientHeight : image.height;\r\n        const width = image.clientWidth !== undefined && image.clientWidth !== null ? image.clientWidth : image.width;\r\n        const cropPointX = image.hasAttribute('data-crop-point-x') && !!image.dataset.cropPointX ? image.dataset.cropPointX : null;\r\n        const cropPointY = image.hasAttribute('data-crop-point-y') && !!image.dataset.cropPointY ? image.dataset.cropPointY : null;\r\n        const imageHeight = image.hasAttribute('data-image-height') && !!image.dataset.imageHeight ? image.dataset.imageHeight : null;\r\n        const imageWidth = image.hasAttribute('data-image-width') && !!image.dataset.imageWidth ? image.dataset.imageWidth : null;\r\n        const autoHeight = image.hasAttribute('data-autoheight');\r\n        const autoWidth = image.hasAttribute('data-autowidth');\r\n        const resizeMode = !image.dataset.resizeMode ? \"fit\" : image.dataset.resizeMode.toLowerCase();\r\n        let transformations = 'f_auto,q_auto';\r\n\r\n        if (autoHeight !== true) {\r\n            transformations += `,h_${height}`;\r\n        }\r\n\r\n        if (autoWidth !== true) {\r\n            transformations += `,w_${width}`;\r\n        }\r\n\r\n        if ((!!cropPointX || !!cropPointY) && (resizeMode === \"fill\" || resizeMode === \"crop\")) {\r\n            transformations += `,g_xy_center`;\r\n        }\r\n\r\n        if (!!cropPointX) {\r\n            const transformed = (imageWidth * cropPointX).toFixed(0);\r\n            const roundedUp = transformed >= 0 ? transformed : 0;\r\n            transformations += `,x_${roundedUp}`;\r\n        }\r\n\r\n        if (!!cropPointY) {\r\n            const transformed = (imageHeight * cropPointY).toFixed(0);\r\n            const roundedUp = transformed >= 0 ? transformed : 0;\r\n            transformations += `,y_${roundedUp}`;\r\n        }\r\n\r\n        transformations += `,c_${resizeMode}`;\r\n        transformations += `/dpr_${this.GetDPR()}`;\r\n        this.SplitUrlIntoParts(source).then(parts => `${parts.base}${transformations}/${parts.file}`).then(parsedUrl => this.AddUrlToElement(image, parsedUrl)).then(_ => this.AddSizesToElement(image, height, width))\r\n            .then(_ => image.dataset['loaded'] = true)\r\n            .then(_ => {\r\n                const event = new Event(\"cloudinaryImageLoaded\");\r\n                image.dispatchEvent(event);\r\n            });\r\n    }\r\n\r\n    AddSizesToElement(image, height, width) {\r\n        image.setAttribute(\"height\", height);\r\n        image.setAttribute(\"width\", width);\r\n    }\r\n\r\n    AddUrlToElement(image, url) {\r\n        if (!!image.style.backgroundImage) {\r\n            image.style.backgroundImage = `url('${url}')`;\r\n        } else {\r\n            image.setAttribute('src', url);\r\n        }\r\n    }\r\n\r\n    GetDPR() {\r\n        let dpr = (typeof window !== \"undefined\" && window !== null ? window.devicePixelRatio : void 0) || 1;\r\n\r\n        if (dpr <= 0 || dpr === 0 / 0) {\r\n            dpr = 1;\r\n        }\r\n\r\n        let dprString = dpr.toString();\r\n\r\n        if (dprString.match(/^\\d+$/)) {\r\n            dprString += '.0';\r\n        }\r\n\r\n        return dprString;\r\n    }\r\n\r\n    InView(image) {\r\n        const boundingClientRect = image.getBoundingClientRect();\r\n        const elementTop = boundingClientRect.top - halfWindowHeight;\r\n        const elementRight = boundingClientRect.right + halfWindowWidth;\r\n        const elementLeft = boundingClientRect.left - halfWindowWidth;\r\n        return elementTop <= window.innerHeight\r\n            && elementLeft <= window.innerWidth\r\n            && elementRight > 0;\r\n    }\r\n\r\n    ElementIsVisible(element) {\r\n        if (element.offsetWidth === 0 || element.offsetHeight === 0) {\r\n            return false;\r\n        }\r\n\r\n        const elementStyles = window.getComputedStyle(element);\r\n\r\n        if (elementStyles.display === 'none') {\r\n            return false;\r\n        }\r\n\r\n        if (elementStyles.opacity === '0') {\r\n            return false;\r\n        }\r\n\r\n        if (element.parentElement === null) {\r\n            return true;\r\n        } else {\r\n            return this.ElementIsVisible(element.parentElement);\r\n        }\r\n    }\r\n\r\n    NotLoaded(image) {\r\n        return image.dataset['loaded'] !== 'true';\r\n    }\r\n\r\n    async SplitUrlIntoParts(url) {\r\n        const parts = url.match('(?<base>.*\\/upload\\/)(?<file>.*)');\r\n        return {\r\n            'base': parts.groups.base,\r\n            'file': parts.groups.file\r\n        };\r\n    }\r\n\r\n    ClearAll(container) {\r\n        Array.from(container.querySelectorAll(\"[data-resource-processor=cloudinary][data-loaded=true]\")).forEach(elm => this.ResetImage(elm));\r\n    }\r\n\r\n    ResetImage(image) {\r\n        image.removeAttribute(\"src\");\r\n        image.removeAttribute(\"height\");\r\n        image.removeAttribute(\"width\");\r\n        image.removeAttribute(\"data-loaded\");\r\n    }\r\n\r\n    ReRun(scope) {\r\n        this.ClearAll(scope);\r\n        this.Run(scope);\r\n    }\r\n\r\n    AddListeners() {\r\n        this.AddVisibilityChange();\r\n        this.AddResizeChange();\r\n        this.AddScrollListener(window);\r\n    }\r\n\r\n    AddVisibilityChange() {\r\n        document.addEventListener('visibilitychange', () => {\r\n            if (document.hidden === false) {\r\n                const checker = setInterval(() => {\r\n                    if (window.outerHeight > 0) {\r\n                        window.clearInterval(checker);\r\n                        cloudinaryProcessor.ReRun(document);\r\n                    }\r\n                }, 10);\r\n            }\r\n        }, {\r\n            once: true\r\n        });\r\n    }\r\n\r\n    AddResizeChange() {\r\n        window.addEventListener(\"resize\", function () {\r\n            const difference = window.innerWidth - cloudinaryProcessor.lastWidth;\r\n\r\n            if (difference >= 200) {\r\n                cloudinaryProcessor.ReRun(document);\r\n            }\r\n        });\r\n    }\r\n\r\n    AddScrollListener(element) {\r\n        element.addEventListener(\"scroll\", function () {\r\n            window.clearTimeout(cloudinaryIsScrolling);\r\n            cloudinaryIsScrolling = setTimeout(function () {\r\n                cloudinaryProcessor.Run(document);\r\n            }, 100);\r\n        });\r\n    }\r\n\r\n};\r\nconst cloudinaryProcessor = new ResponsiveCloudinaryImages();\r\ndocument.addEventListener(\"DOMContentLoaded\", () => {\r\n    cloudinaryProcessor.Run(document);\r\n});"],"file":"responsivecloudinaryimages-min.js"}