{"version":3,"file":"PodcastPlayBar-RtviiSOZ.mjs","names":[],"sources":["../src/components/display/podcasts/PodcastPlayBar.vue","../src/components/display/podcasts/PodcastPlayBar.vue"],"sourcesContent":["<template>\n  <div class=\"d-flex align-items-center\">\n    <PodcastPlayBasicButton v-if=\"displayButonPlay\" :podcast=\"podcast\"/>\n    <div class=\"d-flex align-items-center podcast-play-bar flex-grow-1\">\n      <div class=\"me-2\">\n        {{ playedTime }}\n      </div>\n      <div class=\"position-relative flex-grow-1\">\n        <ProgressBar\n          :main-progress=\"percentProgress\"\n          class=\"medium\"\n          @mouseup=\"seekTo\"\n        />\n      </div>\n      <div class=\"ms-2\">\n        {{ totalTime }}\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ProgressBar from \"../../misc/ProgressBar.vue\";\nimport DurationHelper from \"../../../helper/durationHelper\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nconst PodcastPlayBasicButton = defineAsyncComponent(() => import(\"./PodcastPlayBasicButton.vue\"));\n\n\n//Props \nconst props = defineProps({\n  podcast: { default: () => ({}), type: Object as () => Podcast },\n  displayButonPlay:{ default: false, type: Boolean },\n})\n\n//Composables\nconst playerStore = usePlayerStore();\n\n//Computed\nconst percentProgress = computed(() => {\n  if (props.podcast?.podcastId !== playerStore.playerPodcast?.podcastId) {\n    return 0;\n  }\n  return !playerStore.playerElapsed ? 0 : playerStore.playerElapsed * 100;\n});\nconst playedTime = computed(() => {\n  if (props.podcast?.podcastId === playerStore.playerPodcast?.podcastId) {\n    if (\n      playerStore.playerElapsed &&\n      playerStore.playerElapsed > 0 &&\n      playerStore.playerTotal &&\n      playerStore.playerTotal > 0\n    ) {\n      return DurationHelper.formatDuration(\n        Math.round(playerStore.playerElapsed * playerStore.playerTotal),\n      );\n    }\n  }\n  return \"00:00\";\n});\nconst totalTime = computed(() => DurationHelper.formatDuration(Math.round(props.podcast.duration / 1000)));\n\n//Methods\nfunction seekTo(event: MouseEvent): void {\n  if (\n    !playerStore.playerPodcast ||\n    props.podcast?.podcastId !== playerStore.playerPodcast.podcastId\n  ) {\n    return;\n  }\n  const rect = (event.currentTarget as Element).getBoundingClientRect();\n  const barWidth = (event.currentTarget as Element).clientWidth;\n  const x = event.clientX - rect.left;\n  const percentPosition = x / barWidth;\n  playerStore.playerUpdateSeekTime(playerStore.playerTotal * percentPosition);\n}\n</script>","<template>\n  <div class=\"d-flex align-items-center\">\n    <PodcastPlayBasicButton v-if=\"displayButonPlay\" :podcast=\"podcast\"/>\n    <div class=\"d-flex align-items-center podcast-play-bar flex-grow-1\">\n      <div class=\"me-2\">\n        {{ playedTime }}\n      </div>\n      <div class=\"position-relative flex-grow-1\">\n        <ProgressBar\n          :main-progress=\"percentProgress\"\n          class=\"medium\"\n          @mouseup=\"seekTo\"\n        />\n      </div>\n      <div class=\"ms-2\">\n        {{ totalTime }}\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ProgressBar from \"../../misc/ProgressBar.vue\";\nimport DurationHelper from \"../../../helper/durationHelper\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nconst PodcastPlayBasicButton = defineAsyncComponent(() => import(\"./PodcastPlayBasicButton.vue\"));\n\n\n//Props \nconst props = defineProps({\n  podcast: { default: () => ({}), type: Object as () => Podcast },\n  displayButonPlay:{ default: false, type: Boolean },\n})\n\n//Composables\nconst playerStore = usePlayerStore();\n\n//Computed\nconst percentProgress = computed(() => {\n  if (props.podcast?.podcastId !== playerStore.playerPodcast?.podcastId) {\n    return 0;\n  }\n  return !playerStore.playerElapsed ? 0 : playerStore.playerElapsed * 100;\n});\nconst playedTime = computed(() => {\n  if (props.podcast?.podcastId === playerStore.playerPodcast?.podcastId) {\n    if (\n      playerStore.playerElapsed &&\n      playerStore.playerElapsed > 0 &&\n      playerStore.playerTotal &&\n      playerStore.playerTotal > 0\n    ) {\n      return DurationHelper.formatDuration(\n        Math.round(playerStore.playerElapsed * playerStore.playerTotal),\n      );\n    }\n  }\n  return \"00:00\";\n});\nconst totalTime = computed(() => DurationHelper.formatDuration(Math.round(props.podcast.duration / 1000)));\n\n//Methods\nfunction seekTo(event: MouseEvent): void {\n  if (\n    !playerStore.playerPodcast ||\n    props.podcast?.podcastId !== playerStore.playerPodcast.podcastId\n  ) {\n    return;\n  }\n  const rect = (event.currentTarget as Element).getBoundingClientRect();\n  const barWidth = (event.currentTarget as Element).clientWidth;\n  const x = event.clientX - rect.left;\n  const percentPosition = x / barWidth;\n  playerStore.playerUpdateSeekTime(playerStore.playerTotal * percentPosition);\n}\n</script>"],"mappings":";;;;;;;;;;;;;;;;;;;EA2BA,MAAM,yBAAyB,2BAA2B,OAAO,wCAA+B;EAIhG,MAAM,QAAQ;EAMd,MAAM,cAAc,eAAe;EAGnC,MAAM,kBAAkB,eAAe;GACrC,IAAI,MAAM,SAAS,cAAc,YAAY,eAAe,WAC1D,OAAO;GAET,OAAO,CAAC,YAAY,gBAAgB,IAAI,YAAY,gBAAgB;EACtE,CAAC;EACD,MAAM,aAAa,eAAe;GAChC,IAAI,MAAM,SAAS,cAAc,YAAY,eAAe;QAExD,YAAY,iBACZ,YAAY,gBAAgB,KAC5B,YAAY,eACZ,YAAY,cAAc,GAE1B,OAAO,uBAAe,eACpB,KAAK,MAAM,YAAY,gBAAgB,YAAY,WAAW,CAChE;GAAA;GAGJ,OAAO;EACT,CAAC;EACD,MAAM,YAAY,eAAe,uBAAe,eAAe,KAAK,MAAM,MAAM,QAAQ,WAAW,GAAI,CAAC,CAAC;EAGzG,SAAS,OAAO,OAAyB;GACvC,IACE,CAAC,YAAY,iBACb,MAAM,SAAS,cAAc,YAAY,cAAc,WAEvD;GAEF,MAAM,OAAQ,MAAM,cAA0B,sBAAsB;GACpE,MAAM,WAAY,MAAM,cAA0B;GAElD,MAAM,mBADI,MAAM,UAAU,KAAK,QACH;GAC5B,YAAY,qBAAqB,YAAY,cAAc,eAAe;EAC5E;;;;;;;;;;;;;;;;;;;;mBC3EO,OAAM,4BAA2B;mBAE/B,OAAM,yDAAwD;mBAC5D,OAAM,OAAM;mBAGZ,OAAM,gCAA+B;mBAOrC,OAAM,OAAM;;qBAbrB,mBAiBM,OAjBN,YAiBM,CAhB0B,OAAA,oBAAA,UAAA,GAA9B,YAAoE,OAAA,2BAAA;;EAAnB,SAAS,OAAA;+DAC1D,mBAcM,OAdN,YAcM;EAbJ,mBAEM,OAFN,YAEM,gBADD,OAAA,UAAU,GAAA,CAAA;EAEf,mBAMM,OANN,YAMM,CALJ,YAIE,OAAA,gBAAA;GAHC,iBAAe,OAAA;GAChB,OAAM;GACL,WAAS,OAAA;;EAGd,mBAEM,OAFN,YAEM,gBADD,OAAA,SAAS,GAAA,CAAA"}