{"version":3,"sources":["webpack:///./app/javascript/application/javascript/places-map/BaseMap.vue?bb81","webpack:///app/javascript/application/javascript/places-map/BaseMap.vue","webpack:///./app/javascript/application/javascript/places-map/BaseMap.vue?7df8","webpack:///./app/javascript/application/javascript/places-map/BaseMap.vue","webpack:///./app/javascript/application/javascript/places-map/CemeteriesMap.vue?4e83","webpack:///./app/javascript/application/javascript/places-map/CemeteriesMap.vue?5a9f","webpack:///app/javascript/application/javascript/places-map/CemeteriesMap.vue","webpack:///./app/javascript/application/javascript/places-map/CemeteriesMap.vue"],"names":["component","_vm","this","_h","$createElement","_c","_self","staticClass","_t","filteredPlaces","isVisible","isActive","handleClick","filters","setFilter","activeFiltersCount","_v","ref","_b","attrs","filter","infoWindowContent","scopedSlots","_u","key","fn","scope","$props"],"mappings":"2FAAA,I,01BCkBA,gCClBmN,EDsBnN,CACA,OACA,yCACA,uCACA,mCACA,+EAGA,KARA,WASA,OACA,iBACA,4BACA,0BACA,kBAIA,UACA,eADA,WACA,WACA,6BAEA,gEAFA,aAKA,mBAPA,WAOA,WACA,yCACA,4CACA,IAIA,iBAdA,WAeA,mCAIA,QApCA,WAoCA,I,EAAA,c,EAAA,wGACC,OAAD,IAAC,CACD,uFAFA,OAKA,0DAEA,mEAEA,mCACA,qCAEA,0BACA,UACA,uBACA,UAKA,OAFA,6DAEA,4BAGA,oBAvBA,0C,kLA0BA,SACA,UADA,SACA,GACA,gEAGA,SALA,SAKA,GACA,iDAGA,YATA,SASA,GACA,iEAEA,iCACA,GACA,UAGA,qBACA,2DACA,UAGA,yBACA,oBAGA,kBA1BA,WA0BA,WACA,iCACA,qBACA,8BAGA,sBAEA,6BACA,IACA,2BACA,mBACA,gBACA,UACA,sBAMA,UA9CA,SA8CA,KACA,4BAEA,qBACA,wBAGA,cArDA,WAqDA,WACA,iCACA,gDACA,uBAIA,gBA5DA,WA6DA,mCAEA,mCAEA,+FAEA,2BAGA,YAtEA,WAuEA,uBACA,sD,OErJIA,EAAY,YACd,GHRW,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,qDAAqD,CAACN,EAAIO,GAAG,UAAU,KAAK,CAAC,OAASP,EAAIQ,eAAe,UAAYR,EAAIS,UAAU,SAAWT,EAAIU,SAAS,QAAUV,EAAIW,YAAY,QAAUX,EAAIY,QAAQ,UAAYZ,EAAIa,UAAU,mBAAqBb,EAAIc,qBAAqBd,EAAIe,GAAG,KAAKX,EAAG,MAAM,CAACY,IAAI,MAAMV,YAAY,gCAAgC,CAACN,EAAIe,GAAG,UAAU,KACjd,IGUpB,EACA,KACA,KACA,MAIa,IAAAhB,E,iDClBf,ICAyN,ECYzN,CACA,oB,OAAA,GAEA,OACA,yCACA,uCAGA,SACA,OADA,WACA,6BACA,6BACA,qBAEA,aAGA,kBARA,SAQA,GACA,uGAEA,OAFA,qCAGA,gBAHA,gKAKA,QALA,kE,OCtBIA,EAAY,YACd,GHRW,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAuC,OAAjBH,EAAIK,MAAMD,IAAIF,GAAa,UAAUF,EAAIiB,GAAG,CAACC,MAAM,CAAC,OAASlB,EAAImB,OAAO,kBAAoBnB,EAAIoB,mBAAmBC,YAAYrB,EAAIsB,GAAG,CAAC,CAACC,IAAI,UAAUC,GAAG,SAASC,GAAO,MAAO,CAACzB,EAAIO,GAAG,UAAU,KAAK,KAAKkB,OAAW,MAAK,IAAO,UAAUzB,EAAI0B,QAAO,MAC1S,IGUpB,EACA,KACA,KACA,MAIa,UAAA3B,E","file":"js/13-6bf554b27b09f7056961.chunk.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"flex flex-col md:flex-row md:h-screen map-wrapper\"},[_vm._t(\"default\",null,{\"places\":_vm.filteredPlaces,\"isVisible\":_vm.isVisible,\"isActive\":_vm.isActive,\"onClick\":_vm.handleClick,\"filters\":_vm.filters,\"setFilter\":_vm.setFilter,\"activeFiltersCount\":_vm.activeFiltersCount}),_vm._v(\" \"),_c('div',{ref:\"map\",staticClass:\"flex-auto h-screen md:h-auto\"},[_vm._v(\"Map\")])],2)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"flex flex-col md:flex-row md:h-screen map-wrapper\">\n    <slot\n      :places=\"filteredPlaces\"\n      :isVisible=\"isVisible\"\n      :isActive=\"isActive\"\n      :onClick=\"handleClick\"\n      :filters=\"filters\"\n      :setFilter=\"setFilter\"\n      :activeFiltersCount=\"activeFiltersCount\"\n    />\n\n    <div ref=\"map\" class=\"flex-auto h-screen md:h-auto\">Map</div>\n  </div>\n</template>\n\n<script>\nimport { loadScript } from '@common/dom/load-script';\nconst VIENNA = { lat: 48.2091, lng: 16.3768 };\n\nimport pin from '../../images/icons/pin-purple.svg';\n\nexport default {\n  props: {\n    initialFilters: { required: true, type: Object },\n    initialPlaces: { required: true, type: Array },\n    filter: { required: true, type: Function },\n    infoWindowContent: { required: false, type: Function, default: () => null }\n  },\n\n  data() {\n    return {\n      activePlace: null,\n      filters: this.initialFilters,\n      places: this.initialPlaces,\n      infoWindow: null\n    };\n  },\n\n  computed: {\n    filteredPlaces() {\n      if (!this.hasActiveFilters) return this.places;\n\n      return this.places.filter((place) => this.filter(this.filters, place));\n    },\n\n    activeFiltersCount() {\n      return Object.keys(this.filters).reduce(\n        (memo, key) => memo + (!!this.filters[key] ? 1 : 0),\n        0\n      );\n    },\n\n    hasActiveFilters() {\n      return this.activeFiltersCount > 0;\n    }\n  },\n\n  async mounted() {\n    await loadScript(\n      'https://maps.googleapis.com/maps/api/js?key=AIzaSyCy1L-fWWpXPEApYFL1UL4luCcRAe0lB2Y'\n    );\n\n    this.map = new google.maps.Map(this.$refs.map, { zoom: 12, center: VIENNA });\n    // Create an info window without content. It will be reused when a pin is clicked\n    this.infoWindow = new google.maps.InfoWindow({ content: '', maxWidth: 200 });\n\n    this.places = this.places.map((place) => {\n      let { id, title, lat, lng } = place;\n\n      let marker = new google.maps.Marker({\n        map: this.map,\n        position: { lat, lng },\n        title\n      });\n\n      marker.addListener('click', () => this.handleClick(id));\n\n      return { ...place, marker };\n    });\n\n    this.fitMapToMarkers();\n  },\n\n  methods: {\n    isVisible(placeId) {\n      return this.filteredPlaces.find(({ id }) => id == placeId);\n    },\n\n    isActive(placeId) {\n      return this.activePlace && this.activePlace.id == placeId;\n    },\n\n    handleClick(placeId) {\n      this.activePlace = this.places.find(({ id }) => id == placeId);\n\n      let activePlaceButton = document.getElementById(placeId);\n      if (activePlaceButton) {\n        activePlaceButton.focus();\n      }\n\n      this.map.setOptions({\n        center: { lat: this.activePlace.lat, lng: this.activePlace.lng },\n        zoom: 16\n      });\n\n      this.togglePlaceMarker();\n      this.scrollToMap();\n    },\n\n    togglePlaceMarker() {\n      this.places.forEach((place) => {\n        if (!this.isActive(place.id)) {\n          return place.marker.setIcon(null);\n        }\n\n        place.marker.setIcon(pin);\n\n        const infoContent = this.infoWindowContent(place);\n        if (infoContent) {\n          this.infoWindow.setContent(infoContent);\n          this.infoWindow.open({\n            anchor: place.marker,\n            map: this.map,\n            shouldFocus: false\n          });\n        }\n      });\n    },\n\n    setFilter(name, value) {\n      this.$set(this.filters, name, value);\n\n      this.toggleMarkers();\n      this.fitMapToMarkers();\n    },\n\n    toggleMarkers() {\n      this.places.forEach((place) => {\n        let map = this.filteredPlaces.indexOf(place) > -1 ? this.map : null;\n        place.marker.setMap(map);\n      });\n    },\n\n    fitMapToMarkers() {\n      if (this.filteredPlaces.length === 0) return;\n\n      let bounds = new google.maps.LatLngBounds();\n\n      this.filteredPlaces.forEach(({ lat, lng }) => bounds.extend({ lat, lng }));\n\n      this.map.fitBounds(bounds, 48);\n    },\n\n    scrollToMap() {\n      if (window.innerWidth < 769) {\n        this.$refs.map.scrollIntoView({ behavior: 'smooth' });\n      }\n    }\n  }\n};\n</script>\n","import mod from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BaseMap.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BaseMap.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./BaseMap.vue?vue&type=template&id=1fdc2ff6&\"\nimport script from \"./BaseMap.vue?vue&type=script&lang=js&\"\nexport * from \"./BaseMap.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","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('BaseMap',_vm._b({attrs:{\"filter\":_vm.filter,\"infoWindowContent\":_vm.infoWindowContent},scopedSlots:_vm._u([{key:\"default\",fn:function(scope){return [_vm._t(\"default\",null,null,scope)]}}],null,true)},'BaseMap',_vm.$props,false))}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import mod from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./CemeteriesMap.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./CemeteriesMap.vue?vue&type=script&lang=js&\"","<template>\n  <BaseMap v-bind=\"$props\" :filter=\"filter\" :infoWindowContent=\"infoWindowContent\">\n    <!-- Proxy pass the slot to the base map -->\n    <template v-slot=\"scope\">\n      <slot v-bind=\"scope\" />\n    </template>\n  </BaseMap>\n</template>\n\n<script>\nimport BaseMap from './BaseMap.vue';\n\nexport default {\n  components: { BaseMap },\n\n  props: {\n    initialFilters: { required: true, type: Object },\n    initialPlaces: { required: true, typ: Array }\n  },\n\n  methods: {\n    filter({ area, category }, place) {\n      const matchArea = !area || place.cemetery_area_id === area;\n      const matchCategory = !category || place.category === category;\n\n      return matchArea && matchCategory;\n    },\n\n    infoWindowContent(place) {\n      return `\n        <div id=\"map-pop-up-content\" class=\"pl-1\">\n          <a class=\"group\" href=\"${place.link}\">\n            <img src=\"${place.thumbnail_url}\" class=\"w-full h-full\" />\n            <h5 class=\"font-bold text-sm text-blue p-1 border border-light-indigo group-hover:underline\">\n              ${place.title}\n            </h5>\n          </a>\n        </div>\n      `;\n    }\n  }\n};\n</script>\n","import { render, staticRenderFns } from \"./CemeteriesMap.vue?vue&type=template&id=7d329900&\"\nimport script from \"./CemeteriesMap.vue?vue&type=script&lang=js&\"\nexport * from \"./CemeteriesMap.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":""}