{"version":3,"sources":["components/Player/UI/Duration.tsx","components/Player/UI/styles.ts","components/Player/UI/defaultProps.ts","components/Player/UI/data.ts","components/Player/UI/index.tsx","components/Player/AudioPlaceholder/styles.ts","components/Player/AudioPlaceholder/index.tsx","components/Player/Unmute/styles.js","components/Player/Unmute/index.js","components/Player/styles.ts","utils/is-facebook-provider.ts","utils/is-youtube-provider.ts","components/Player/data.ts","components/Player/defaultProps.ts","components/Player/index.tsx","global-styles.ts","utils/is-object.ts","utils/deep-equal.ts","App.tsx","index.tsx","reportWebVitals.ts"],"names":["format","seconds","date","Date","hh","getUTCHours","mm","getUTCMinutes","ss","pad","getUTCSeconds","concat","string","slice","Duration","_ref","_jsx","dateTime","Math","round","children","memo","Wrapper","styled","div","_templateObject","_taggedTemplateLiteral","props","isMp3","isPaused","isActive","Controls","PlayPauseButton","_templateObject2","playing","_templateObject3","PlayButton","a","_templateObject4","Elapsed","span","_templateObject5","Timeline","_templateObject6","Seek","input","_templateObject7","Buffer","_templateObject8","Timestamp","_templateObject9","Progress","_templateObject10","ToggleMute","_templateObject11","muted","Volume","_templateObject12","VolumeRange","_templateObject13","VolumeBar","_templateObject14","VolumeCol","em","_templateObject15","FullscreenButton","_templateObject16","defaultProps","duration","played","loaded","volume","controlsEnabled","onFullscreen","onPlayPause","seekMouseDown","seekChange","seekMouseUp","toggleMute","volumeChange","initVolumeBar","id","volumeBarCoef","length","UI","_useState","useState","_useState2","_slicedToArray","volumeBar","setVolumeBar","_useState3","_useState4","isControlsActive","setIsControlsActive","useEffect","updatedVolumeBar","_toConsumableArray","map","col","index","_objectSpread","timer","setTimeout","clearTimeout","_jsxs","onMouseMove","onMouseLeave","onClick","type","min","max","step","value","onMouseDown","onChange","onMouseUp","style","width","ImagePlaceholder","img","AudioPlaceholder","showPlaceHolderImage","placeHolderImage","src","alt","_Fragment","button","Unmute","text","screenFullActive","fullscreenFallbackEnabled","MATCH_URL_FACEBOOK","MATCH_URL_FACEBOOK_WATCH","MATCH_URL_YOUTUBE","MATCH_URL_SHORT_YOUTUBE","MATCH_URL_YOUTUBE_EMBED","isYouTubeLink","url","test","initOptionsState","pip","controls","light","loop","playbackRate","playsinline","source","startDate","Player","optionsState","setOptionsState","playerState","setPlayerState","_useState5","_useState6","setFullscreenFallbackEnabled","wrapperElement","useRef","optionsInitUpdate","updateOptionsState","undefined","isYoutubeProvider","window","innerWidth","includes","localStorageVolume","localStorage","getItem","updatedOptions","parseFloat","newOptions","handlePlayPause","handleToggleMuted","newLocalStorageVolume","setItem","toString","console","log","screenfull","isFullscreen","ref","title","position","top","left","height","allowFullScreen","inputUrl","parts","split","Error","videoId","transformDailymotionUrl","overflow","ReactPlayer","player","className","onReady","onStart","now","dayjs","startTime","seek","diff","seekTo","onPlay","onPause","onBuffer","onBufferEnd","onSeek","onEnded","_wrapperElement$curre","_wrapperElement$curre2","playerRootId","current","closest","event","CustomEvent","detail","bubbles","dispatchEvent","onError","e","onProgress","state","seeking","loadedSeconds","playedSeconds","onDuration","isEnabled","toggle","target","GlobalStyle","createGlobalStyle","isObject","object","deepEqual","object1","object2","keys1","Object","keys","keys2","_i","_keys","key","val1","val2","areObjects","defaultLocalData","App","localData","setLocalData","playerRef","intervalCounter","setInterval","_playerRef$current","_playerRef$current$cl","STRIMM_PLAYER","prevState","clearInterval","reportWebVitals","onPerfEntry","Function","then","getCLS","getFID","getFCP","getLCP","getTTFB","$components","document","getElementsByClassName","i","ReactDOM","render","React","StrictMode"],"mappings":"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","file":"static/js/main.74c54a2f.chunk.js","sourcesContent":["import React, { memo } from 'react';\n\ninterface Props {\n  seconds: number;\n}\n\nfunction format(seconds: number) {\n  const date = new Date(seconds * 1000);\n  const hh = date.getUTCHours();\n  const mm = date.getUTCMinutes();\n  const ss = pad(date.getUTCSeconds());\n  if (hh) {\n    return `${hh}:${pad(mm)}:${ss}`;\n  }\n  return `${mm}:${ss}`;\n}\n\nfunction pad(string: number) {\n  return `0${string}`.slice(-2);\n}\n\nfunction Duration({ seconds }: Props) {\n  return <time dateTime={`P${Math.round(seconds)}S`}>{format(seconds)}</time>;\n}\n\nexport default memo(Duration);\n","import styled from \"styled-components\";\nimport {\n  PlayButtonProps,\n  PlayPauseButtonProps,\n  ToggleMuteProps,\n  VolumeColProps,\n  WrapperProps,\n} from \"./types\";\n\nconst Wrapper = styled.div<WrapperProps>`\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-image: none;\n  text-align: center;\n  cursor: pointer;\n  font-size: 16px;\n  color: #fff;\n\n  ${(props) => (props.isMp3 ? `z-index: 5` : `z-index: 1`)};\n\n  ${(props) =>\n    props.isPaused || props.isActive\n      ? `\n    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.25), transparent 15%);\n\n    ${Controls} {\n      opacity: 1;\n    }\n  `\n      : null};\n`;\n\nconst PlayPauseButton = styled.div<PlayPauseButtonProps>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n\n  &::before {\n    font-family: flowplayer;\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    font-size: 14vw;\n    transition: opacity 0.1s;\n    opacity: 0;\n\n    @media (min-width: 768px) {\n      font-size: 107px;\n    }\n  }\n\n  ${(props) =>\n    !props.playing\n      ? `\n        &::before {\n          content: '\\\\e007';\n        }\n      `\n      : `\n        &::before {\n          content: '\\\\e008';\n        }\n      `}\n`;\n\nconst Controls = styled.div`\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 3em;\n  z-index: 2;\n  padding-left: 0.3em;\n  padding-right: 2.5em;\n  transition: background-image 0.1s, opacity 0.1s;\n  opacity: 0;\n`;\n\nconst PlayButton = styled.a<PlayButtonProps>`\n  margin: 0 0.5em;\n  flex: 0 0 auto;\n  display: inline-block;\n\n  ${(props) =>\n    !props.playing\n      ? `\n        &::before {\n        font-family: flowplayer;\n        font-size: 1.7em;\n        content: '\\\\e007';\n      }\n      `\n      : `\n        &::before {\n          font-family: flowplayer;\n          font-size: 1.7em;\n          content: '\\\\e008';\n        }\n       `}\n`;\n\nconst Elapsed = styled.span`\n  margin: 0 0.5em;\n  display: inline-block;\n  flex: 0 0 auto;\n  cursor: default;\n`;\n\nconst Timeline = styled.div`\n  position: relative;\n  margin: 0 0.5em;\n  background-color: rgba(255, 255, 255, 0.5);\n  height: 0.9em;\n  border-radius: 0.24em;\n  flex: 1 1 auto;\n  transition: height 0.2s;\n`;\n\nconst Seek = styled.input`\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  background-color: transparent;\n\n  &[type=\"range\"] {\n    -webkit-appearance: none;\n    width: 100%;\n    margin: 0;\n  }\n  &[type=\"range\"]:focus {\n    outline: none;\n  }\n  &[type=\"range\"]::-webkit-slider-runnable-track {\n    width: 100%;\n    height: 15px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    background: rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    border: 0px solid rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]::-webkit-slider-thumb {\n    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    height: 20px;\n    width: 20px;\n    border-radius: 20px;\n    background: rgba(255, 255, 255, 0);\n    cursor: col-resize;\n    -webkit-appearance: none;\n    margin-top: -2.5px;\n  }\n  &[type=\"range\"]:focus::-webkit-slider-runnable-track {\n    background: rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]::-moz-range-track {\n    width: 100%;\n    height: 15px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    background: rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    border: 0px solid rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]::-moz-range-thumb {\n    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    height: 20px;\n    width: 20px;\n    border-radius: 20px;\n    background: rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]::-ms-track {\n    width: 100%;\n    height: 15px;\n    cursor: col-resize;\n    background: transparent;\n    border-color: transparent;\n    color: transparent;\n  }\n  &[type=\"range\"]::-ms-fill-lower {\n    background: rgba(242, 242, 242, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]::-ms-fill-upper {\n    background: rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]::-ms-thumb {\n    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    width: 20px;\n    height: 15px;\n    border-radius: 20px;\n    background: rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]:focus::-ms-fill-lower {\n    background: rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]:focus::-ms-fill-upper {\n    background: rgba(255, 255, 255, 0);\n  }\n`;\n\nconst Buffer = styled.div`\n  position: absolute;\n  left: 0;\n  height: 100%;\n  max-width: 100%;\n  background-color: rgba(255, 255, 255, 0.6);\n  border-radius: 0.24em;\n  transition: width 0.25s linear;\n`;\n\nconst Timestamp = styled.span`\n  position: absolute;\n  background-color: rgba(0, 0, 0, 0.65);\n  display: none;\n  border-radius: 0.2em;\n  padding: 0.1em 0.3em;\n  font-size: 90%;\n  bottom: 1.4em;\n  height: auto;\n`;\n\nconst Progress = styled.div`\n  position: absolute;\n  height: 100%;\n  max-width: 100%;\n  border-radius: 0.24em;\n  background-color: #00abcd;\n  fill: rgba(0, 0, 0, 0.2);\n  transition: width 0.25s linear;\n`;\n\nconst ToggleMute = styled.a<ToggleMuteProps>`\n  margin: 0 0.5em;\n  display: inline-block;\n  flex: 0 0 auto;\n\n  ${(props) =>\n    !props.muted\n      ? `\n    &::before {\n    font-family: flowplayer;\n    font-size: 1.7em;\n    content: '\\\\e00b';\n  }\n  `\n      : `\n  &::before {\n    font-family: flowplayer;\n    font-size: 1.7em;\n    content: '\\\\e00d';\n  }\n   `}\n`;\n\nconst Volume = styled.div`\n  margin: 0 0.5em;\n  flex: 0 0 auto;\n  position: relative;\n`;\n\nconst VolumeRange = styled.input`\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  background-color: transparent;\n\n  &[type=\"range\"] {\n    -webkit-appearance: none;\n    width: 100%;\n    margin: 0;\n  }\n  &[type=\"range\"]:focus {\n    outline: none;\n  }\n  &[type=\"range\"]::-webkit-slider-runnable-track {\n    width: 100%;\n    height: 15px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    background: rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    border: 0px solid rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]::-webkit-slider-thumb {\n    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    height: 1px;\n    width: 1px;\n    border-radius: 20px;\n    background: rgba(255, 255, 255, 0);\n    cursor: col-resize;\n    -webkit-appearance: none;\n    margin-top: -2.5px;\n  }\n  &[type=\"range\"]:focus::-webkit-slider-runnable-track {\n    background: rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]::-moz-range-track {\n    width: 100%;\n    height: 15px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    background: rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    border: 0px solid rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]::-moz-range-thumb {\n    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    height: 1px;\n    width: 1px;\n    border-radius: 20px;\n    background: rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]::-ms-track {\n    width: 100%;\n    height: 15px;\n    cursor: col-resize;\n    background: transparent;\n    border-color: transparent;\n    color: transparent;\n  }\n  &[type=\"range\"]::-ms-fill-lower {\n    background: rgba(242, 242, 242, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]::-ms-fill-upper {\n    background: rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    border-radius: 0px;\n    box-shadow: 0px 0px 0.6px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]::-ms-thumb {\n    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0),\n      0px 0px 0px rgba(255, 255, 255, 0);\n    border: 0px solid rgba(255, 255, 255, 0);\n    width: 1px;\n    height: 1px;\n    border-radius: 20px;\n    background: rgba(255, 255, 255, 0);\n    cursor: col-resize;\n  }\n  &[type=\"range\"]:focus::-ms-fill-lower {\n    background: rgba(255, 255, 255, 0);\n  }\n  &[type=\"range\"]:focus::-ms-fill-upper {\n    background: rgba(255, 255, 255, 0);\n  }\n`;\n\nconst VolumeBar = styled.div`\n  flex: 1;\n  position: relative;\n  cursor: col-resize;\n  height: 0.9em;\n  border-radius: 0.24em;\n  background-color: transparent;\n  user-select: none;\n  transition: height 0.2s;\n  white-space: nowrap;\n`;\n\nconst VolumeCol = styled.em<VolumeColProps>`\n  border-radius: 2px;\n  display: inline-block;\n  width: 5px;\n  height: 100%;\n  position: relative;\n  vertical-align: top;\n  transition: transform 0.4s;\n  transform-origin: bottom;\n  user-select: none;\n  transform: scale(1.1);\n  ${(props) =>\n    props.isActive\n      ? `\n    background-color: #00abcd;\n    fill: rgba(0, 0, 0, 0.2);\n    `\n      : `\n    background-color: rgba(255, 255, 255, 0.75);\n    `}\n\n  & + & {\n    margin-left: 3px;\n  }\n\n  &:hover {\n    transform: scaleY(1.35);\n    transition: transform 0.2s;\n  }\n`;\n\nconst FullscreenButton = styled.a`\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  transform: translateY(-50%);\n  right: 0;\n  padding: 0 0.7em 0 0.3em;\n\n  &::before {\n    font-family: flowplayer;\n    font-size: 1.45em;\n    content: \"\\\\e002\";\n  }\n`;\n\nexport {\n  Wrapper,\n  FullscreenButton,\n  PlayPauseButton,\n  Controls,\n  PlayButton,\n  Elapsed,\n  Timeline,\n  Seek,\n  Buffer,\n  Timestamp,\n  Progress,\n  ToggleMute,\n  Volume,\n  VolumeRange,\n  VolumeBar,\n  VolumeCol,\n};\n","import { Props } from \"./types\";\n\nconst defaultProps: Props = {\n  isMp3: false,\n  duration: 0,\n  played: 0,\n  loaded: 0,\n  volume: 0,\n  playing: false,\n  controlsEnabled: true,\n  muted: false,\n  onFullscreen: () => {},\n  onPlayPause: () => {},\n  seekMouseDown: () => {},\n  seekChange: () => {},\n  seekMouseUp: () => {},\n  toggleMute: () => {},\n  volumeChange: () => {},\n};\n\nexport default defaultProps;\n","import {VolumeBarItemType} from \"./types\";\n\nconst initVolumeBar: Array<VolumeBarItemType> = [\n  {\n    id: 0,\n    isActive: false,\n  },\n  {\n    id: 1,\n    isActive: false,\n  },\n  {\n    id: 2,\n    isActive: false,\n  },\n  {\n    id: 3,\n    isActive: false,\n  },\n  {\n    id: 4,\n    isActive: false,\n  },\n  {\n    id: 5,\n    isActive: false,\n  },\n  {\n    id: 6,\n    isActive: false,\n  },\n];\n\nexport { initVolumeBar };\n","/**\n *\n * UI\n *\n */\n\nimport React, { memo, useEffect, useState } from \"react\";\n\nimport Duration from \"./Duration\";\n\nimport {\n  Wrapper,\n  FullscreenButton,\n  PlayPauseButton,\n  Controls,\n  PlayButton,\n  Elapsed,\n  Timeline,\n  Seek,\n  Buffer,\n  Timestamp,\n  Progress,\n  ToggleMute,\n  Volume,\n  VolumeRange,\n  VolumeBar,\n  VolumeCol,\n} from \"./styles\";\nimport defaultProps from \"./defaultProps\";\nimport { Props, VolumeBarItemType } from \"./types\";\nimport { initVolumeBar } from \"./data\";\n\nconst volumeBarCoef = 100 / initVolumeBar.length;\n\nfunction UI({\n  duration,\n  played,\n  loaded,\n  volume,\n  playing,\n  controlsEnabled,\n  muted,\n  onFullscreen,\n  onPlayPause,\n  seekMouseDown,\n  seekChange,\n  seekMouseUp,\n  toggleMute,\n  volumeChange,\n  isMp3,\n}: Props) {\n  // volume bar state\n  const [volumeBar, setVolumeBar] =\n    useState<Array<VolumeBarItemType>>(initVolumeBar);\n\n  // is controls active\n  const [isControlsActive, setIsControlsActive] = useState<boolean>(true);\n\n  // watch volume - update volume bar\n  useEffect(() => {\n    let updatedVolumeBar = [...volumeBar];\n    updatedVolumeBar = updatedVolumeBar.map(\n      (col: VolumeBarItemType, index: number) => ({\n        ...col,\n        isActive: volumeBarCoef * index < volume * 100,\n      })\n    );\n    setVolumeBar(updatedVolumeBar);\n  }, [volume]);\n\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>;\n\n    if (isControlsActive) {\n      timer = setTimeout(() => {\n        setIsControlsActive(false);\n      }, 5000);\n    }\n\n    return () => clearTimeout(timer);\n  }, [isControlsActive]);\n\n  // mouse move handler\n  const mouseMoveHandler = () => {\n    setIsControlsActive(true);\n  };\n\n  // mouse leave handler\n  const mouseLeaveHandler = () => {\n    setIsControlsActive(false);\n  };\n\n  // play\\pause button click handler\n  const playPauseButtonClickHandler = () => {\n    onPlayPause();\n  };\n\n  return (\n    <Wrapper\n      isMp3={isMp3}\n      isPaused={!playing}\n      isActive={isControlsActive}\n      onMouseMove={mouseMoveHandler}\n      onMouseLeave={mouseLeaveHandler}\n    >\n      <PlayPauseButton\n        playing={playing}\n        onClick={playPauseButtonClickHandler}\n      />\n\n      <Controls>\n        {controlsEnabled ? (\n          <PlayButton playing={playing} onClick={onPlayPause} />\n        ) : null}\n\n        {controlsEnabled ? (\n          <Elapsed>\n            <Duration seconds={duration * played} />\n          </Elapsed>\n        ) : null}\n\n        {controlsEnabled ? (\n          <Timeline>\n            <Seek\n              type=\"range\"\n              min={0}\n              max={1}\n              step=\"any\"\n              value={played}\n              onMouseDown={seekMouseDown}\n              onChange={seekChange}\n              onMouseUp={seekMouseUp}\n            />\n            <Buffer style={{ width: `${loaded * 100}%` }} />\n            <Timestamp />\n            <Progress style={{ width: `${played * 100}%` }} />\n          </Timeline>\n        ) : null}\n\n        <ToggleMute muted={muted} onClick={toggleMute} />\n\n        <Volume>\n          <VolumeRange\n            type=\"range\"\n            min={0}\n            max={1}\n            step=\"any\"\n            value={volume}\n            onChange={volumeChange}\n          />\n          <VolumeBar>\n            {volumeBar &&\n              volumeBar.map((col) => (\n                <VolumeCol key={col.id} isActive={col.isActive} />\n              ))}\n          </VolumeBar>\n        </Volume>\n        <FullscreenButton\n          onClick={() => {\n            // screenfull.request(wrapperElement.current);\n            onFullscreen();\n          }}\n        />\n      </Controls>\n    </Wrapper>\n  );\n}\n\nUI.defaultProps = defaultProps;\n\nexport default memo(UI);\n","import styled from \"styled-components\";\n\nconst Wrapper = styled.div`\n  position: absolute;\n  z-index: 2;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  padding: 10px;\n  background-color: #000;\n`;\n\nconst ImagePlaceholder = styled.img`\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n`;\n\nexport { Wrapper, ImagePlaceholder };\n","import React from \"react\";\n\nimport { Wrapper, ImagePlaceholder } from \"./styles\";\n\ntype Props = {\n  showPlaceHolderImage: boolean;\n  placeHolderImage: string;\n};\n\nfunction AudioPlaceholder({ showPlaceHolderImage, placeHolderImage }: Props) {\n  return (\n    <Wrapper>\n      {showPlaceHolderImage && placeHolderImage && placeHolderImage.length ? (\n        <ImagePlaceholder src={placeHolderImage} alt=\"placeholder\" />\n      ) : (\n        <></>\n      )}\n    </Wrapper>\n  );\n}\n\nexport default AudioPlaceholder;\n","import styled from 'styled-components';\n\nconst Wrapper = styled.button`\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 6;\n  height: 37px;\n  line-height: 37px;\n  min-width: 170px;\n  padding: 0 10px;\n  background-color: #fff;\n  border-radius: 2px;\n  border: none;\n  outline: none;\n  cursor: pointer;\n\n  & > span {\n    display: inline-block;\n    font-size: 14px;\n    line-height: 37px;\n    vertical-align: top;\n  }\n\n  &::before {\n    display: inline-block;\n    vertical-align: top;\n    margin-right: 7px;\n    font-family: flowplayer;\n    font-size: 2em;\n    line-height: 37px;\n    content: '\\\\e00d';\n  }\n`;\n\nexport { Wrapper };\n","/**\n *\n * UI\n *\n */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { Wrapper } from \"./styles\";\n\nfunction Unmute({ onClick, text }) {\n  return (\n    <Wrapper type=\"button\" onClick={onClick}>\n      <span>{text}</span>\n    </Wrapper>\n  );\n}\n\nUnmute.propTypes = {\n  onClick: PropTypes.func,\n  text: PropTypes.string,\n};\n\nexport default Unmute;\n","import styled from 'styled-components';\n\ninterface WrapperProps {\n  readonly screenFullActive: boolean;\n  readonly fullscreenFallbackEnabled: boolean;\n}\n\nconst Wrapper = styled.div<WrapperProps>`\n  position: relative;\n  background-color: black;\n  padding-bottom: ${`${(9 / 16) * 100}%`};\n\n  ${(props) => props.screenFullActive ? `\n    position: static;\n    padding-bottom: 0;\n  ` : null}\n\n  ${(props) =>\n    props.fullscreenFallbackEnabled\n      ? `\n    position: fixed;\n    padding-bottom: 0;\n    top: 0%;\n    left: 0;\n    width: 100vw;\n    height: 100vh;\n    z-index: 13;\n    background-color: black;\n  `\n      : null}\n\n  & > .react-player {\n    position: absolute;\n    z-index: 0;\n    top: 0;\n    left: 0;\n  }\n`;\n\n\nexport { Wrapper };\n","// patterns\nexport const MATCH_URL_FACEBOOK = /^https?:\\/\\/(www\\.)?facebook\\.com.*\\/(video(s)?|watch|story)(\\.php?|\\/).+$/\nexport const MATCH_URL_FACEBOOK_WATCH = /^https?:\\/\\/fb\\.watch\\/.+$/\n\nexport default function isFacebookProvider (url: string) {\n  return MATCH_URL_FACEBOOK.test(url) || MATCH_URL_FACEBOOK_WATCH.test(url);\n}\n","export const MATCH_URL_YOUTUBE =\n  /^(https?:\\/\\/)?(www\\.)?youtube\\.com\\/watch\\?v=([^&]+)/;\nexport const MATCH_URL_SHORT_YOUTUBE =\n  /^(https?:\\/\\/)?(www\\.)?youtu\\.be\\/([^?]+)/;\nexport const MATCH_URL_YOUTUBE_EMBED =\n  /^(https?:\\/\\/)?(www\\.)?youtube\\.com\\/embed\\/([^?]+)/;\n\nexport default function isYouTubeLink(url: string) {\n  return (\n    MATCH_URL_YOUTUBE.test(url) ||\n    MATCH_URL_SHORT_YOUTUBE.test(url) ||\n    MATCH_URL_YOUTUBE_EMBED.test(url)\n  );\n}\n","import {ReactPlayerProps} from \"react-player\";\n\nconst initOptionsState: ReactPlayerProps = {\n  url: '',\n  pip: true,\n  playing: true,\n  controls: false,\n  light: false,\n  volume: 0,\n  muted: true,\n  played: 0,\n  loaded: 0,\n  loop: false,\n  duration: 0,\n  playbackRate: 1.0,\n  playsinline: true,\n};\n\nexport { initOptionsState };\n","import { Props } from './types';\n\nconst defaultProps: Props = {\n  source: null,\n  startDate: null,\n  showPlaceHolderImage: false,\n  placeHolderImage: null,\n};\n\nexport default defaultProps;\n","/**\n *\n * Player\n */\n\nimport React, { ChangeEvent, useEffect, useRef, useState } from \"react\";\nimport ReactPlayer, { ReactPlayerProps } from \"react-player\";\n\n// 3d parties\nimport dayjs from \"dayjs\";\nimport screenfull from \"screenfull\";\n\n// components\nimport UI from \"./UI\";\nimport AudioPlaceholder from \"./AudioPlaceholder\";\nimport Unmute from \"./Unmute\";\n\n// styles\nimport { Wrapper } from \"./styles\";\nimport \"./UI/icons/style.css\";\n\n// utils\nimport isFacebookProvider from \"../../utils/is-facebook-provider\";\nimport isYoutubeProvider from \"../../utils/is-youtube-provider\";\n\n// data, types, props, default\nimport { initOptionsState } from \"./data\";\nimport { OnProgressType, Props } from \"./types\";\nimport defaultProps from \"./defaultProps\";\n\nfunction Player({\n  source,\n  startDate,\n  showPlaceHolderImage,\n  placeHolderImage,\n}: Props) {\n  // options state\n  const [optionsState, setOptionsState] =\n    useState<ReactPlayerProps>(initOptionsState);\n\n  // player state\n  const [playerState, setPlayerState] = useState<ReactPlayer>();\n\n  // fullscreenFallbackEnabled enabled state\n  const [fullscreenFallbackEnabled, setFullscreenFallbackEnabled] =\n    useState<boolean>(false);\n\n  // wrapper ref\n  const wrapperElement = useRef<HTMLInputElement>(null);\n\n  // init\n  useEffect(() => {\n    if (playerState) {\n      optionsInitUpdate();\n    }\n  }, [playerState]);\n\n  // watch source - update url\n  useEffect(() => {\n    updateOptionsState({\n      url: source && source.length > 0 ? source : undefined,\n      playing:\n        source && isYoutubeProvider(source) && window.innerWidth < 375\n          ? false\n          : true,\n      muted:\n        source && isYoutubeProvider(source) && window.innerWidth < 375\n          ? false\n          : true,\n      controls:\n        source && source.length > 0\n          ? isFacebookProvider(source) ||\n            isYoutubeProvider(source) ||\n            source?.includes(\"rumble\")\n          : false,\n    });\n  }, [source]);\n\n  // options init update\n  const optionsInitUpdate = () => {\n    const localStorageVolume = localStorage.getItem(\"volume\");\n\n    const updatedOptions = {\n      ...optionsState,\n      volume:\n        localStorageVolume !== null && parseFloat(localStorageVolume) !== 0\n          ? parseFloat(localStorageVolume)\n          : 0.7,\n    };\n\n    // console.log('updated options: ', updatedOptions);\n\n    setOptionsState(updatedOptions);\n  };\n\n  // update options state\n  const updateOptionsState = (newOptions: ReactPlayerProps) => {\n    const updatedOptions = {\n      ...optionsState,\n      ...newOptions,\n    };\n    setOptionsState(updatedOptions);\n\n    // console.log('updated options: ', updatedOptions);\n  };\n\n  // handle ready\n  const handleReady = () => {\n    // console.log('onReady');\n  };\n\n  // handle start\n  const handleStart = () => {\n    // console.log('onStart');\n\n    if (startDate && playerState) {\n      const now = dayjs();\n      const startTime = dayjs(startDate);\n      const seek = now.diff(startTime, \"seconds\");\n\n      playerState.seekTo(seek, \"seconds\");\n    }\n  };\n\n  // handle play pause\n  const handlePlayPause = () => {\n    // console.log('play pause: ', optionsState.playing);\n\n    updateOptionsState({\n      playing: !optionsState.playing,\n    });\n  };\n\n  // handle volume change\n  const handleVolumeChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const value = parseFloat(e.target.value);\n    localStorage.setItem(\"volume\", e.target.value);\n\n    // console.log('volume change: ', value);\n\n    updateOptionsState({\n      muted: !value,\n      volume: value,\n    });\n  };\n\n  // handle toggle muted\n  const handleToggleMuted = () => {\n    const localStorageVolume = localStorage.getItem(\"volume\");\n    const newLocalStorageVolume =\n      localStorageVolume !== null && parseFloat(localStorageVolume) !== 0\n        ? parseFloat(localStorageVolume)\n        : 0.7;\n\n    localStorage.setItem(\"volume\", newLocalStorageVolume.toString());\n\n    // console.log('toggle muted: ', newLocalStorageVolume);\n\n    console.log(optionsState.muted);\n\n    updateOptionsState({\n      muted: !optionsState.muted,\n      volume: !optionsState.muted ? 0 : newLocalStorageVolume,\n    });\n  };\n\n  // handle play\n  const handlePlay = () => {\n    // console.log('onPlay');\n\n    updateOptionsState({\n      playing: true,\n    });\n  };\n\n  // handle seek\n  const handleSeek = () => {\n    // console.log('onSeek');\n  };\n\n  // handle pause\n  const handlePause = () => {\n    // console.log('onPause');\n\n    updateOptionsState({\n      playing: false,\n    });\n  };\n\n  // handle seek mouse down\n  const handleSeekMouseDown = () => {\n    updateOptionsState({\n      seeking: true,\n    });\n  };\n\n  // handle seek change\n  const handleSeekChange = (e: ChangeEvent<HTMLInputElement>) => {\n    updateOptionsState({\n      played: parseFloat(e.target.value),\n    });\n  };\n\n  // handle seek mouse up\n  const handleSeekMouseUp = (e: React.MouseEvent<HTMLInputElement>) => {\n    const target = e.target as HTMLInputElement;\n\n    updateOptionsState({\n      seeking: false,\n    });\n    playerState && playerState.seekTo(parseFloat(target.value));\n  };\n\n  // handle progress\n  const handleProgress = (state: OnProgressType) => {\n    const internalPlayerOptions: ReactPlayerProps = {};\n\n    // We only want to update time slider if we are not currently seeking\n    if (!optionsState.seeking) {\n      updateOptionsState({\n        loaded: state.loaded,\n        loadedSeconds: state.loadedSeconds,\n        played: state.played,\n        playedSeconds: state.playedSeconds,\n        ...internalPlayerOptions,\n      });\n    }\n  };\n\n  // handle ended\n  const handleEnded = () => {\n    // console.log('onEnded');\n    const playerRootId = wrapperElement?.current?.closest(\n      \".STRIMM_PLAYER_ROOT\"\n    )?.id;\n\n    const event = new CustomEvent(\"STRIMM_PLAYER_EVENT_TRACK_ENDED\", {\n      detail: {\n        playerRootId,\n        source,\n      },\n      bubbles: true,\n    });\n\n    if (wrapperElement?.current) {\n      wrapperElement.current.dispatchEvent(event);\n    }\n\n    // setEndedState(true);\n  };\n\n  // handle duration\n  const handleDuration = (duration: number) => {\n    // console.log('onDuration', duration);\n\n    updateOptionsState({\n      duration,\n    });\n  };\n\n  // unmute click handler\n  const unmuteClickHandler = () => {\n    // console.log('unmute click handler');\n\n    handleToggleMuted();\n  };\n\n  // handle click fullscreen\n  const handleClickFullscreen = () => {\n    if (wrapperElement && wrapperElement.current) {\n      if (screenfull.isEnabled) {\n        screenfull.toggle(wrapperElement.current);\n      } else {\n        setFullscreenFallbackEnabled(!fullscreenFallbackEnabled);\n      }\n    }\n  };\n\n  const ref = (player: ReactPlayer) => {\n    setPlayerState(player);\n  };\n\n  function transformDailymotionUrl(inputUrl: string): string {\n    const parts = inputUrl.split(\"/video/\");\n\n    if (parts.length !== 2) {\n      throw new Error(\n        \"Invalid URL format. Please provide a URL in the format https://www.dailymotion.com/video/VIDEO_ID\"\n      );\n    }\n\n    const videoId = parts[1];\n\n    const embedUrl = `https://www.dailymotion.com/embed/video/${videoId}?autoplay=1`;\n\n    return embedUrl;\n  }\n\n  // if (source && source.includes(\"dailymotion\")) {\n  //   console.log(\"it is dailymotion!!!\");\n  //   return (\n  //     <WrapperDailymotion>\n  //       <iframe\n  //         title=\"Dailymotion Video Player\"\n  //         src={transformDailymotionUrl(source)}\n  //         width=\"100%\"\n  //         height=\"100%\"\n  //         allowFullScreen\n  //         style={{\n  //           width: \"100%\",\n  //           height: \"100%\",\n  //           position: \"absolute\",\n  //           left: 0,\n  //           top: 0,\n  //           overflow: \"hidden\",\n  //         }}\n  //       ></iframe>\n  //     </WrapperDailymotion>\n  //   );\n  // }\n\n  return (\n    <Wrapper\n      screenFullActive={\"isFullscreen\" in screenfull && screenfull.isFullscreen}\n      fullscreenFallbackEnabled={fullscreenFallbackEnabled}\n      ref={wrapperElement}\n    >\n      {source?.includes(\"rumble\") ? (\n        <iframe\n          title=\"iframe\"\n          style={{\n            position: \"absolute\",\n            top: 0,\n            left: 0,\n            width: \"100%\",\n            height: \"100%\",\n          }}\n          src={source}\n          allowFullScreen\n        ></iframe>\n      ) : source?.includes(\"dailymotion\") ? (\n        <iframe\n          title=\"Dailymotion Video Player\"\n          src={transformDailymotionUrl(source)}\n          width=\"100%\"\n          height=\"100%\"\n          allowFullScreen\n          style={{\n            width: \"100%\",\n            height: \"100%\",\n            position: \"absolute\",\n            left: 0,\n            top: 0,\n            overflow: \"hidden\",\n          }}\n        ></iframe>\n      ) : (\n        <ReactPlayer\n          ref={ref}\n          className=\"react-player\"\n          width=\"100%\"\n          height=\"100%\"\n          onReady={handleReady}\n          onStart={handleStart}\n          onPlay={handlePlay}\n          onPause={handlePause}\n          onBuffer={() => console.log(\"onBuffer\")}\n          onBufferEnd={() => console.log(\"onBufferEnd\")}\n          onSeek={handleSeek}\n          onEnded={handleEnded}\n          onError={(e) => console.log(\"onError\", e)}\n          onProgress={handleProgress}\n          onDuration={handleDuration}\n          {...optionsState}\n        />\n      )}\n\n      {showPlaceHolderImage &&\n      placeHolderImage &&\n      placeHolderImage?.length > 0 &&\n      (source?.includes(\".mp3\") ||\n        source?.includes(\".wav\") ||\n        source === null) ? (\n        <AudioPlaceholder\n          showPlaceHolderImage={showPlaceHolderImage}\n          placeHolderImage={placeHolderImage}\n        />\n      ) : null}\n\n      {!optionsState.controls &&\n      optionsState.muted &&\n      !source?.includes(\"rumble\") &&\n      !source?.includes(\"dailymotion\") &&\n      (source?.includes(\".mp3\") || source?.includes(\".wav\")) ? (\n        <Unmute\n          text={\"TAP TO UNMUTE\"}\n          onClick={() => {\n            handlePlayPause();\n            setTimeout(() => {\n              unmuteClickHandler();\n            }, 1000);\n          }}\n        />\n      ) : null}\n\n      {!optionsState.controls && !source?.includes(\"dailymotion\") ? (\n        <UI\n          duration={optionsState.duration}\n          playing={optionsState.playing}\n          played={optionsState.played}\n          loaded={optionsState.loaded}\n          muted={optionsState.muted}\n          volume={optionsState.volume}\n          onFullscreen={handleClickFullscreen}\n          onPlayPause={handlePlayPause}\n          seekMouseDown={handleSeekMouseDown}\n          seekChange={handleSeekChange}\n          seekMouseUp={handleSeekMouseUp}\n          toggleMute={handleToggleMuted}\n          volumeChange={handleVolumeChange}\n          isMp3={\n            source?.includes(\".mp3\") ||\n            source?.includes(\".wav\") ||\n            source === null\n          }\n        />\n      ) : null}\n    </Wrapper>\n  );\n}\n\nPlayer.defaultProps = defaultProps;\n\nexport default Player;\n","import { createGlobalStyle } from 'styled-components';\n\nconst GlobalStyle = createGlobalStyle`\n  .STRIMM_PLAYER_ROOT {\n    font-family: Roboto-Regular, 'Helvetica Neue', Helvetica, Arial, sans-serif;\n\t  -webkit-overflow-scrolling: touch;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    box-sizing: border-box;\n    \n    & *, & *::before, & *::after {\n      box-sizing: border-box;\n    }\n    \n    input, select {\n      border: none;\n    }\n}\n`;\n\nexport default GlobalStyle;\n","function isObject(object: object) {\n  return object != null && typeof object === 'object';\n}\n\nexport default isObject;\n","import isObject from './is-object';\n\nfunction deepEqual(object1: object | null, object2: object | null) {\n  if (!object1 || !object2) return false;\n\n  const keys1 = Object.keys(object1);\n  const keys2 = Object.keys(object2);\n\n  if (keys1.length !== keys2.length) {\n    return false;\n  }\n\n  for (const key of keys1) {\n    // @ts-ignore\n    const val1 = object1[key];\n    // @ts-ignore\n    const val2 = object2[key];\n    const areObjects = isObject(val1) && isObject(val2);\n    if (\n      (areObjects && !deepEqual(val1, val2)) ||\n      (!areObjects && val1 !== val2)\n    ) {\n      return false;\n    }\n  }\n\n  return true;\n}\n\nexport default deepEqual;\n","import React, { memo, useEffect, useRef, useState } from \"react\";\n\n// components\nimport Player from \"./components/Player\";\n\n// styles\nimport GlobalStyle from \"./global-styles\";\nimport deepEqual from \"./utils/deep-equal\";\n\n// types\ndeclare global {\n  interface Window {\n    STRIMM_PLAYER: {\n      [key: string]: {\n        url: string;\n        startDate: string;\n        showPlaceHolderImage: boolean;\n        placeHolderImage: string;\n      };\n    };\n  }\n}\n\ninterface PlayerData {\n  url: string | null;\n  startDate: string | null;\n  showPlaceHolderImage: boolean;\n  placeHolderImage: string | null;\n}\n\nconst defaultLocalData: PlayerData = {\n  url: null,\n  startDate: null,\n  showPlaceHolderImage: false,\n  placeHolderImage: null,\n};\n\n// entry\nfunction App() {\n  const [localData, setLocalData] = useState<PlayerData>(defaultLocalData);\n  const playerRef = useRef<HTMLDivElement>(null);\n\n  // on mount\n  useEffect(() => {\n    const intervalCounter = setInterval(() => {\n      const playerRootId = playerRef?.current?.closest(\n        \".STRIMM_PLAYER_ROOT\"\n      )?.id;\n\n      if (\n        \"STRIMM_PLAYER\" in window &&\n        playerRootId &&\n        window.STRIMM_PLAYER[playerRootId] &&\n        \"url\" in window.STRIMM_PLAYER[playerRootId] &&\n        \"startDate\" in window.STRIMM_PLAYER[playerRootId] &&\n        !deepEqual(localData, window.STRIMM_PLAYER[playerRootId])\n      ) {\n        setLocalData((prevState) => ({\n          ...prevState,\n          ...window.STRIMM_PLAYER[playerRootId],\n        }));\n      }\n    }, 1000);\n\n    return () => {\n      clearInterval(intervalCounter);\n    };\n  }, [localData]);\n\n  return (\n    <div ref={playerRef}>\n      <Player\n        source={localData.url}\n        startDate={localData.startDate}\n        showPlaceHolderImage={localData.showPlaceHolderImage}\n        placeHolderImage={localData.placeHolderImage}\n      />\n\n      <GlobalStyle />\n    </div>\n  );\n}\n\nexport default memo(App);\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from './App';\nimport reportWebVitals from './reportWebVitals';\n\nconst $components = document.getElementsByClassName('STRIMM_PLAYER_ROOT');\n\nfor (let i = 0; i < $components.length; i++) {\n  ReactDOM.render(\n    <React.StrictMode>\n      <App />\n    </React.StrictMode>,\n    $components[i]\n  );\n}\n\n// If you want to start measuring performance in your app, pass a function\n// to log results (for example: reportWebVitals(console.log))\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\nreportWebVitals();\n","import { ReportHandler } from 'web-vitals';\n\nconst reportWebVitals = (onPerfEntry?: ReportHandler) => {\n  if (onPerfEntry && onPerfEntry instanceof Function) {\n    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n      getCLS(onPerfEntry);\n      getFID(onPerfEntry);\n      getFCP(onPerfEntry);\n      getLCP(onPerfEntry);\n      getTTFB(onPerfEntry);\n    });\n  }\n};\n\nexport default reportWebVitals;\n"],"sourceRoot":""}