{
  "version": 3,
  "sources": ["/cdn/shop/t/66/assets/video.js?cb=16427"],
  "sourcesContent": ["/* global YT, Vimeo */\n\nif (!customElements.get('video-component')) {\n  class Video extends HTMLElement {\n    constructor() {\n      super();\n      this.autoplay = this.dataset.autoplay === 'true';\n      this.background = this.dataset.background === 'true';\n      this.naturalWidth = this.dataset.naturalWidth === 'true';\n    }\n\n    connectedCallback() {\n      this.init();\n    }\n\n    init() {\n      const url = this.dataset.videoUrl;\n\n      if (url) {\n        if (url.includes('youtu.be') || url.includes('youtube.com')) {\n          if (url.includes('v=')) {\n            this.videoId = url.split('v=').pop().split('&')[0];\n          } else {\n            this.videoId = url.split('?')[0].split('/').pop();\n          }\n\n          this.type = 'youtube';\n          this.initYouTube();\n        } else if (url.includes('vimeo.com')) {\n          this.videoId = url.split('?')[0].split('/').pop();\n          this.type = 'vimeo';\n          this.initVimeo();\n        }\n      } else {\n        this.type = 'tag';\n        this.initVideoTag();\n      }\n\n      // Allow for videos which haven't played to play on tap\n      if (this.background) {\n        this.closest('.video-section').addEventListener('click', this.play.bind(this));\n      }\n    }\n\n    /**\n     * Loads a player API script.\n     * @param {string} src - Url of script to load.\n     */\n    loadScript(src) {\n      if (document.querySelector(`script[src=\"${src}\"]`)) return;\n\n      const s = document.createElement('script');\n      s.src = src;\n      s.onerror = (err) => console.warn(`Unable to load script ${src}`, err);  // eslint-disable-line\n\n      if (this.type === 'vimeo') {\n        s.onload = () => document.dispatchEvent(new CustomEvent('on:vimeo-api:loaded'));\n      } else if (this.type === 'youtube') {\n        window.onYouTubeIframeAPIReady = () => document.dispatchEvent(new CustomEvent('on:youtube-api:loaded'));\n      }\n\n      document.body.appendChild(s);\n    }\n\n    /**\n     * Initialises a YouTube video.\n     */\n    initYouTube() {\n      const initYTPlayer = () => {\n        YT.ready(() => {\n          this.player = new YT.Player(this.querySelector('div'), {\n            videoId: this.videoId,\n            width: '1280',\n            height: '720',\n            playerVars: {\n              controls: this.background ? 0 : 1,\n              disablekb: this.background ? 1 : 0,\n              iv_load_policy: 3,\n              modestbranding: 1,\n              playsinline: 1,\n              rel: 0\n            },\n            events: {\n              onReady: this.handleYTReady.bind(this),\n              onStateChange: this.handleYTStateChange.bind(this)\n            }\n          });\n        });\n      };\n\n      if (!window.YT) {\n        document.addEventListener('on:youtube-api:loaded', initYTPlayer.bind(this));\n        this.loadScript('//www.youtube.com/iframe_api');\n      } else {\n        initYTPlayer();\n      }\n    }\n\n    /**\n     * Initialises a Vimeo video.\n     */\n    initVimeo() {\n      const initVimeoPlayer = async () => {\n        this.player = new Vimeo.Player(this, {\n          id: this.videoId,\n          width: '1280',\n          height: '720',\n          autoplay: this.autoplay,\n          background: this.background,\n          keyboard: !this.background,\n          muted: this.autoplay\n        });\n\n        await this.player.ready();\n        this.setupIframe('js-vimeo');\n\n        this.player.on('pause', () => {\n          if (this.inViewport) this.pausedByUser = true;\n        });\n\n        this.player.on('play', () => {\n          this.closest('.video-section').classList.add('video-section--played');\n        });\n\n        this.play();\n      };\n\n      if (!window.Vimeo) {\n        document.addEventListener('on:vimeo-api:loaded', initVimeoPlayer.bind(this));\n        this.loadScript('//player.vimeo.com/api/player.js');\n      } else {\n        initVimeoPlayer();\n      }\n    }\n\n    /**\n     * Initialises a video tag.\n     */\n    initVideoTag() {\n      this.player = this.querySelector('video');\n\n      this.player.addEventListener('pause', () => {\n        if (this.inViewport) this.pausedByUser = true;\n      });\n\n      // If the video is already playing\n      if (this.player.currentTime > 0 && !this.player.paused && !this.player.ended\n        && this.player.readyState > 2) {\n        this.closest('.video-section').classList.add('video-section--played');\n      } else {\n        this.player.addEventListener('play', () => {\n          this.closest('.video-section').classList.add('video-section--played');\n        });\n\n        this.addObserver(this.player);\n\n        // Mute the video if a click didn't trigger its load\n        const deferredMedia = this.closest('deferred-media');\n        if (!deferredMedia || deferredMedia.loadTrigger !== 'click') {\n          this.player.muted = true;\n        }\n\n        this.play();\n      }\n    }\n\n    /**\n     * Handles a YouTube ready event.\n     */\n    handleYTReady() {\n      this.setupIframe('js-youtube');\n\n      if (this.autoplay) this.player.mute();\n      this.play();\n    }\n\n    /**\n     * Handles a YouTube state change event.\n     * @param {object} e - Event object.\n     */\n    handleYTStateChange(e) {\n      if (e.data === YT.PlayerState.PAUSED) {\n        if (this.inViewport) this.pausedByUser = true;\n      } else if (e.data === YT.PlayerState.ENDED) {\n        // Looping this way rather than 'loop' API parameter to avoid flash of black background\n        if (this.background) this.player.playVideo();\n      } else if (e.data === YT.PlayerState.PLAYING) {\n        this.closest('.video-section').classList.add('video-section--played');\n      }\n    }\n\n    /**\n     * Sets up the injected iframe.\n     * @param {string} jsClass - Class name to add to the iframe.\n     */\n    setupIframe(jsClass) {\n      // Enable iframe to cover entire container height.\n      if (this.autoplay && !this.naturalWidth) {\n        this.style.width = `${this.clientHeight * 1.7778}px`;\n\n        window.addEventListener('resize', window.debounce(() => {\n          this.style.width = `${this.clientHeight * 1.7778}px`;\n        }, 200));\n      }\n\n      this.iframe = this.querySelector('iframe');\n      this.iframe.title = this.dataset.description;\n      this.iframe.classList.add(jsClass);\n      this.addObserver(this.iframe);\n    }\n\n    /**\n     * Plays the video when scrolled into view (if not paused by the user).\n     */\n    play() {\n      if (!this.player || this.pausedByUser) return;\n\n      if (this.type === 'youtube') {\n        this.player.playVideo();\n      } else {\n        this.player.play();\n      }\n    }\n\n    /**\n     * Pauses the video when scrolled out of view (if playing).\n     */\n    pause() {\n      if (!this.player) return;\n\n      if (this.type === 'youtube') {\n        if (this.player.getPlayerState() !== 2) {\n          this.player.pauseVideo();\n          this.pausedByUser = false;\n        }\n      } else if (this.type === 'vimeo') {\n        this.player.getPaused().then((paused) => {\n          if (!paused) {\n            this.player.pause();\n            this.pausedByUser = false;\n          }\n        });\n      } else if (!this.player.paused) {\n        this.player.pause();\n        this.pausedByUser = false;\n      }\n    }\n\n    /**\n     * Adds an observer to pause the video when not in the viewport.\n     * @param {Element} el - Element to observe.\n     */\n    addObserver(el) {\n      if ('IntersectionObserver' in window === false) return;\n\n      const observer = new IntersectionObserver((entries) => {\n        entries.forEach((entry) => {\n          if (entry.isIntersecting) {\n            this.inViewport = true;\n            this.play();\n          } else {\n            this.inViewport = false;\n            this.pause();\n          }\n        }, { rootMargin: '0px 0px 200px 0px' });\n      });\n\n      observer.observe(el);\n    }\n  }\n\n  customElements.define('video-component', Video);\n}\n"],
  "mappings": "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",
  "names": []
}
