@saooti/octopus-sdk 42.0.3 → 42.0.5

package/dist/PodcastItem-6qkOg90q.mjs

@@ -0,0 +1,213 @@
+import { E as state } from "./classicApi-BKNiWOG4.mjs";
+import { n as debounce } from "./useResizePhone-CpfFUmfV.mjs";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { t as displayHelper_default } from "./displayHelper-CpXshNzz.mjs";
+import { t as useOrgaComputed } from "./useOrgaComputed-T8Mhcne0.mjs";
+import { t as useDayjs } from "./useDayjs-BqojyoqU.mjs";
+import { t as RightsIndicator_default } from "./RightsIndicator-DYhqEbAB.mjs";
+import { t as PodcastSeasonInfo_default } from "./PodcastSeasonInfo-BwD--f9z.mjs";
+import { t as PodcastImage_default } from "./PodcastImage-BrfDAORW.mjs";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineAsyncComponent, defineComponent, nextTick, normalizeClass, onBeforeMount, openBlock, ref, resolveComponent, toDisplayString, unref, useTemplateRef, withCtx } from "vue";
+import { useI18n } from "vue-i18n";
+import dayjs from "dayjs";
+//#region src/components/display/podcasts/AnimatorsItem.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$2 = {
+	key: 0,
+	class: "d-flex align-items-center justify-content-start animators-item"
+};
+//#endregion
+//#region src/components/display/podcasts/AnimatorsItem.vue
+var AnimatorsItem_default = /* @__PURE__ */ defineComponent({
+	__name: "AnimatorsItem",
+	props: { animator: {
+		default: void 0,
+		type: Object
+	} },
+	setup(__props) {
+		const props = __props;
+		const { t } = useI18n();
+		const animatorName = computed(() => `${props.animator?.firstName ?? ""} ${props.animator?.lastName ?? ""}`.trim());
+		return (_ctx, _cache) => {
+			const _component_router_link = resolveComponent("router-link");
+			return __props.animator ? (openBlock(), createElementBlock("div", _hoisted_1$2, [createVNode(_component_router_link, {
+				to: {
+					name: "participant",
+					params: { participantId: __props.animator.participantId }
+				},
+				title: unref(t)("Participant name page", { name: animatorName.value }),
+				class: "podcast-item-animator text-truncate"
+			}, {
+				default: withCtx(() => [createTextVNode(toDisplayString(animatorName.value), 1)]),
+				_: 1
+			}, 8, ["to", "title"])])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+//#region src/components/display/podcasts/PodcastItemInfo.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$1 = { class: "podcast-item-info" };
+var _hoisted_2$1 = { class: "podcast-item-status text-secondary h6 mx-2" };
+var _hoisted_3 = ["datetime"];
+var _hoisted_4 = { class: "mx-2 d-flex align-items-center justify-content-between mt-2" };
+var _hoisted_5 = {
+	key: 0,
+	class: "useless-div-for-podcastmaker"
+};
+//#endregion
+//#region src/components/display/podcasts/PodcastItemInfo.vue
+var PodcastItemInfo_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "PodcastItemInfo",
+	props: { podcast: {
+		default: () => ({}),
+		type: Object
+	} },
+	setup(__props) {
+		const PodcastPlayBar = defineAsyncComponent(() => import("./PodcastPlayBar-C7pDzmXr.mjs"));
+		const props = __props;
+		const { t } = useI18n();
+		const { isPodcastmaker } = useOrgaComputed();
+		const { formatDate } = useDayjs();
+		const date = computed(() => {
+			return formatDate(props.podcast.pubDate);
+		});
+		const orgaNameDisplay = computed(() => {
+			if (props.podcast.organisation.name.length > 30) return props.podcast.organisation.name.substring(0, 30) + "...";
+			return props.podcast.organisation.name;
+		});
+		return (_ctx, _cache) => {
+			const _component_router_link = resolveComponent("router-link");
+			return openBlock(), createElementBlock("div", _hoisted_1$1, [
+				createElementVNode("div", _hoisted_2$1, [createElementVNode("time", { datetime: __props.podcast.pubDate }, toDisplayString(date.value), 9, _hoisted_3), createVNode(PodcastSeasonInfo_default, { podcast: __props.podcast }, null, 8, ["podcast"])]),
+				createVNode(_component_router_link, {
+					to: {
+						name: "podcast",
+						params: { podcastId: __props.podcast.podcastId }
+					},
+					class: "text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line",
+					title: unref(t)("Episode name page", { name: __props.podcast.title })
+				}, {
+					default: withCtx(() => [createVNode(RightsIndicator_default, {
+						inline: "",
+						podcast: __props.podcast,
+						action: "edit"
+					}, null, 8, ["podcast"]), createTextVNode(" " + toDisplayString(__props.podcast.title), 1)]),
+					_: 1
+				}, 8, ["to", "title"]),
+				unref(state).emissionsPage.progressBar ? (openBlock(), createBlock(unref(PodcastPlayBar), {
+					key: 0,
+					"display-buton-play": true,
+					podcast: __props.podcast,
+					class: "me-2"
+				}, null, 8, ["podcast"])) : createCommentVNode("", true),
+				createElementVNode("div", _hoisted_4, [
+					unref(isPodcastmaker) ? (openBlock(), createElementBlock("div", _hoisted_5)) : createCommentVNode("", true),
+					__props.podcast.animators && 0 !== __props.podcast.animators.length ? (openBlock(), createBlock(AnimatorsItem_default, {
+						key: 1,
+						class: "w-0 flex-grow-1",
+						animator: __props.podcast.animators[0]
+					}, null, 8, ["animator"])) : createCommentVNode("", true),
+					!unref(isPodcastmaker) ? (openBlock(), createBlock(_component_router_link, {
+						key: 2,
+						to: {
+							name: "productor",
+							params: { productorId: __props.podcast.organisation.id }
+						},
+						class: "text-dark producer-podcast-item"
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString("© " + orgaNameDisplay.value), 1)]),
+						_: 1
+					}, 8, ["to"])) : createCommentVNode("", true)
+				])
+			]);
+		};
+	}
+}), [["__scopeId", "data-v-a6132bd8"]]);
+//#endregion
+//#region src/components/display/podcasts/PodcastItem.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-pubdate", "data-count"];
+var _hoisted_2 = ["innerHTML"];
+//#endregion
+//#region src/components/display/podcasts/PodcastItem.vue
+var PodcastItem_default = /* @__PURE__ */ defineComponent({
+	__name: "PodcastItem",
+	props: {
+		podcast: {},
+		fetchConference: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const isMobile = ref(false);
+		const firstDisplayDesc = ref(false);
+		const hoverDesc = ref(false);
+		const arrowDirection = ref("up");
+		const isDescriptionBig = ref(false);
+		const debounceShowDescriptionEvent = ref(void 0);
+		const debounceHideDescriptionEvent = ref(void 0);
+		const descriptionPodcastRef = useTemplateRef("descriptionPodcast");
+		const descriptionPodcastContainerRef = useTemplateRef("descriptionPodcastContainer");
+		const displayDate = computed(() => dayjs(props.podcast.pubDate).format());
+		const description = computed(() => props.podcast.description ?? "");
+		onBeforeMount(() => {
+			isMobile.value = window.matchMedia("(hover: none)").matches;
+			debounceShowDescriptionEvent.value = debounce(showDescription, 100);
+			debounceHideDescriptionEvent.value = debounce(hideDescription, 100);
+		});
+		function initDescription() {
+			if (firstDisplayDesc.value) return;
+			const podcastDesc = descriptionPodcastRef?.value;
+			const podcastDescContainer = descriptionPodcastContainerRef?.value;
+			if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) isDescriptionBig.value = true;
+			firstDisplayDesc.value = true;
+		}
+		function showDescription() {
+			arrowDirection.value = "down";
+			hoverDesc.value = true;
+			nextTick(() => {
+				initDescription();
+			});
+		}
+		function hideDescription() {
+			arrowDirection.value = "up";
+			hoverDesc.value = false;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("article", {
+				class: "podcast-item-container border",
+				"data-pubdate": displayDate.value,
+				"data-count": __props.podcast.downloadCount
+			}, [
+				createVNode(PodcastImage_default, {
+					podcast: __props.podcast,
+					"hide-play": hoverDesc.value && 0 !== description.value.length,
+					"display-description": 0 !== description.value.length,
+					"arrow-direction": arrowDirection.value,
+					"fetch-conference": __props.fetchConference,
+					onHideDescription: hideDescription,
+					onShowDescription: showDescription
+				}, null, 8, [
+					"podcast",
+					"hide-play",
+					"display-description",
+					"arrow-direction",
+					"fetch-conference"
+				]),
+				hoverDesc.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					ref: "descriptionPodcastContainer",
+					class: normalizeClass(["element-description description-podcast-item html-wysiwyg-content", [hoverDesc.value && "" !== description.value ? "visible" : "invisible", !isMobile.value && isDescriptionBig.value ? "after-element-description" : "mobile-description-podcast-item"]])
+				}, [createElementVNode("div", {
+					ref: "descriptionPodcast",
+					innerHTML: unref(displayHelper_default).urlify(description.value)
+				}, null, 8, _hoisted_2)], 2)) : createCommentVNode("", true),
+				createElementVNode("div", {
+					onMouseenter: _cache[0] || (_cache[0] = (...args) => debounceShowDescriptionEvent.value && debounceShowDescriptionEvent.value(...args)),
+					onMouseleave: _cache[1] || (_cache[1] = (...args) => debounceHideDescriptionEvent.value && debounceHideDescriptionEvent.value(...args))
+				}, [createVNode(PodcastItemInfo_default, { podcast: __props.podcast }, null, 8, ["podcast"])], 32)
+			], 8, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { PodcastItem_default as t };
+
+//# sourceMappingURL=PodcastItem-6qkOg90q.mjs.map

package/dist/PodcastItem-6qkOg90q.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastItem-6qkOg90q.mjs","names":[],"sources":["../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItem.vue","../src/components/display/podcasts/PodcastItem.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EAGtB,MAAM,eAAe,eAAe,GAAG,MAAM,UAAU,aAAa,GAAG,GAAI,MAAM,UAAU,YAAY,KAAK,KAAK,CAAC;;;UA9BxG,QAAA,YAAA,UAAA,GADR,mBAcM,OAdN,cAcM,CAVJ,YASc,wBAAA;IARX,IAAE;;8BAAkE,QAAA,SAAS,cAAa;;IAI1F,OAAO,MAAA,CAAA,EAAC,yBAAA,EAAA,MAAkC,aAAA,MAAY,CAAA;IACvD,OAAM;;2BAEY,CAAA,gBAAA,gBAAf,aAAA,KAAY,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;EEoDrB,MAAM,iBAAiB,2BACb,OAAO,gCACjB;EAGA,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,mBAAmB,gBAAgB;EAG3C,MAAM,EAAE,eAAe,SAAS;EAEhC,MAAM,OAAO,eAAuB;GAChC,OAAO,WAAW,MAAM,QAAQ,OAAO;EAC3C,CAAC;EAED,MAAM,kBAAkB,eAAc;GAClC,IAAI,MAAM,QAAQ,aAAa,KAAK,SAAS,IACzC,OAAO,MAAM,QAAQ,aAAa,KAAK,UAAU,GAAG,EAAE,IAAI;GAE9D,OAAO,MAAM,QAAQ,aAAa;EACtC,CAAC;;;uBAzFG,mBAkDM,OAlDN,cAkDM;IAjDF,mBAMM,OANN,cAMM,CALF,mBAEO,QAAA,EAFA,UAAU,QAAA,QAAQ,QAAA,GAAA,gBAClB,KAAA,KAAI,GAAA,GAAA,UAAA,GAGX,YAAwC,2BAAA,EAApB,SAAS,QAAA,QAAO,GAAA,MAAA,GAAA,CAAA,SAAA,CAAA,CAAA,CAAA;IAGxC,YAcc,wBAAA;KAbT,IAAE;;2BAA0E,QAAA,QAAQ,UAAS;;KAI9F,OAAM;KACL,OAAO,MAAA,CAAA,EAAC,qBAAA,EAAA,MAA8B,QAAA,QAAQ,MAAK,CAAA;;4BAMlD,CAJF,YAIE,yBAAA;MAHE,QAAA;MACC,SAAS,QAAA;MACV,QAAO;+CACT,MACF,gBAAG,QAAA,QAAQ,KAAK,GAAA,CAAA,CAAA,CAAA;;;IAIV,MAAA,KAAA,EAAM,cAAc,eAAA,UAAA,GAD9B,YAKE,MAAA,cAAA,GAAA;;KAHG,sBAAoB;KACpB,SAAS,QAAA;KACV,OAAM;;IAGV,mBAiBM,OAjBN,YAiBM;KAhBS,MAAA,cAAA,KAAA,UAAA,GAAX,mBAAkE,OAAlE,UAAkE,KAAA,mBAAA,IAAA,IAAA;KAExD,QAAA,QAAQ,aAAS,MAAU,QAAA,QAAQ,UAAU,UAAA,UAAA,GADvD,YAIE,uBAAA;;MAFE,OAAM;MACL,UAAU,QAAA,QAAQ,UAAS;;MAGrB,MAAA,cAAA,KAAA,UAAA,GADX,YASc,wBAAA;;MAPT,IAAE;;8BAAsF,QAAA,QAAQ,aAAa,GAAE;;MAIhH,OAAM;;6BAEsB,CAAA,gBAAA,gBAAA,OAAlB,gBAAA,KAAe,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;EEGzC,MAAM,QAAQ;EAMd,MAAM,WAAW,IAAI,KAAK;EAC1B,MAAM,mBAAmB,IAAI,KAAK;EAClC,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,iBAAiB,IAAI,IAAI;EAC/B,MAAM,mBAAmB,IAAI,KAAK;EAClC,MAAM,+BAA+D,IAAI,KAAA,CAAS;EAClF,MAAM,+BAA+D,IAAI,KAAA,CAAS;EAClF,MAAM,wBAAwB,eAAe,oBAAoB;EACjE,MAAM,iCAAiC,eAAe,6BAA6B;EAGnF,MAAM,cAAc,eAAe,MAAM,MAAM,QAAQ,OAAO,EAAE,OAAO,CAAC;EACxE,MAAM,cAAc,eAAe,MAAM,QAAQ,eAAe,EAAE;EAElE,oBAAkB;GAChB,SAAS,QAAQ,OAAO,WAAW,eAAe,EAAE;GACpD,6BAA6B,QAAQ,SAAS,iBAAiB,GAAG;GAClE,6BAA6B,QAAQ,SAAS,iBAAiB,GAAG;EACpE,CAAC;EAGD,SAAS,kBAAwB;GAC/B,IAAI,iBAAiB,OACnB;GAEF,MAAM,cAAc,uBAAuB;GAC3C,MAAM,uBAAuB,gCAAgC;GAC7D,IAAI,aAAa,eAAe,sBAAsB,cACpD,iBAAiB,QAAQ;GAE3B,iBAAiB,QAAQ;EAC3B;EACA,SAAS,kBAAwB;GAC/B,eAAe,QAAQ;GACvB,UAAU,QAAQ;GAClB,eAAe;IACb,gBAAgB;GAClB,CAAC;EACH;EACA,SAAS,kBAAwB;GAC/B,eAAe,QAAQ;GACvB,UAAU,QAAQ;EACpB;;uBAlGE,mBAmCU,WAAA;IAlCR,OAAM;IACL,gBAAc,YAAA;IACd,cAAY,QAAA,QAAQ;;IAErB,YAQE,sBAAA;KAPC,SAAS,QAAA;KACT,aAAW,UAAA,SAAS,MAAU,YAAA,MAAY;KAC1C,uBAAmB,MAAQ,YAAA,MAAY;KACvC,mBAAiB,eAAA;KACjB,oBAAkB,QAAA;KAClB,mBAAkB;KAClB,mBAAkB;;;;;;;;IAGb,UAAA,SAAA,UAAA,GADR,mBAYM,OAAA;;KAVJ,KAAI;KACJ,OAAK,eAAA,CAAC,qEAAmE,CACvD,UAAA,SAAS,OAAW,YAAA,QAAW,YAAA,aAAA,CAAqC,SAAA,SAAY,iBAAA,QAAgB,8BAAA,iCAAA,CAAA,CAAA;QAMlH,mBAA2E,OAAA;KAAtE,KAAI;KAAqB,WAAQ,MAAA,qBAAA,EAAc,OAAO,YAAA,KAAW;;IAGxE,mBAOM,OAAA;KANH,cAAU,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,6BAAA,SAAA,6BAAA,MAAA,GAAA,IAAA;KACZ,cAAU,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,6BAAA,SAAA,6BAAA,MAAA,GAAA,IAAA;QAEb,YAEE,yBAAA,EADC,SAAS,QAAA,QAAO,GAAA,MAAA,GAAA,CAAA,SAAA,CAAA,CAAA,GAAA,EAAA"}

package/dist/PodcastItem-DLD5hfk7.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastItem-DLD5hfk7.mjs","names":[],"sources":["../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItem.vue","../src/components/display/podcasts/PodcastItem.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/PodcastItem-ltLOqm-_.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastItem-ltLOqm-_.mjs","names":[],"sources":["../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItem.vue","../src/components/display/podcasts/PodcastItem.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/PodcastItem-naoxNwra.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastItem-naoxNwra.mjs","names":[],"sources":["../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/AnimatorsItem.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItemInfo.vue","../src/components/display/podcasts/PodcastItem.vue","../src/components/display/podcasts/PodcastItem.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n  <div\n    v-if=\"animator\"\n    class=\"d-flex align-items-center justify-content-start animators-item\"\n  >\n    <router-link\n      :to=\"{\n        name: 'participant',\n        params: { participantId: animator.participantId },\n      }\"\n      :title=\"t('Participant name page', { name: animatorName })\"\n      class=\"podcast-item-animator text-truncate\"\n    >\n      {{ animatorName }}\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Participant } from \"@/stores/class/general/participant\";\nimport { computed } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  animator: { default: undefined, type: Object as () => Participant },\n})\n\n//Composables\nconst { t } = useI18n();\n\n//Computed\nconst animatorName = computed(() => `${props.animator?.firstName ?? \"\"} ${ props.animator?.lastName ?? \"\"}`.trim());\n\n</script>\n\n<style lang=\"scss\">\n.octopus-app .podcast-item-animator {\n  font-size: 0.55rem;\n  font-weight: 300;\n  text-transform: capitalize;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n    <div class=\"podcast-item-info\">\n        <div class=\"podcast-item-status text-secondary h6 mx-2\">\n            <time :datetime=\"podcast.pubDate\">\n                {{ date }}\n            </time>\n\n            <PodcastSeasonInfo :podcast=\"podcast\" />\n        </div>\n\n        <router-link\n            :to=\"{\n                name: 'podcast',\n                params: { podcastId: podcast.podcastId },\n            }\"\n            class=\"text-dark flex-grow-1 title-podcast-item basic-line-clamp three-line\"\n            :title=\"t('Episode name page', { name: podcast.title })\"\n        >\n            <RightsIndicator\n                inline\n                :podcast=\"podcast\"\n                action=\"edit\"\n            />\n            {{ podcast.title }}\n        </router-link>\n\n        <PodcastPlayBar\n            v-if=\"state.emissionsPage.progressBar\"\n            :display-buton-play=\"true\"\n            :podcast=\"podcast\"\n            class=\"me-2\"\n        />\n\n        <div class=\"mx-2 d-flex align-items-center justify-content-between mt-2\">\n            <div v-if=\"isPodcastmaker\" class=\"useless-div-for-podcastmaker\" />\n            <AnimatorsItem\n                v-if=\"podcast.animators && 0 !== podcast.animators.length\"\n                class=\"w-0 flex-grow-1\"\n                :animator=\"podcast.animators[0]\"\n            />\n            <router-link\n                v-if=\"!isPodcastmaker\"\n                :to=\"{\n                    name: 'productor',\n                    params: { productorId: podcast.organisation.id },\n                }\"\n                class=\"text-dark producer-podcast-item\"\n            >\n                {{ \"© \" + orgaNameDisplay }}\n            </router-link>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport AnimatorsItem from \"./AnimatorsItem.vue\";\nimport RightsIndicator from \"../RightsIndicator.vue\"; \nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { state } from \"../../../stores/ParamSdkStore\";\nimport { useI18n } from \"vue-i18n\";\nimport PodcastSeasonInfo from \"./PodcastSeasonInfo.vue\";\nimport { useDayjs } from \"../../composable/useDayjs\";\n\nconst PodcastPlayBar = defineAsyncComponent(\n    () => import(\"./PodcastPlayBar.vue\"),\n);\n\n//Props \nconst props = defineProps({\n    podcast: { default: () => ({}), type: Object as () => Podcast },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker } = useOrgaComputed();\n\n//Computed\nconst { formatDate } = useDayjs();\n\nconst date = computed((): string => {\n    return formatDate(props.podcast.pubDate);\n});\n\nconst orgaNameDisplay = computed(() =>{\n    if (props.podcast.organisation.name.length > 30) {\n        return props.podcast.organisation.name.substring(0, 30) + \"...\";\n    }\n    return props.podcast.organisation.name;\n});\n</script>\n\n<style scoped lang=\"scss\">\n.title-podcast-item {\n    font-weight: 700;\n    margin: 0.25rem 0.5rem 0.5rem;\n    flex-grow: 1;\n    font-size: 0.9rem;\n    min-height: 3rem;\n    line-height: 1rem;\n}\n\n.producer-podcast-item {\n    font-size: 0.55rem;\n    color: var(--octopus-gray-text);\n    flex-shrink: 0;\n}\n\n.podcast-item-status {\n    display: flex;\n    justify-content: space-between;\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n","<template>\n  <article\n    class=\"podcast-item-container border\"\n    :data-pubdate=\"displayDate\"\n    :data-count=\"podcast.downloadCount\"\n  >\n    <PodcastImage\n      :podcast=\"podcast\"\n      :hide-play=\"hoverDesc && 0 !== description.length\"\n      :display-description=\"0 !== description.length\"\n      :arrow-direction=\"arrowDirection\"\n      :fetch-conference=\"fetchConference\"\n      @hide-description=\"hideDescription\"\n      @show-description=\"showDescription\"\n    />\n    <div\n      v-if=\"hoverDesc\"\n      ref=\"descriptionPodcastContainer\"\n      class=\"element-description description-podcast-item html-wysiwyg-content\"\n      :class=\"[\n        hoverDesc && '' !== description ? 'visible' : 'invisible',\n        !isMobile && isDescriptionBig ? 'after-element-description' : 'mobile-description-podcast-item',\n      ]\"\n    >\n      <!-- eslint-disable vue/no-v-html -->\n      <div ref=\"descriptionPodcast\" v-html=\"displayHelper.urlify(description)\" />\n      <!-- eslint-enable -->\n    </div>\n    <div\n      @mouseenter=\"debounceShowDescriptionEvent\"\n      @mouseleave=\"debounceHideDescriptionEvent\"\n    >\n      <PodcastItemInfo\n        :podcast=\"podcast\"\n      />\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport debounce from '../../../helper/debounceHelper';\nimport PodcastItemInfo from \"./PodcastItemInfo.vue\";\nimport PodcastImage from \"./PodcastImage.vue\";\nimport dayjs from \"dayjs\";\nimport { Podcast } from \"../../../stores/class/general/podcast\";\nimport { computed, nextTick, onBeforeMount, ref, Ref, useTemplateRef } from \"vue\";\nimport { Conference } from \"@/stores/class/conference/conference\";\n\nimport displayHelper from \"../../../helper/displayHelper\";\n\n//Props \nconst props = defineProps<{\n  podcast: Podcast;\n  fetchConference?: Conference;\n}>();\n\n//Data \nconst isMobile = ref(false);\nconst firstDisplayDesc = ref(false);\nconst hoverDesc = ref(false);\nconst arrowDirection = ref(\"up\");\nconst isDescriptionBig = ref(false);\nconst debounceShowDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst debounceHideDescriptionEvent: Ref< undefined | (() => void)> = ref(undefined);\nconst descriptionPodcastRef = useTemplateRef('descriptionPodcast');\nconst descriptionPodcastContainerRef = useTemplateRef('descriptionPodcastContainer');\n\n//Computed\nconst displayDate = computed(() => dayjs(props.podcast.pubDate).format());\nconst description = computed(() => props.podcast.description ?? \"\");\n\nonBeforeMount(()=>{\n  isMobile.value = window.matchMedia(\"(hover: none)\").matches;\n  debounceShowDescriptionEvent.value = debounce(showDescription, 100);\n  debounceHideDescriptionEvent.value = debounce(hideDescription, 100);\n})\n\n//Methods\nfunction initDescription(): void {\n  if (firstDisplayDesc.value) {\n    return;\n  }\n  const podcastDesc = descriptionPodcastRef?.value as HTMLElement;\n  const podcastDescContainer = descriptionPodcastContainerRef?.value as HTMLElement;\n  if (podcastDesc?.clientHeight > podcastDescContainer?.clientHeight) {\n    isDescriptionBig.value = true;\n  }\n  firstDisplayDesc.value = true;\n}\nfunction showDescription(): void {\n  arrowDirection.value = \"down\";\n  hoverDesc.value = true;\n  nextTick(() => {\n    initDescription();\n  });\n}\nfunction hideDescription(): void {\n  arrowDirection.value = \"up\";\n  hoverDesc.value = false;\n}\n</script>\n\n<style lang=\"scss\">\n\n.octopus-app {\n  .podcast-item-container {\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--octopus-border-radius);\n    position: relative;\n    width: var(--octopus-podcast-size);\n    height: 20.5rem;\n    overflow: hidden;\n    text-align: left;\n    background: var(--octopus-background);\n    flex-shrink: 0;\n\n    .description-podcast-item {\n      --octopus-max-height-description: var(--octopus-podcast-size);\n\n      padding: 1rem;\n      background-color: oklch(from var(--octopus-background) l c h / 90%);\n      position: absolute;\n      width: var(--octopus-podcast-size);\n      height: var(--octopus-podcast-size);\n      margin-top:0;\n\n      &.mobile-description-podcast-item {\n        overflow: auto;\n      }\n    }\n\n    @media (width <= 450px) {\n      width: var(--octopus-image-size);\n      height: 19rem;\n\n      .description-podcast-item {\n        height: var(--octopus-image-size);\n        width: var(--octopus-image-size);\n      }\n    }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EAGtB,MAAM,eAAe,eAAe,GAAG,MAAM,UAAU,aAAa,GAAG,GAAI,MAAM,UAAU,YAAY,KAAK,KAAK,CAAC;;;UA9BxG,QAAA,YAAA,UAAA,GADR,mBAcM,OAdN,cAcM,CAVJ,YASc,wBAAA;IARX,IAAE;;8BAAkE,QAAA,SAAS,cAAa;;IAI1F,OAAO,MAAA,CAAA,EAAC,yBAAA,EAAA,MAAkC,aAAA,MAAY,CAAA;IACvD,OAAM;;2BAEY,CAAA,gBAAA,gBAAf,aAAA,KAAY,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;EEoDrB,MAAM,iBAAiB,2BACb,OAAO,gCACjB;EAGA,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,mBAAmB,gBAAgB;EAG3C,MAAM,EAAE,eAAe,SAAS;EAEhC,MAAM,OAAO,eAAuB;GAChC,OAAO,WAAW,MAAM,QAAQ,OAAO;EAC3C,CAAC;EAED,MAAM,kBAAkB,eAAc;GAClC,IAAI,MAAM,QAAQ,aAAa,KAAK,SAAS,IACzC,OAAO,MAAM,QAAQ,aAAa,KAAK,UAAU,GAAG,EAAE,IAAI;GAE9D,OAAO,MAAM,QAAQ,aAAa;EACtC,CAAC;;;uBAzFG,mBAkDM,OAlDN,cAkDM;IAjDF,mBAMM,OANN,cAMM,CALF,mBAEO,QAAA,EAFA,UAAU,QAAA,QAAQ,QAAA,GAAA,gBAClB,KAAA,KAAI,GAAA,GAAA,UAAA,GAGX,YAAwC,2BAAA,EAApB,SAAS,QAAA,QAAO,GAAA,MAAA,GAAA,CAAA,SAAA,CAAA,CAAA,CAAA;IAGxC,YAcc,wBAAA;KAbT,IAAE;;2BAA0E,QAAA,QAAQ,UAAS;;KAI9F,OAAM;KACL,OAAO,MAAA,CAAA,EAAC,qBAAA,EAAA,MAA8B,QAAA,QAAQ,MAAK,CAAA;;4BAMlD,CAJF,YAIE,yBAAA;MAHE,QAAA;MACC,SAAS,QAAA;MACV,QAAO;+CACT,MACF,gBAAG,QAAA,QAAQ,KAAK,GAAA,CAAA,CAAA,CAAA;;;IAIV,MAAA,KAAA,EAAM,cAAc,eAAA,UAAA,GAD9B,YAKE,MAAA,cAAA,GAAA;;KAHG,sBAAoB;KACpB,SAAS,QAAA;KACV,OAAM;;IAGV,mBAiBM,OAjBN,YAiBM;KAhBS,MAAA,cAAA,KAAA,UAAA,GAAX,mBAAkE,OAAlE,UAAkE,KAAA,mBAAA,IAAA,IAAA;KAExD,QAAA,QAAQ,aAAS,MAAU,QAAA,QAAQ,UAAU,UAAA,UAAA,GADvD,YAIE,uBAAA;;MAFE,OAAM;MACL,UAAU,QAAA,QAAQ,UAAS;;MAGrB,MAAA,cAAA,KAAA,UAAA,GADX,YASc,wBAAA;;MAPT,IAAE;;8BAAsF,QAAA,QAAQ,aAAa,GAAE;;MAIhH,OAAM;;6BAEsB,CAAA,gBAAA,gBAAA,OAAlB,gBAAA,KAAe,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;EEGzC,MAAM,QAAQ;EAMd,MAAM,WAAW,IAAI,KAAK;EAC1B,MAAM,mBAAmB,IAAI,KAAK;EAClC,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,iBAAiB,IAAI,IAAI;EAC/B,MAAM,mBAAmB,IAAI,KAAK;EAClC,MAAM,+BAA+D,IAAI,KAAA,CAAS;EAClF,MAAM,+BAA+D,IAAI,KAAA,CAAS;EAClF,MAAM,wBAAwB,eAAe,oBAAoB;EACjE,MAAM,iCAAiC,eAAe,6BAA6B;EAGnF,MAAM,cAAc,eAAe,MAAM,MAAM,QAAQ,OAAO,EAAE,OAAO,CAAC;EACxE,MAAM,cAAc,eAAe,MAAM,QAAQ,eAAe,EAAE;EAElE,oBAAkB;GAChB,SAAS,QAAQ,OAAO,WAAW,eAAe,EAAE;GACpD,6BAA6B,QAAQ,SAAS,iBAAiB,GAAG;GAClE,6BAA6B,QAAQ,SAAS,iBAAiB,GAAG;EACpE,CAAC;EAGD,SAAS,kBAAwB;GAC/B,IAAI,iBAAiB,OACnB;GAEF,MAAM,cAAc,uBAAuB;GAC3C,MAAM,uBAAuB,gCAAgC;GAC7D,IAAI,aAAa,eAAe,sBAAsB,cACpD,iBAAiB,QAAQ;GAE3B,iBAAiB,QAAQ;EAC3B;EACA,SAAS,kBAAwB;GAC/B,eAAe,QAAQ;GACvB,UAAU,QAAQ;GAClB,eAAe;IACb,gBAAgB;GAClB,CAAC;EACH;EACA,SAAS,kBAAwB;GAC/B,eAAe,QAAQ;GACvB,UAAU,QAAQ;EACpB;;uBAlGE,mBAmCU,WAAA;IAlCR,OAAM;IACL,gBAAc,YAAA;IACd,cAAY,QAAA,QAAQ;;IAErB,YAQE,sBAAA;KAPC,SAAS,QAAA;KACT,aAAW,UAAA,SAAS,MAAU,YAAA,MAAY;KAC1C,uBAAmB,MAAQ,YAAA,MAAY;KACvC,mBAAiB,eAAA;KACjB,oBAAkB,QAAA;KAClB,mBAAkB;KAClB,mBAAkB;;;;;;;;IAGb,UAAA,SAAA,UAAA,GADR,mBAYM,OAAA;;KAVJ,KAAI;KACJ,OAAK,eAAA,CAAC,qEAAmE,CACvD,UAAA,SAAS,OAAW,YAAA,QAAW,YAAA,aAAA,CAAqC,SAAA,SAAY,iBAAA,QAAgB,8BAAA,iCAAA,CAAA,CAAA;QAMlH,mBAA2E,OAAA;KAAtE,KAAI;KAAqB,WAAQ,MAAA,qBAAA,EAAc,OAAO,YAAA,KAAW;;IAGxE,mBAOM,OAAA;KANH,cAAU,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,6BAAA,SAAA,6BAAA,MAAA,GAAA,IAAA;KACZ,cAAU,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,6BAAA,SAAA,6BAAA,MAAA,GAAA,IAAA;QAEb,YAEE,yBAAA,EADC,SAAS,QAAA,QAAO,GAAA,MAAA,GAAA,CAAA,SAAA,CAAA,CAAA,GAAA,EAAA"}

package/dist/PodcastList-5vFekv1m.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastList-5vFekv1m.mjs","names":[],"sources":["../src/components/display/playlist/PodcastList.vue","../src/components/display/playlist/PodcastList.vue"],"sourcesContent":["<!--\n  Component displaying a list of podcasts IN A PLAYLIST\n  Do not confuse this with PodcastList from podcasts\n-->\n<template>\n  <div>\n    <h3 class=\"mb-3 align-self-baseline\">\n      {{ titleList }}\n    </h3>\n\n    <ClassicSearch\n      v-if=\"!loading && notEmptyPlaylist\"\n      v-model:text-init=\"searchPattern\"\n      class=\"align-self-baseline mb-2\"\n      id-search=\"podcast-list-search\"\n      :label=\"t('Search')\"\n    />\n\n    <ListPaginate\n      id=\"podcastPlaylistListPaginate\"\n      v-model:first=\"dfirst\"\n      v-model:rows-per-page=\"dsize\"\n      v-model:is-mobile=\"isMobile\"\n      :text-count=\"\n        podcasts.length > 1\n          ? `${t('Number podcasts', { nb: podcasts.length })}`\n          : undefined\n      \"\n      :total-count=\"podcasts.length\"\n      :loading=\"loading\"\n      :loading-text=\"loading ? t('Loading podcasts ...') : undefined\"\n      :error-text=\"\n        !loading && !podcasts.length && notEmptyPlaylist\n          ? t(`No podcast match your query`)\n          : undefined\n      \"\n      :player-responsive=\"true\"\n      :force-update-parameters=\"true\"\n    >\n      <template #list>\n        <div class=\"octopus-element-list\">\n          <ClassicLazy\n            v-for=\"p in podcastsDisplay\"\n            :key=\"p.podcastId\"\n            :min-height=\"410\"\n          >\n            <PodcastItem\n              v-if=\"0 !== p.podcastId\"\n              :podcast=\"p\"\n            />\n\n            <template #preview>\n              <router-link\n                :to=\"{\n                  name: 'podcast',\n                  params: { podcastId: p.podcastId },\n                }\"\n                :title=\"t('Episode name page', { name: p.title })\"\n              >\n                {{ p.title }}\n              </router-link>\n            </template>\n          </ClassicLazy>\n        </div>\n      </template>\n    </ListPaginate>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ListPaginate from \"../list/ListPaginate.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport classicApi from \"../../../api/classicApi\";\nimport PodcastItem from \"../podcasts/PodcastItem.vue\";\nimport ClassicSearch from \"../../form/ClassicSearch.vue\";\nimport ClassicLazy from \"../../misc/ClassicLazy.vue\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { Playlist } from \"@/stores/class/general/playlist\";\nimport { computed, onBeforeMount, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\nimport { playlistApi } from \"../../../api/playlistApi\";\n\n//Props \nconst props = defineProps({\n  playlist: { default: () => ({}), type: Object as () => Playlist },\n  first: { default: 0, type: Number },\n  size: { default: 30, type: Number },\n  query: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"update:query\"]);\n\n//Data \nconst loading = ref(true);\nconst podcasts: Ref<Array<Podcast>> = ref([]);\nconst podcastsQuery: Ref<Array<Podcast>> = ref([]);\nconst dfirst = ref(props.first);\nconst dsize = ref(props.size);\nconst searchPattern = ref(\"\");\nconst isMobile = ref(false);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst { isEditRights } = useOrgaComputed();\n\n//Computed\nconst titleList = computed(() => notEmptyPlaylist.value? t(\"Podcasts in the playlist\"): t(\"No podcasts in the playlist\"));\nconst notEmptyPlaylist = computed(() => 0 !== Object.keys(props.playlist.samplingViews ?? []).length);\nconst podcastsDisplay = computed(() => {\n  if (isMobile.value) {\n    return podcastsQuery.value.slice(\n      0,\n      Math.min(dfirst.value + dsize.value, podcasts.value.length),\n    );\n  }\n  return podcastsQuery.value.slice(\n    dfirst.value,\n    Math.min(dfirst.value + dsize.value, podcasts.value.length),\n  );\n});\nconst editRight = computed(() =>isEditRights(props.playlist.organisation?.id));\n\n//Watch\nwatch(searchPattern,() => {\n  emit('update:query', searchPattern.value);\n  if (\"\" !== searchPattern.value) {\n    podcastsQuery.value = podcasts.value.filter((el: Podcast) => {\n      return el.title\n        .toLowerCase()\n        .includes(searchPattern.value.toLowerCase());\n    });\n  } else {\n    podcastsQuery.value = podcasts.value;\n  }\n});\n\nonBeforeMount(fetchContent);\n\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  if (notEmptyPlaylist.value) {\n    podcasts.value.length = 0;\n    loading.value = true;\n    try {\n      podcasts.value = await playlistApi.getContentFull(props.playlist.playlistId);\n      if (!editRight.value) {\n        podcasts.value = podcasts.value.filter((p: Podcast | null) => {\n          return (\n            null !== p &&\n            (!p.availability || true === p.availability.visibility)\n          );\n        });\n      }\n      podcastsQuery.value = podcasts.value;\n      searchPattern.value = props.query ?? \"\";\n    } catch (error) {\n      handle403(error as AxiosError);\n    }\n  }\n  loading.value = false;\n}\n</script>\n\n","<!--\n  Component displaying a list of podcasts IN A PLAYLIST\n  Do not confuse this with PodcastList from podcasts\n-->\n<template>\n  <div>\n    <h3 class=\"mb-3 align-self-baseline\">\n      {{ titleList }}\n    </h3>\n\n    <ClassicSearch\n      v-if=\"!loading && notEmptyPlaylist\"\n      v-model:text-init=\"searchPattern\"\n      class=\"align-self-baseline mb-2\"\n      id-search=\"podcast-list-search\"\n      :label=\"t('Search')\"\n    />\n\n    <ListPaginate\n      id=\"podcastPlaylistListPaginate\"\n      v-model:first=\"dfirst\"\n      v-model:rows-per-page=\"dsize\"\n      v-model:is-mobile=\"isMobile\"\n      :text-count=\"\n        podcasts.length > 1\n          ? `${t('Number podcasts', { nb: podcasts.length })}`\n          : undefined\n      \"\n      :total-count=\"podcasts.length\"\n      :loading=\"loading\"\n      :loading-text=\"loading ? t('Loading podcasts ...') : undefined\"\n      :error-text=\"\n        !loading && !podcasts.length && notEmptyPlaylist\n          ? t(`No podcast match your query`)\n          : undefined\n      \"\n      :player-responsive=\"true\"\n      :force-update-parameters=\"true\"\n    >\n      <template #list>\n        <div class=\"octopus-element-list\">\n          <ClassicLazy\n            v-for=\"p in podcastsDisplay\"\n            :key=\"p.podcastId\"\n            :min-height=\"410\"\n          >\n            <PodcastItem\n              v-if=\"0 !== p.podcastId\"\n              :podcast=\"p\"\n            />\n\n            <template #preview>\n              <router-link\n                :to=\"{\n                  name: 'podcast',\n                  params: { podcastId: p.podcastId },\n                }\"\n                :title=\"t('Episode name page', { name: p.title })\"\n              >\n                {{ p.title }}\n              </router-link>\n            </template>\n          </ClassicLazy>\n        </div>\n      </template>\n    </ListPaginate>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ListPaginate from \"../list/ListPaginate.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport {useOrgaComputed} from \"../../composable/useOrgaComputed\";\nimport classicApi from \"../../../api/classicApi\";\nimport PodcastItem from \"../podcasts/PodcastItem.vue\";\nimport ClassicSearch from \"../../form/ClassicSearch.vue\";\nimport ClassicLazy from \"../../misc/ClassicLazy.vue\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { Playlist } from \"@/stores/class/general/playlist\";\nimport { computed, onBeforeMount, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\nimport { playlistApi } from \"../../../api/playlistApi\";\n\n//Props \nconst props = defineProps({\n  playlist: { default: () => ({}), type: Object as () => Playlist },\n  first: { default: 0, type: Number },\n  size: { default: 30, type: Number },\n  query: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"update:query\"]);\n\n//Data \nconst loading = ref(true);\nconst podcasts: Ref<Array<Podcast>> = ref([]);\nconst podcastsQuery: Ref<Array<Podcast>> = ref([]);\nconst dfirst = ref(props.first);\nconst dsize = ref(props.size);\nconst searchPattern = ref(\"\");\nconst isMobile = ref(false);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst { isEditRights } = useOrgaComputed();\n\n//Computed\nconst titleList = computed(() => notEmptyPlaylist.value? t(\"Podcasts in the playlist\"): t(\"No podcasts in the playlist\"));\nconst notEmptyPlaylist = computed(() => 0 !== Object.keys(props.playlist.samplingViews ?? []).length);\nconst podcastsDisplay = computed(() => {\n  if (isMobile.value) {\n    return podcastsQuery.value.slice(\n      0,\n      Math.min(dfirst.value + dsize.value, podcasts.value.length),\n    );\n  }\n  return podcastsQuery.value.slice(\n    dfirst.value,\n    Math.min(dfirst.value + dsize.value, podcasts.value.length),\n  );\n});\nconst editRight = computed(() =>isEditRights(props.playlist.organisation?.id));\n\n//Watch\nwatch(searchPattern,() => {\n  emit('update:query', searchPattern.value);\n  if (\"\" !== searchPattern.value) {\n    podcastsQuery.value = podcasts.value.filter((el: Podcast) => {\n      return el.title\n        .toLowerCase()\n        .includes(searchPattern.value.toLowerCase());\n    });\n  } else {\n    podcastsQuery.value = podcasts.value;\n  }\n});\n\nonBeforeMount(fetchContent);\n\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  if (notEmptyPlaylist.value) {\n    podcasts.value.length = 0;\n    loading.value = true;\n    try {\n      podcasts.value = await playlistApi.getContentFull(props.playlist.playlistId);\n      if (!editRight.value) {\n        podcasts.value = podcasts.value.filter((p: Podcast | null) => {\n          return (\n            null !== p &&\n            (!p.availability || true === p.availability.visibility)\n          );\n        });\n      }\n      podcastsQuery.value = podcasts.value;\n      searchPattern.value = props.query ?? \"\";\n    } catch (error) {\n      handle403(error as AxiosError);\n    }\n  }\n  loading.value = false;\n}\n</script>\n\n"],"mappings":"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"}

package/dist/PodcastList-B60tYB2G.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastList-B60tYB2G.mjs","names":[],"sources":["../src/components/display/podcasts/PodcastList.vue","../src/components/display/podcasts/PodcastList.vue"],"sourcesContent":["<!--\n  Component displaying a list of podcast\n  DO NOT confuse this with PodcastList from playlist\n-->\n<template>\n  <ListPaginate\n    id=\"podcastListPaginate\"\n    v-model:first=\"dfirst\"\n    v-model:rows-per-page=\"dsize\"\n    v-model:is-mobile=\"isMobile\"\n    :text-count=\"\n      showCount && podcasts.length > 1\n        ? t('Number podcasts', { nb: totalCount }) + sortText\n        : undefined\n    \"\n    :total-count=\"totalCount\"\n    :loading=\"loading\"\n    :loading-text=\"loading ? t('Loading podcasts ...') : undefined\"\n    :error-text=\"\n      !loading && !podcasts.length\n        ? t(`No podcast match your query`)\n        : undefined\n    \"\n    :just-size-chosen=\"justSizeChosen\"\n    :player-responsive=\"true\"\n    :force-update-parameters=\"forceUpdateParameters\"\n  >\n    <template #list>\n      <div class=\"octopus-element-list\">\n        <ClassicLazy\n          v-for=\"p in displayArray\"\n          :key=\"p.podcastId\"\n          :min-height=\"410\"\n        >\n          <PodcastItem\n            v-if=\"0 !== p.podcastId\"\n            :podcast=\"p\"\n          />\n          <template #preview>\n            <router-link\n              :to=\"{\n                name: 'podcast',\n                params: { podcastId: p.podcastId },\n              }\"\n              :title=\"t('Episode name page', { name: p.title })\"\n            >\n              {{ p.title }}\n            </router-link>\n          </template>\n        </ClassicLazy>\n      </div>\n    </template>\n  </ListPaginate>\n</template>\n\n<script setup lang=\"ts\">\nimport ListPaginate from \"../list/ListPaginate.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport PodcastItem from \"./PodcastItem.vue\";\nimport ClassicLazy from \"../../misc/ClassicLazy.vue\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Podcast, PodcastProcessingStatus, emptyPodcastData } from \"../../../stores/class/general/podcast\";\nimport { computed, onBeforeMount, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\nimport { podcastApi, PodcastMonetisation, PodcastSearchOptions, PodcastSort } from \"../../../api/podcastApi\";\nimport { EmissionGroup } from \"@/api/groupsApi\";\n\n//Props \nconst props = withDefaults(defineProps<{\n  first?: number;\n  size?: number;\n  organisationId?: Array<string>;\n  emissionId?: number;\n  iabId?: number;\n  participantId?: number;\n  query?: string;\n  monetisable?: PodcastMonetisation;\n  popularSort?: boolean;\n  reload?: boolean;\n  before?: string;\n  after?: string;\n  includeHidden?: boolean;\n  /** Enable the display of number of items in ListPaginate */\n  showCount?: boolean;\n  displaySortText?: boolean;\n  /** Criteria to sort on */\n  sortCriteria?: PodcastSort;\n  validity?: 'true'|'false'|''|boolean; // TODO improve this\n  rubriqueId?: Array<number>;\n  rubriquageId?: Array<number>;\n  noRubriquageId?: Array<number>;\n  justSizeChosen?: boolean;\n  withVideo?: boolean;\n  includeTag?: Array<string>;\n  forceUpdateParameters?: boolean;\n  /** The beneficiaries to filter on */\n  beneficiaries?: Array<string>;\n  /** The emission groups to filter on */\n  emissionGroups?: Array<EmissionGroup>;\n  /** The seasons to filter on */\n  seasons?: Array<number>;\n}>(), {\n  first: 0,\n  size: 30,\n  popularSort: false,\n  reload: false,\n  includeHidden: false,\n  showCount: false,\n  displaySortText: true,\n  validity: '',\n  justSizeChosen: false,\n  withVideo: undefined,\n  forceUpdateParameters: false\n});\n\n//Emits\nconst emit = defineEmits([\"fetch\", \"emptyList\"]);\n\n//Data \nconst loading = ref(true);\nconst dfirst = ref(props.first);\nconst dsize = ref(props.size);\nconst totalCount = ref(0);\nconst isMobile = ref(false);\nconst podcasts: Ref<Array<Podcast>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst displayArray = computed(() => {\n  if (isMobile.value || props.justSizeChosen) {\n    return podcasts.value;\n  }\n  return podcasts.value.slice(\n    dfirst.value,\n    Math.min(dfirst.value + dsize.value, totalCount.value),\n  );\n});\nconst changePaginate = computed(() => `${props.first}|${props.size}`);\nconst changed = computed(() => {\n  return `${organisation.value}|${props.emissionId}|${props.sortCriteria}|${sort.value}\n    ${props.iabId}|${props.participantId}|${props.query}|${props.monetisable}|${props.popularSort}|\n    ${props.rubriqueId}|${props.rubriquageId}|${props.before}|${props.after}|${props.includeHidden}|${props.noRubriquageId}|${props.validity}|\n    ${props.withVideo}|${props.includeTag}|${props.beneficiaries}|${props.emissionGroups}`;\n});\nconst organisation = computed(() => {\n  if (props.organisationId) {\n    return props.organisationId;\n  }\n  return filterStore.filterOrgaId ? [filterStore.filterOrgaId] : [];\n});\nconst sort = computed(() => props.popularSort ? PodcastSort.POPULARITY : (props.sortCriteria ?? PodcastSort.DATE));\nconst sortText = computed(() => {\n  if (!props.displaySortText) {\n    return \"\";\n  }\n  switch (props.sortCriteria) {\n    case \"SCORE\":\n      return \" \" + t(\"sort by score\");\n    case \"DATE\":\n      return \" \" + t(\"sort by date\");\n    case \"NAME\":\n      return \" \" + t(\"sort by alphabetical\");\n    default:\n      return \" \" + t(\"sort by date\");\n  }\n});\n\n//Watch\nwatch(changePaginate, () => {\n  dfirst.value = props.first;\n  dsize.value = props.size;\n});\nwatch(changed, () => fetchContent(true));\nwatch(()=>props.reload, () => fetchContent(true));\nwatch(dsize, () => fetchContent(true));\nwatch(dfirst, () => {\n  if (\n    !podcasts.value[dfirst.value] ||\n    0 === podcasts.value[dfirst.value].podcastId\n  ) {\n    fetchContent(false);\n  }\n});\n\nonBeforeMount(()=>fetchContent(false))\n\n//Methods\nasync function fetchContent(reset: boolean): Promise<void> {\n  loading.value = true;\n\n  // Sadly we kinda have no idea what will be passed as 'validity', we need to\n  // handle multiple cases.\n  let validity: undefined|boolean = undefined;\n  if (props.validity !== undefined && props.validity !== '') {\n    validity = props.validity === 'true' || props.validity === true;\n  }\n  \n  const param: PodcastSearchOptions = {\n    first: reset ? 0 : dfirst.value,\n    size: dsize.value,\n    organisationId: organisation.value,\n    emissionId: props.emissionId,\n    groupId: props.emissionGroups?.map(g => g.groupId),\n    iabId: props.iabId,\n    participantId: props.participantId,\n    query: props.query,\n    monetisable: props.monetisable,\n    sort: sort.value,\n    pubDateBefore: props.before,\n    pubDateAfter: props.after,\n    noRubriquageId: props.noRubriquageId?.length\n      ? props.noRubriquageId\n      : undefined,\n    rubriqueId: props.rubriqueId?.length ? props.rubriqueId : undefined,\n    rubriquageId: props.rubriquageId?.length ? props.rubriquageId : undefined,\n    includeHidden: props.includeHidden,\n    validity,\n    /* publisherId:\n      !this.onlyValid && !authStore.isRoleProduction\n        ? authStore.authProfile?.userId\n        : undefined, */\n    processingStatus: [PodcastProcessingStatus.Ready, PodcastProcessingStatus.Processing],\n    withVideo: props.withVideo,\n    tags: props.includeTag?.length ? props.includeTag : undefined,\n    beneficiaries: props.beneficiaries ?? undefined,\n    season: props.seasons\n  };\n\n  try {\n    const data = await podcastApi.searchFull(param, true);\n    afterFetching(reset, data);\n  } catch (error) {\n    if (error instanceof AxiosError) {\n      handle403(error as AxiosError);\n    } else {\n      console.error('error', error);\n    }\n  }\n}\nfunction afterFetching(\n  reset: boolean,\n  data: { count: number; result: Array<Podcast>; sort: string },\n): void {\n  if (reset) {\n    dfirst.value = 0;\n    podcasts.value.length = 0;\n  }\n  if (dfirst.value > podcasts.value.length) {\n    for (\n      let i = podcasts.value.length - 1, len = dfirst.value + dsize.value;\n      i < len;\n      i++\n    ) {\n      podcasts.value.push(emptyPodcastData());\n    }\n  }\n  const responsePodcasts = data.result.filter((p: Podcast | null) => {\n    return null !== p;\n  });\n  podcasts.value = podcasts.value\n    .slice(0, dfirst.value)\n    .concat(responsePodcasts)\n    .concat(\n      podcasts.value.slice(dfirst.value + dsize.value, podcasts.value.length),\n    );\n  emit(\"fetch\", podcasts.value);\n  totalCount.value = props.justSizeChosen ? props.size : data.count;\n  if (0 === podcasts.value.length) {\n    emit(\"emptyList\");\n  }\n  loading.value = false;\n}\n</script>\n","<!--\n  Component displaying a list of podcast\n  DO NOT confuse this with PodcastList from playlist\n-->\n<template>\n  <ListPaginate\n    id=\"podcastListPaginate\"\n    v-model:first=\"dfirst\"\n    v-model:rows-per-page=\"dsize\"\n    v-model:is-mobile=\"isMobile\"\n    :text-count=\"\n      showCount && podcasts.length > 1\n        ? t('Number podcasts', { nb: totalCount }) + sortText\n        : undefined\n    \"\n    :total-count=\"totalCount\"\n    :loading=\"loading\"\n    :loading-text=\"loading ? t('Loading podcasts ...') : undefined\"\n    :error-text=\"\n      !loading && !podcasts.length\n        ? t(`No podcast match your query`)\n        : undefined\n    \"\n    :just-size-chosen=\"justSizeChosen\"\n    :player-responsive=\"true\"\n    :force-update-parameters=\"forceUpdateParameters\"\n  >\n    <template #list>\n      <div class=\"octopus-element-list\">\n        <ClassicLazy\n          v-for=\"p in displayArray\"\n          :key=\"p.podcastId\"\n          :min-height=\"410\"\n        >\n          <PodcastItem\n            v-if=\"0 !== p.podcastId\"\n            :podcast=\"p\"\n          />\n          <template #preview>\n            <router-link\n              :to=\"{\n                name: 'podcast',\n                params: { podcastId: p.podcastId },\n              }\"\n              :title=\"t('Episode name page', { name: p.title })\"\n            >\n              {{ p.title }}\n            </router-link>\n          </template>\n        </ClassicLazy>\n      </div>\n    </template>\n  </ListPaginate>\n</template>\n\n<script setup lang=\"ts\">\nimport ListPaginate from \"../list/ListPaginate.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport PodcastItem from \"./PodcastItem.vue\";\nimport ClassicLazy from \"../../misc/ClassicLazy.vue\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Podcast, PodcastProcessingStatus, emptyPodcastData } from \"../../../stores/class/general/podcast\";\nimport { computed, onBeforeMount, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\nimport { podcastApi, PodcastMonetisation, PodcastSearchOptions, PodcastSort } from \"../../../api/podcastApi\";\nimport { EmissionGroup } from \"@/api/groupsApi\";\n\n//Props \nconst props = withDefaults(defineProps<{\n  first?: number;\n  size?: number;\n  organisationId?: Array<string>;\n  emissionId?: number;\n  iabId?: number;\n  participantId?: number;\n  query?: string;\n  monetisable?: PodcastMonetisation;\n  popularSort?: boolean;\n  reload?: boolean;\n  before?: string;\n  after?: string;\n  includeHidden?: boolean;\n  /** Enable the display of number of items in ListPaginate */\n  showCount?: boolean;\n  displaySortText?: boolean;\n  /** Criteria to sort on */\n  sortCriteria?: PodcastSort;\n  validity?: 'true'|'false'|''|boolean; // TODO improve this\n  rubriqueId?: Array<number>;\n  rubriquageId?: Array<number>;\n  noRubriquageId?: Array<number>;\n  justSizeChosen?: boolean;\n  withVideo?: boolean;\n  includeTag?: Array<string>;\n  forceUpdateParameters?: boolean;\n  /** The beneficiaries to filter on */\n  beneficiaries?: Array<string>;\n  /** The emission groups to filter on */\n  emissionGroups?: Array<EmissionGroup>;\n  /** The seasons to filter on */\n  seasons?: Array<number>;\n}>(), {\n  first: 0,\n  size: 30,\n  popularSort: false,\n  reload: false,\n  includeHidden: false,\n  showCount: false,\n  displaySortText: true,\n  validity: '',\n  justSizeChosen: false,\n  withVideo: undefined,\n  forceUpdateParameters: false\n});\n\n//Emits\nconst emit = defineEmits([\"fetch\", \"emptyList\"]);\n\n//Data \nconst loading = ref(true);\nconst dfirst = ref(props.first);\nconst dsize = ref(props.size);\nconst totalCount = ref(0);\nconst isMobile = ref(false);\nconst podcasts: Ref<Array<Podcast>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst displayArray = computed(() => {\n  if (isMobile.value || props.justSizeChosen) {\n    return podcasts.value;\n  }\n  return podcasts.value.slice(\n    dfirst.value,\n    Math.min(dfirst.value + dsize.value, totalCount.value),\n  );\n});\nconst changePaginate = computed(() => `${props.first}|${props.size}`);\nconst changed = computed(() => {\n  return `${organisation.value}|${props.emissionId}|${props.sortCriteria}|${sort.value}\n    ${props.iabId}|${props.participantId}|${props.query}|${props.monetisable}|${props.popularSort}|\n    ${props.rubriqueId}|${props.rubriquageId}|${props.before}|${props.after}|${props.includeHidden}|${props.noRubriquageId}|${props.validity}|\n    ${props.withVideo}|${props.includeTag}|${props.beneficiaries}|${props.emissionGroups}`;\n});\nconst organisation = computed(() => {\n  if (props.organisationId) {\n    return props.organisationId;\n  }\n  return filterStore.filterOrgaId ? [filterStore.filterOrgaId] : [];\n});\nconst sort = computed(() => props.popularSort ? PodcastSort.POPULARITY : (props.sortCriteria ?? PodcastSort.DATE));\nconst sortText = computed(() => {\n  if (!props.displaySortText) {\n    return \"\";\n  }\n  switch (props.sortCriteria) {\n    case \"SCORE\":\n      return \" \" + t(\"sort by score\");\n    case \"DATE\":\n      return \" \" + t(\"sort by date\");\n    case \"NAME\":\n      return \" \" + t(\"sort by alphabetical\");\n    default:\n      return \" \" + t(\"sort by date\");\n  }\n});\n\n//Watch\nwatch(changePaginate, () => {\n  dfirst.value = props.first;\n  dsize.value = props.size;\n});\nwatch(changed, () => fetchContent(true));\nwatch(()=>props.reload, () => fetchContent(true));\nwatch(dsize, () => fetchContent(true));\nwatch(dfirst, () => {\n  if (\n    !podcasts.value[dfirst.value] ||\n    0 === podcasts.value[dfirst.value].podcastId\n  ) {\n    fetchContent(false);\n  }\n});\n\nonBeforeMount(()=>fetchContent(false))\n\n//Methods\nasync function fetchContent(reset: boolean): Promise<void> {\n  loading.value = true;\n\n  // Sadly we kinda have no idea what will be passed as 'validity', we need to\n  // handle multiple cases.\n  let validity: undefined|boolean = undefined;\n  if (props.validity !== undefined && props.validity !== '') {\n    validity = props.validity === 'true' || props.validity === true;\n  }\n  \n  const param: PodcastSearchOptions = {\n    first: reset ? 0 : dfirst.value,\n    size: dsize.value,\n    organisationId: organisation.value,\n    emissionId: props.emissionId,\n    groupId: props.emissionGroups?.map(g => g.groupId),\n    iabId: props.iabId,\n    participantId: props.participantId,\n    query: props.query,\n    monetisable: props.monetisable,\n    sort: sort.value,\n    pubDateBefore: props.before,\n    pubDateAfter: props.after,\n    noRubriquageId: props.noRubriquageId?.length\n      ? props.noRubriquageId\n      : undefined,\n    rubriqueId: props.rubriqueId?.length ? props.rubriqueId : undefined,\n    rubriquageId: props.rubriquageId?.length ? props.rubriquageId : undefined,\n    includeHidden: props.includeHidden,\n    validity,\n    /* publisherId:\n      !this.onlyValid && !authStore.isRoleProduction\n        ? authStore.authProfile?.userId\n        : undefined, */\n    processingStatus: [PodcastProcessingStatus.Ready, PodcastProcessingStatus.Processing],\n    withVideo: props.withVideo,\n    tags: props.includeTag?.length ? props.includeTag : undefined,\n    beneficiaries: props.beneficiaries ?? undefined,\n    season: props.seasons\n  };\n\n  try {\n    const data = await podcastApi.searchFull(param, true);\n    afterFetching(reset, data);\n  } catch (error) {\n    if (error instanceof AxiosError) {\n      handle403(error as AxiosError);\n    } else {\n      console.error('error', error);\n    }\n  }\n}\nfunction afterFetching(\n  reset: boolean,\n  data: { count: number; result: Array<Podcast>; sort: string },\n): void {\n  if (reset) {\n    dfirst.value = 0;\n    podcasts.value.length = 0;\n  }\n  if (dfirst.value > podcasts.value.length) {\n    for (\n      let i = podcasts.value.length - 1, len = dfirst.value + dsize.value;\n      i < len;\n      i++\n    ) {\n      podcasts.value.push(emptyPodcastData());\n    }\n  }\n  const responsePodcasts = data.result.filter((p: Podcast | null) => {\n    return null !== p;\n  });\n  podcasts.value = podcasts.value\n    .slice(0, dfirst.value)\n    .concat(responsePodcasts)\n    .concat(\n      podcasts.value.slice(dfirst.value + dsize.value, podcasts.value.length),\n    );\n  emit(\"fetch\", podcasts.value);\n  totalCount.value = props.justSizeChosen ? props.size : data.count;\n  if (0 === podcasts.value.length) {\n    emit(\"emptyList\");\n  }\n  loading.value = false;\n}\n</script>\n"],"mappings":"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"}