{"version":3,"sources":["webpack:///./assets/javascripts/modules/components/SizeSelectorComponent.js"],"names":["SizeSelectorComponent","compEl","_classCallCheck","this","_this","_possibleConstructorReturn","__proto__","Object","getPrototypeOf","call","clickOutside","bind","addToWishlistURL","box","$component","sizesBox","querySelector","SELECTORS","sizes","querySelectorAll","trigger","sizeError","selected","sizeSelected","sizeSelect","select","sizeDropdown","dropdown","isProductOnWishlist","dataset","productIntoWishlist","Component","show","classList","toggle","scrollIntoView","behavior","block","document","addEventListener","e","stopPropagation","remove","removeEventListener","target","closeDropdown","size","prevSize","CLASSES","add","innerHTML","unavailable","self","forEach","value","productCode","fetch","body","method","credentials","mode","then","response","ok","console","log","catch","error","stack","_this2","toggleDropdown","length","isSelected","contains","isUnavailable","selectSize","$emit","$customEvents","PRODUCT_EVENTS","notifyme","notifymeclose","sizechanged","button","addToWishlistAfterChangeSize","$on","notifymeended","cleanSelectSize","sizerequired","sizeErrorBox","payload","addtowish","removefromwish","selectedSize","bindEvents","checkSizeSelected"],"mappings":"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","file":"component-SizeSelectorComponent.chunks.js","sourcesContent":["import Component from '../abstracts/Component';\n\nexport default class SizeSelectorComponent extends Component {\n  get COMPONENTNAME() {\n    return 'SizeSelectorComponent';\n  }\n\n  get SELECTORS() {\n    return {\n      sizesBox: '[data-sizes]', // sizes box\n      sizes: '[data-size]', // sizes\n      trigger: '[data-sizes-trigger]', // for error\n      sizeError: '[data-sizes-error]', // error div\n      select: '[data-sizes-select]',\n      dropdown: '[data-sizes-dropdown]',\n      sizeSelected: '[data-size-selected]',\n    };\n  }\n\n  get CLASSES() {\n    return {\n      selected: 'selected',\n      show: 'show',\n    };\n  }\n\n  constructor(compEl) {\n    super(compEl);\n    this.clickOutside = this.clickOutside.bind(this);\n    this.addToWishlistURL = \"/action/ajax/wishlist-add\";\n    this.box = this.$component;\n    this.sizesBox = this.$component.querySelector(this.SELECTORS.sizesBox);\n    this.sizes = this.$component.querySelectorAll(this.SELECTORS.sizes);\n    this.trigger = this.$component.querySelector(this.SELECTORS.trigger);\n    this.sizeError = this.$component.querySelector(this.SELECTORS.sizeError);\n    this.selected = this.$component.querySelector(this.SELECTORS.sizeSelected);\n    this.sizeSelect = this.$component.querySelector(this.SELECTORS.select);\n    this.sizeDropdown = this.$component.querySelector(this.SELECTORS.dropdown);\n    this.isProductOnWishlist = this.$component.dataset.productIntoWishlist === 'true';\n  }\n\n  toggleDropdown() {\n    this.trigger.classList.toggle('open');\n    this.trigger.scrollIntoView({ behavior: 'smooth', block: 'center' });\n    document.addEventListener('click', this.clickOutside);\n    this.sizeDropdown.addEventListener('click', e => e.stopPropagation());\n  }\n\n  closeDropdown() {\n    if(!this.trigger) return;\n    this.trigger.classList.remove('open');\n    document.removeEventListener('click', this.clickOutside);\n  }\n\n  clickOutside(e) {\n    if (e.target != this.trigger) {\n      this.closeDropdown();\n    }\n  }\n\n  selectSize(size) {\n    if (!size) return;\n    // remove selected\n    let prevSize = this.sizesBox.querySelector(\n      this.SELECTORS.sizes + '.' + this.CLASSES.selected\n    );\n    if (prevSize) {\n      prevSize.classList.remove(this.CLASSES.selected);\n    }\n    // add selected\n    size.classList.add(this.CLASSES.selected);\n    /*if (this.sizeSelect != null) {\n      this.sizeSelect.value = size.dataset.value;\n      this.selected.innerHTML = size.innerHTML;\n      this.selected.dataset.unavailable = size.dataset.unavailable;\n      this.closeDropdown();\n    }*/\n    if (this.selected){\n      this.selected.innerHTML = size.innerHTML;\n      this.selected.dataset.unavailable = size.dataset.unavailable;\n    }\n    this.closeDropdown();\n  }\n\n  cleanSelectSize() {\n    // global\n    let self = this;\n    // clean selected class\n    this.sizes.forEach(size => {\n      size.classList.remove(self.CLASSES.selected);\n    });\n    if (this.sizeSelect != null) {\n      this.sizeSelect.value = '';\n    }\n    if(this.selected) {\n      this.selected.innerHTML = '';\n    }\n  }\n\n  addToWishlistAfterChangeSize(productCode) {\n    fetch(`${this.addToWishlistURL}?code=${productCode}`, {\n      body: null,\n      method: 'GET',\n      credentials: 'include',\n      mode: 'cors',\n    })\n      .then(function(response) {\n        if (response.ok) {\n          console.log('OK', response.body);\n        }\n      })\n      .catch(error => {\n        console.error(\n          'Failed to send request for add/remove wishlist',\n          error.stack\n        );\n      });\n  }\n\n  bindEvents() {\n    // trigger on sizes\n    if (this.trigger != null) {\n      this.trigger.addEventListener('click', () => {\n        this.toggleDropdown();\n      });\n    }\n    if (this.sizes.length) {\n      this.sizes.forEach(size => {\n        size.addEventListener('click', () => {\n          const isSelected = size.classList.contains(this.CLASSES.selected);\n          const isUnavailable = size.dataset.unavailable === 'true';\n          const productCode = size.dataset.productCode;\n          // put size\n          this.selectSize(size);\n          // if not available launch notify me event\n          if (isUnavailable) {\n            this.$emit(this.$customEvents.PRODUCT_EVENTS.notifyme, {\n              box: this.box,\n            });\n          } else {\n            // if available i want to hide the notifyme form\n            this.$emit(this.$customEvents.PRODUCT_EVENTS.notifymeclose, {\n              box: this.box,\n            });\n          }\n          // general event\n          this.$emit(this.$customEvents.PRODUCT_EVENTS.sizechanged, {\n            button: size,\n          });\n          if (!isSelected && !isUnavailable && this.isProductOnWishlist) {\n            this.addToWishlistAfterChangeSize(productCode);\n          }\n\n          // reset error\n          if (this.sizeError) {\n            this.sizeError.innerHTML = '';\n            this.sizeError.classList.remove(this.CLASSES.show);\n          }\n        });\n      });\n    }\n\n    // on notify me ended reset select\n    this.$on(this.$customEvents.PRODUCT_EVENTS.notifymeended, () => {\n      // reset value\n      this.cleanSelectSize();\n    });\n\n    // Size not selected event\n    this.$on(this.$customEvents.PRODUCT_EVENTS.sizerequired, (e) => {\n      let sizeErrorBox = document.querySelector('[data-sizes-error=prod-'+e.payload.dataset.productCode+']');\n      // put error\n      if (sizeErrorBox && !sizeErrorBox.classList.contains(this.CLASSES.show)) {\n        sizeErrorBox.classList.add(this.CLASSES.show);\n        sizeErrorBox.innerHTML = e.payload.dataset.selectSize;\n      }\n    });\n    //is product already into wishlist state toggled by wishlist add/remove events\n    this.$on(this.$customEvents.PRODUCT_EVENTS.addtowish, () => {\n      this.isProductOnWishlist = true;\n    });\n    this.$on(this.$customEvents.PRODUCT_EVENTS.removefromwish, () => {\n      this.isProductOnWishlist = false;\n    });\n  }\n\n  checkSizeSelected(){\n    if(!this.selected) return;\n    const selectedSize = this.selected.dataset['sizeSelected'];\n    if(selectedSize){\n      const size = this.sizesBox.querySelector(`[data-product-code=\"${selectedSize}\"]`);\n      console.log(size);\n\n      this.selectSize(size);\n    }\n  }\n\n  render() {\n    this.log('Rendering...');\n    this.bindEvents();\n    this.checkSizeSelected();\n  }\n}\n"],"sourceRoot":""}