{"version":3,"file":"PlayerLarge-DxbCmLJv.mjs","names":[],"sources":["../src/components/misc/player/PlayerLarge.vue","../src/components/misc/player/PlayerLarge.vue"],"sourcesContent":["<template>\n    <div\n        class=\"d-flex flex-column align-items-center my-2 flex-grow-1 player-text position-relative overflow-y-auto\"\n    >\n        <button\n            :title=\"t('Reduce')\"\n            class=\"player-reduce-button btn bg-transparent player-text\"\n            @click=\"changePlayerLargeVersion\"\n        >\n            <ChevronDownIcon :size=\"40\" />\n        </button>\n        <PlayerImage :image-width=\"200\" />\n        <PlayerTitle\n            :player-error=\"playerError\"\n            :hls-ready=\"hlsReady\"\n            title-class=\"h3\"\n        />\n        <PlayerChaptering class=\"justify-content-center w-100\" />\n        <div class=\"player-grow-large-content\">\n            <PlayerProgressBar\n                class-progress=\"large\"\n                :show-comments=\"true\"\n                :display-alert-bar=\"displayAlertBar\"\n                :percent-live-progress=\"percentLiveProgress\"\n                :duration-live-position=\"durationLivePosition\"\n                :player-error=\"playerError\"\n                :listen-time=\"listenTime\"\n            />\n            <div\n                v-if=\"!playerError && (!radioUrl || isAdPlaying)\"\n                class=\"d-flex justify-content-between\"\n            >\n                <div>{{ displayPlayTime }}</div>\n                <div>{{ displayTotalTime }}</div>\n            </div>\n            <RadioHistory v-if=\"radioUrl\" />\n        </div>\n\n\n        <!-- Transcription -->\n        <div\n            v-if=\"transcriptText.length > 0 && !isAdPlaying\"\n            class=\"transcript\"\n        >\n            <div class=\"flex-grow-1 p-1 text-center w-100 transcript-bg rounded\">\n                <div\n                    v-for=\"line, i in transcriptText\"\n                    :key=\"i\"\n                >\n                    {{ line }}\n                </div>\n            </div>\n            <ClassicLoading\n                v-if=\"generatingTranscriptLanguage\"\n                small\n                spinner-color=\"white\"\n                :loading-text=\"$t('Player - Generating subtitles', { language: generatingTranscriptLanguage })\"\n            />\n\n            <div\n                v-if=\"transcriptInfo\"\n                class=\"flex-grow-1 p-1 text-center transcript-info rounded\"\n            >\n                {{ transcriptInfo }}\n            </div>\n        </div>\n\n        <!-- Buttons -->\n        <div class=\"d-flex align-items-center flex-grow-1\">\n            <button\n                title=\"-15''\"\n                class=\"btn bg-transparent player-text\"\n                :disabled=\"isAdPlaying\"\n                @click=\"seekClick(-15)\"\n            >\n                <Rewind15Icon :size=\"44\" />\n            </button>\n            <PlayerPlayButton :player-error=\"playerError\" :is-big-button=\"true\" />\n\n            <button\n                title=\"+15''\"\n                class=\"btn bg-transparent player-text\"\n                :disabled=\"isAdPlaying\"\n                @click=\"seekClick(15)\"\n            >\n                <FastForward15Icon :size=\"44\" />\n            </button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport Rewind15Icon from \"vue-material-design-icons/Rewind15.vue\";\nimport FastForward15Icon from \"vue-material-design-icons/FastForward15.vue\";\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport {usePlayerDisplayTime} from \"../../composable/player/usePlayerDisplayTime\";\nimport PlayerChaptering from \"./chaptering/PlayerChaptering.vue\";\nimport PlayerImage from \"./elements/PlayerImage.vue\";\nimport PlayerTitle from \"./elements/PlayerTitle.vue\";\nimport PlayerPlayButton from \"./elements/PlayerPlayButton.vue\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useI18n } from \"vue-i18n\";\nimport { state as sdkParams } from \"../../../stores/ParamSdkStore\";\nimport ClassicLoading from \"../../form/ClassicLoading.vue\";\nimport { usePlayerTranscript } from \"../../composable/player/usePlayerTranscript\";\n\nconst RadioHistory = defineAsyncComponent(\n    () => import(\"./radio/RadioHistory.vue\"),\n);\nconst PlayerProgressBar = defineAsyncComponent(\n    () => import(\"./progressbar/PlayerProgressBar.vue\"),\n);\n\n//Props\ndefineProps( {\n    playerError: { default: false, type: Boolean },\n    displayAlertBar: { default: false, type: Boolean },\n    percentLiveProgress: { default: 0, type: Number },\n    durationLivePosition: { default: 0, type: Number },\n    listenTime: { default: 0, type: Number },\n    hlsReady: { default: false, type: Boolean },\n});\n\n//Emits\nconst emit = defineEmits(['changePlayerLargeVersion']);\n\n//Composables\nconst { \n    transcriptText,\n    radioUrl,\n    isAdPlaying,\n    displayPlayTime,\n    displayTotalTime,\n} = usePlayerDisplayTime();\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst { generatingTranscriptLanguage } = usePlayerTranscript();\n\n/** Info message to display regarding transcript */\nconst transcriptInfo = computed((): string|undefined => {\n    if (sdkParams.player.showAITranscriptWarning === true) {\n        return t('Player - Transcription - AI Warning');\n    }\n    return undefined;\n});\n\n//Methods\nfunction changePlayerLargeVersion() {\n    emit(\"changePlayerLargeVersion\");\n}\nfunction seekClick(addTime: number): void {\n    const audioPlayer: HTMLAudioElement | null =\n        document.querySelector(\"#audio-player\");\n    if (!audioPlayer) {\n        return;\n    }\n    const seekTo = audioPlayer.currentTime + addTime;\n    if (playerStore.playerPodcast || playerStore.playerLive) {\n        playerStore.playerUpdateSeekTime(seekTo > 0 ? seekTo : 0);\n    }\n    audioPlayer.currentTime = seekTo > 0 ? seekTo : 0;\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  .player-container .img-box {\n    width: 10rem;\n    height: 10rem;\n  }\n\n  .player-reduce-button {\n    position: absolute;\n    right: 0;\n    font-size: 1.2rem !important;\n  }\n\n  .player-grow-large-content {\n    width: 100%;\n    padding: 1rem 2rem;\n\n    @media (width <= 960px) {\n      padding: 0.5rem;\n    }\n  }\n\n  .transcript {\n    display: flex;\n    flex-direction: column;\n    padding: 0 1rem;\n    width: 100%;\n    \n    .transcript-info {\n      font-style: italic;\n      font-size: 16px;\n    }\n  }\n\n  .transcript-bg {\n    background: var(--octopus-player-transcript-bg-color);\n  }\n}\n\n.player-text {\n  color: var(--octopus-player-text-color);\n}\n</style>\n","<template>\n    <div\n        class=\"d-flex flex-column align-items-center my-2 flex-grow-1 player-text position-relative overflow-y-auto\"\n    >\n        <button\n            :title=\"t('Reduce')\"\n            class=\"player-reduce-button btn bg-transparent player-text\"\n            @click=\"changePlayerLargeVersion\"\n        >\n            <ChevronDownIcon :size=\"40\" />\n        </button>\n        <PlayerImage :image-width=\"200\" />\n        <PlayerTitle\n            :player-error=\"playerError\"\n            :hls-ready=\"hlsReady\"\n            title-class=\"h3\"\n        />\n        <PlayerChaptering class=\"justify-content-center w-100\" />\n        <div class=\"player-grow-large-content\">\n            <PlayerProgressBar\n                class-progress=\"large\"\n                :show-comments=\"true\"\n                :display-alert-bar=\"displayAlertBar\"\n                :percent-live-progress=\"percentLiveProgress\"\n                :duration-live-position=\"durationLivePosition\"\n                :player-error=\"playerError\"\n                :listen-time=\"listenTime\"\n            />\n            <div\n                v-if=\"!playerError && (!radioUrl || isAdPlaying)\"\n                class=\"d-flex justify-content-between\"\n            >\n                <div>{{ displayPlayTime }}</div>\n                <div>{{ displayTotalTime }}</div>\n            </div>\n            <RadioHistory v-if=\"radioUrl\" />\n        </div>\n\n\n        <!-- Transcription -->\n        <div\n            v-if=\"transcriptText.length > 0 && !isAdPlaying\"\n            class=\"transcript\"\n        >\n            <div class=\"flex-grow-1 p-1 text-center w-100 transcript-bg rounded\">\n                <div\n                    v-for=\"line, i in transcriptText\"\n                    :key=\"i\"\n                >\n                    {{ line }}\n                </div>\n            </div>\n            <ClassicLoading\n                v-if=\"generatingTranscriptLanguage\"\n                small\n                spinner-color=\"white\"\n                :loading-text=\"$t('Player - Generating subtitles', { language: generatingTranscriptLanguage })\"\n            />\n\n            <div\n                v-if=\"transcriptInfo\"\n                class=\"flex-grow-1 p-1 text-center transcript-info rounded\"\n            >\n                {{ transcriptInfo }}\n            </div>\n        </div>\n\n        <!-- Buttons -->\n        <div class=\"d-flex align-items-center flex-grow-1\">\n            <button\n                title=\"-15''\"\n                class=\"btn bg-transparent player-text\"\n                :disabled=\"isAdPlaying\"\n                @click=\"seekClick(-15)\"\n            >\n                <Rewind15Icon :size=\"44\" />\n            </button>\n            <PlayerPlayButton :player-error=\"playerError\" :is-big-button=\"true\" />\n\n            <button\n                title=\"+15''\"\n                class=\"btn bg-transparent player-text\"\n                :disabled=\"isAdPlaying\"\n                @click=\"seekClick(15)\"\n            >\n                <FastForward15Icon :size=\"44\" />\n            </button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport Rewind15Icon from \"vue-material-design-icons/Rewind15.vue\";\nimport FastForward15Icon from \"vue-material-design-icons/FastForward15.vue\";\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport {usePlayerDisplayTime} from \"../../composable/player/usePlayerDisplayTime\";\nimport PlayerChaptering from \"./chaptering/PlayerChaptering.vue\";\nimport PlayerImage from \"./elements/PlayerImage.vue\";\nimport PlayerTitle from \"./elements/PlayerTitle.vue\";\nimport PlayerPlayButton from \"./elements/PlayerPlayButton.vue\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useI18n } from \"vue-i18n\";\nimport { state as sdkParams } from \"../../../stores/ParamSdkStore\";\nimport ClassicLoading from \"../../form/ClassicLoading.vue\";\nimport { usePlayerTranscript } from \"../../composable/player/usePlayerTranscript\";\n\nconst RadioHistory = defineAsyncComponent(\n    () => import(\"./radio/RadioHistory.vue\"),\n);\nconst PlayerProgressBar = defineAsyncComponent(\n    () => import(\"./progressbar/PlayerProgressBar.vue\"),\n);\n\n//Props\ndefineProps( {\n    playerError: { default: false, type: Boolean },\n    displayAlertBar: { default: false, type: Boolean },\n    percentLiveProgress: { default: 0, type: Number },\n    durationLivePosition: { default: 0, type: Number },\n    listenTime: { default: 0, type: Number },\n    hlsReady: { default: false, type: Boolean },\n});\n\n//Emits\nconst emit = defineEmits(['changePlayerLargeVersion']);\n\n//Composables\nconst { \n    transcriptText,\n    radioUrl,\n    isAdPlaying,\n    displayPlayTime,\n    displayTotalTime,\n} = usePlayerDisplayTime();\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst { generatingTranscriptLanguage } = usePlayerTranscript();\n\n/** Info message to display regarding transcript */\nconst transcriptInfo = computed((): string|undefined => {\n    if (sdkParams.player.showAITranscriptWarning === true) {\n        return t('Player - Transcription - AI Warning');\n    }\n    return undefined;\n});\n\n//Methods\nfunction changePlayerLargeVersion() {\n    emit(\"changePlayerLargeVersion\");\n}\nfunction seekClick(addTime: number): void {\n    const audioPlayer: HTMLAudioElement | null =\n        document.querySelector(\"#audio-player\");\n    if (!audioPlayer) {\n        return;\n    }\n    const seekTo = audioPlayer.currentTime + addTime;\n    if (playerStore.playerPodcast || playerStore.playerLive) {\n        playerStore.playerUpdateSeekTime(seekTo > 0 ? seekTo : 0);\n    }\n    audioPlayer.currentTime = seekTo > 0 ? seekTo : 0;\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  .player-container .img-box {\n    width: 10rem;\n    height: 10rem;\n  }\n\n  .player-reduce-button {\n    position: absolute;\n    right: 0;\n    font-size: 1.2rem !important;\n  }\n\n  .player-grow-large-content {\n    width: 100%;\n    padding: 1rem 2rem;\n\n    @media (width <= 960px) {\n      padding: 0.5rem;\n    }\n  }\n\n  .transcript {\n    display: flex;\n    flex-direction: column;\n    padding: 0 1rem;\n    width: 100%;\n    \n    .transcript-info {\n      font-style: italic;\n      font-size: 16px;\n    }\n  }\n\n  .transcript-bg {\n    background: var(--octopus-player-transcript-bg-color);\n  }\n}\n\n.player-text {\n  color: var(--octopus-player-text-color);\n}\n</style>\n"],"mappings":"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"}