{"version":3,"sources":["webpack:///./src/views/quote/QuoteImagesBreakOut.vue","webpack:///src/views/quote/QuoteImagesBreakOut.vue","webpack:///./src/views/quote/QuoteImagesBreakOut.vue?88d9","webpack:///./src/views/quote/QuoteImagesBreakOut.vue?91d9","webpack:///./src/components/BulmaCarousel/BulmaCarousel.vue","webpack:///src/components/BulmaCarousel/BulmaCarousel.vue","webpack:///./src/components/BulmaCarousel/BulmaCarousel.vue?f229","webpack:///./src/components/BulmaCarousel/BulmaCarousel.vue?2970","webpack:///./src/components/BulmaCarousel/ImageService.js","webpack:///./src/components/BulmaCarousel/BulmaCarousel.vue?ee30","webpack:///./src/components/BulmaCarousel/BulmaCarouselModal.vue","webpack:///src/components/BulmaCarousel/BulmaCarouselModal.vue","webpack:///./src/components/BulmaCarousel/BulmaCarouselModal.vue?3501","webpack:///./src/components/BulmaCarousel/BulmaCarouselModal.vue?a81d","webpack:///./src/views/quote/QuoteImagesBreakOut.vue?69d0"],"names":["render","_vm","this","_c","_self","isEditing","_e","attrs","modalOpen","selectedImage","imageIds","on","close","staticClass","isLoadingImages","_l","imageCategories","category","refreshComponent","key","quoteImageCategoryId","ref","refInFor","imagesWithInfo","value","quoteId","name","orderIndex","isPrivate","hasSeclectAll","refreshCategory","updateImage","arrangeImagesOrder","directives","rawName","expression","_m","staticRenderFns","components","BulmaCarouselModal","QuoteImageCategory","props","quoteIds","type","default","maxSelected","subtitle","isAudanet","data","size","images","watch","created","document","methods","QuoteService","getThumbnail","id","index","thumbnail","getThumbnailWithInfo","getThumbnails","vm","promises","Promise","viewImage","closed","window","editImage","OpenImage","saved","updatedThumbnail","getImageCategories","getImagesWithInfoByCategory","categoryId","component","class","isLoading","imageBase64","staticStyle","handleMouseOver","$event","showZoom","handleImageClick","_v","_s","imageIndex","imageCount","previousImage","nextImage","startIndex","imageWidth","imageHeight","showMagnifier","zoom","scale","computed","isLoadingFirstImage","newVal","oldVal","handler","style","imgStyle","deep","mounted","ImageService","initSelectedIds","length","getImage","action","notifyOrientation","i","event","handleImageAndMousePosition","offsetX","offsetY","posY","posX","onWheel","getImageThumbnail","url","FqApi","get","responseType","result","image","Buffer","from","toString","headers","toLowerCase","isActive","animationIn","animationOut","animationDuration","minWidth","title","setOrientation","BaseModalEx","BulmaCarousel","closable","active"],"mappings":"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","file":"static/js/quote-imagesbreakout-chunk.66747c88.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return (!_vm.isEditing)?_c('div',[_c('bulma-carousel-modal',{attrs:{\"active\":_vm.modalOpen,\"closable\":true,\"start-index\":_vm.selectedImage,\"image-ids\":_vm.imageIds,\"image-height\":1000,\"image-width\":1000},on:{\"close\":_vm.close}}),_c('div',{staticClass:\"tile is-ancestor is-parent\"},[_c('div',{staticClass:\"tile is-parent\"},[(!_vm.isLoadingImages)?_c('div',{staticClass:\"is-flex is-flex-wrap-wrap flex-full-width\"},[_c('article',{staticClass:\"tile is-child detail-page-tile\"},[_vm._l((_vm.imageCategories),function(category){return [(_vm.refreshComponent)?_c('quote-image-category',{key:category.quoteImageCategoryId,ref:\"quoteImageCategories\",refInFor:true,attrs:{\"categories\":_vm.imageCategories,\"images\":_vm.imagesWithInfo,\"quote-id\":_vm.value.quoteId,\"category\":category.name,\"category-id\":category.quoteImageCategoryId,\"category-order-index\":category.orderIndex,\"is-private\":category.isPrivate,\"value\":_vm.value,\"has-select\":_vm.hasSeclectAll,\"refresh\":_vm.refreshCategory,\"is-category-select-all-enable\":false,\"is-delete-enable\":false,\"is-image-selectable\":false,\"is-white-box\":true},on:{\"update-image\":_vm.updateImage,\"arrange-images-order\":_vm.arrangeImagesOrder}}):_vm._e()]})],2)]):_vm._e()])]),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.isLoadingImages),expression:\"isLoadingImages\"}],staticClass:\"columns is-multiline\"},[_vm._m(0)])],1):_vm._e()\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"section\"},[_c('span',{staticClass:\"is-loading-image has-text-black has-text-centered\"})])\n}]\n\nexport { render, staticRenderFns }","<template>\n  <!-- <div class=\"tile is-ancestor is-parent\">\n    <div class=\"tile is-parent\">\n      <article class=\"tile is-child box detail-page-tile\"> -->\n  <div v-if=\"!isEditing\">\n    <bulma-carousel-modal :active=\"modalOpen\"\n      :closable=\"true\"\n      :start-index=\"selectedImage\"\n      :image-ids=\"imageIds\"\n      :image-height=\"1000\"\n      :image-width=\"1000\"\n      @close=\"close\" />\n\n    <div class=\"tile is-ancestor is-parent\">\n      <div class=\"tile is-parent\">\n        <div class=\"is-flex is-flex-wrap-wrap flex-full-width\"\n          v-if=\"!isLoadingImages\">\n          <article class=\"tile is-child detail-page-tile\">\n            <template v-for=\"category in imageCategories\">\n              <quote-image-category v-if=\"refreshComponent\"\n                :categories=\"imageCategories\"\n                :images=\"imagesWithInfo\"\n                :key=\"category.quoteImageCategoryId\"\n                :quote-id=\"value.quoteId\"\n                :category=\"category.name\"\n                :category-id=\"category.quoteImageCategoryId\"\n                :category-order-index=\"category.orderIndex\"\n                :is-private=\"category.isPrivate\"\n                :value=\"value\"\n                :has-select=\"hasSeclectAll\"\n                :refresh=\"refreshCategory\"\n                :is-category-select-all-enable=\"false\"\n                :is-delete-enable=\"false\"\n                :is-image-selectable=\"false\"\n                :is-white-box=\"true\"\n                @update-image=\"updateImage\"\n                @arrange-images-order=\"arrangeImagesOrder\"\n                ref=\"quoteImageCategories\" />\n\n              <!-- <div class=\"tile\"\n                :key=\"category.id\">\n                <div class=\"tile is-parent\">\n                  <article class=\"tile is-child detail-page-tile\">\n                    <div class=\"columns\">\n                      <div class=\"column\">\n                        <div class=\"category-name is-size-4 has-text-weight-semibold\">{{ category.name }}</div>\n                      </div>\n                    </div>\n                    <div v-if=\"isLoadingImages\"\n                      class=\"columns is-multiline dragable-box\">\n                      <div class=\"section\">\n                        <div class=\"is-loading-image-popup content has-text-grey has-text-centered\" />\n                      </div>\n                    </div>\n                    <div v-else-if=\"getImagesWithInfoByCategory(category.quoteImageCategoryId).length === 0\"\n                      class=\"content has-text-grey is-multiline dragable-box\">\n                      <div class=\"column is-one-fifth has-text-centered\">\n                        <span icon=\"icon is-large\">\n                          <i class=\"mdi mdi-48px mdi-emoticon-sad\" />\n                        </span>\n                        <div>No Images</div>\n                      </div>\n                    </div>\n                    <div v-else\n                      class=\"columns is-flex is-multiline dragable-box\">\n                      <div v-for=\"(image, index) in getImagesWithInfoByCategory(category.quoteImageCategoryId)\"\n                        :key=\"image.quoteImageId\"\n                        class=\"p-2\">\n                        <div v-if=\"image.imageContent\"\n                          :class=\"'card'\"\n                          style=\"box-shadow: 0 0 0 1px #d9d9d9\">\n\n                          <header class=\"card-header\">\n\n                            <div class=\"card-header-title p-1 has-background-grey-lighter is-flex is-justify-content-end\">\n                              <a class=\"has-text-primary is-outlined\"\n                                @click=\"editImage(image.quoteImageId)\">\n                                <span class=\"icon\">\n                                  <i class=\"mdi mdi-lead-pencil mdi-24px\"\n                                    aria-hidden=\"true\" />\n                                </span>\n                              </a>\n                            </div>\n\n                          </header>\n\n                          <div class=\"card-image\">\n                            <a @click=\"viewImage(index)\">\n                              <figure class=\"image is-128x128\">\n                                <div style=\"position: relative\">\n                                  <i v-if=\"image.isPrimary\"\n                                    class=\"mdi mdi-star mdi-24px has-text-gold\"\n                                    style=\"position: absolute; z-index: 1\" />\n                                  <img v-if=\"image.imageContent\"\n                                    class=\"image is-128x128\"\n                                    style=\"object-fit: cover;\"\n                                    :src=\"image.imageContent\"\n                                    :key=\"image.quoteImageId\"\n                                    :id=\"image.quoteImageId\">\n                                </div>\n                              </figure>\n                            </a>\n                          </div>\n                        </div>\n                      </div>\n                    </div>\n                  </article>\n                </div>\n              </div> -->\n            </template>\n          </article>\n        </div>\n      </div>\n    </div>\n\n    <!-- <div v-for=\"(image, index) in imagesWithInfo\"\n        :key=\"image.quoteImageId\"\n        class=\"p-2\">\n        <div v-if=\"image.imageContent\"\n          :class=\"'card'\"\n          style=\"box-shadow: 0 0 0 1px #d9d9d9\">\n\n          <header class=\"card-header\">\n\n            <div class=\"card-header-title p-1 has-background-grey-lighter is-flex is-justify-content-end\">\n              <a class=\"has-text-primary is-outlined\"\n                @click=\"editImage(image.quoteImageId)\">\n                <span class=\"icon\">\n                  <i class=\"mdi mdi-lead-pencil mdi-24px\"\n                    aria-hidden=\"true\" />\n                </span>\n              </a>\n            </div>\n\n          </header>\n\n          <div class=\"card-image\">\n            <a @click=\"viewImage(index)\">\n              <figure class=\"image is-128x128\">\n                <div style=\"position: relative\">\n                  <i v-if=\"image.isPrimary\"\n                    class=\"mdi mdi-star mdi-24px has-text-gold\"\n                    style=\"position: absolute; z-index: 1\" />\n                  <img v-if=\"image.imageContent\"\n                    class=\"image is-128x128\"\n                    style=\"object-fit: cover;\"\n                    :src=\"image.imageContent\"\n                    :key=\"image.quoteImageId\"\n                    :id=\"image.quoteImageId\">\n                </div>\n              </figure>\n            </a>\n          </div>\n        </div>\n      </div>\n    </div> -->\n\n    <div v-show=\"isLoadingImages\"\n      class=\"columns is-multiline\">\n      <div class=\"section\">\n        <span class=\"is-loading-image has-text-black has-text-centered\" />\n      </div>\n    </div>\n    <!--\n        </div>\n      </article>\n    </div> -->\n  </div>\n\n</template>\n\n<script>\nimport QuoteService from './QuoteService'\nimport BulmaCarouselModal from '../../components/BulmaCarousel/BulmaCarouselModal.vue'\nimport { OpenImage } from '@/components/VuePainterro'\nimport QuoteImageCategory from './components/QuoteImageCategory.vue'\n\nconst MaximumImages = 99\n\nexport default {\n  name: 'QuoteImages',\n  components: {\n    BulmaCarouselModal,\n    QuoteImageCategory\n  },\n  props: {\n    value: null,\n    quoteIds: {\n      type: Array,\n      default: () => {\n        return []\n      }\n    },\n    maxSelected: {\n      type: Number,\n      default: MaximumImages\n    },\n    subtitle: {\n      type: String,\n      default: 'Select images to attach'\n    },\n    isAudanet: {\n      type: Boolean,\n      default: false\n    }\n  },\n  data() {\n    return {\n      size: 200,\n      isLoadingImages: true,\n      images: [],\n      imageIds: [],\n      selectedImage: null,\n      modalOpen: false,\n      imagesWithInfo: [],\n      isEditing: false,\n      imageCategories: null,\n      quoteId: '',\n      hasSeclectAll: false,\n      refreshCategory: false,\n      refreshComponent: true\n    }\n  },\n  watch: {\n    value(value) {\n      this.quoteId = value.quoteId\n    }\n  },\n  async created() {\n    document.title = 'Images for Quote ' + this.value.quoteNo\n    await this.getImageCategories()\n    this.getThumbnails()\n  },\n  methods: {\n    async arrangeImagesOrder() {\n      const imageIds = []\n      for (const category of this.$refs.quoteImageCategories) {\n        if (category.imagesWithInfo.length) {\n          imageIds.push(...category.imagesWithInfo.map((obj) => obj.quoteImageId))\n        }\n      }\n      if (imageIds) {\n        await QuoteService.setQuoteImagesOrderIndex(this.value.quoteId, imageIds)\n        // this.$eventHub.$emit(`${EventHubTypes.ImageCountChanged}UpdateQuote`, imageIds.length)\n      }\n    },\n    updateImage() {\n      this.getImageCategories()\n      this.getThumbnails()\n    },\n    async getThumbnail(id, index) {\n      var thumbnail = await QuoteService.getImageThumbnail(id, this.size)\n      this.images.splice(index, 1, thumbnail)\n    },\n    async getThumbnailWithInfo(id, index) {\n      var thumbnail = await QuoteService.getImageThumbnailWithInfo(id, this.size)\n      return thumbnail\n    },\n    async getThumbnails() {\n      this.isLoadingImages = true\n      this.imagesWithInfo.splice(0, this.imagesWithInfo.length)\n      const vm = this\n      this.imageIds = await QuoteService.getImageIds(this.value.quoteId)\n      const promises = this.imageIds.map(function (id, index) {\n        return vm.getThumbnailWithInfo(id, index)\n      })\n      this.imagesWithInfo = await Promise.all(promises)\n      this.isLoadingImages = false\n      //this.$eventHub.$emit(EventHubTypes.ImageCountChanged, this.imageIds.length)\n    },\n    viewImage(index) {\n      this.modalOpen = true\n      this.selectedImage = index\n    },\n    close() {\n      this.modalOpen = false\n      this.selectedImage = null\n    },\n    async closed() {\n      window.scroll(this.lastScrollX, this.lastScrollY)\n      this.isEditing = false\n      //await this.getThumbnails()\n    },\n    editImage(id) {\n      this.$showSpinner()\n      this.lastScrollX = window.scrollX\n      this.lastScrollY = window.scrollY\n      window.scrollTo(0, 0)\n      OpenImage(id, this.saved, this.closed, false)\n      this.$hideSpinner()\n      this.isEditing = true\n    },\n    async saved(id) {\n      // Callback function to update thumbnail after saving images in Painterro\n      const thumbnail = this.imagesWithInfo.find((i) => i.quoteImageId === id)\n      const updatedThumbnail = await this.getThumbnailWithInfo(id, this.size)\n      thumbnail.imageContent = updatedThumbnail.imageContent\n    },\n    async getImageCategories() {\n      this.imageCategories = await QuoteService.getQuoteImageCategories()\n    },\n    getImagesWithInfoByCategory(categoryId) {\n      const images = this.imagesWithInfo\n      const category = this.imageCategories.find((i) => i.quoteImageCategoryId === categoryId)\n      const noCategory = category.orderIndex === 0 ? images.filter((i) => !i.imageCategoryId) : []\n      const filtered = images.filter((i) => i.imageCategoryId === categoryId)\n      const combined = filtered.concat(noCategory).sort((a, b) => a.orderIndex - b.orderIndex)\n      return combined\n      //return this.imagesWithInfo.filter((i) => i.imageCategoryId == categoryId)\n    }\n  }\n}\n</script>\n\n<style scoped>\n.is-loading-image {\n  left: 45%;\n}\n\n.is-multiline.dragable-box {\n  min-height: 3em;\n  border: dashed 2px #e3e2e2;\n  border-radius: 2px;\n  margin-left: 2px;\n  margin-right: 3px;\n  background-color: #fafafa;\n}\n\n.flex-full-width {\n  flex: 0 0 100%;\n}\n\n</style>","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./QuoteImagesBreakOut.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./QuoteImagesBreakOut.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./QuoteImagesBreakOut.vue?vue&type=template&id=a41e9af2&scoped=true\"\nimport script from \"./QuoteImagesBreakOut.vue?vue&type=script&lang=js\"\nexport * from \"./QuoteImagesBreakOut.vue?vue&type=script&lang=js\"\nimport style0 from \"./QuoteImagesBreakOut.vue?vue&type=style&index=0&id=a41e9af2&prod&scoped=true&lang=css\"\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  \"a41e9af2\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('div',{staticClass:\"carousel carousel-animated carousel-animate-slide\",class:{ 'is-loading-image-popup' : _vm.isLoading}},[(_vm.isLoading && !_vm.imageBase64)?_c('section',{staticClass:\"section\"},[_vm._m(0)]):_vm._e(),_c('div',{staticClass:\"carousel-container\"},[_vm._m(1),_c('div',{staticClass:\"carousel-item has-background\",staticStyle:{\"overflow\":\"visible\"}},[_c('div',{attrs:{\"id\":\"img-zoomer-box\"}},[_c('img',{staticClass:\"is-background\",attrs:{\"id\":\"img-1\",\"src\":_vm.imageBase64,\"alt\":\"\",\"width\":\"800\",\"height\":\"600\"},on:{\"mousemove\":_vm.handleMouseOver,\"mouseleave\":function($event){_vm.showZoom = false},\"click\":_vm.handleImageClick}}),(_vm.showZoom)?_c('div',{attrs:{\"id\":\"img-2\"}},[_c('div',{attrs:{\"id\":\"img-2-bg\"}})]):_vm._e()]),(_vm.imageBase64)?_c('div',{staticClass:\"title\"},[_vm._v(_vm._s(_vm.imageIndex + 1)+\" of \"+_vm._s(_vm.imageCount))]):_vm._e()])]),_c('div',{staticClass:\"carousel-navigation is-overlay\"},[_c('div',{staticClass:\"carousel-nav-left\"},[_c('i',{staticClass:\"mdi mdi-36px mdi-chevron-left\",class:{'mdi-dark mdi-inactive' : _vm.imageIndex === 0},attrs:{\"aria-hidden\":\"true\"},on:{\"click\":function($event){return _vm.previousImage()}}})]),_c('div',{staticClass:\"carousel-nav-right\"},[_c('i',{staticClass:\"mdi mdi-36px mdi-chevron-right\",class:{'mdi-dark mdi-inactive' : _vm.imageIndex === _vm.imageCount - 1},attrs:{\"aria-hidden\":\"true\"},on:{\"click\":function($event){return _vm.nextImage()}}})])])])])\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"content has-text-grey has-text-centered\"},[_c('span',{staticStyle:{\"opacity\":\"0\"},attrs:{\"icon\":\"icon is-large\"}},[_c('i',{staticClass:\"mdi mdi-spin mdi-loading mdi-36px\"})])])\n},function (){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"carousel-item has-background is-active\"},[_c('img',{staticClass:\"is-background\",attrs:{\"src\":\"\",\"alt\":\"\",\"width\":\"800\",\"height\":\"600\"}})])\n}]\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <div class=\"carousel carousel-animated carousel-animate-slide\"\n      :class=\"{ 'is-loading-image-popup' : isLoading}\">\n      <section v-if=\"isLoading && !imageBase64\"\n        class=\"section\">\n        <div class=\"content has-text-grey has-text-centered\">\n          <span icon=\"icon is-large\"\n            style=\"opacity: 0;\">\n            <i class=\"mdi mdi-spin mdi-loading mdi-36px\" />\n          </span>\n        </div>\n      </section>\n      <div class=\"carousel-container\">\n        <div class=\"carousel-item has-background is-active\">\n          <img class=\"is-background\"\n            src=\"\"\n            alt=\"\"\n            width=\"800\"\n            height=\"600\">\n        </div>\n        <div class=\"carousel-item has-background\"\n          style=\"overflow:visible\">\n          <div id=\"img-zoomer-box\">\n            <img class=\"is-background\"\n              id=\"img-1\"\n              :src=\"imageBase64\"\n              alt=\"\"\n              width=\"800\"\n              height=\"600\"\n              @mousemove=\"handleMouseOver\"\n              @mouseleave=\"showZoom = false\"\n              @click=\"handleImageClick\">\n            <div v-if=\"showZoom\"\n              id=\"img-2\">\n              <div id=\"img-2-bg\" />\n            </div>\n          </div>\n          <div v-if=\"imageBase64\"\n            class=\"title\">{{ imageIndex + 1 }} of {{ imageCount }}</div>\n        </div>\n      </div>\n      <div class=\"carousel-navigation is-overlay\">\n        <div class=\"carousel-nav-left\">\n          <i class=\"mdi mdi-36px mdi-chevron-left\"\n            :class=\"{'mdi-dark mdi-inactive' : imageIndex === 0}\"\n            aria-hidden=\"true\"\n            @click=\"previousImage()\" />\n        </div>\n        <div class=\"carousel-nav-right\">\n          <i class=\"mdi mdi-36px mdi-chevron-right\"\n            :class=\"{'mdi-dark mdi-inactive' : imageIndex === imageCount - 1}\"\n            aria-hidden=\"true\"\n            @click=\"nextImage()\" />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport ImageService from './ImageService'\nimport { ImageOrientationTypes } from '@/enums'\n\nexport default {\n  name: 'BulmaCarousel',\n  props: {\n    imageIds: {\n      type: Array,\n      default: () => {\n        return []\n      }\n    },\n    startIndex: {\n      type: Number,\n      default: 0\n    },\n    imageWidth: {\n      type: Number,\n      default: 800\n    },\n    imageHeight: {\n      type: Number,\n      default: 600\n    }\n  },\n  data() {\n    return {\n      imageBase64: '',\n      imageIndex: this.startIndex,\n      imageCount: this.imageIds.length,\n      isLoading: false,\n      images: [],\n      showZoom: false,\n      showMagnifier: false,\n      zoom: {\n        scale: 1.5,\n        zoom: true\n      }\n    }\n  },\n  computed: {\n    isLoadingFirstImage() {\n      return !this.images[this.startIndex] || this.images[this.startIndex] === undefined\n    }\n  },\n  watch: {\n    imageBase64(newVal, oldVal) {\n      this.notifyOrientation()\n    },\n    // change cursor zoom in / zoom out when zoom changes\n    zoom: {\n      handler(newVal, oldVal) {\n        const imgStyle = document.querySelector('#img-2-bg').style\n        const style = document.querySelector('#img-zoomer-box').style\n\n        if (newVal.zoom) {\n          style.cursor = 'zoom-in'\n        } else {\n          style.cursor = 'zoom-out'\n        }\n\n        let original = document.querySelector('#img-1')\n\n        let imgWidth = original.offsetWidth\n        let imgHeight = original.offsetHeight\n        imgStyle.backgroundSize = imgWidth * 1.5 * this.zoom.scale + 'px ' + imgHeight * 1.5 * this.zoom.scale + 'px'\n      },\n      deep: true\n    }\n  },\n  created() {\n    this.images = new Array(this.imageIds.length)\n    this.initSelectedIds(this.imageIds.length)\n    this.getImage()\n    // this.getThumbnails()\n  },\n  mounted() {\n    window.addEventListener('wheel', this.onWheel)\n  },\n  methods: {\n    async getThumbnail(id, index) {\n      var thumbnail = await ImageService.getImageThumbnail(id, 800)\n      this.images.splice(index, 1, thumbnail)\n    },\n    async getThumbnails() {\n      this.isLoading = true\n      const vm = this\n      this.images = new Array(this.imageIds.length)\n      this.initSelectedIds(this.imageIds.length)\n      const promises = this.imageIds.map(function (id, index) {\n        vm.getThumbnail(id, index)\n      })\n      await Promise.all(promises)\n      // console.log(this.images[this.startIndex])\n      this.isLoading = false\n    },\n    initSelectedIds(length) {\n      this.imagesSelected = new Array(length)\n      let size = length\n      while (size--) {\n        this.imagesSelected.splice(size, 1, false)\n      }\n    },\n    async getImage(action) {\n      this.isLoading = true\n      // if (action === 'prev') {\n      //   this.images[0] = !this.images[1] ? this.images[1] : (this.imageIndex > 0 ? await ImageService.getImageThumbnail(this.imageIds[this.imageIndex - 1], 800) : '')\n      //   this.images[1] = !this.images[2] ? this.images[2] : await ImageService.getImageThumbnail(this.imageIds[this.imageIndex], 800)\n      //   this.images[2] = await ImageService.getImageThumbnail(this.imageIds[this.imageIndex + 1], 800)\n      // } else if (action === 'next') {\n      //   this.images[0] = await ImageService.getImageThumbnail(this.imageIds[this.imageIndex - 1], 800)\n      //   this.images[1] = !this.images[0] ? this.images[0] : await ImageService.getImageThumbnail(this.imageIds[this.imageIndex], 800)\n      //   this.images[2] = this.imageIndex < this.imageCount - 1 ? await ImageService.getImageThumbnail(this.imageIds[this.imageIndex + 1], 800) : ''\n      // } else {\n      //   this.images[0] = this.imageIndex > 0 ? await ImageService.getImageThumbnail(this.imageIds[this.imageIndex - 1], 800) : ''\n      //   this.images[1] = await ImageService.getImageThumbnail(this.imageIds[this.imageIndex], 800)\n      //   this.images[2] = this.imageIndex < this.imageCount - 1 ? await ImageService.getImageThumbnail(this.imageIds[this.imageIndex + 1], 800) : ''\n      // }\n      if (this.images[this.imageIndex] !== undefined) {\n        this.imageBase64 = this.images[this.imageIndex]\n      } else {\n        this.imageBase64 = await ImageService.getImageThumbnail(this.imageIds[this.imageIndex], 800)\n        this.images.splice(this.imageIndex, 1, this.imageBase64)\n      }\n      this.isLoading = false\n    },\n    previousImage() {\n      if (this.imageIndex > 0) {\n        this.imageIndex--\n        this.getImage('prev')\n      }\n    },\n    nextImage() {\n      if (this.imageIndex < this.imageCount - 1) {\n        this.imageIndex++\n        this.getImage('next')\n      }\n    },\n    notifyOrientation() {\n      const i = new Image()\n      const vm = this\n      i.onload = function () {\n        // console.log({ w: i.width, h: i.height })\n        const o = i.width > i.height ? ImageOrientationTypes.Landscape : ImageOrientationTypes.Portrait\n        vm.$emit('orientation', o)\n      }\n      i.src = this.images[this.imageIndex]\n    },\n    handleMouseOver(event) {\n      if (this.showMagnifier) {\n        let x = event.offsetX || layerX\n        let y = event.offsetY || layerY\n        this.handleImageAndMousePosition(event, x, y)\n      }\n    },\n    handleImageAndMousePosition(event, offsetX, offsetY) {\n      this.showZoom = true\n      // original image\n      let original = document.querySelector('#img-1')\n      // magnified image magnifier/container\n      let magnified = document.querySelector('#img-2')\n      // image inside of magnifier\n      let magnifiedImage = document.querySelector('#img-2-bg')\n\n      let style = magnified?.style\n\n      let imgStyle = magnifiedImage?.style\n\n      if (!style || !imgStyle) return\n\n      // setting background image on the fly\n      imgStyle.backgroundImage = 'url(' + original.src + ')'\n\n      // offsets when mouse moves over image and layers when clicked on image\n\n      let x = offsetX\n      let y = offsetY\n\n      let imgWidth = original.offsetWidth\n      let imgHeight = original.offsetHeight\n\n      let xperc = (x / imgWidth) * 100\n      let yperc = (y / imgHeight) * 100\n\n      //lets user scroll past right edge of image\n      if (x > 0.01 * imgWidth) xperc += 0.15 * xperc\n      //lets user scroll past bottom edge of image\n      if (y >= 0.01 * imgHeight) yperc += 0.15 * yperc\n\n      imgStyle.backgroundSize = imgWidth * 1.5 * this.zoom.scale + 'px ' + imgHeight * 1.5 * this.zoom.scale + 'px'\n\n      imgStyle.backgroundPositionX = xperc + '%'\n      imgStyle.backgroundPositionY = yperc + '%'\n      // position of the magnifying glass\n      let posY = 0\n      let posX = 0\n      //// when the magnified image tries to go beyond the viewport (x axis)\n      if (event.pageY + 300 > event.view.innerHeight) {\n        posY = event.view.innerHeight - 600\n      } else if (event.pageY - 300 < 0) posY = 0\n      else posY = event.pageY - 300\n\n      //// when the magnified image tries to go beyond the viewport (y axis)\n      if (event.pageX + 300 > event.view.innerWidth) {\n        posX = event.view.innerWidth - 600\n      } else if (event.pageX - 300 < 0) posX = 0\n      else posX = event.pageX - 300\n\n      style.left = posX + 'px'\n      style.top = posY + 'px'\n    },\n    async handleImageClick(event) {\n      if (!this.showMagnifier) {\n        this.showMagnifier = true\n        this.showZoom = true\n        // await 1 second before showing magnifier, will not work without this as the image is not mounted otherwise\n        await new Promise((resolve) => setTimeout(resolve, 10))\n        this.handleImageAndMousePosition(event, event.layerX, event.layerY)\n      } else {\n        this.showMagnifier = false\n        this.showZoom = false\n      }\n    },\n    onWheel(event) {\n      // delta Y is scroll up and down\n      // showZoom is true when mouse is over image\n      if (event.deltaY > 0 && this.showZoom) {\n        if (this.zoom.scale > 1.5) this.zoom.scale = this.zoom.scale - 0.5\n      } else if (event.deltaY < 0 && this.showZoom) {\n        if (this.zoom.scale < 5) this.zoom.scale = this.zoom.scale + 0.5\n      }\n\n      if (this.zoom.scale >= 5) this.zoom.zoom = false\n      if (this.zoom.scale <= 1.5) this.zoom.zoom = true\n    }\n  }\n}\n</script>\n\n<style>\n#img-zoomer-box {\n  height: auto;\n  position: relative;\n  margin: 10px auto;\n}\n\n#img-1 {\n  width: 100%;\n  height: auto;\n}\n\n#img-zoomer-box:hover,\n#img-zoomer-box:active {\n  display: block;\n  cursor: zoom-in;\n}\n\n#img-zoomer-box:hover #img-2,\n#img-zoomer-box:active #img-2 {\n  opacity: 1;\n}\n#img-2 {\n  width: 600px;\n  height: 600px;\n  box-shadow: 0 5px 10px -2px rgba(0, 0, 0, 0.3);\n  pointer-events: none;\n  position: fixed;\n  border: 4px solid whitesmoke;\n  z-index: 999;\n  border-radius: 100%;\n  opacity: 0;\n  display: block;\n  overflow: hidden !important;\n  transition: opacity 0.2s;\n}\n\n#img-2-bg {\n  width: 100%;\n  height: 100%;\n  overflow: hidden !important;\n  background-repeat: no-repeat;\n  background-position: 0 0;\n  border-radius: 100%;\n  /* transition: background-position 0.2s; */\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BulmaCarousel.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BulmaCarousel.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./BulmaCarousel.vue?vue&type=template&id=2a779f82\"\nimport script from \"./BulmaCarousel.vue?vue&type=script&lang=js\"\nexport * from \"./BulmaCarousel.vue?vue&type=script&lang=js\"\nimport style0 from \"./BulmaCarousel.vue?vue&type=style&index=0&id=2a779f82&prod&lang=css\"\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","import FqApi from '@/services/fq-api'\n\nexport default {\n  async getImageThumbnail(id, size) {\n    const url = `/quotes/images/thumbnail/${id}?size=${size}`\n    const result = await FqApi.get(url, { responseType: 'arraybuffer' })\n    const image = Buffer.from(result.data, 'binary').toString('base64')\n    return `data:${result.headers['content-type'].toLowerCase()};base64,${image}`\n  }\n}\n","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BulmaCarousel.vue?vue&type=style&index=0&id=2a779f82&prod&lang=css\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('base-modal-ex',{attrs:{\"id\":\"pdf-modal\",\"active\":_vm.isActive,\"animation-in\":_vm.animationIn,\"animation-out\":_vm.animationOut,\"animation-duration\":_vm.animationDuration,\"can-cancel\":true,\"min-width\":_vm.minWidth},on:{\"update:active\":[function($event){_vm.isActive=$event},function($event){return _vm.close()}]}},[_c('div',{staticClass:\"box\"},[_c('article',{staticClass:\"media\"},[_c('div',{staticClass:\"media-content\"},[_c('div',{staticClass:\"content\"},[(_vm.title)?_c('h4',{staticClass:\"title is-5\"},[_vm._v(_vm._s(_vm.title))]):_vm._e(),_c('bulma-carousel',{attrs:{\"image\":_vm.image,\"image-width\":_vm.imageWidth,\"image-height\":_vm.imageHeight,\"image-ids\":_vm.imageIds,\"start-index\":_vm.startIndex},on:{\"orientation\":_vm.setOrientation}})],1)])])])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <base-modal-ex\n    id=\"pdf-modal\"\n    :active.sync=\"isActive\"\n    :animation-in=\"animationIn\"\n    :animation-out=\"animationOut\"\n    :animation-duration=\"animationDuration\"\n    :can-cancel=\"true\"\n    :min-width=\"minWidth\"\n    @update:active=\"close()\">\n    <div class=\"box\">\n      <article class=\"media\">\n        <div class=\"media-content\">\n          <div class=\"content\">\n            <h4\n              v-if=\"title\"\n              class=\"title is-5\">{{ title }}</h4>\n            <bulma-carousel\n              :image=\"image\"\n              :image-width=\"imageWidth\"\n              :image-height=\"imageHeight\"\n              :image-ids=\"imageIds\"\n              :start-index=\"startIndex\"\n              @orientation=\"setOrientation\" />\n          </div>\n        </div>\n      </article>\n    </div>\n  </base-modal-ex>\n</template>\n\n<script>\nimport { BaseModalEx } from '@/components/BulmaModal'\nimport BulmaCarousel from './BulmaCarousel'\nimport { ImageOrientationTypes } from '@/enums'\n\nexport default {\n  name: 'BulmaCarouselModal',\n  components: {\n    BaseModalEx,\n    BulmaCarousel\n  },\n  props: {\n    title: {\n      type: String,\n      default: ''\n    },\n    closable: {\n      type: Boolean,\n      default: true\n    },\n    active: {\n      type: Boolean,\n      default: false\n    },\n    animationIn: {\n      type: String,\n      default: 'zoomIn'\n    },\n    animationOut: {\n      type: String,\n      default: 'zoomOut'\n    },\n    animationDuration: {\n      type: [String, Number],\n      default: 0.3\n    },\n    imageIds: {\n      type: Array,\n      default: () => {\n        return []\n      }\n    },\n    startIndex: {\n      type: Number,\n      default: 0\n    },\n    imageWidth: {\n      type: Number,\n      default: 800\n    },\n    imageHeight: {\n      type: Number,\n      default: 600\n    },\n    image: {\n      type: String,\n      default: ''\n    }\n  },\n  data() {\n    return {\n      isActive: this.active || false,\n      minWidth: 30\n    }\n  },\n  computed: {},\n  watch: {\n    active(value) {\n      this.isActive = value\n    }\n  },\n  created() {},\n  mounted() {},\n  methods: {\n    close() {\n      this.$emit('close')\n    },\n    previousImage() {\n      this.$emit('previousImage')\n    },\n    nextImage() {\n      this.$emit('nextImage')\n    },\n    setOrientation(value) {\n      this.minWidth = value === ImageOrientationTypes.Portrait ? 30 : 60\n    }\n  }\n}\n</script>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BulmaCarouselModal.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BulmaCarouselModal.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./BulmaCarouselModal.vue?vue&type=template&id=589416a5\"\nimport script from \"./BulmaCarouselModal.vue?vue&type=script&lang=js\"\nexport * from \"./BulmaCarouselModal.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","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./QuoteImagesBreakOut.vue?vue&type=style&index=0&id=a41e9af2&prod&scoped=true&lang=css\""],"sourceRoot":""}