{"version":3,"sources":["webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?55b3","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?df97","webpack:///resources/js/src/app/components/item/ItemImageCarousel.vue","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","attrs","itemscope","itemtype","staticClass","href","singleImages","url","alt","getAltText","singleImagesMiddle","title","getImageName","_v","showThumbs","ref","id","_l","carouselImages","imagePreview","index","class","active","currentItem","_e","_withStripped","props","maxQuantity","imageUrlAccessor","showDots","animationStyle","pluginPath","inject","itemId","default","data","initialized","computed","watch","currentVariation","mounted","$nextTick","methods","component","options","__file"],"mappings":"kGAAA,IAAIA,EAAS,WACX,IAAIC,EAAMC,KACNC,EAAKF,EAAIG,eACTC,EAAKJ,EAAIK,MAAMD,IAAMF,EACzB,OAAOE,EACL,MACA,CAAEE,MAAO,CAAEC,UAAW,GAAIC,SAAU,4BACpC,CACE,CACEJ,EAAG,MAAO,CAAEK,YAAa,wBAA0B,CACjDL,EAAG,MAAO,CAAEK,YAAa,eAAiB,CACxCL,EACE,IACA,CACEK,YAAa,WACbH,MAAO,CACLI,KAAMV,EAAIW,aAAa,GAAGC,IAC1B,gBAAiB,YAGrB,CACER,EAAG,WAAY,CACbE,MAAO,CACLO,IAAKb,EAAIc,WAAWd,EAAIe,mBAAmB,IAC3C,YAAaf,EAAIe,mBAAmB,GAAGH,IACvCI,MAAOhB,EAAIiB,aAAajB,EAAIe,mBAAmB,IAC/C,gBAAiB,2BAIvB,OAINf,EAAIkB,GAAG,KACPlB,EAAImB,WACAf,EACE,MACA,CACEgB,IAAK,SACLX,YACE,yDACFH,MAAO,CAAEe,GAAI,mBAEfrB,EAAIsB,GAAGtB,EAAIuB,gBAAgB,SAASC,EAAcC,GAChD,OAAiB,IAAVA,EACHrB,EAAG,MAAO,CAAEK,YAAa,YAAc,CACrCL,EAAG,MAAO,CAAEK,YAAa,mBAAqB,CAC5CL,EACE,IACA,CACEK,YAAa,mBACbH,MAAO,CACLI,KAAMV,EAAIW,aAAac,GAAOb,IAC9B,gBAAiB,YAGrB,CACER,EAAG,WAAY,CACbsB,MAAO,CAAEC,OAAQ3B,EAAI4B,cAAgBH,GACrCnB,MAAO,CACLO,IAAKb,EAAIc,WAAWU,GACpB,YAAaA,EAAaZ,IAC1BI,MAAOhB,EAAIiB,aAAaO,GACxB,gBAAiB,kCAIvB,OAINxB,EAAI6B,QAEV,GAEF7B,EAAI6B,OAGZ,IAIJ9B,EAAO+B,eAAgB,E,8CCnFkM,G,OCqCzN,CACEC,MAAO,CACLC,YACJ,CACM,KAAN,OACM,QAAN,IAEIC,iBACJ,CACM,KAAN,OACM,QAAN,OAEId,WACJ,CACM,KAAN,QACM,SAAN,GAEIe,SACJ,CACM,KAAN,QACM,SAAN,GAEIC,eACJ,CACM,KAAN,OACM,QAAN,YAEIC,WACJ,CACM,KAAN,OACM,QAAN,KAIEC,OAAQ,CACNC,OAAQ,CACNC,QAAS,OAIbC,KAxCF,WA0CI,MAAO,CACLZ,YAAa,EACba,aAAa,IAIjBC,SACF,CACI,iBADJ,WAGM,OAAN,qEAGI,eANJ,WAQM,OAAN,iCACA,6BACA,cACA,2BAEI,mBAbJ,WAeM,OAAN,iCACA,6BACA,aACA,2BAGI,aArBJ,WAuBM,OAAN,iCACA,6BACA,uBACA,4BAIEC,MAAO,CACLC,iBACJ,CACM,QADN,SACA,KACQ,IAAR,OACA,OAEU,YAAV,WAEY,EAAZ,iBACA,IAGM,MAAN,IAIEC,QAhGF,WAiGA,WACI5C,KAAK6C,WAAU,WAEb,EAAN,wBAIEC,QACF,CACI,cADJ,WAGM,OAAN,yFAGI,aANJ,WAQM,IAAN,uBAEM,EAAN,gCACM,EAAN,kEACM,EAAN,2BAEM,IAAN,uBAEM,EAAN,gCACM,EAAN,kEACM,EAAN,2BAEM,KAAN,eACM,KAAN,qBAGI,aAxBJ,WAyBM,IAAN,OACA,uBACA,GACQ,YAAR,EACQ,KAAR,cACQ,MAAR,EACQ,UAAR,EACQ,QAAR,EACQ,OAAR,GACQ,UAAR,IACQ,IAAR,IACQ,SAAR,CACA,4CACA,8CAEQ,kBAAR,GACQ,QAAR,CACA,gFACA,kFAEQ,WAAR,IACQ,UAAR,YAEA,kBAEA,2BACA,aACA,OAGQ,cAAR,YAEU,EAAV,iBAIA,mCAEQ,EAAR,gCAGM,EAAN,kCAEA,8BAEQ,SAAR,QACU,YAAV,EACU,WAAV,kEAIM,EAAN,0DAEQ,EAAR,6BAII,kBAlFJ,WAoFM,EAAN,gCACQ,YAAR,EACQ,MAAR,EACQ,MAAR,EACQ,UAAR,EACQ,MAAR,EACQ,OAAR,GACQ,WAAR,EACQ,QAAR,EACQ,KAAR,EACQ,SAAR,CACA,4CACA,8CAEQ,kBAAR,GACQ,QAAR,CACA,gFACA,kFAEQ,WAAR,OAII,KA3GJ,SA2GA,GAEA,qBAEA,2BACA,EACA,OAII,WArHJ,SAqHA,GAEM,OAAN,kFAGI,aA1HJ,SA0HA,GAEM,OAAN,wEAGI,aA/HJ,WAgIM,IAAN,OACM,OAAN,2BAEQ,IAAR,kDAEQ,GAAR,eAKA,CACU,IAAV,mCAEU,EAAV,uBACU,EAAV,oBACU,EAAV,uDAEU,EAAV,oCAAY,OAAZ,UACU,EAAV,sCAAY,OAAZ,WAEU,SAAV,yBAbU,W,OC9QNC,EAAY,YACd,EACAjD,EHyEoB,IGvEpB,EACA,KACA,KACA,MAuBFiD,EAAUC,QAAQC,OAAS,6DACZ,UAAAF,E","file":"chunks/ceres-client-33.min.js","sourcesContent":["var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"div\",\n    { attrs: { itemscope: \"\", itemtype: \"http://schema.org/Thing\" } },\n    [\n      [\n        _c(\"div\", { staticClass: \"single-carousel mt-0\" }, [\n          _c(\"div\", { staticClass: \"text-center\" }, [\n            _c(\n              \"a\",\n              {\n                staticClass: \"fancybox\",\n                attrs: {\n                  href: _vm.singleImages[0].url,\n                  \"data-fancybox\": \"gallery\"\n                }\n              },\n              [\n                _c(\"lazy-img\", {\n                  attrs: {\n                    alt: _vm.getAltText(_vm.singleImagesMiddle[0]),\n                    \"image-url\": _vm.singleImagesMiddle[0].url,\n                    title: _vm.getImageName(_vm.singleImagesMiddle[0]),\n                    \"picture-class\": \"big-single img-fluid\"\n                  }\n                })\n              ],\n              1\n            )\n          ])\n        ]),\n        _vm._v(\" \"),\n        _vm.showThumbs\n          ? _c(\n              \"div\",\n              {\n                ref: \"thumbs\",\n                staticClass:\n                  \"owl-thumbs owl-carousel owl-theme owl-single-item mt-5\",\n                attrs: { id: \"thumb-carousel\" }\n              },\n              _vm._l(_vm.carouselImages, function(imagePreview, index) {\n                return index !== 0\n                  ? _c(\"div\", { staticClass: \"prop-1-1\" }, [\n                      _c(\"div\", { staticClass: \"image-container\" }, [\n                        _c(\n                          \"a\",\n                          {\n                            staticClass: \"fancybox d-block\",\n                            attrs: {\n                              href: _vm.singleImages[index].url,\n                              \"data-fancybox\": \"gallery\"\n                            }\n                          },\n                          [\n                            _c(\"lazy-img\", {\n                              class: { active: _vm.currentItem === index },\n                              attrs: {\n                                alt: _vm.getAltText(imagePreview),\n                                \"image-url\": imagePreview.url,\n                                title: _vm.getImageName(imagePreview),\n                                \"picture-class\": \"owl-thumb border-appearance\"\n                              }\n                            })\n                          ],\n                          1\n                        )\n                      ])\n                    ])\n                  : _vm._e()\n              }),\n              0\n            )\n          : _vm._e()\n      ]\n    ],\n    2\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }","import mod from \"-!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ItemImageCarousel.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ItemImageCarousel.vue?vue&type=script&lang=js&\"","<template>\n  <div itemscope itemtype=\"http://schema.org/Thing\">\n    <template>\n      <div class=\"single-carousel mt-0\">\n        <div class=\"text-center\">\n          <a :href=\"singleImages[0].url\" class=\"fancybox\" data-fancybox=\"gallery\">\n            <lazy-img\n                :alt=\"getAltText(singleImagesMiddle[0])\"\n                :image-url=\"singleImagesMiddle[0].url\"\n                :title=\"getImageName(singleImagesMiddle[0])\"\n                picture-class=\"big-single img-fluid\">\n            </lazy-img>\n          </a>\n        </div>\n      </div>\n      <div v-if=\"showThumbs\" id=\"thumb-carousel\" ref=\"thumbs\" class=\"owl-thumbs owl-carousel owl-theme owl-single-item mt-5\">\n        <div v-for=\"(imagePreview, index) in carouselImages\" class=\"prop-1-1\" v-if=\"index !== 0\">\n          <div class=\"image-container\">\n            <a :href=\"singleImages[index].url\" class=\"fancybox d-block\" data-fancybox=\"gallery\">\n              <lazy-img\n                  :alt=\"getAltText(imagePreview)\"\n                  :image-url=\"imagePreview.url\"\n                  :title=\"getImageName(imagePreview)\"\n                  picture-class=\"owl-thumb border-appearance\"\n                  v-bind:class=\"{ 'active': currentItem === index}\"></lazy-img>\n            </a>\n          </div>\n        </div>\n      </div>\n    </template>\n  </div>\n</template>\n\n<script>\nimport { isNullOrUndefined } from \"../../helper/utils\";\nimport { Fancybox } from \"@fancyapps/ui\";\n\nexport default {\n  props: {\n    maxQuantity:\n        {\n          type: Number,\n          default: 20\n        },\n    imageUrlAccessor:\n        {\n          type: String,\n          default: \"url\"\n        },\n    showThumbs:\n        {\n          type: Boolean,\n          default: true\n        },\n    showDots:\n        {\n          type: Boolean,\n          default: true\n        },\n    animationStyle:\n        {\n          type: String,\n          default: \"standard\"\n        },\n    pluginPath:\n        {\n          type: String,\n          default: \"\"\n        }\n  },\n\n  inject: {\n    itemId: {\n      default: null\n    }\n  },\n\n  data()\n  {\n    return {\n      currentItem: 0,\n      initialized: false\n    };\n  },\n\n  computed:\n      {\n        currentVariation()\n        {\n          return this.$store.getters[`${this.itemId}/currentItemVariation`];\n        },\n\n        carouselImages()\n        {\n          return this.$options.filters.itemImages(\n              this.currentVariation.images,\n              \"urlPreview\"\n          ).slice(0, this.maxQuantity);\n        },\n        singleImagesMiddle()\n        {\n            return this.$options.filters.itemImages(\n                this.currentVariation.images,\n                'urlMiddle'\n            ).slice(0, this.maxQuantity);\n        },\n\n        singleImages()\n        {\n          return this.$options.filters.itemImages(\n              this.currentVariation.images,\n              this.imageUrlAccessor\n          ).slice(0, this.maxQuantity);\n        }\n      },\n\n  watch: {\n    currentVariation:\n        {\n          handler(val, oldVal)\n          {\n            if (val !== oldVal)\n            {\n              setTimeout(() =>\n              {\n                this.reInitialize();\n              }, 1);\n            }\n          },\n          deep: true\n        }\n  },\n\n  mounted()\n  {\n    this.$nextTick(() =>\n    {\n      this.initThumbCarousel();\n    });\n  },\n\n  methods:\n      {\n        getImageCount()\n        {\n          return this.carouselImages.length > this.maxQuantity ? this.maxQuantity : this.carouselImages.length;\n        },\n\n        reInitialize()\n        {\n          const $owl = $(this.$refs.single);\n\n          $owl.trigger(\"destroy.owl.carousel\");\n          $owl.html($owl.find(\".owl-stage-outer\").html()).removeClass(\"owl-loaded\");\n          $owl.find(\".owl-item\").remove();\n\n          const $thumbs = $(this.$refs.thumbs);\n\n          $thumbs.trigger(\"destroy.owl.carousel\");\n          $thumbs.html($thumbs.find(\".owl-stage-outer\").html()).removeClass(\"owl-loaded\");\n          $thumbs.find(\".owl-item\").remove();\n\n          this.initCarousel();\n          this.initThumbCarousel();\n        },\n\n        initCarousel()\n        {\n          const imageCount = this.getImageCount();\n          const carouselSettings = {\n            autoHeight: true,\n            dots: this.showDots,\n            items: 1,\n            lazyLoad: true,\n            rewind: true,\n            margin: 10,\n            mouseDrag: imageCount > 1,\n            nav: imageCount > 1,\n            navClass: [\n              \"owl-single-item-nav left carousel-control\",\n              \"owl-single-item-nav right carousel-control\"\n            ],\n            navContainerClass: \"\",\n            navText: [\n              \"<i class=\\\"owl-single-item-control fa fa-chevron-left\\\" aria-hidden=\\\"true\\\"></i>\",\n              \"<i class=\\\"owl-single-item-control fa fa-chevron-right\\\" aria-hidden=\\\"true\\\"></i>\"\n            ],\n            smartSpeed: 350,\n            onChanged: event =>\n            {\n              const $thumb = $(this.$refs.thumbs);\n\n              $thumb.trigger(\"to.owl.carousel\", [\n                event.page.index,\n                350\n              ]);\n            },\n            onInitialized: event =>\n            {\n              this.initialized = true;\n            }\n          };\n\n          if (this.animationStyle !== \"standard\")\n          {\n            carouselSettings.animateOut = this.animationStyle;\n          }\n\n          $(this.$refs.single).owlCarousel(carouselSettings);\n\n          if (!isNullOrUndefined(window.lightbox))\n          {\n            lightbox.option({\n              wrapAround: true,\n              albumLabel: this.$translate(\"Ceres::Template.singleItemLightboxImageShown\")\n            });\n          }\n\n          $(this.$refs.single).on(\"changed.owl.carousel\", event =>\n          {\n            this.currentItem = event.page.index;\n          });\n        },\n\n        initThumbCarousel()\n        {\n          $(this.$refs.thumbs).owlCarousel({\n            autoHeight: true,\n            dots: false,\n            items: 5,\n            lazyLoad: true,\n            loop: false,\n            margin: 10,\n            mouseDrag: false,\n            center: false,\n            nav: true,\n            navClass: [\n              \"owl-single-item-nav left carousel-control\",\n              \"owl-single-item-nav right carousel-control\"\n            ],\n            navContainerClass: \"\",\n            navText: [\n              \"<i class=\\\"owl-single-item-control fa fa-chevron-left\\\" aria-hidden=\\\"true\\\"></i>\",\n              \"<i class=\\\"owl-single-item-control fa fa-chevron-right\\\" aria-hidden=\\\"true\\\"></i>\"\n            ],\n            smartSpeed: 350\n          });\n        },\n\n        goTo(index)\n        {\n          const $owl = $(this.$refs.single);\n\n          $owl.trigger(\"to.owl.carousel\", [\n            index,\n            350\n          ]);\n        },\n\n        getAltText(image)\n        {\n          return image && image.alternate ? image.alternate : this.$options.filters.itemName(this.currentVariation);\n        },\n\n        getImageName(image)\n        {\n          return image && image.name ? image.name : this.$options.filters.itemName(this.currentVariation);\n        },\n\n        loadLightbox()\n        {\n          return new Promise((resolve, reject) =>\n          {\n            const script = document.querySelector(\"script#lightboxscript\");\n\n            if (!isNullOrUndefined(script))\n            {\n              resolve();\n            }\n            else\n            {\n              const script = document.createElement(\"script\");\n\n              script.type = \"text/javascript\";\n              script.id = \"lightboxscript\";\n              script.src = `${this.pluginPath}/js/dist/lightbox.min.js`;\n\n              script.addEventListener(\"load\", () => resolve(), false);\n              script.addEventListener(\"error\", event => reject(event), false);\n\n              document.body.appendChild(script);\n            }\n          });\n        }\n      }\n};\n</script>\n","import { render, staticRenderFns } from \"./ItemImageCarousel.vue?vue&type=template&id=5285279e&\"\nimport script from \"./ItemImageCarousel.vue?vue&type=script&lang=js&\"\nexport * from \"./ItemImageCarousel.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\n/* hot reload */\nif (module.hot) {\n  var api = require(\"/Users/ihussein/workspace/8291/133/FreakWave/node_modules/vue-hot-reload-api/dist/index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('5285279e')) {\n      api.createRecord('5285279e', component.options)\n    } else {\n      api.reload('5285279e', component.options)\n    }\n    module.hot.accept(\"./ItemImageCarousel.vue?vue&type=template&id=5285279e&\", function () {\n      api.rerender('5285279e', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"resources/js/src/app/components/item/ItemImageCarousel.vue\"\nexport default component.exports"],"sourceRoot":""}