{"version":3,"sources":["webpack:///./resources/js/src/app/components/item/ItemImageOverlay.vue","webpack:///./resources/js/src/app/components/item/ItemImageOverlay.vue?2e4a","webpack:///resources/js/src/app/components/item/ItemImageOverlay.vue","webpack:///./resources/js/src/app/components/item/ItemImageOverlay.vue?3f6f"],"names":["render","_vm","this","_c","_self","visible","staticClass","on","click","closeOverlay","_v","attrs","id","_l","previewImages","item","index","key","class","active","activeIndex","src","alt","name","loading","width","height","viewBox","fill","xmlns","d","stroke","_s","carouselImages","image","_e","_withStripped","props","type","Boolean","default","selectedIndex","Number","Array","required","String","data","isMobile","methods","$emit","handleKeyDown","event","$","carousel","loadZoomPlugin","_this","Promise","resolve","reject","script","document","createElement","concat","App","publicPath","addEventListener","initializeZoom","body","appendChild","startX","startY","isZoomedIn","currentX","currentY","imgElement","imgWidth","imgHeight","css","transform","transition","cursor","off","e","touch","originalEvent","touches","pageX","pageY","preventDefault","maxTranslateX","maxTranslateY","Math","max","min","zoom","magnify","duration","detectDeviceType","userAgent","navigator","vendor","window","opera","test","toLowerCase","mounted","_this2","$nextTick","$props","activeItem","relatedTarget","beforeDestroy","removeEventListener","component"],"mappings":"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","file":"chunks/ceres-client-48.min.js","sourcesContent":["var render = function render() {\n  var _vm = this,\n    _c = _vm._self._c\n  return _vm.visible\n    ? _c(\"div\", { staticClass: \"overlay\" }, [\n        _c(\"div\", { staticClass: \"overlay-toolbar\" }, [\n          _c(\n            \"div\",\n            { staticClass: \"overlay-close\", on: { click: _vm.closeOverlay } },\n            [_vm._v(\"✕\")]\n          ),\n        ]),\n        _vm._v(\" \"),\n        _c(\"div\", { staticClass: \"overlay-content position-relative\" }, [\n          _c(\"div\", { staticClass: \"overlay-carousel\" }, [\n            _c(\n              \"div\",\n              {\n                staticClass: \"carousel slide\",\n                attrs: {\n                  id: \"overlayItemImageCarousel\",\n                  \"data-touch\": \"false\",\n                  \"data-interval\": \"false\",\n                },\n              },\n              [\n                _c(\n                  \"div\",\n                  { staticClass: \"position-relative mx-auto carousel-wrapper\" },\n                  [\n                    _c(\n                      \"div\",\n                      { staticClass: \"carousel-inner\" },\n                      _vm._l(_vm.previewImages, function (item, index) {\n                        return _c(\n                          \"div\",\n                          {\n                            key: index,\n                            class: {\n                              \"carousel-item\": true,\n                              active: index === _vm.activeIndex,\n                            },\n                          },\n                          [\n                            _c(\"img\", {\n                              staticClass: \"img-fluid\",\n                              attrs: {\n                                src: item,\n                                alt: _vm.name,\n                                loading: \"lazy\",\n                              },\n                            }),\n                          ]\n                        )\n                      }),\n                      0\n                    ),\n                  ]\n                ),\n                _vm._v(\" \"),\n                _c(\n                  \"button\",\n                  {\n                    staticClass: \"carousel-control carousel-control-prev\",\n                    attrs: {\n                      \"data-target\": \"#overlayItemImageCarousel\",\n                      \"data-slide\": \"prev\",\n                    },\n                  },\n                  [\n                    _c(\n                      \"svg\",\n                      {\n                        attrs: {\n                          width: \"24\",\n                          height: \"24\",\n                          viewBox: \"0 0 24 24\",\n                          fill: \"none\",\n                          xmlns: \"http://www.w3.org/2000/svg\",\n                        },\n                      },\n                      [\n                        _c(\"path\", {\n                          attrs: {\n                            d: \"M15 18L9 12L15 6\",\n                            stroke: \"#121926\",\n                            \"stroke-width\": \"2\",\n                            \"stroke-linecap\": \"round\",\n                            \"stroke-linejoin\": \"round\",\n                          },\n                        }),\n                      ]\n                    ),\n                  ]\n                ),\n                _vm._v(\" \"),\n                _c(\n                  \"button\",\n                  {\n                    staticClass: \"carousel-control carousel-control-next\",\n                    attrs: {\n                      \"data-target\": \"#overlayItemImageCarousel\",\n                      \"data-slide\": \"next\",\n                    },\n                  },\n                  [\n                    _c(\n                      \"svg\",\n                      {\n                        attrs: {\n                          width: \"24\",\n                          height: \"24\",\n                          viewBox: \"0 0 24 24\",\n                          fill: \"none\",\n                          xmlns: \"http://www.w3.org/2000/svg\",\n                        },\n                      },\n                      [\n                        _c(\"path\", {\n                          attrs: {\n                            d: \"M9 18L15 12L9 6\",\n                            stroke: \"#121926\",\n                            \"stroke-width\": \"2\",\n                            \"stroke-linecap\": \"round\",\n                            \"stroke-linejoin\": \"round\",\n                          },\n                        }),\n                      ]\n                    ),\n                  ]\n                ),\n              ]\n            ),\n          ]),\n        ]),\n        _vm._v(\" \"),\n        _c(\"p\", { staticClass: \"text-center px-3\" }, [\n          _vm._v(_vm._s(_vm.name)),\n        ]),\n        _vm._v(\" \"),\n        _c(\n          \"div\",\n          { staticClass: \"overlay-thumbnail-images\" },\n          _vm._l(_vm.carouselImages, function (image, index) {\n            return _c(\n              \"div\",\n              {\n                key: index,\n                staticClass: \"thumbnail-image\",\n                class: { active: index === _vm.activeIndex },\n                attrs: {\n                  \"data-target\": \"#overlayItemImageCarousel\",\n                  \"data-slide-to\": index,\n                },\n              },\n              [\n                _c(\"img\", {\n                  staticClass: \"img-fluid\",\n                  attrs: { src: image, alt: _vm.name, loading: \"lazy\" },\n                }),\n              ]\n            )\n          }),\n          0\n        ),\n      ])\n    : _vm._e()\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!./ItemImageOverlay.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!./ItemImageOverlay.vue?vue&type=script&lang=js\"","<template>\n  <div v-if=\"visible\" class=\"overlay\">\n    <div class=\"overlay-toolbar\">\n      <div class=\"overlay-close\" @click=\"closeOverlay\">✕</div>\n    </div>\n    <div class=\"overlay-content position-relative\">\n      <div class=\"overlay-carousel\">\n        <div\n          id=\"overlayItemImageCarousel\"\n          class=\"carousel slide\"\n          data-touch=\"false\"\n          data-interval=\"false\"\n        >\n          <div class=\"position-relative mx-auto carousel-wrapper\">\n            <div class=\"carousel-inner\">\n              <div\n                v-for=\"(item, index) in previewImages\"\n                :key=\"index\"\n                :class=\"{\n                  'carousel-item': true,\n                  active: index === activeIndex,\n                }\"\n              >\n                <img class=\"img-fluid\" :src=\"item\" :alt=\"name\" loading=\"lazy\" />\n              </div>\n            </div>\n          </div>\n          <button\n            class=\"carousel-control carousel-control-prev\"\n            data-target=\"#overlayItemImageCarousel\"\n            data-slide=\"prev\"\n          >\n            <svg\n              width=\"24\"\n              height=\"24\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M15 18L9 12L15 6\"\n                stroke=\"#121926\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n          <button\n            class=\"carousel-control carousel-control-next\"\n            data-target=\"#overlayItemImageCarousel\"\n            data-slide=\"next\"\n          >\n            <svg\n              width=\"24\"\n              height=\"24\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M9 18L15 12L9 6\"\n                stroke=\"#121926\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n        </div>\n      </div>\n    </div>\n    <p class=\"text-center px-3\">{{ name }}</p>\n    <div class=\"overlay-thumbnail-images\">\n      <div\n        v-for=\"(image, index) in carouselImages\"\n        :key=\"index\"\n        class=\"thumbnail-image\"\n        data-target=\"#overlayItemImageCarousel\"\n        :data-slide-to=\"index\"\n        :class=\"{ active: index === activeIndex }\"\n      >\n        <img class=\"img-fluid\" :src=\"image\" :alt=\"name\" loading=\"lazy\" />\n      </div>\n    </div>\n  </div>\n</template>\n<script>\nexport default {\n  name: \"item-image-overlay\",\n  props: {\n    visible: {\n      type: Boolean,\n      default: false,\n    },\n    selectedIndex: {\n      type: Number,\n      default: 0,\n    },\n    previewImages: {\n      type: Array,\n      required: true,\n    },\n    carouselImages: {\n      type: Array,\n      required: true,\n    },\n    name: {\n      type: String,\n      required: true,\n    },\n  },\n  data() {\n    return {\n      activeIndex: 0,\n      isMobile: false,\n    };\n  },\n  methods: {\n    closeOverlay() {\n      this.$emit(\"close-overlay\");\n    },\n    handleKeyDown(event) {\n      if (event.key === \"ArrowRight\") {\n        $(\"#overlayItemImageCarousel\").carousel(\"next\");\n      } else if (event.key === \"ArrowLeft\") {\n        $(\"#overlayItemImageCarousel\").carousel(\"prev\");\n      } else if (event.key === \"Escape\") {\n        this.closeOverlay();\n      }\n    },\n    loadZoomPlugin() {\n      return new Promise((resolve, reject) => {\n        const script = document.createElement(\"script\");\n        script.type = \"text/javascript\";\n        script.id = \"zoom-plugin\";\n        script.src = `${App.publicPath}morgenland-zoom.min.js`;\n\n        script.addEventListener(\n          \"load\",\n          () => {\n            this.initializeZoom();\n            resolve();\n          },\n          false\n        );\n        script.addEventListener(\"error\", (event) => reject(event), false);\n        document.body.appendChild(script);\n      });\n    },\n    initializeZoom() {\n      if (this.isMobile) {\n        let isZoomedIn = false;\n        let startX,\n          startY,\n          currentX = 0,\n          currentY = 0;\n\n        const maxDrag = 50;\n\n        $(\"#overlayItemImageCarousel .carousel-item img\").on(\n          \"click\",\n          function () {\n            const imgElement = $(this);\n            const imgWidth = imgElement.width();\n            const imgHeight = imgElement.height();\n\n            if (!isZoomedIn) {\n              imgElement.css({\n                transform: \"scale(2)\",\n                transition: \"transform 0.3s ease\",\n                cursor: \"move\",\n              });\n              isZoomedIn = true;\n\n              imgElement.on(\"touchstart\", function (e) {\n                const touch = e.originalEvent.touches[0];\n                startX = touch.pageX - currentX;\n                startY = touch.pageY - currentY;\n              });\n\n              imgElement.on(\"touchmove\", function (e) {\n                e.preventDefault();\n                const touch = e.originalEvent.touches[0];\n                currentX = touch.pageX - startX;\n                currentY = touch.pageY - startY;\n\n                const maxTranslateX = (imgWidth * 1.3 - imgWidth) / 2 + maxDrag;\n                const maxTranslateY =\n                  (imgHeight * 1.3 - imgHeight) / 2 + maxDrag;\n\n                currentX = Math.max(\n                  -maxTranslateX,\n                  Math.min(currentX, maxTranslateX)\n                );\n                currentY = Math.max(\n                  -maxTranslateY,\n                  Math.min(currentY, maxTranslateY)\n                );\n\n                imgElement.css({\n                  transform: `scale(2) translate(${currentX}px, ${currentY}px)`,\n                  transition: \"transform 0.2s ease\",\n                });\n              });\n            } else {\n              imgElement.css({\n                transform: \"scale(1)\",\n                transition: \"transform 0.2s ease\",\n                cursor: \"default\",\n              });\n              imgElement.off(\"touchmove\");\n              currentX = 0;\n              currentY = 0;\n              isZoomedIn = false;\n            }\n          }\n        );\n      } else {\n        $(\"#overlayItemImageCarousel .carousel-item\").zoom({\n          on: \"click\",\n          magnify: 1.5,\n          duration: 300,\n        });\n      }\n    },\n\n    detectDeviceType() {\n      const userAgent = navigator.userAgent || navigator.vendor || window.opera;\n      this.isMobile = /android|iphone|ipad|ipod/i.test(userAgent.toLowerCase());\n    },\n  },\n\n  mounted() {\n    this.$nextTick(() => {\n      this.detectDeviceType();\n      this.loadZoomPlugin();\n      this.activeIndex = this.$props.selectedIndex;\n      $(\"#overlayItemImageCarousel\").carousel();\n\n      $(\"#overlayItemImageCarousel\").on(\"slid.bs.carousel\", (event) => {\n        const activeItem = $(event.relatedTarget);\n        this.activeIndex = activeItem.index();\n      });\n      document.addEventListener(\"keydown\", this.handleKeyDown);\n    });\n  },\n  beforeDestroy() {\n    document.removeEventListener(\"keydown\", this.handleKeyDown);\n  },\n};\n</script>\n","import { render, staticRenderFns } from \"./ItemImageOverlay.vue?vue&type=template&id=6031f214\"\nimport script from \"./ItemImageOverlay.vue?vue&type=script&lang=js\"\nexport * from \"./ItemImageOverlay.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\nexport default component.exports"],"sourceRoot":""}