{"file":"vds-lightbox.entry.js","mappings":"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","names":[],"sources":["src/components/vds-lightbox/vds-lightbox.scss?tag=vds-lightbox","src/components/vds-lightbox/vds-lightbox.tsx"],"sourcesContent":[":host {\r\n  display: inherit;\r\n}\r\n\r\niframe {\r\n  aspect-ratio: 16 / 9;\r\n  width: 100%;\r\n}\r\n","import { Component, ComponentInterface, Element, h, Host, Listen, Prop, State } from '@stencil/core';\r\nimport { addEventListener, removeEventListener } from '../../utils/helpers';\r\n\r\ninterface IMediaElement {\r\n  src: string;\r\n  caption?: string;\r\n  copyright?: string;\r\n  nodeguid?: string;\r\n  download?: string;\r\n  type: 'image' | 'video' | 'iframe';\r\n}\r\n\r\n@Component({\r\n  tag: 'vds-lightbox',\r\n  styleUrl: 'vds-lightbox.scss',\r\n  shadow: false,\r\n})\r\nexport class VdsLightbox implements ComponentInterface {\r\n\r\n  private desktopMediaQuery = `(min-width: ${getComputedStyle(document.documentElement).getPropertyValue('--vt-breakpoint-md').trim()})`;\r\n  private anchorElements: HTMLAnchorElement[] = [];\r\n  private modalElement?: HTMLVdsModalElement;\r\n  private contentSlides?: HTMLVdsSlidesElement;\r\n  private mediaSlides?: HTMLVdsSlidesElement;\r\n  private videoElements: HTMLVideoElement[] = [];\r\n  private iframeElements: HTMLIFrameElement[] = [];\r\n\r\n  /**\r\n   * Gets access to the host element within the class instance\r\n   */\r\n  @Element() el!: HTMLElement;\r\n\r\n  /**\r\n   * Sets the open state of the lightbox modal\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) open = false;\r\n\r\n  /**\r\n   * Label of the download link\r\n   */\r\n  @Prop() downloadLabel?: string;\r\n\r\n  /**\r\n   * Label of the press-binder link\r\n   */\r\n  @Prop() pressBinderLabel?: string;\r\n\r\n  /**\r\n   * Path to Lottie Animation for Press-Binder\r\n   */\r\n  @Prop() pressBinderAnimation: string;\r\n\r\n  /**\r\n   * The element within the scope of this component where\r\n   * anchor elements are searched\r\n   */\r\n  @Prop() target: string = \":scope a:not([target=_blank]):not([download])\";\r\n\r\n  /**\r\n   * Sets the visibility of press-binder buttons\r\n   */\r\n  @Prop() showPressBinder: boolean = false;\r\n\r\n  /**\r\n   * Sets visibility of download button\r\n   */\r\n  @Prop() showDownload: boolean = false;\r\n\r\n  /**\r\n   * Desktop Media-Query State\r\n   * is true when viewport matches desktop media-query\r\n   */\r\n  @State() isDesktop = window.matchMedia(this.desktopMediaQuery).matches;\r\n\r\n  @Listen('resize', { target: 'window' })\r\n  handleResize() {\r\n    this.isDesktop = window.matchMedia(this.desktopMediaQuery).matches;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <slot></slot>\r\n        { this.renderModal() }\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  async connectedCallback(): Promise<void> {\r\n    const anchorElements = await this.getAnchorElements();\r\n    anchorElements.forEach(x => addEventListener(x, 'click', (e) => this.handleAnchorElementClick(e, x)));\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.anchorElements.forEach(x => removeEventListener(x, 'click', (e) => this.handleAnchorElementClick(e, x)));\r\n  }\r\n\r\n  async componentDidRender(): Promise<void> {\r\n    this.setupUIKitLightbox();\r\n\r\n    if (this.mediaSlides && this.contentSlides) {\r\n      await this.contentSlides.lockSwipes(true);\r\n      addEventListener(this.mediaSlides, 'vdsSlideDidChange', () => this.onSlideDidChange(this.mediaSlides));\r\n    }\r\n  }\r\n\r\n  componentDidUpdate(): void {\r\n    if (!this.isDesktop) {\r\n      this.modalElement.closeModal();\r\n    }\r\n  }\r\n\r\n  private getAnchorElements(): Promise<HTMLAnchorElement[]> {\r\n    return new Promise((resolve) => {\r\n      const anchorElements = this.anchorElements = Array.from(this.el.querySelectorAll(this.target));\r\n      resolve(anchorElements);\r\n    });\r\n  }\r\n\r\n  private async handleAnchorElementClick(event: Event, element: HTMLAnchorElement): Promise<void> {\r\n    if (this.isDesktop) {\r\n      event.preventDefault();\r\n      const index = this.anchorElements.findIndex(e => e == element);\r\n      const activeIndex = index > -1 ? index : 0;\r\n      await this.mediaSlides.slideTo(activeIndex, 0);\r\n      await this.contentSlides.slideTo(activeIndex, 0);\r\n      await this.modalElement.openModal();\r\n    }\r\n  }\r\n\r\n  private handleDownloadAnchorElementClick(element: IMediaElement): void {\r\n    const fakeAnchor = document.createElement('a');\r\n    fakeAnchor.href = element.download;\r\n    fakeAnchor.target = '_blank';\r\n    fakeAnchor.click();\r\n  }\r\n\r\n  private getContentType(source: string): 'image' | 'video' | 'iframe' {\r\n    const imageFileTypes = ['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg', 'tiff', 'bmp', 'ico'];\r\n    const videoFileTypes = ['mov', 'mp4', 'avi', 'flv', 'mkv', 'wmv'];\r\n    if (imageFileTypes.some(x => source.endsWith(x))) return 'image';\r\n    else if (videoFileTypes.some(x => source.endsWith(x)) || source.match(\"canto.de\")) return 'video';\r\n    else return 'iframe';\r\n  }\r\n\r\n  private createMediaElements(elements: HTMLAnchorElement[]): IMediaElement[] {\r\n    return elements.map((x): IMediaElement => {\r\n      return {\r\n        src: x.href,\r\n        caption: x.dataset.caption,\r\n        copyright: x.dataset.copyright,\r\n        nodeguid: x.dataset.nodeguid,\r\n        download: x.dataset.download,\r\n        type: this.getContentType(x.href)\r\n      }\r\n    });\r\n  }\r\n\r\n  private renderModal(): string {\r\n    const mediaElements = this.createMediaElements(this.anchorElements);\r\n\r\n    return (\r\n      <vds-modal ref={(el) => (this.modalElement = el)}\r\n                 onVdsModalShown={() => this.open = true}\r\n                 onVdsModalHidden={() => this.closeLightbox()}\r\n                 lightbox\r\n                 footer>\r\n\r\n        <div slot=\"body\" class=\"overflow-x-clip w-full rounded-[5px]\">\r\n          <vds-slides ref={(el) => (this.mediaSlides = el)} navigation={mediaElements.length > 1} options={{ spaceBetween: 20, rewind: true, effect: 'slide'}}>\r\n            { mediaElements.map((element) =>\r\n              <vds-slide>\r\n                { element.type === \"image\" && this.renderImage(element) }\r\n                { element.type == \"video\" &&  this.renderVideo(element) }\r\n                { element.type == \"iframe\" &&  this.renderIframe(element) }\r\n              </vds-slide>\r\n            )}\r\n          </vds-slides>\r\n        </div>\r\n\r\n        <div slot=\"footer\" class=\"overflow-hidden\">\r\n          <vds-slides ref={(el) => (this.contentSlides = el)} options={{allowTouchMove: false, effect: 'fade', rewind: true}}>\r\n            { mediaElements.map((element) => this.renderFooterElement(element))}\r\n          </vds-slides>\r\n        </div>\r\n\r\n      </vds-modal>\r\n    )\r\n  }\r\n\r\n  private async onSlideDidChange(slides: HTMLVdsSlidesElement): Promise<void> {\r\n    slides.stopVideos();\r\n    const index = await slides.getActiveIndex();\r\n    await this.contentSlides.slideTo(index);\r\n  }\r\n\r\n  private setupUIKitLightbox(): void {\r\n    const UIkit: any = window['UIkit'];\r\n    if (UIkit) {\r\n      if (this.isDesktop) {\r\n        UIkit.lightbox(this.el).$destroy();\r\n      }\r\n      else {\r\n        UIkit.lightbox(this.el);\r\n      }\r\n    }\r\n  }\r\n\r\n  private renderFooterElement(element: IMediaElement): string {\r\n    return (\r\n      <vds-slide>\r\n        <div class=\"grid grid-cols-2 gap-10 w-full h-full bg-white\">\r\n          <div class=\"col-span-1 text-grey-light text-sm\">\r\n            <span class=\"block\">{element.caption}</span>\r\n            <span class=\"block\">{element.copyright}</span>\r\n          </div>\r\n          <div class=\"col-span-1 flex justify-end\">\r\n            { (this.showDownload && element.download) && this.renderDownloadLink(element) }\r\n            { (this.showPressBinder && element.nodeguid) && this.renderAddToPressBinderLink(element) }\r\n          </div>\r\n        </div>\r\n      </vds-slide>\r\n    );\r\n  }\r\n\r\n  private renderDownloadLink(element: IMediaElement): string {\r\n    return (\r\n      <div class=\"flex mr-5 items-start\">\r\n        <vds-icon-link\r\n          href={element.download}\r\n          label={this.downloadLabel}\r\n          icon-color=\"berry\"\r\n          font-size=\"18px\"\r\n          lineHeight=\"30px\"\r\n          label-color=\"grey\"\r\n          tablet-growth=\"false\"\r\n          download={true}\r\n          last={true}\r\n          onClick={() => this.handleDownloadAnchorElementClick(element)}>\r\n          <svg slot=\"icon-start\" xmlns=\"http://www.w3.org/2000/svg\" data-name=\"2px_Line_Icons\" viewBox=\"44.05 44 39.95 40\" width=\"28\">\r\n            <path d=\"M83,70v5c0,2.25-.3,4.22-2,6s-3.7,2-5.95,2c-2,0-20.05,0-22,0-2.25,0-4.26-.31-6-2s-2-3.71-2-6V70\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2px\"></path>\r\n            <path d=\"M73,66l-7,7a2.54,2.54,0,0,1-4,0l-7-7\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2px\"></path>\r\n            <path d=\"M64 67 64 45\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2px\"></path>\r\n          </svg>\r\n        </vds-icon-link>\r\n      </div>\r\n    )\r\n  }\r\n\r\n  private renderAddToPressBinderLink(element: IMediaElement): string {\r\n    return (\r\n      <div class=\"flex items-start\">\r\n        <vds-add-to-press-binder class=\"-mt-1\"\r\n                                 nodeguid={element.nodeguid}\r\n                                 label={this.pressBinderLabel}\r\n                                 animation={this.pressBinderAnimation}></vds-add-to-press-binder>\r\n      </div>\r\n    )\r\n  }\r\n\r\n  private renderImage(element: IMediaElement): string {\r\n    return (\r\n      <div class=\"w-full aspect-video\">\r\n        <img class=\"rounded object-contain h-full\" src={element.src} width=\"1920\" height=\"1080\" alt={element.caption} />\r\n      </div>\r\n    )\r\n  }\r\n\r\n  private renderVideo(element: IMediaElement): string {\r\n    return (\r\n      <video ref={(nativeElement) => this.videoElements.push(nativeElement)}\r\n             class=\"w-full rounded aspect-video\"\r\n             width=\"1920\"\r\n             height=\"1080\"\r\n             preload=\"metadata\"\r\n             controls>\r\n            <source src={element.src} type=\"video/mp4\" />\r\n        </video>\r\n    )\r\n  }\r\n\r\n  private renderIframe(element: IMediaElement): string {\r\n    return (\r\n      <iframe ref={(nativeElement) => this.iframeElements.push(nativeElement)}\r\n              class=\"w-full aspect-video rounded\"\r\n              src={element.src}\r\n              title={element.caption}\r\n              frameborder=\"0\"\r\n              allowFullScreen></iframe>\r\n    )\r\n  }\r\n\r\n  private closeLightbox(): void {\r\n    this.mediaSlides.stopVideos();\r\n    this.open = false;\r\n  }\r\n\r\n}\r\n"],"version":3}