{"version":3,"sources":["webpack:///./src/client/default/js/components/zoomComponent.js","webpack:///./src/client/default/js/base/baseComponent.js"],"names":["ZoomComponent","_BaseComponent","element","_this","_classCallCheck","_callSuper","bindHover","bindClick","_inherits","_createClass","key","get","_defineProperty","this","CUSTOM_MESSAGES","THUMBNAIL_EVENTS","click","updateMainImage","zoomImageContainer","zoomContainer","value","_this2","$el","addEventListener","e","target","classList","contains","querySelector","img","document","EMIT","ZOOM_EVENTS","$on","handleFocusZoom","bind","handleBlurZoom","_this3","clearTimeout","deleteTimeout","SELECTORS","add","container","createElement","zoomUrl","encodeURI","decodeURI","$options","src","CLASSES","style","backgroundImage","appendChild","setTimeout","showZoom","moveZoom","$off","remove","_this4","cursor","dimentions","getBoundingClientRect","x","offsetX","y","offsetY","xpercent","Math","round","width","ypercent","height","backgroundPosition","url","setAttribute","image","srcset","dataset","index","_this5","leaveTimeout","enterTimeout","createContainer","_this6","destroyContainer","hideZoom","BaseComponent","_BaseGiaComponent","_componentElement","_checkMessages","compOptions","options","_objectSpread","Object","keys","filter","entry","includes","forEach","optionValue","cleanEntry","cleanOptionKey","JSON","parse","replace","convertType","deepFreeze","getAttribute","events","cb","arguments","length","undefined","elements","Bean","on","stopPropagation","one","off","fire","message","_loading","LOADER_EVENTS","show","body","error","icon","hide","option","optionReturn","str","concat","charAt","toLocaleLowerCase","slice","BaseGiaComponent"],"mappings":"keAAkD,IAE7BA,EAAa,SAAAC,GAmBhC,SAAAD,EAAYE,GAAS,IAAAC,EAGF,OAHEC,IAAA,KAAAJ,IACnBG,EAAAE,EAAA,KAAAL,EAAA,CAAME,KACDI,YACLH,EAAKI,YAAYJ,EAClB,OAAAK,IAAAR,EAAAC,GAAAQ,IAAAT,EAAA,EAAAU,IAAA,WAAAC,IAtBD,WACE,OAAAC,IAAA,GACGC,KAAKC,gBAAgBC,iBAAiBC,MAAQH,KAAKI,mBAEvD,CAAAP,IAAA,YAAAC,IAED,WACE,MAAO,CACLO,mBAAoB,cAEvB,CAAAR,IAAA,UAAAC,IAED,WACE,MAAO,CACLQ,cAAe,aAElB,CAAAT,IAAA,YAAAU,MAQD,WAAY,IAAAC,EAAA,KACVR,KAAKS,IAAIC,iBAAiB,SAAS,SAACC,GAClC,GAAIA,EAAEC,OAAOC,UAAUC,SAAS,YAAcH,EAAEC,OAAOG,cAAc,YAAa,CAChF,IAAMC,EAAMC,SAASF,cAAc,cACnCP,EAAKU,KAAKV,EAAKP,gBAAgBkB,YAAYhB,MAAO,CAChDa,IAAKA,UAeZ,CAAAnB,IAAA,YAAAU,MAED,WACEP,KAAKoB,IAAI,kBAAmBpB,KAAKqB,gBAAgBC,KAAKtB,MAAOA,KAAKS,KAElET,KAAKoB,IAAI,kBAAmBpB,KAAKuB,eAAeD,KAAKtB,MAAOA,KAAKS,KAEjET,KAAKoB,IAAI,aAAcpB,KAAKqB,gBAAgBC,KAAKtB,MAAOA,KAAKS,KAE7DT,KAAKoB,IAAI,YAAapB,KAAKuB,eAAeD,KAAKtB,MAAOA,KAAKS,OAC5D,CAAAZ,IAAA,kBAAAU,MAED,WAAkB,IAAAiB,EAAA,KAChBC,aAAazB,KAAK0B,eAClB,IAAMpB,EAAgBN,KAAKS,IAAIM,cAAcf,KAAK2B,UAAUtB,oBAC5D,GAAKC,EAUHA,EAAcO,UAAUe,IAAI,eAVV,CAClB,IAAMC,EAAYZ,SAASa,cAAc,OACnCC,EAAUC,UAAUC,UAAUjC,KAAKkC,SAASC,MAClDN,EAAUhB,UAAUe,IAAI5B,KAAKoC,QAAQ9B,eACrCuB,EAAUQ,MAAMC,gBAAkB,OAASP,EAAU,IACrD/B,KAAKS,IAAI8B,YAAYV,GACrBW,YAAW,WACTX,EAAUhB,UAAUe,IAAI,aACvB,KAILY,YAAW,WACThB,EAAKf,IAAII,UAAUe,IAAI,kBACtB,KAEH5B,KAAKyC,aACN,CAAA5C,IAAA,WAAAU,MAED,WACEP,KAAK0C,aACN,CAAA7C,IAAA,WAAAU,MAED,WACEP,KAAK2C,KAAK,oBACX,CAAA9C,IAAA,mBAAAU,MAED,WACE,IAAMD,EAAgBN,KAAKS,IAAIM,cAAcf,KAAK2B,UAAUtB,oBACxDC,IACFA,EAAcO,UAAU+B,OAAO,WAC/B5C,KAAK0B,cAAgBc,YAAW,WAC9BlC,EAAcsC,WACb,QAEN,CAAA/C,IAAA,WAAAU,MAED,WAAW,IAAAsC,EAAA,KACT7C,KAAKoB,IACH,kBACA,SAACT,GACC,IAAMmC,EAAoCnC,EACpCL,EAA4CuC,EAAKpC,IAAIM,cAAc8B,EAAKlB,UAAUtB,oBACpF0C,EAAazC,EAAc0C,wBAE3BC,EAAIH,EAAOI,QACXC,EAAIL,EAAOM,QAEXC,EAAWC,KAAKC,MAAM,KAAOR,EAAWS,MAAQP,IAChDQ,EAAWH,KAAKC,MAAM,KAAOR,EAAWW,OAASP,IAErD7C,EAAc+B,MAAMsB,mBAAqBN,EAAW,KAAOI,EAAW,MAExEzD,KAAKS,OAER,CAAAZ,IAAA,kBAAAU,MAED,SAAgBqD,GACd5D,KAAKS,IAAIoD,aAAa,kBAAmBD,EAAIA,KAC7C,IAAME,EAAyC9D,KAAKS,IAAIM,cAAc,OACtE+C,EAAM3B,IAAMyB,EAAIA,IAChBE,EAAMC,OAASH,EAAIG,OACnBD,EAAME,QAAQC,MAAQL,EAAIK,QAC3B,CAAApE,IAAA,kBAAAU,MAED,SAAgBI,GAAG,IAAAuD,EAAA,KACjBzC,aAAazB,KAAKmE,cAClBnE,KAAKoE,aAAe5B,YAAW,WAC7B0B,EAAKG,oBACJ,OACJ,CAAAxE,IAAA,iBAAAU,MAED,SAAeI,GAAG,IAAA2D,EAAA,KAChB7C,aAAazB,KAAKoE,cAClBpE,KAAKmE,aAAe3B,YAAW,WAC7B8B,EAAK7D,IAAII,UAAU+B,OAAO,gBAC1B0B,EAAKC,mBACLD,EAAKE,aACJ,SA1I2B,C,OAASC,I,kpBCIO,IAE7BA,EAAa,SAAAC,GAmChC,SAAAD,EAAYpF,GAAS,IAAAC,EAIG,OAJHC,IAAA,KAAAkF,IACnBnF,EAAAE,EAAA,KAAAiF,EAAA,CAAMpF,KACDsF,kBAAoBtF,EACzBC,EAAKqF,kBAAkBd,aAAa,sBAAuB,QAC3DvE,EAAKsF,iBAAiBtF,EACvB,OAAAK,IAAA8E,EAAAC,GAAA9E,IAAA6E,EAAA,EAAA5E,IAAA,MAAAC,IApCD,WACE,OAAmCE,KAAK2E,oBACzC,CAAA9E,IAAA,WAAAC,IAED,WACE,IAAM+E,EAAc,GACdC,E,iWAAOC,CAAA,GAAQ/E,KAAKS,IAAIuD,SAY9B,OAXuBgB,OAAOC,KAAKH,GAASI,QAAO,SAACC,GAAK,OAAKA,EAAMC,SAAS,aAC9DC,SAAQ,SAACF,GACtB,IACIG,EADEC,EAAad,EAAce,eAAeL,GAG9CG,EADER,EAAQK,GAAOC,SAAS,MAAQN,EAAQK,GAAOC,SAAS,KAC5CK,KAAKC,MAAMZ,EAAQK,GAAOQ,QAAQ,KAAM,MAExClB,EAAcmB,YAAYd,EAAQK,IAElDN,EAAYU,GAAcD,KAErBO,YAAWhB,KACnB,CAAAhF,IAAA,iBAAAC,IAED,WACE,OAAOE,KAAKS,IAAIqF,aAAa,oBAC9B,CAAAjG,IAAA,MAAAU,MAiDD,SAAIwF,EAAQC,GAAyC,IAArC3G,EAAO4G,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAGjG,KAAKS,IAAK2F,EAAQH,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,KACxC5G,GAAY0G,GAAWC,IACvBI,EAMHC,IAAKC,GAAGjH,EAAS0G,EAAQK,GAAU,SAACzF,GAC9BA,GAAGA,EAAE4F,kBACTP,EAAGrF,MAPL0F,IAAKC,GAAGjH,EAAS0G,GAAQ,SAACpF,GACpBA,GAAGA,EAAE4F,kBACTP,EAAGrF,SAUT,CAAAd,IAAA,OAAAU,MAQA,SAAKwF,EAAQC,GAAwB,IAApB3G,EAAO4G,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAGjG,KAAKS,IAC9B4F,IAAKG,IAAInH,EAAS0G,EAAQC,KAG5B,CAAAnG,IAAA,OAAAU,MAOA,SAAKwF,GAA4B,IAApB1G,EAAO4G,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAGjG,KAAKS,IAC1B4F,IAAKI,IAAIpH,EAAS0G,KAGpB,CAAAlG,IAAA,QAAAU,MAOA,SAAMwF,GAA4B,IAApB1G,EAAO4G,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAGjG,KAAKS,IAC3B4F,IAAKK,KAAKrH,EAAS0G,KAGrB,CAAAlG,IAAA,UAAAU,MAOA,SAAQsB,EAAW8E,GACjB3G,KAAK4G,UAAW,EAChB5G,KAAKkB,KAAKlB,KAAKC,gBAAgB4G,cAAcC,KAAM,CACjDjF,UAAWA,GAAaZ,SAAS8F,KACjCJ,QAASA,UAAW,SAIxB,CAAA9G,IAAA,aAAAU,MASA,SAAWsB,EAAW8E,GAA8B,IAAAnG,EAAA,KAArBwG,EAAKf,UAAAC,OAAA,QAAAC,IAAAF,UAAA,IAAAA,UAAA,GAAUgB,EAAIhB,UAAAC,OAAA,EAAAD,UAAA,QAAAE,EAChDnG,KAAK4G,UAAW,EAChBpE,YAAW,WACJhC,EAAKoG,UACRpG,EAAKU,KAAKV,EAAKP,gBAAgB4G,cAAcK,KAAM,CACjDrF,UAAWA,GAAaZ,SAAS8F,KACjCJ,UACAK,QACAC,WAGH,QACJ,EAAApH,IAAA,cAAAU,MAvHD,SAAmB4G,GACjB,IAAIC,EACJ,OAAQD,GACN,IAAK,QACHC,GAAe,EACf,MACF,IAAK,OACHA,GAAe,EACf,MACF,IAAK,OACHA,EAAe,KACf,MACF,QACEA,EAAeD,EAInB,OAAOC,IACR,CAAAvH,IAAA,iBAAAU,MAED,SAAsBV,GACpB,IAAMwH,EAAMxH,EAAI8F,QAAQ,SAAU,IAClC,MAAO,GAAP2B,OAAUD,EAAIE,OAAO,GAAGC,qBAAmBF,OAAGD,EAAII,MAAM,QAhE1B,C,MAASC","file":"js/component-zoomComponent-js.chunks.js","sourcesContent":["import BaseComponent from '../base/baseComponent';\n\nexport default class ZoomComponent extends BaseComponent {\n  get Messages() {\n    return {\n      [this.CUSTOM_MESSAGES.THUMBNAIL_EVENTS.click]: this.updateMainImage\n    };\n  }\n\n  get SELECTORS() {\n    return {\n      zoomImageContainer: '.js-zoom'\n    };\n  }\n\n  get CLASSES() {\n    return {\n      zoomContainer: 'js-zoom'\n    };\n  }\n\n  constructor(element) {\n    super(element);\n    this.bindHover();\n    this.bindClick();\n  }\n\n  bindClick() {\n    this.$el.addEventListener('click', (e) => {\n      if (e.target.classList.contains('js-zoom') || e.target.querySelector('.js-zoom')) {\n        const img = document.querySelector('.img-fluid');\n        this.EMIT(this.CUSTOM_MESSAGES.ZOOM_EVENTS.click, {\n          img: img\n        });\n      }\n    });\n\n    // this.$el.addEventListener('keydown', (e) => {\n    //   if (e.key === 'Enter' || (e.ctrlKey && e.altKey && e.code === 'Space')) {\n    //     e.preventDefault();\n    //     let jsZoom = this.$el.querySelector('.js-zoom');\n    //     if (jsZoom) {\n    //       jsZoom.focus();\n    //       jsZoom.click();\n    //     }\n    //   }\n    // });\n  }\n\n  bindHover() {\n    this.$on('mouseenter.zoom', this.handleFocusZoom.bind(this), this.$el);\n\n    this.$on('mouseleave.zoom', this.handleBlurZoom.bind(this), this.$el);\n\n    this.$on('focus.zoom', this.handleFocusZoom.bind(this), this.$el);\n\n    this.$on('blur.zoom', this.handleBlurZoom.bind(this), this.$el);\n  }\n\n  createContainer() {\n    clearTimeout(this.deleteTimeout);\n    const zoomContainer = this.$el.querySelector(this.SELECTORS.zoomImageContainer);\n    if (!zoomContainer) {\n      const container = document.createElement('div');\n      const zoomUrl = encodeURI(decodeURI(this.$options.src));\n      container.classList.add(this.CLASSES.zoomContainer);\n      container.style.backgroundImage = 'url(' + zoomUrl + ')';\n      this.$el.appendChild(container);\n      setTimeout(() => {\n        container.classList.add('visible');\n      }, 100);\n    } else {\n      zoomContainer.classList.add('visible');\n    }\n    setTimeout(() => {\n      this.$el.classList.add('zoom-visible');\n    }, 100);\n\n    this.showZoom();\n  }\n\n  showZoom() {\n    this.moveZoom();\n  }\n\n  hideZoom() {\n    this.$off('mousemove.zoom');\n  }\n\n  destroyContainer() {\n    const zoomContainer = this.$el.querySelector(this.SELECTORS.zoomImageContainer);\n    if (zoomContainer) {\n      zoomContainer.classList.remove('visible');\n      this.deleteTimeout = setTimeout(() => {\n        zoomContainer.remove();\n      }, 300);\n    }\n  }\n\n  moveZoom() {\n    this.$on(\n      'mousemove.zoom',\n      (e) => {\n        const cursor = /** @type {MouseEvent} */ (e);\n        const zoomContainer = /** @type {HTMLElement} */ (this.$el.querySelector(this.SELECTORS.zoomImageContainer));\n        var dimentions = zoomContainer.getBoundingClientRect();\n        // Calculate the position of the cursor inside the element (in pixels).>\n        var x = cursor.offsetX;\n        var y = cursor.offsetY;\n        // Calculate the position of the cursor as a percentage of the total width/height of the element.\n        var xpercent = Math.round(100 / (dimentions.width / x));\n        var ypercent = Math.round(100 / (dimentions.height / y));\n        // Update the background position of the image.\n        zoomContainer.style.backgroundPosition = xpercent + '% ' + ypercent + '%';\n      },\n      this.$el\n    );\n  }\n\n  updateMainImage(url) {\n    this.$el.setAttribute('data-option-src', url.url);\n    const image = /** @type {HTMLImageElement} */ (this.$el.querySelector('img'));\n    image.src = url.url;\n    image.srcset = url.srcset;\n    image.dataset.index = url.index;\n  }\n\n  handleFocusZoom(e) {\n    clearTimeout(this.leaveTimeout);\n    this.enterTimeout = setTimeout(() => {\n      this.createContainer();\n    }, 200);\n  }\n\n  handleBlurZoom(e) {\n    clearTimeout(this.enterTimeout);\n    this.leaveTimeout = setTimeout(() => {\n      this.$el.classList.remove('zoom-visible');\n      this.destroyContainer();\n      this.hideZoom();\n    }, 200);\n  }\n}\n","/* eslint-disable new-cap */\n/* eslint-disable valid-jsdoc */\n/* eslint-disable no-underscore-dangle */\n\nimport Bean from 'bean';\nimport deepFreeze from '../utilities/freeze';\nimport BaseGiaComponent from './baseGiaComponent';\n\nexport default class BaseComponent extends BaseGiaComponent {\n  /**\n   * @returns {HTMLElement}\n   */\n  get $el() {\n    return /** @type {HTMLElement} */ (this._componentElement);\n  }\n\n  get $options() {\n    const compOptions = {};\n    const options = { ...this.$el.dataset };\n    const optionsEntires = Object.keys(options).filter((entry) => entry.includes('option'));\n    optionsEntires.forEach((entry) => {\n      const cleanEntry = BaseComponent.cleanOptionKey(entry);\n      let optionValue;\n      if (options[entry].includes('{') && options[entry].includes('}')) {\n        optionValue = JSON.parse(options[entry].replace(/'/g, '\"'));\n      } else {\n        optionValue = BaseComponent.convertType(options[entry]);\n      }\n      compOptions[cleanEntry] = optionValue;\n    });\n    return deepFreeze(compOptions);\n  }\n\n  get COMPONENT_NAME() {\n    return this.$el.getAttribute('data-component');\n  }\n\n  /**\n   *\n   * constructor\n   *\n   * @param {Element} element\n   */\n  constructor(element) {\n    super(element);\n    this._componentElement = element;\n    this._componentElement.setAttribute('data-component-init', 'true');\n    this._checkMessages();\n  }\n\n  static convertType(option) {\n    let optionReturn;\n    switch (option) {\n      case 'false':\n        optionReturn = false;\n        break;\n      case 'true':\n        optionReturn = true;\n        break;\n      case 'null':\n        optionReturn = null;\n        break;\n      default:\n        optionReturn = option;\n        break;\n    }\n\n    return optionReturn;\n  }\n\n  static cleanOptionKey(key) {\n    const str = key.replace('option', '');\n    return `${str.charAt(0).toLocaleLowerCase()}${str.slice(1)}`;\n  }\n\n  /**\n   *\n   * $on\n   *\n   * @param {String} events\n   * @param {Function} cb\n   * @param {Element} [element = this.$el]\n   * @param {Array|String|Element} [elements = null]\n   */\n  $on(events, cb, element = this.$el, elements = null) {\n    if (!element || !events || !cb) return;\n    if (!elements) {\n      Bean.on(element, events, (e) => {\n        if (e) e.stopPropagation();\n        cb(e);\n      });\n    } else {\n      Bean.on(element, events, elements, (e) => {\n        if (e) e.stopPropagation();\n        cb(e);\n      });\n    }\n  }\n\n  /**\n   *\n   * $one\n   *\n   * @param {String} events\n   * @param {Function} cb\n   * @param {Element} [element = this.$el]\n   */\n  $one(events, cb, element = this.$el) {\n    Bean.one(element, events, cb);\n  }\n\n  /**\n   *\n   * $off\n   *\n   * @param {String} events\n   * @param {Element} [element = this.$el]\n   */\n  $off(events, element = this.$el) {\n    Bean.off(element, events);\n  }\n\n  /**\n   *\n   * $fire\n   *\n   * @param {String} events\n   * @param {Element} [element = this.$el]\n   */\n  $fire(events, element = this.$el) {\n    Bean.fire(element, events);\n  }\n\n  /**\n   *\n   * Activate loader\n   *\n   * @param {HTMLElement} [container]\n   * @param {String} [message]\n   */\n  loading(container, message) {\n    this._loading = true;\n    this.EMIT(this.CUSTOM_MESSAGES.LOADER_EVENTS.show, {\n      container: container || document.body,\n      message: message ?? null\n    });\n  }\n\n  /**\n   *\n   * Deactivate loader\n   *\n   * @param {HTMLElement} [container]\n   * @param {String} [message]\n   * @param {Boolean} [error=false]\n   * @param {String} [icon]\n   */\n  endLoading(container, message, error = false, icon) {\n    this._loading = false;\n    setTimeout(() => {\n      if (!this._loading) {\n        this.EMIT(this.CUSTOM_MESSAGES.LOADER_EVENTS.hide, {\n          container: container || document.body,\n          message,\n          error,\n          icon\n        });\n      }\n    }, 400);\n  }\n}\n"],"sourceRoot":""}