{"version":3,"sources":["webpack:///./modules/HotspotImage.ts","webpack:///./helpers/domhelpers.ts"],"names":["__webpack_require__","r","__webpack_exports__","_helpers_domhelpers__WEBPACK_IMPORTED_MODULE_0__","_js_libs_tiny_slider_js__WEBPACK_IMPORTED_MODULE_1__","HotspotImage","element","_this","this","axisVal","Eucerin","isDesktop","itemsNr","autoWidthVal","createCords","initHotspotImageSlider","querySelector","classList","add","indexChange","initReadMoreOnClick","readMoreBtn","document","addEventListener","initHotspotSlider","destroy","setup","selector","Array","from","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","prototype","autowidthVal","Object","container","items","slideBy","axis","navContainer","navAsThumbnails","lazyload","lazyloadSelector","autoWidth","nav","mouseDrag","autoHeight","loop","speed","preventScrollOnTouch","xyCordsArray","innerHTML","index","indexVal","hospotPointVal","getAttribute","createHotspotPoints","setAttribute","imageWidth","clientWidth","imageHeight","clientHeight","closest","appendChild","positionCords","cpHotspotImage","img","hotspotPointList","naturalWidth","naturalHeight","xPosCord","yPosCord","style","left","toString","top","events","on","e","indexEl","displayIndex","initActiveIndexEl","then","bind","module","default","remove","createElement","createElementFromString","str","wrapper","className","addClassName","createDiv","firstElementChild","value","addClass","removeClass","createScriptTag","script","domScript","type","src","textContent","innerText","defer","injectScriptsFromAjaxResponse","scripts","getElementsByTagName","exist","shouldScriptNotBeMoved","hasAttribute","length","indexOf","isScriptTagRendered","map","Promise","all","resolve","reject","onload","onerror","console","error","event","target","head","listenToLoad$","_functional__WEBPACK_IMPORTED_MODULE_3__","arg","rxjs__WEBPACK_IMPORTED_MODULE_0__","pipe","rxjs_operators__WEBPACK_IMPORTED_MODULE_1__","rxjs_operators__WEBPACK_IMPORTED_MODULE_2__","removeDataAttr","hideSpinner","dispatchEvent","CustomEvent","srcset","supportWebP","tagName","includes","replace","addSpinnerToImage","parentElement","removeAttribute"],"mappings":"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","file":"./modules/HotspotImage.0f9872a1.js","sourcesContent":["const moduleSelector = '[data-module=\"HotspotImage\"]';\r\nimport { createElementFromString } from '../helpers/domhelpers';\r\nimport { tns } from '../../js/libs/tiny-slider.js'\r\n\r\nexport default class HotspotImage {\r\n    initHotspotSlider;\r\n    xPosCord;\r\n    yPosCord;\r\n    axisVal;\r\n    itemsNr;\r\n    autoWidthVal;\r\n    imageWidth;\r\n    imageHeight;\r\n    readMoreBtn;\r\n\r\n    static setup(selector: string = moduleSelector): void {\r\n        Array.from(document.querySelectorAll(selector)).filter((node: HTMLElement) => !node.dataset.moduleInitialized).forEach((element: HTMLElement) => {\r\n            new HotspotImage(element);\r\n            element.dataset.moduleInitialized = 'true';\r\n        });\r\n    }\r\n\r\n    constructor(public element: HTMLElement) {\r\n        this.axisVal = Eucerin.isDesktop ? \"vertical\" : \"horizontal\";\r\n        this.itemsNr = Eucerin.isDesktop ? \"1\" : \"1\";\r\n        this.autoWidthVal = Eucerin.isDesktop ? false : true;\r\n        this.createCords();\r\n        this.initHotspotImageSlider(this.axisVal, this.itemsNr, this.autoWidthVal);\r\n        this.element.querySelector(\".card\").classList.add(\"active\");\r\n\r\n        this.indexChange();\r\n        this.initReadMoreOnClick(this.readMoreBtn);\r\n\r\n        document.addEventListener('Eucerin:resizeEnd', () => {\r\n            this.axisVal = Eucerin.isDesktop ? \"vertical\" : \"horizontal\";\r\n            this.itemsNr = Eucerin.isDesktop ? \"1\" : \"1\";\r\n            this.autoWidthVal = Eucerin.isDesktop ? false : true;\r\n            this.initHotspotSlider.destroy();\r\n            this.createCords();\r\n            this.initHotspotImageSlider(this.axisVal, this.itemsNr, this.autoWidthVal);\r\n            this.element.querySelector(\".card\").classList.add(\"active\");\r\n            this.indexChange();\r\n            this.initReadMoreOnClick(this.readMoreBtn);\r\n        });\r\n    }\r\n\r\n    private initHotspotImageSlider(axisVal, itemsNr, autowidthVal) {\r\n        this.initHotspotSlider = tns({\r\n            container: this.element.querySelector('.hotspot-teasers'),\r\n            items: itemsNr,\r\n            slideBy: 1,\r\n            axis: axisVal,\r\n            navContainer: this.element.querySelector(\".hotspot-wrapper\"),\r\n            navAsThumbnails: true,\r\n            lazyload: true,\r\n            lazyloadSelector: 'img',\r\n            autoWidth: autowidthVal,\r\n            nav: true,\r\n            mouseDrag: true,\r\n            autoHeight: true,\r\n            loop: false,\r\n            speed: 400,\r\n            preventScrollOnTouch: 'auto',\r\n        });\r\n    }\r\n\r\n    private createCords() {\r\n        const xyCordsArray = this.element.querySelectorAll(\".hotspot-teasers .card\");\r\n        this.element.querySelector(\".hotspot-wrapper\").innerHTML = \"\";\r\n        xyCordsArray.forEach((element, index) => {\r\n            const indexVal = index + 1,\r\n                hospotPointVal = element.getAttribute(\"data-card-hotspot-label\") !== \"\" ? indexVal : \"\";\r\n                this.readMoreBtn = element.querySelector(\".read-more-info\");\r\n            const createHotspotPoints = createElementFromString(`\r\n                <span data-card-hotspot-x=${element.getAttribute(\"data-card-hotspot-x\")} active-item-point=${indexVal} data-card-hotspot-y=${element.getAttribute(\"data-card-hotspot-y\")} index=${index + 1} class=\"hotspot-point\">${hospotPointVal}</span>\r\n            `);\r\n\r\n            element.setAttribute(\"active-item-card\", `${indexVal}`);\r\n\r\n            this.imageWidth = this.element.querySelector(\".image-wrapper\").clientWidth;\r\n            this.imageHeight = this.element.querySelector(\".image-wrapper\").clientHeight;\r\n\r\n            element.closest(\".cp-hotspot-image\").querySelector(\".hotspot-wrapper\").appendChild(createHotspotPoints);\r\n            this.positionCords(element);\r\n        });\r\n    }\r\n\r\n    private positionCords(element) {\r\n        const cpHotspotImage = element.closest(\".cp-hotspot-image\");\r\n        const img = cpHotspotImage.querySelector('img');\r\n\r\n        const hotspotPointList = cpHotspotImage.querySelectorAll(\".hotspot-point\"),\r\n            naturalWidth = img.naturalWidth,\r\n            naturalHeight = img.naturalHeight;\r\n\r\n        const hotspotRadius = 12.5;\r\n\r\n        hotspotPointList.forEach((element: HTMLElement) => {\r\n            this.xPosCord = element.getAttribute(\"data-card-hotspot-x\");\r\n            this.yPosCord = element.getAttribute(\"data-card-hotspot-y\");\r\n            element.style.left = (this.xPosCord * this.imageWidth / naturalWidth - hotspotRadius).toString() + \"px\";\r\n            element.style.top = (this.yPosCord * this.imageHeight / naturalHeight - hotspotRadius).toString() + \"px\";\r\n        });\r\n    }\r\n\r\n    private indexChange() {\r\n        this.initHotspotSlider.events.on('indexChanged', (e) => {\r\n            const indexEl = e.displayIndex;\r\n\r\n            this.initActiveIndexEl(indexEl);\r\n        });\r\n    }\r\n\r\n    private initReadMoreOnClick(element) {\r\n        const TeaserReadMore = () => import('../modules/TeaserReadMore');\r\n        TeaserReadMore().then((module) => new module.default(element));\r\n    }\r\n\r\n    private initActiveIndexEl(e) {\r\n        this.element.querySelectorAll(\".card\").forEach((element) => {\r\n            element.classList.remove(\"active\");\r\n            if (element.getAttribute(\"active-item-card\") == e) {\r\n                element.classList.add(\"active\");\r\n            }\r\n        });\r\n    }\r\n}\r\n\r\nnew HotspotImage.setup();","/// <reference path=\"../typings/facelift.d.ts\" />\r\nimport {\r\n    fromEvent,\r\n    Observable,\r\n} from 'rxjs';\r\n\r\nimport {\r\n    first,\r\n    map,\r\n} from 'rxjs/operators';\r\n\r\nimport {\r\n    pipe,\r\n    fork,\r\n    alt,\r\n    not,\r\n    tap,\r\n} from './functional';\r\n\r\nimport { isIOS } from '../helpers/helperFunctions';\r\n\r\nexport function bindFunctions(element: any, ...funcs: Array<(target: any, ...args: any[]) => void>) {\r\n    return function (...args) {\r\n        funcs.forEach((f, i) => f(element, args[i]));\r\n        return element;\r\n    }\r\n}\r\n\r\nexport function createElement(selector: string): HTMLElement {\r\n    return document.createElement(selector);\r\n}\r\n\r\nexport function createAnchor(href: string = '', text: string = '', className: string = ''): HTMLAnchorElement {\r\n    return bindFunctions(\r\n        createElement('a'),\r\n        addHref,\r\n        addTextContent,\r\n        addClassName\r\n    )(href, text, className);\r\n}\r\n\r\nexport function createSpan(className: string): HTMLElement {\r\n    return addClassName(createElement('span'), className);\r\n};\r\n\r\nexport function createDiv(className: string): HTMLElement {\r\n    return addClassName(createElement('div'), className);\r\n};\r\n\r\nexport function createNav(className: string): HTMLElement {\r\n    return addClassName(createElement('nav'), className);\r\n};\r\n\r\nexport function createUList(className: string): HTMLElement {\r\n    return addClassName(createElement('ul'), className);\r\n};\r\n\r\nexport function createListItem(className: string): HTMLElement {\r\n    return addClassName(createElement('li'), className);\r\n};\r\n\r\nexport function createButton(className: string): HTMLElement {\r\n    return addClassName(createElement('button'), className);\r\n};\r\n\r\nexport function createElementFromString(str: string): HTMLElement {\r\n    const wrapper = createDiv('');\r\n    wrapper.innerHTML = str;\r\n    return <HTMLElement>wrapper.firstElementChild || wrapper;\r\n}\r\n\r\nexport function createSVG(inner: string): HTMLElement {\r\n    const svg = document.createElement('svg');\r\n    svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');\r\n    svg.setAttribute('viewBox', '0 0 86 86');\r\n    svg.innerHTML = inner;\r\n\r\n    return svg;\r\n}\r\n\r\nexport function addTextContent(element: HTMLElement, value: string): HTMLElement {\r\n    element.textContent = value;\r\n    return element;\r\n}\r\n\r\nexport function addInnerHTML(element: HTMLElement, value: string): HTMLElement {\r\n    element.innerHTML = value;\r\n    return element;\r\n}\r\n\r\nexport function addClassName(element: HTMLElement, value: string): HTMLElement {\r\n    element.className = value;\r\n    return element;\r\n}\r\n\r\nexport function addClass(element: HTMLElement, value: string): HTMLElement {\r\n    element.classList.add(value);\r\n    return element;\r\n}\r\n\r\nexport function addClasses(element: HTMLElement, ...classes: string[]): HTMLElement {\r\n    classes.forEach(cls => addClass(element, cls));\r\n    return element;\r\n}\r\n\r\nexport function removeClass(node: HTMLElement, className: string): HTMLElement {\r\n    node.classList.remove(className);\r\n    return node;\r\n}\r\n\r\nexport function removeClasses(node: HTMLElement, ...classes: string[]): HTMLElement {\r\n    classes.forEach(cls => removeClass(node, cls));\r\n    return node;\r\n}\r\n\r\nexport function addClassToList(list: Element[] | HTMLElement[] | HTMLCollection | NodeList, className: string) {\r\n    Array.from(list).forEach(itm => addClass(<HTMLElement>itm, className));\r\n    return list;\r\n}\r\n\r\nexport function removeClassFromList(list: Element[] | HTMLElement[] | HTMLCollection | NodeList, className: string) {\r\n    Array.from(list).forEach(itm => removeClass(<HTMLElement>itm, className));\r\n    return list;\r\n}\r\n\r\nexport function hasClass(\r\n    element: HTMLElement | Element | EventTarget,\r\n    value: string\r\n): boolean {\r\n    return (<HTMLElement>element).classList.contains(value);\r\n}\r\n\r\nexport function addHref(element: HTMLAnchorElement, value: string): HTMLAnchorElement {\r\n    element.href = value;\r\n    return element;\r\n}\r\n\r\nexport function addToElement(element: HTMLElement, ...items: HTMLElement[]): HTMLElement {\r\n    items.filter(i => i).forEach(i => element.appendChild(i));\r\n    return element;\r\n}\r\n\r\nexport function addToElementAtTheBeginning(element: HTMLElement, ...items: HTMLElement[]): HTMLElement {\r\n    const children = <HTMLElement[]>Array.from(element.children);\r\n    return addToElement(element, ...items.concat(children));\r\n}\r\n\r\nexport function addElementsFromArray(target: HTMLElement, arr: HTMLElement[]) {\r\n    arr.forEach(e => addToElement(target, e));\r\n    return arr;\r\n}\r\n\r\nexport function getElementHeight(element: HTMLElement): number {\r\n    return element.offsetHeight;\r\n}\r\n\r\nexport function setElementHeight(element: HTMLElement, height: number) {\r\n    element.style.height = height ? height + 'px' : '';\r\n    return this;\r\n}\r\n\r\nexport function isInViewPort(element: HTMLElement): boolean {\r\n    const elementRect = element.getBoundingClientRect();\r\n    let offsetHeight = window.innerHeight + 250;\r\n\r\n    return elementRect.top < 0 && elementRect.bottom > 0\r\n        || elementRect.top >= 0 && elementRect.top < offsetHeight\r\n        || elementRect.bottom > 0 && elementRect.bottom < offsetHeight\r\n        || elementRect.bottom <= (offsetHeight || document.documentElement.clientHeight) &&\r\n        elementRect.right <= (window.innerWidth || document.documentElement.clientWidth);\r\n}\r\n\r\nexport function getSibling(element: HTMLElement, selector: string): HTMLElement {\r\n    return <HTMLElement>element.parentElement.querySelector(selector);\r\n}\r\n\r\nexport function getClosest(element: HTMLElement, selector: string): HTMLElement {\r\n    do {\r\n        if (element.matches(selector)) {\r\n            return element;\r\n        }\r\n        element = <HTMLElement>element.parentElement || <HTMLElement>element.parentNode;\r\n    } while (element !== null && element.nodeType === 1);\r\n\r\n    return null;\r\n}\r\n\r\nexport function createScriptTag(script: HTMLScriptElement): HTMLScriptElement {\r\n    let domScript = document.createElement('script');\r\n    domScript.type = 'text/javascript';\r\n\r\n    if (script.src) {\r\n        domScript.src = script.src;\r\n    } else {\r\n        domScript.textContent = script.innerText;\r\n    }\r\n\r\n    if (script.defer) {\r\n        domScript.defer = true;\r\n    }\r\n\r\n    return domScript;\r\n}\r\n\r\nexport function insertScript(script: HTMLScriptElement): HTMLScriptElement {\r\n    let domScript = document.createElement('script');\r\n    domScript.type = 'text/javascript';\r\n\r\n    if (script.src) {\r\n        domScript.src = script.src;\r\n    } else {\r\n        domScript.textContent = script.innerText;\r\n    }\r\n\r\n    if (script.defer) {\r\n        domScript.defer = true;\r\n    }\r\n\r\n    return document.head.appendChild(domScript);\r\n}\r\n\r\nexport function addScriptToHead(url: string, callback: Callback) {\r\n    var newScript = document.createElement(\"script\");\r\n    newScript.onerror = loadError;\r\n\r\n    if (callback) {\r\n        newScript.onload = callback;\r\n    }\r\n\r\n    newScript.src = url;\r\n\r\n    return document.head.appendChild(newScript);\r\n}\r\n\r\nexport function loadError(oError) {\r\n    throw new URIError(\"The script \" + oError.target.src + \" didn't load correctly.\");\r\n}\r\n\r\nexport function injectScriptsFromAjaxResponse(element: HTMLElement): Promise<any[]> {\r\n\r\n    const scripts = Array.from(element.getElementsByTagName('script'))\r\n        .filter(script => !isScriptTagRendered(script))\r\n        .map(createScriptTag);\r\n\r\n    return Promise.all(scripts.map(script => new Promise((resolve, reject) => {\r\n        if (script.src) {\r\n            script.onload = () => resolve();\r\n            script.onerror = () => {\r\n                console.error(`Layer script was not loaded: URL ${(<HTMLScriptElement>event.target).src}`);\r\n                resolve();\r\n            };\r\n        } else {\r\n            resolve();\r\n        }\r\n\r\n        document.head.appendChild(script);\r\n    })));\r\n}\r\n\r\nexport function isScriptTagRendered(script: HTMLScriptElement): boolean {\r\n    var exist: boolean = false;\r\n    const shouldScriptNotBeMoved = script.hasAttribute('data-dont-move-script-from-layer');\r\n    \r\n    if (script.src) {\r\n        (document.querySelectorAll(`[src=\"${script.src}\"]`).length > 0 && script.src.indexOf(\"recaptcha\") == -1 && script.src.indexOf(\"friendly-challenge\") == -1) ? exist = true : exist = false;\r\n    }\r\n\r\n    if (shouldScriptNotBeMoved) {\r\n        exist = true;\r\n    }\r\n\r\n    return exist;\r\n}\r\n\r\nexport function toggleClass(node: HTMLElement, className: string, force?: boolean): HTMLElement {\r\n    if (typeof force === undefined) {\r\n        node.classList.toggle(className);\r\n    } else {\r\n        force\r\n            ? node.classList.add(className)\r\n            : node.classList.remove(className);\r\n    }\r\n\r\n    return node;\r\n}\r\n\r\nexport function getChildren(node: HTMLElement, selector?: string): HTMLElement[] {\r\n    let children = <HTMLElement[]>Array.from(node.children);\r\n\r\n    if (selector) {\r\n        children = children.filter(ch => hasClass(ch, selector));\r\n    }\r\n\r\n    return children;\r\n}\r\n\r\nexport function dispatchEvent(element: HTMLElement, event: Event): HTMLElement {\r\n    element.dispatchEvent(event);\r\n    return element;\r\n}\r\n\r\n/*\r\n *\r\n * Helper Functions for ImageLoad\r\n *\r\n */\r\n\r\nexport const listenToLoad$ = fork(arg => arg, loadPicture$, setSourceAttr);\r\nexport const addSpinnerToImage = alt(not(isImage), showSpinner);\r\nexport const loadImageLazy$ = pipe(tap(addSpinnerToImage), listenToLoad$);\r\n\r\nexport function isImage(element: HTMLElement): HTMLImageElement | false {\r\n    return element.tagName === 'IMG' ? <HTMLImageElement>element : false;\r\n}\r\n\r\nexport function isImageLoaded(img: HTMLImageElement): boolean {\r\n    return (img.hasAttribute('src') || img.hasAttribute('srcset'))\r\n        || (!isIOS && img.complete && img.naturalHeight !== 0);\r\n}\r\n\r\nexport function hasImageToBeLoaded(img: HTMLImageElement): boolean {\r\n    if (!isImageLoaded(img) && isInViewPort(img)) {\r\n        addClass(img.parentElement, 'image-loaded');\r\n    }\r\n    return !isImageLoaded(img) && isInViewPort(img) && Eucerin.supportWebP != undefined;\r\n}\r\n\r\nexport function loadPicture$(img: HTMLImageElement): Observable<HTMLImageElement> {\r\n    return fromEvent(img, 'load').pipe(\r\n        first(),\r\n        map(e => <HTMLImageElement>e.target),\r\n        map(removeDataAttr),\r\n        map(hideSpinner),\r\n        tap(() => document.dispatchEvent(new CustomEvent('Eucerin:lazyimageloaded'))));\r\n}\r\n\r\nexport function setSourceAttr(img: HTMLImageElement): HTMLImageElement {\r\n    let src = img.dataset.src,\r\n        srcset = img.dataset.srcset;\r\n\r\n    if (Eucerin.supportWebP && img.tagName == \"SOURCE\") {\r\n        if (src && src.includes('.webp')) img.setAttribute('src', src);\r\n\r\n\r\n        if (srcset && srcset.includes('.webp')) img.setAttribute('srcset', srcset);\r\n\r\n    } else {\r\n        if (src && !src.includes('.webp')) img.setAttribute('src', src);\r\n\r\n\r\n        if (srcset && !srcset.includes('.webp')) img.setAttribute('srcset', srcset);\r\n    }\r\n\r\n    if (img.tagName == \"IMG\") {\r\n        if (Eucerin.supportWebP) {\r\n            if (src) {\r\n                src = src.replace(/(.jpg$|.jpeg$|.png$)/g, \".webp\");\r\n                src = src.replace(/(.jpg\\?|.jpeg\\?|.png\\?)/g, \".webp?\");\r\n            }\r\n\r\n            if (srcset) {\r\n                srcset = srcset.replace(/(.jpg$|.jpeg$|.png$)/g, \".webp\");\r\n                srcset = srcset.replace(/(.jpg\\?|.jpg\\?|.png\\?)/g, \".webp?\");\r\n            }\r\n        }\r\n\r\n\r\n        srcset && img.setAttribute('srcset', srcset);\r\n        src && img.setAttribute('src', src);\r\n    }\r\n\r\n    return img;\r\n}\r\n\r\nexport function removeDataAttr(img: HTMLImageElement): HTMLImageElement {\r\n    img.removeAttribute('data-src');\r\n    img.removeAttribute('data-srcset');\r\n\r\n    return img;\r\n}\r\n\r\nexport function showSpinner(img: HTMLImageElement) {\r\n    addClass(img.parentElement, 'lazy-spinner');\r\n    return img;\r\n}\r\n\r\nexport function hideSpinner(img: HTMLImageElement) {\r\n    removeClass(img.parentElement, 'lazy-spinner');\r\n    return img;\r\n}\r\n\r\nexport function checkWebPSupport() {\r\n    return new Promise((resolve, reject) => {\r\n        var img = new Image();\r\n        img.onload = function () { resolve(); };\r\n        img.onerror = function () { reject(); };\r\n        img.src = 'data:image/webp;base64,UklGRjoAAABXRUJQVlA4IC4AAACyAgCdASoCAAIALmk0mk0iIiIiIgBoSygABc6WWgAA/veff/0PP8bA//LwYAAA';\r\n    })\r\n}\r\n\r\nexport function isEmpty(value) {\r\n    return (value === undefined || value == null || value.length <= 0) ? true : false;\r\n}\r\n\r\nexport function scrollToElement(element, to, duration) {\r\n    var start = element.scrollTop,\r\n        change = to - start,\r\n        currentTime = 0,\r\n        increment = 20;\r\n\r\n    var animateScroll = function () {\r\n        currentTime += increment;\r\n\r\n        var val = Math.easeInOutQuad(currentTime, start, change, duration);\r\n\r\n        element.scrollTop = val;\r\n\r\n        if (currentTime < duration) {\r\n            setTimeout(animateScroll, increment);\r\n        }\r\n    };\r\n\r\n    animateScroll();\r\n\r\n    return;\r\n}\r\nexport function adjustLayerMarkUp(html: string, overlayTitle?, getLayerTitleFromContent?): HTMLElement {\r\n    let node = createElementFromString(`<div>${html}</div>`),\r\n        layerTitle = (overlayTitle) ? overlayTitle : '';\r\n\r\n    if (getLayerTitleFromContent) {\r\n        let title: HTMLElement = node.querySelector('h2') || node.querySelector('.hdl-3') || node.querySelector('.hdl-4');\r\n        if (title) {\r\n            layerTitle = title.innerHTML;\r\n            title.remove();\r\n        } else {\r\n            layerTitle = '';\r\n        }\r\n\r\n    }\r\n\r\n    return createElementFromString(`\r\n        <div class=\"content-wrapper\">\r\n            ${(overlayTitle || getLayerTitleFromContent) ?\r\n            `<div class=\"overlay-header\">\r\n                <p class=\"overlay-title hdl-3\">${layerTitle}</p>\r\n            </div>`\r\n            : \"\"}\r\n            <div class=\"overlay-content\">${node.innerHTML}</div>\r\n        </div>`);\r\n}\r\n\r\nexport function isObjectLiteral(a) {\r\n    return (!!a) && (a.constructor === Object);\r\n};\r\n\r\nexport function isObject(a) {\r\n    return typeof a === 'object' && a !== null;\r\n}\r\n\r\nexport function isArray(a) {\r\n    return (!!a) && (a.constructor === Array);\r\n};\r\n\r\nexport function objectToStyleString(styleObject): string {\r\n    return Object.entries(styleObject).map(([k, v]) => `${k}: ${v}`).join(';');\r\n};"],"sourceRoot":""}