{"version":3,"file":"ShowRoom.5IoJuUzf.js","sources":["../../../../../../packages/ui/models/googleMapMarkerModel.ts","../../../../../../packages/shared/images/misc/pin-filled.svg?url","../../../../views/showroom/ShowRoom.vue"],"sourcesContent":["import type { FunctionalComponent } from 'vue';\nimport type { Coordinates } from '@mop/ui/types/googleMap';\n\nexport function googleMapMarkerModel(responseData: any) {\n  return {\n    getId(): string {\n      return responseData?.id;\n    },\n\n    getTitle(): string {\n      return responseData?.title || '';\n    },\n\n    getCountry(): string {\n      return responseData?.country;\n    },\n\n    getCoordinates(): Coordinates {\n      return responseData?.geoLocation;\n    },\n\n    getIcon(): FunctionalComponent {\n      return responseData.icon ?? '';\n    },\n\n    getSelectedIcon(): string {\n      return responseData.selectedIcon ?? responseData.icon;\n    },\n\n    getPopupContent(): string {\n      return responseData.popupContent ?? '';\n    },\n\n    getOrigin(): unknown {\n      return responseData.originModel;\n    },\n  };\n}\n","export default \"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2017%2019'%3e%3cpath%20d='M8.5.87a6.55%206.55%200%200%200-6.62%206.61c0%203.9%206%2010.03%206.26%2010.3l.36.35.36-.36c.25-.26%206.26-6.38%206.26-10.29A6.55%206.55%200%200%200%208.5.87z'%20fill='%23383e44'/%3e%3ccircle%20cx='8.5'%20cy='7.48'%20r='1.79'%20fill='%23fff'/%3e%3c/svg%3e\"","<script setup lang=\"ts\">\nimport type { GoogleMapMarkerModel } from '@mop/ui/types/googleMap';\nimport { googleMapMarkerModel } from '@mop/ui/models/googleMapMarkerModel';\nimport pinFilled from '@mop/shared/images/misc/pin-filled.svg?url';\n\ntype ShowRoom = {\n  _uid: string;\n  title: string;\n  longitude: string;\n  latitude: string;\n  streetAndNumber?: string;\n  zipAndCity?: string;\n  phone?: string;\n  contactPerson?: string;\n  email?: string;\n  image?: {\n    filename?: string;\n  };\n};\n\ndefineOptions({\n  name: 'ShowRoom',\n});\n\nconst { $gtm, $storyblokLivePreview } = useNuxtApp();\nconst { getCmsStory, trackPageView, cmsStoryModelRef, loadingRef: loadingCms } = useMopCms();\nconst { initTransition } = useMopPageTransitionClient();\nconst { handleHeadForCmsPage } = useMopSeo();\nconst classNameRef = ref(['']);\ninitTransition(classNameRef, loadingCms);\nconst showRoomMarkersRef = ref<GoogleMapMarkerModel[]>([]);\nconst mapLoadedRef = ref(false);\nconst selectedMarkerRef = ref('');\nconst googleApiKey = useRuntimeConfig().public.GOOGLE_API_KEY;\n\nuseAsyncData(async () => {\n  await getCmsStory('/company/facts-figures');\n  trackPageView('Showroom');\n});\n\nwatch(\n  [mapLoadedRef, () => loadingCms.value.loading],\n  () => {\n    if (mapLoadedRef.value && !loadingCms.value.loading) {\n      showRoomMarkersRef.value = cmsStoryModelRef.value.getAttribute('showrooms').map(mapShowroomToMarker);\n    }\n  },\n  { immediate: true },\n);\n\nfunction mapShowroomToMarker(showRoom: ShowRoom) {\n  return googleMapMarkerModel({\n    id: showRoom._uid,\n    title: showRoom.title,\n    icon: pinFilled,\n    geoLocation: {\n      longitude: Number(showRoom.longitude),\n      latitude: Number(showRoom.latitude),\n    },\n    popupContent: getPopupContent(showRoom),\n    country: showRoom.zipAndCity,\n  });\n}\n\nfunction getPopupContent(showRoom: ShowRoom) {\n  const infoParts: string[] = [];\n  const image: string = showRoom?.image?.filename\n    ? `\n          <div class=\"showroom-popup__img-wrap\">\n            <img class=\"showroom-popup__img\" src=\"${showRoom.image.filename}\" />\n          </div>`\n    : '';\n  if (showRoom.title) {\n    infoParts.push(`<div class=\"showroom-popup__headline\">${showRoom.title}</div>`);\n  }\n  if (showRoom.streetAndNumber) {\n    infoParts.push(`<p>${showRoom.streetAndNumber}</p>`);\n  }\n  if (showRoom.zipAndCity) {\n    infoParts.push(`<p class=\"showroom-popup__country\">${showRoom.zipAndCity}</p>`);\n  }\n  if (showRoom.email && showRoom.contactPerson) {\n    infoParts.push(\n      `<p><a class=\"showroom-popup__email\" href=\"mailto:${showRoom.email}\">${showRoom.contactPerson}</a></p>`,\n    );\n  }\n  if (showRoom.phone) {\n    infoParts.push(`<p><a class=\"showroom-popup__phone\" href=\"tel:${showRoom.phone}\">${showRoom.phone}</a></p>`);\n  }\n\n  return `\n        <div class=\"showroom-popup\">\n          <div class=\"showroom-popup__info\">\n            ${infoParts.join(' ')}\n          </div>\n          ${image}\n        </div>\n      `;\n}\n\nfunction handleMapLoaded() {\n  mapLoadedRef.value = true;\n}\n\nfunction handleMarkerSelect(mopMarker: GoogleMapMarkerModel) {\n  selectedMarkerRef.value = mopMarker.getId();\n  $gtm.trackEvent({\n    eventName: 'showroom_locater',\n    parameters: ['click', mopMarker.getTitle(), mopMarker.getCountry()],\n  });\n}\n\n$storyblokLivePreview.initStoryListener('Storyblok', cmsStoryModelRef);\n\nconst seoHeadRef = computed(() => {\n  if (!cmsStoryModelRef.value.isInitialized() || cmsStoryModelRef.value.hasError()) {\n    return {};\n  }\n  return handleHeadForCmsPage(cmsStoryModelRef.value);\n});\n\nuseHead(seoHeadRef);\n</script>\n\n<template>\n  <div :class=\"['showroom', 'transition', ...classNameRef]\">\n    <MopCmsContentElementsSlot\n      id=\"showroom__content\"\n      class=\"showroom__content\"\n      :elements=\"cmsStoryModelRef.getContentElements('body')\"\n    />\n\n    <div class=\"showroom__map-wrapper\">\n      <UiGoogleMap\n        :api-key=\"googleApiKey\"\n        :region=\"$mopI18n.lang\"\n        :language=\"$mopI18n.lang\"\n        :markers=\"showRoomMarkersRef\"\n        :selected-marker-id=\"selectedMarkerRef\"\n        force-render\n        class=\"showroom__map\"\n        @map-initialized=\"handleMapLoaded\"\n        @select-marker=\"handleMarkerSelect\"\n      />\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.showroom__map-wrapper {\n  display: flex;\n  justify-content: center;\n  padding: 0 $global-padding;\n}\n\n.showroom__map {\n  height: 660px;\n  max-width: 1000px;\n  width: 100%;\n}\n</style>\n"],"names":["googleMapMarkerModel","responseData","pinFilled","$gtm","$storyblokLivePreview","useNuxtApp","getCmsStory","trackPageView","cmsStoryModelRef","loadingCms","useMopCms","initTransition","useMopPageTransitionClient","handleHeadForCmsPage","useMopSeo","classNameRef","ref","showRoomMarkersRef","mapLoadedRef","selectedMarkerRef","googleApiKey","useRuntimeConfig","useAsyncData","watch","mapShowroomToMarker","showRoom","getPopupContent","infoParts","image","_a","handleMapLoaded","handleMarkerSelect","mopMarker","seoHeadRef","computed","useHead"],"mappings":"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"}