@saooti/octopus-sdk 42.2.1 → 42.2.2

package/dist/QrCode-DNiPIFIA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"QrCode-DNiPIFIA.mjs","names":[],"sources":["../src/components/display/sharing/FormatSwitch.vue","../src/components/display/sharing/FormatSwitch.vue","../src/components/display/sharing/QrCode.vue","../src/components/display/sharing/QrCode.vue"],"sourcesContent":["<template>\n    <div class=\"format-switch\">\n      <input \n        id=\"format-switch-checkbox\"\n        :checked=\"isSvg\"\n        class=\"format-switch-checkbox\" \n        type=\"checkbox\" \n        @input=\"changeIsSvg\"/>\n      <label class=\"format-switch-label\" for=\"format-switch-checkbox\">\n        <span class=\"format-switch-label-span\">SVG</span>\n      </label>\n    </div>\n  </template>\n  \n<script setup lang=\"ts\">\n\n//Props \nconst props = defineProps({\n  isSvg: { default: true, type: Boolean },\n})\n\n//Emits\nconst emit = defineEmits(['update:isSvg']);\n\n//Methods\nfunction changeIsSvg(){\n  emit('update:isSvg', !props.isSvg)\n}\n</script>\n  <style lang=\"scss\">\n  .octopus-app {\n\n    --format-switch-size:140px;\n    --format-switch-half: calc(var(--format-switch-size) / 2 );\n  \n    .format-switch {\n      background: var(--octopus-secondary);\n      border-radius: 30px;\n      overflow: hidden;\n      width: var(--format-switch-size);\n      text-align: center;\n      color: black;\n      border: 2px solid var(--octopus-secondary);\n      padding-right: var(--format-switch-half);\n      position: relative;\n  \n      &::before {\n        content: \"PNG\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        width: var(--format-switch-half);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 3;\n        pointer-events: none;\n      }\n  \n    \n      &-checkbox {\n        cursor: pointer;\n        position: absolute;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        opacity: 0;\n        z-index: 2;\n        margin: 0;\n  \n        & + .format-switch-label {\n          position: relative;\n          padding: 0.5rem 0;\n          display: block;\n          user-select: none;\n          pointer-events: none;\n  \n          &::before {\n            content: \"\";\n            background: white;\n            height: 100%;\n            width: 100%;\n            position: absolute;\n            left: 0;\n            top: 0;\n            border-radius: 30px;\n            transform: translateX(var(--format-switch-half));\n            transition: transform 300ms;\n          }\n  \n          .format-switch-label-span {\n            position: relative;\n          }\n        }\n  \n        &:checked + .format-switch-label::before {\n          transform: translateX(0px);\n          transition: transform 300ms linear;\n        }\n      }\n  \n      &:has(input:focus-visible){\n        box-shadow: 0 0 10px 1px  var(--octopus-primary) !important;\n      }\n    }\n  }\n  </style>","<template>\n    <div class=\"format-switch\">\n      <input \n        id=\"format-switch-checkbox\"\n        :checked=\"isSvg\"\n        class=\"format-switch-checkbox\" \n        type=\"checkbox\" \n        @input=\"changeIsSvg\"/>\n      <label class=\"format-switch-label\" for=\"format-switch-checkbox\">\n        <span class=\"format-switch-label-span\">SVG</span>\n      </label>\n    </div>\n  </template>\n  \n<script setup lang=\"ts\">\n\n//Props \nconst props = defineProps({\n  isSvg: { default: true, type: Boolean },\n})\n\n//Emits\nconst emit = defineEmits(['update:isSvg']);\n\n//Methods\nfunction changeIsSvg(){\n  emit('update:isSvg', !props.isSvg)\n}\n</script>\n  <style lang=\"scss\">\n  .octopus-app {\n\n    --format-switch-size:140px;\n    --format-switch-half: calc(var(--format-switch-size) / 2 );\n  \n    .format-switch {\n      background: var(--octopus-secondary);\n      border-radius: 30px;\n      overflow: hidden;\n      width: var(--format-switch-size);\n      text-align: center;\n      color: black;\n      border: 2px solid var(--octopus-secondary);\n      padding-right: var(--format-switch-half);\n      position: relative;\n  \n      &::before {\n        content: \"PNG\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        width: var(--format-switch-half);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 3;\n        pointer-events: none;\n      }\n  \n    \n      &-checkbox {\n        cursor: pointer;\n        position: absolute;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        opacity: 0;\n        z-index: 2;\n        margin: 0;\n  \n        & + .format-switch-label {\n          position: relative;\n          padding: 0.5rem 0;\n          display: block;\n          user-select: none;\n          pointer-events: none;\n  \n          &::before {\n            content: \"\";\n            background: white;\n            height: 100%;\n            width: 100%;\n            position: absolute;\n            left: 0;\n            top: 0;\n            border-radius: 30px;\n            transform: translateX(var(--format-switch-half));\n            transition: transform 300ms;\n          }\n  \n          .format-switch-label-span {\n            position: relative;\n          }\n        }\n  \n        &:checked + .format-switch-label::before {\n          transform: translateX(0px);\n          transition: transform 300ms linear;\n        }\n      }\n  \n      &:has(input:focus-visible){\n        box-shadow: 0 0 10px 1px  var(--octopus-primary) !important;\n      }\n    }\n  }\n  </style>","<template>\n  <div class=\"d-flex flex-column align-items-center\">\n    <div class=\"d-flex align-items-center mb-3\">\n      <div class=\"form-label me-3\">\n        {{ t(\"Color of the QR Code\") }}\n      </div>\n      <VSwatches\n        v-model:model-value=\"color\"\n        class=\"c-hand\"\n        show-fallback\n        fallback-input-type=\"color\"\n        colors=\"text-advanced\"\n        popover-to=\"right\"\n        popover-y=\"bottom\"\n        :data-color=\"color\"\n      />\n    </div>\n    <qrcode-vue\n      :render-as=\"renderQrCode\"\n      :value=\"url\"\n      :size=\"size\"\n      level=\"H\"\n      :foreground=\"color\"\n      class=\"myQrCode\"\n      :margin=\"2\"\n    />\n    <div class=\"d-flex align-items-center my-3\">\n      <FormatSwitch v-model:is-svg=\"isSvg\" class=\"me-3\"/>\n      <button class=\"btn btn-primary\" @click=\"download\">\n        {{ t(\"Download\") }}\n      </button>\n    </div>\n    <SnackBar ref=\"snackbar\" position=\"bottom-left\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { VSwatches } from \"vue3-swatches\";\nimport \"vue3-swatches/dist/style.css\";\nimport SnackBar from \"../../misc/SnackBar.vue\";\nimport QrcodeVue from \"qrcode.vue\";\nimport FormatSwitch from \"./FormatSwitch.vue\";\nimport { useSaveFetchStore } from \"../../../stores/SaveFetchStore\";\nimport { computed, onBeforeMount, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  url: { default: \"\", type: String },\n    orgaForColor: { default: undefined, type: String },\n})\n\n//Data \nconst size = ref(1000);\nconst color = ref(\"#000000\");\nconst isSvg = ref(true);\nconst snackBarRef = useTemplateRef('snackbar');\n\n//Composables\nconst { t } = useI18n();\nconst saveFetchStore = useSaveFetchStore();\n\n\n//Computed\nconst renderQrCode = computed(() => isSvg.value ? 'svg' : 'canvas');\n\nonBeforeMount(()=>initDefaultColor())\n\n//Methods\nfunction download(): void {\n  const canvas = document.getElementsByClassName(\"myQrCode\");\n  if (!canvas || canvas.length <=0 || !canvas[0]) {\n    return;\n  }\n  const downloadLink = document.createElement(\"a\");\n  if (isSvg.value) {\n    const svgData = canvas[0].outerHTML;\n    const svgBlob = new Blob([svgData], {type:\"image/svg+xml;charset=utf-8\"});\n    const svgUrl = URL.createObjectURL(svgBlob);\n    downloadLink.href = svgUrl;\n    downloadLink.download = \"qrcode.svg\";\n  }else{\n    downloadLink.download = \"qrcode.png\";\n    downloadLink.href = (canvas[0] as HTMLCanvasElement).toDataURL();\n  }\n  downloadLink.click();\n  (snackBarRef?.value as InstanceType<typeof SnackBar>).open(\n    t(\"Download started\"),\n  );\n}\nasync function initDefaultColor(): Promise<void> {\n  if (undefined === props.orgaForColor) return;\n  const attributes = await saveFetchStore.getOrgaAttributes(props.orgaForColor);\n  if (Object.hasOwn(attributes, \"COLOR\")) {\n    color.value = attributes.COLOR as string;\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .myQrCode{\n    height: 200px !important;\n    width: 200px !important;\n  }\n}\n</style>","<template>\n  <div class=\"d-flex flex-column align-items-center\">\n    <div class=\"d-flex align-items-center mb-3\">\n      <div class=\"form-label me-3\">\n        {{ t(\"Color of the QR Code\") }}\n      </div>\n      <VSwatches\n        v-model:model-value=\"color\"\n        class=\"c-hand\"\n        show-fallback\n        fallback-input-type=\"color\"\n        colors=\"text-advanced\"\n        popover-to=\"right\"\n        popover-y=\"bottom\"\n        :data-color=\"color\"\n      />\n    </div>\n    <qrcode-vue\n      :render-as=\"renderQrCode\"\n      :value=\"url\"\n      :size=\"size\"\n      level=\"H\"\n      :foreground=\"color\"\n      class=\"myQrCode\"\n      :margin=\"2\"\n    />\n    <div class=\"d-flex align-items-center my-3\">\n      <FormatSwitch v-model:is-svg=\"isSvg\" class=\"me-3\"/>\n      <button class=\"btn btn-primary\" @click=\"download\">\n        {{ t(\"Download\") }}\n      </button>\n    </div>\n    <SnackBar ref=\"snackbar\" position=\"bottom-left\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { VSwatches } from \"vue3-swatches\";\nimport \"vue3-swatches/dist/style.css\";\nimport SnackBar from \"../../misc/SnackBar.vue\";\nimport QrcodeVue from \"qrcode.vue\";\nimport FormatSwitch from \"./FormatSwitch.vue\";\nimport { useSaveFetchStore } from \"../../../stores/SaveFetchStore\";\nimport { computed, onBeforeMount, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  url: { default: \"\", type: String },\n    orgaForColor: { default: undefined, type: String },\n})\n\n//Data \nconst size = ref(1000);\nconst color = ref(\"#000000\");\nconst isSvg = ref(true);\nconst snackBarRef = useTemplateRef('snackbar');\n\n//Composables\nconst { t } = useI18n();\nconst saveFetchStore = useSaveFetchStore();\n\n\n//Computed\nconst renderQrCode = computed(() => isSvg.value ? 'svg' : 'canvas');\n\nonBeforeMount(()=>initDefaultColor())\n\n//Methods\nfunction download(): void {\n  const canvas = document.getElementsByClassName(\"myQrCode\");\n  if (!canvas || canvas.length <=0 || !canvas[0]) {\n    return;\n  }\n  const downloadLink = document.createElement(\"a\");\n  if (isSvg.value) {\n    const svgData = canvas[0].outerHTML;\n    const svgBlob = new Blob([svgData], {type:\"image/svg+xml;charset=utf-8\"});\n    const svgUrl = URL.createObjectURL(svgBlob);\n    downloadLink.href = svgUrl;\n    downloadLink.download = \"qrcode.svg\";\n  }else{\n    downloadLink.download = \"qrcode.png\";\n    downloadLink.href = (canvas[0] as HTMLCanvasElement).toDataURL();\n  }\n  downloadLink.click();\n  (snackBarRef?.value as InstanceType<typeof SnackBar>).open(\n    t(\"Download started\"),\n  );\n}\nasync function initDefaultColor(): Promise<void> {\n  if (undefined === props.orgaForColor) return;\n  const attributes = await saveFetchStore.getOrgaAttributes(props.orgaForColor);\n  if (Object.hasOwn(attributes, \"COLOR\")) {\n    color.value = attributes.COLOR as string;\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .myQrCode{\n    height: 200px !important;\n    width: 200px !important;\n  }\n}\n</style>"],"mappings":";;;;;;;;;;;;;;;;;;;EAiBA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAGb,SAAS,cAAa;GACpB,KAAK,gBAAgB,CAAC,MAAM,KAAK;EACnC;;;;;;;;;;;;;;;qBC1BS,OAAM,gBAAe;;;qBAA1B,mBAUM,OAVN,cAUM,CATJ,mBAKwB,SAAA;EAJtB,IAAG;EACF,SAAS,OAAA;EACV,OAAM;EACN,MAAK;EACJ,SAAO,OAAA;uDACV,mBAEQ,SAAA;EAFD,OAAM;EAAsB,KAAI;KACrC,mBAAiD,QAAA,EAA3C,OAAM,2BAA0B,GAAC,KAAG,CAAA,GAAA,EAAA,EAAA,CAAA;;;;;;;;;;;;;;;;;;;ECsClD,MAAM,QAAQ;EAMd,MAAM,OAAO,IAAI,GAAI;EACrB,MAAM,QAAQ,IAAI,SAAS;EAC3B,MAAM,QAAQ,IAAI,IAAI;EACtB,MAAM,cAAc,eAAe,UAAU;EAG7C,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,iBAAiB,kBAAkB;EAIzC,MAAM,eAAe,eAAe,MAAM,QAAQ,QAAQ,QAAQ;EAElE,oBAAkB,iBAAiB,CAAC;EAGpC,SAAS,WAAiB;GACxB,MAAM,SAAS,SAAS,uBAAuB,UAAU;GACzD,IAAI,CAAC,UAAU,OAAO,UAAS,KAAK,CAAC,OAAO,IAC1C;GAEF,MAAM,eAAe,SAAS,cAAc,GAAG;GAC/C,IAAI,MAAM,OAAO;IACf,MAAM,UAAU,OAAO,GAAG;IAC1B,MAAM,UAAU,IAAI,KAAK,CAAC,OAAO,GAAG,EAAC,MAAK,8BAA6B,CAAC;IAExE,aAAa,OADE,IAAI,gBAAgB,OACf;IACpB,aAAa,WAAW;GAC1B,OAAK;IACH,aAAa,WAAW;IACxB,aAAa,OAAQ,OAAO,GAAyB,UAAU;GACjE;GACA,aAAa,MAAM;GACnB,CAAC,aAAa,OAAwC,KACpD,EAAE,kBAAkB,CACtB;EACF;EACA,eAAe,mBAAkC;GAC/C,IAAI,KAAA,MAAc,MAAM,cAAc;GACtC,MAAM,aAAa,MAAM,eAAe,kBAAkB,MAAM,YAAY;GAC5E,IAAI,OAAO,OAAO,YAAY,OAAO,GACnC,MAAM,QAAQ,WAAW;EAE7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBC/FO,OAAM,wCAAuC;mBAC3C,OAAM,iCAAgC;mBACpC,OAAM,kBAAiB;mBAuBzB,OAAM,iCAAgC;;qBAzB7C,mBAgCM,OAhCN,YAgCM;EA/BJ,mBAcM,OAdN,YAcM,CAbJ,mBAEM,OAFN,YAEM,gBADD,OAAA,EAAC,sBAAA,CAAA,GAAA,CAAA,GAEN,YASE,OAAA,cAAA;GARQ,eAAa,OAAA;gEAAA,OAAA,QAAK;GAC1B,OAAM;GACN,iBAAA;GACA,uBAAoB;GACpB,QAAO;GACP,cAAW;GACX,aAAU;GACT,cAAY,OAAA;;EAGjB,YAQE,OAAA,cAAA;GAPC,aAAW,OAAA;GACX,OAAO,OAAA;GACP,MAAM,OAAA;GACP,OAAM;GACL,YAAY,OAAA;GACb,OAAM;GACL,QAAQ;;;;;;;EAEX,mBAKM,OALN,YAKM,CAJJ,YAAmD,OAAA,iBAAA;GAA7B,UAAQ,OAAA;2DAAA,OAAA,QAAK;GAAE,OAAM;2BAC3C,mBAES,UAAA;GAFD,OAAM;GAAmB,SAAO,OAAA;qBACnC,OAAA,EAAC,UAAA,CAAA,GAAA,CAAA,CAAA,CAAA;EAGR,YAAkD,OAAA,aAAA;GAAxC,KAAI;GAAW,UAAS"}

package/dist/{QrCode-CUP2O18d.mjs → QrCode-MCv4t_Bn.mjs}

@@ -1,6 +1,6 @@
 import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.mjs";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { T as useSaveFetchStore } from "./classicApi-CkDHWZG1.mjs";
+import { T as useSaveFetchStore } from "./classicApi-xjOqAovv.mjs";
 import { t as SnackBar_default } from "./SnackBar-DdE1dYhi.mjs";
 import { computed, createElementBlock, createElementVNode, createVNode, defineComponent, onBeforeMount, openBlock, ref, toDisplayString, useTemplateRef } from "vue";
 import { useI18n } from "vue-i18n";
@@ -174,4 +174,4 @@ var QrCode_default = /*#__PURE__*/ _plugin_vue_export_helper_default(QrCode_vue_
 //#endregion
 export { QrCode_exports as n, QrCode_default as t };
 
-//# sourceMappingURL=QrCode-CUP2O18d.mjs.map
+//# sourceMappingURL=QrCode-MCv4t_Bn.mjs.map

package/dist/QrCode-MCv4t_Bn.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"QrCode-MCv4t_Bn.mjs","names":[],"sources":["../src/components/display/sharing/FormatSwitch.vue","../src/components/display/sharing/FormatSwitch.vue","../src/components/display/sharing/QrCode.vue","../src/components/display/sharing/QrCode.vue"],"sourcesContent":["<template>\n    <div class=\"format-switch\">\n      <input \n        id=\"format-switch-checkbox\"\n        :checked=\"isSvg\"\n        class=\"format-switch-checkbox\" \n        type=\"checkbox\" \n        @input=\"changeIsSvg\"/>\n      <label class=\"format-switch-label\" for=\"format-switch-checkbox\">\n        <span class=\"format-switch-label-span\">SVG</span>\n      </label>\n    </div>\n  </template>\n  \n<script setup lang=\"ts\">\n\n//Props \nconst props = defineProps({\n  isSvg: { default: true, type: Boolean },\n})\n\n//Emits\nconst emit = defineEmits(['update:isSvg']);\n\n//Methods\nfunction changeIsSvg(){\n  emit('update:isSvg', !props.isSvg)\n}\n</script>\n  <style lang=\"scss\">\n  .octopus-app {\n\n    --format-switch-size:140px;\n    --format-switch-half: calc(var(--format-switch-size) / 2 );\n  \n    .format-switch {\n      background: var(--octopus-secondary);\n      border-radius: 30px;\n      overflow: hidden;\n      width: var(--format-switch-size);\n      text-align: center;\n      color: black;\n      border: 2px solid var(--octopus-secondary);\n      padding-right: var(--format-switch-half);\n      position: relative;\n  \n      &::before {\n        content: \"PNG\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        width: var(--format-switch-half);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 3;\n        pointer-events: none;\n      }\n  \n    \n      &-checkbox {\n        cursor: pointer;\n        position: absolute;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        opacity: 0;\n        z-index: 2;\n        margin: 0;\n  \n        & + .format-switch-label {\n          position: relative;\n          padding: 0.5rem 0;\n          display: block;\n          user-select: none;\n          pointer-events: none;\n  \n          &::before {\n            content: \"\";\n            background: white;\n            height: 100%;\n            width: 100%;\n            position: absolute;\n            left: 0;\n            top: 0;\n            border-radius: 30px;\n            transform: translateX(var(--format-switch-half));\n            transition: transform 300ms;\n          }\n  \n          .format-switch-label-span {\n            position: relative;\n          }\n        }\n  \n        &:checked + .format-switch-label::before {\n          transform: translateX(0px);\n          transition: transform 300ms linear;\n        }\n      }\n  \n      &:has(input:focus-visible){\n        box-shadow: 0 0 10px 1px  var(--octopus-primary) !important;\n      }\n    }\n  }\n  </style>","<template>\n    <div class=\"format-switch\">\n      <input \n        id=\"format-switch-checkbox\"\n        :checked=\"isSvg\"\n        class=\"format-switch-checkbox\" \n        type=\"checkbox\" \n        @input=\"changeIsSvg\"/>\n      <label class=\"format-switch-label\" for=\"format-switch-checkbox\">\n        <span class=\"format-switch-label-span\">SVG</span>\n      </label>\n    </div>\n  </template>\n  \n<script setup lang=\"ts\">\n\n//Props \nconst props = defineProps({\n  isSvg: { default: true, type: Boolean },\n})\n\n//Emits\nconst emit = defineEmits(['update:isSvg']);\n\n//Methods\nfunction changeIsSvg(){\n  emit('update:isSvg', !props.isSvg)\n}\n</script>\n  <style lang=\"scss\">\n  .octopus-app {\n\n    --format-switch-size:140px;\n    --format-switch-half: calc(var(--format-switch-size) / 2 );\n  \n    .format-switch {\n      background: var(--octopus-secondary);\n      border-radius: 30px;\n      overflow: hidden;\n      width: var(--format-switch-size);\n      text-align: center;\n      color: black;\n      border: 2px solid var(--octopus-secondary);\n      padding-right: var(--format-switch-half);\n      position: relative;\n  \n      &::before {\n        content: \"PNG\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        width: var(--format-switch-half);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 3;\n        pointer-events: none;\n      }\n  \n    \n      &-checkbox {\n        cursor: pointer;\n        position: absolute;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        opacity: 0;\n        z-index: 2;\n        margin: 0;\n  \n        & + .format-switch-label {\n          position: relative;\n          padding: 0.5rem 0;\n          display: block;\n          user-select: none;\n          pointer-events: none;\n  \n          &::before {\n            content: \"\";\n            background: white;\n            height: 100%;\n            width: 100%;\n            position: absolute;\n            left: 0;\n            top: 0;\n            border-radius: 30px;\n            transform: translateX(var(--format-switch-half));\n            transition: transform 300ms;\n          }\n  \n          .format-switch-label-span {\n            position: relative;\n          }\n        }\n  \n        &:checked + .format-switch-label::before {\n          transform: translateX(0px);\n          transition: transform 300ms linear;\n        }\n      }\n  \n      &:has(input:focus-visible){\n        box-shadow: 0 0 10px 1px  var(--octopus-primary) !important;\n      }\n    }\n  }\n  </style>","<template>\n  <div class=\"d-flex flex-column align-items-center\">\n    <div class=\"d-flex align-items-center mb-3\">\n      <div class=\"form-label me-3\">\n        {{ t(\"Color of the QR Code\") }}\n      </div>\n      <VSwatches\n        v-model:model-value=\"color\"\n        class=\"c-hand\"\n        show-fallback\n        fallback-input-type=\"color\"\n        colors=\"text-advanced\"\n        popover-to=\"right\"\n        popover-y=\"bottom\"\n        :data-color=\"color\"\n      />\n    </div>\n    <qrcode-vue\n      :render-as=\"renderQrCode\"\n      :value=\"url\"\n      :size=\"size\"\n      level=\"H\"\n      :foreground=\"color\"\n      class=\"myQrCode\"\n      :margin=\"2\"\n    />\n    <div class=\"d-flex align-items-center my-3\">\n      <FormatSwitch v-model:is-svg=\"isSvg\" class=\"me-3\"/>\n      <button class=\"btn btn-primary\" @click=\"download\">\n        {{ t(\"Download\") }}\n      </button>\n    </div>\n    <SnackBar ref=\"snackbar\" position=\"bottom-left\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { VSwatches } from \"vue3-swatches\";\nimport \"vue3-swatches/dist/style.css\";\nimport SnackBar from \"../../misc/SnackBar.vue\";\nimport QrcodeVue from \"qrcode.vue\";\nimport FormatSwitch from \"./FormatSwitch.vue\";\nimport { useSaveFetchStore } from \"../../../stores/SaveFetchStore\";\nimport { computed, onBeforeMount, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  url: { default: \"\", type: String },\n    orgaForColor: { default: undefined, type: String },\n})\n\n//Data \nconst size = ref(1000);\nconst color = ref(\"#000000\");\nconst isSvg = ref(true);\nconst snackBarRef = useTemplateRef('snackbar');\n\n//Composables\nconst { t } = useI18n();\nconst saveFetchStore = useSaveFetchStore();\n\n\n//Computed\nconst renderQrCode = computed(() => isSvg.value ? 'svg' : 'canvas');\n\nonBeforeMount(()=>initDefaultColor())\n\n//Methods\nfunction download(): void {\n  const canvas = document.getElementsByClassName(\"myQrCode\");\n  if (!canvas || canvas.length <=0 || !canvas[0]) {\n    return;\n  }\n  const downloadLink = document.createElement(\"a\");\n  if (isSvg.value) {\n    const svgData = canvas[0].outerHTML;\n    const svgBlob = new Blob([svgData], {type:\"image/svg+xml;charset=utf-8\"});\n    const svgUrl = URL.createObjectURL(svgBlob);\n    downloadLink.href = svgUrl;\n    downloadLink.download = \"qrcode.svg\";\n  }else{\n    downloadLink.download = \"qrcode.png\";\n    downloadLink.href = (canvas[0] as HTMLCanvasElement).toDataURL();\n  }\n  downloadLink.click();\n  (snackBarRef?.value as InstanceType<typeof SnackBar>).open(\n    t(\"Download started\"),\n  );\n}\nasync function initDefaultColor(): Promise<void> {\n  if (undefined === props.orgaForColor) return;\n  const attributes = await saveFetchStore.getOrgaAttributes(props.orgaForColor);\n  if (Object.hasOwn(attributes, \"COLOR\")) {\n    color.value = attributes.COLOR as string;\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .myQrCode{\n    height: 200px !important;\n    width: 200px !important;\n  }\n}\n</style>","<template>\n  <div class=\"d-flex flex-column align-items-center\">\n    <div class=\"d-flex align-items-center mb-3\">\n      <div class=\"form-label me-3\">\n        {{ t(\"Color of the QR Code\") }}\n      </div>\n      <VSwatches\n        v-model:model-value=\"color\"\n        class=\"c-hand\"\n        show-fallback\n        fallback-input-type=\"color\"\n        colors=\"text-advanced\"\n        popover-to=\"right\"\n        popover-y=\"bottom\"\n        :data-color=\"color\"\n      />\n    </div>\n    <qrcode-vue\n      :render-as=\"renderQrCode\"\n      :value=\"url\"\n      :size=\"size\"\n      level=\"H\"\n      :foreground=\"color\"\n      class=\"myQrCode\"\n      :margin=\"2\"\n    />\n    <div class=\"d-flex align-items-center my-3\">\n      <FormatSwitch v-model:is-svg=\"isSvg\" class=\"me-3\"/>\n      <button class=\"btn btn-primary\" @click=\"download\">\n        {{ t(\"Download\") }}\n      </button>\n    </div>\n    <SnackBar ref=\"snackbar\" position=\"bottom-left\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { VSwatches } from \"vue3-swatches\";\nimport \"vue3-swatches/dist/style.css\";\nimport SnackBar from \"../../misc/SnackBar.vue\";\nimport QrcodeVue from \"qrcode.vue\";\nimport FormatSwitch from \"./FormatSwitch.vue\";\nimport { useSaveFetchStore } from \"../../../stores/SaveFetchStore\";\nimport { computed, onBeforeMount, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  url: { default: \"\", type: String },\n    orgaForColor: { default: undefined, type: String },\n})\n\n//Data \nconst size = ref(1000);\nconst color = ref(\"#000000\");\nconst isSvg = ref(true);\nconst snackBarRef = useTemplateRef('snackbar');\n\n//Composables\nconst { t } = useI18n();\nconst saveFetchStore = useSaveFetchStore();\n\n\n//Computed\nconst renderQrCode = computed(() => isSvg.value ? 'svg' : 'canvas');\n\nonBeforeMount(()=>initDefaultColor())\n\n//Methods\nfunction download(): void {\n  const canvas = document.getElementsByClassName(\"myQrCode\");\n  if (!canvas || canvas.length <=0 || !canvas[0]) {\n    return;\n  }\n  const downloadLink = document.createElement(\"a\");\n  if (isSvg.value) {\n    const svgData = canvas[0].outerHTML;\n    const svgBlob = new Blob([svgData], {type:\"image/svg+xml;charset=utf-8\"});\n    const svgUrl = URL.createObjectURL(svgBlob);\n    downloadLink.href = svgUrl;\n    downloadLink.download = \"qrcode.svg\";\n  }else{\n    downloadLink.download = \"qrcode.png\";\n    downloadLink.href = (canvas[0] as HTMLCanvasElement).toDataURL();\n  }\n  downloadLink.click();\n  (snackBarRef?.value as InstanceType<typeof SnackBar>).open(\n    t(\"Download started\"),\n  );\n}\nasync function initDefaultColor(): Promise<void> {\n  if (undefined === props.orgaForColor) return;\n  const attributes = await saveFetchStore.getOrgaAttributes(props.orgaForColor);\n  if (Object.hasOwn(attributes, \"COLOR\")) {\n    color.value = attributes.COLOR as string;\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .myQrCode{\n    height: 200px !important;\n    width: 200px !important;\n  }\n}\n</style>"],"mappings":";;;;;;;;;;;;;;;;;;;EAiBA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAGb,SAAS,cAAa;GACpB,KAAK,gBAAgB,CAAC,MAAM,KAAK;EACnC;;;;;;;;;;;;;;;qBC1BS,OAAM,gBAAe;;;qBAA1B,mBAUM,OAVN,cAUM,CATJ,mBAKwB,SAAA;EAJtB,IAAG;EACF,SAAS,OAAA;EACV,OAAM;EACN,MAAK;EACJ,SAAO,OAAA;uDACV,mBAEQ,SAAA;EAFD,OAAM;EAAsB,KAAI;KACrC,mBAAiD,QAAA,EAA3C,OAAM,2BAA0B,GAAC,KAAG,CAAA,GAAA,EAAA,EAAA,CAAA;;;;;;;;;;;;;;;;;;;ECsClD,MAAM,QAAQ;EAMd,MAAM,OAAO,IAAI,GAAI;EACrB,MAAM,QAAQ,IAAI,SAAS;EAC3B,MAAM,QAAQ,IAAI,IAAI;EACtB,MAAM,cAAc,eAAe,UAAU;EAG7C,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,iBAAiB,kBAAkB;EAIzC,MAAM,eAAe,eAAe,MAAM,QAAQ,QAAQ,QAAQ;EAElE,oBAAkB,iBAAiB,CAAC;EAGpC,SAAS,WAAiB;GACxB,MAAM,SAAS,SAAS,uBAAuB,UAAU;GACzD,IAAI,CAAC,UAAU,OAAO,UAAS,KAAK,CAAC,OAAO,IAC1C;GAEF,MAAM,eAAe,SAAS,cAAc,GAAG;GAC/C,IAAI,MAAM,OAAO;IACf,MAAM,UAAU,OAAO,GAAG;IAC1B,MAAM,UAAU,IAAI,KAAK,CAAC,OAAO,GAAG,EAAC,MAAK,8BAA6B,CAAC;IAExE,aAAa,OADE,IAAI,gBAAgB,OACf;IACpB,aAAa,WAAW;GAC1B,OAAK;IACH,aAAa,WAAW;IACxB,aAAa,OAAQ,OAAO,GAAyB,UAAU;GACjE;GACA,aAAa,MAAM;GACnB,CAAC,aAAa,OAAwC,KACpD,EAAE,kBAAkB,CACtB;EACF;EACA,eAAe,mBAAkC;GAC/C,IAAI,KAAA,MAAc,MAAM,cAAc;GACtC,MAAM,aAAa,MAAM,eAAe,kBAAkB,MAAM,YAAY;GAC5E,IAAI,OAAO,OAAO,YAAY,OAAO,GACnC,MAAM,QAAQ,WAAW;EAE7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBC/FO,OAAM,wCAAuC;mBAC3C,OAAM,iCAAgC;mBACpC,OAAM,kBAAiB;mBAuBzB,OAAM,iCAAgC;;qBAzB7C,mBAgCM,OAhCN,YAgCM;EA/BJ,mBAcM,OAdN,YAcM,CAbJ,mBAEM,OAFN,YAEM,gBADD,OAAA,EAAC,sBAAA,CAAA,GAAA,CAAA,GAEN,YASE,OAAA,cAAA;GARQ,eAAa,OAAA;gEAAA,OAAA,QAAK;GAC1B,OAAM;GACN,iBAAA;GACA,uBAAoB;GACpB,QAAO;GACP,cAAW;GACX,aAAU;GACT,cAAY,OAAA;;EAGjB,YAQE,OAAA,cAAA;GAPC,aAAW,OAAA;GACX,OAAO,OAAA;GACP,MAAM,OAAA;GACP,OAAM;GACL,YAAY,OAAA;GACb,OAAM;GACL,QAAQ;;;;;;;EAEX,mBAKM,OALN,YAKM,CAJJ,YAAmD,OAAA,iBAAA;GAA7B,UAAQ,OAAA;2DAAA,OAAA,QAAK;GAAE,OAAM;2BAC3C,mBAES,UAAA;GAFD,OAAM;GAAmB,SAAO,OAAA;qBACnC,OAAA,EAAC,UAAA,CAAA,GAAA,CAAA,CAAA,CAAA;EAGR,YAAkD,OAAA,aAAA;GAAxC,KAAI;GAAW,UAAS"}

package/dist/{QrCodeModal-DXBCuki7.mjs → QrCodeModal-Be8E0JlC.mjs}

@@ -1,6 +1,6 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
 import { t as ClassicModal_default } from "./ClassicModal-CilwHp9p.mjs";
-import { t as QrCode_default } from "./QrCode-CUP2O18d.mjs";
+import { t as QrCode_default } from "./QrCode-MCv4t_Bn.mjs";
 import { createBlock, createElementVNode, createVNode, defineComponent, openBlock, toDisplayString, withCtx } from "vue";
 import { useI18n } from "vue-i18n";
 //#region src/components/misc/modal/QrCodeModal.vue?vue&type=script&setup=true&lang.ts
@@ -61,4 +61,4 @@ var QrCodeModal_default = /*#__PURE__*/ _plugin_vue_export_helper_default(QrCode
 //#endregion
 export { QrCodeModal_default as default };
 
-//# sourceMappingURL=QrCodeModal-DXBCuki7.mjs.map
+//# sourceMappingURL=QrCodeModal-Be8E0JlC.mjs.map

package/dist/QrCodeModal-Be8E0JlC.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"QrCodeModal-Be8E0JlC.mjs","names":[],"sources":["../src/components/misc/modal/QrCodeModal.vue","../src/components/misc/modal/QrCodeModal.vue"],"sourcesContent":["<template>\n  <ClassicModal\n    id-modal=\"qrcode-modal\"\n    :title-modal=\"t('Share QR Code')\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <QrCode :url=\"urlPage\" :orga-for-color=\"orgaForColor\" />\n    </template>\n    <template #footer>\n      <button class=\"btn btn-primary m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicModal from \"../modal/ClassicModal.vue\";\nimport QrCode from \"../../display/sharing/QrCode.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  urlPage: { default: undefined, type: String },\n  orgaForColor: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\"]);\n \n//Composables\nconst { t } = useI18n();\n\n//Methods\nfunction closePopup(): void {\n  emit(\"close\");\n}\n</script>\n","<template>\n  <ClassicModal\n    id-modal=\"qrcode-modal\"\n    :title-modal=\"t('Share QR Code')\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <QrCode :url=\"urlPage\" :orga-for-color=\"orgaForColor\" />\n    </template>\n    <template #footer>\n      <button class=\"btn btn-primary m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicModal from \"../modal/ClassicModal.vue\";\nimport QrCode from \"../../display/sharing/QrCode.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  urlPage: { default: undefined, type: String },\n  orgaForColor: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\"]);\n \n//Composables\nconst { t } = useI18n();\n\n//Methods\nfunction closePopup(): void {\n  emit(\"close\");\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,OAAO;EAGb,MAAM,EAAE,MAAM,QAAQ;EAGtB,SAAS,aAAmB;GAC1B,KAAK,OAAO;EACd;;;;;;;;;;;;;;;;;;qBCpCE,YAae,OAAA,iBAAA;EAZb,YAAS;EACR,eAAa,OAAA,EAAC,eAAA;EACd,SAAO,OAAA;;EAEG,MAAI,cAC2C,CAAxD,YAAwD,OAAA,WAAA;GAA/C,KAAK,OAAA;GAAU,kBAAgB,OAAA;;EAE/B,QAAM,cAGN,CAFT,mBAES,UAAA;GAFD,OAAM;GAAuB,SAAO,OAAA;qBACvC,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/QrCodeModal-DYDKLLuw.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"QrCodeModal-DYDKLLuw.mjs","names":[],"sources":["../src/components/misc/modal/QrCodeModal.vue","../src/components/misc/modal/QrCodeModal.vue"],"sourcesContent":["<template>\n  <ClassicModal\n    id-modal=\"qrcode-modal\"\n    :title-modal=\"t('Share QR Code')\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <QrCode :url=\"urlPage\" :orga-for-color=\"orgaForColor\" />\n    </template>\n    <template #footer>\n      <button class=\"btn btn-primary m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicModal from \"../modal/ClassicModal.vue\";\nimport QrCode from \"../../display/sharing/QrCode.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  urlPage: { default: undefined, type: String },\n  orgaForColor: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\"]);\n \n//Composables\nconst { t } = useI18n();\n\n//Methods\nfunction closePopup(): void {\n  emit(\"close\");\n}\n</script>\n","<template>\n  <ClassicModal\n    id-modal=\"qrcode-modal\"\n    :title-modal=\"t('Share QR Code')\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <QrCode :url=\"urlPage\" :orga-for-color=\"orgaForColor\" />\n    </template>\n    <template #footer>\n      <button class=\"btn btn-primary m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicModal from \"../modal/ClassicModal.vue\";\nimport QrCode from \"../../display/sharing/QrCode.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  urlPage: { default: undefined, type: String },\n  orgaForColor: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\"]);\n \n//Composables\nconst { t } = useI18n();\n\n//Methods\nfunction closePopup(): void {\n  emit(\"close\");\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,OAAO;EAGb,MAAM,EAAE,MAAM,QAAQ;EAGtB,SAAS,aAAmB;GAC1B,KAAK,OAAO;EACd;;;;;;;;;;;;;;;;;;qBCpCE,YAae,OAAA,iBAAA;EAZb,YAAS;EACR,eAAa,OAAA,EAAC,eAAA;EACd,SAAO,OAAA;;EAEG,MAAI,cAC2C,CAAxD,YAAwD,OAAA,WAAA;GAA/C,KAAK,OAAA;GAAU,kBAAgB,OAAA;;EAE/B,QAAM,cAGN,CAFT,mBAES,UAAA;GAFD,OAAM;GAAuB,SAAO,OAAA;qBACvC,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/RadioCurrently-BJOmCSby.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioCurrently-BJOmCSby.mjs","names":[],"sources":["../src/components/display/live/RadioCurrently.vue","../src/components/display/live/RadioCurrently.vue"],"sourcesContent":["<template>\n  <div class=\"d-flex align-items-center\">\n    <div\n      v-if=\"currentlyPlayingString.length || podcastRadio\"\n      class=\"fw-bold me-1\"\n    >\n      {{ t(\"Currently\") }}&nbsp;:\n    </div>\n    <router-link\n      v-if=\"podcastRadio\"\n      class=\"d-flex align-items-center\"\n      :to=\"{\n        name: 'podcast',\n        params: { podcastId: podcastRadio.podcastId },\n      }\"\n      :title=\"t('Episode name page', { name: podcastRadio.title })\"\n    >\n      <img\n        v-lazy=\"useProxyImageUrl(podcastRadio.imageUrl, '80')\"\n        width=\"80\"\n        height=\"80\"\n        class=\"small-img-box\"\n        aria-hidden=\"true\"\n        alt=\"\"\n        :title=\"t('Episode name image', { name: podcastRadio.title })\"\n      />\n      <div>{{ podcastRadio.title }}</div>\n    </router-link>\n    <div v-else-if=\"currentlyPlayingString.length\">\n      {{ currentlyPlayingString }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useFetchRadio} from \"../../composable/radio/usefetchRadioData\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst currentMetadata: Ref<MediaRadio | undefined> = ref(undefined);\nconst currentPodcast: Ref<Podcast | undefined> = ref(undefined);\nconst radioInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n  \n//Composables\nconst { t } = useI18n();\nconst { fetchRadioMetadata, displayTitle } = useFetchRadio();\nconst { useProxyImageUrl } = useImageProxy();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst podcastRadio = computed(() => {\n  if (playingRadio.value) {\n    return playerStore.playerRadio?.podcast;\n  }\n  return currentPodcast.value;\n});\nconst currentlyPlayingString = computed(() => {\n  if (playingRadio.value && playerStore.playerRadio) {\n    return displayTitle(playerStore.playerRadio.metadata);\n  }\n  return displayTitle(currentMetadata.value);\n});\n\nonMounted(()=>{\n  fetchCurrentlyPlaying();\n  radioInterval.value = setInterval(() => {\n    fetchCurrentlyPlaying();\n  }, 10000);\n})\n\nonUnmounted(()=>{\n  clearInterval(radioInterval.value);\n  radioInterval.value= undefined;\n})\n\n\n//Methods\nasync function fetchCurrentlyPlaying(): Promise<void> {\n  if (!props.radio || playingRadio.value) {\n    return;\n  }\n  fetchRadioMetadata(\n    props.radio.id,\n    currentMetadata.value?.title ?? \"\",\n    updateMetadata,\n  );\n}\nfunction updateMetadata(metadata: MediaRadio|undefined, podcast?: Podcast): void {\n  currentMetadata.value = metadata;\n  currentPodcast.value = podcast;\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app .small-img-box {\n  height: 80px;\n  width: 80px;\n  border-radius: var(--octopus-border-radius);\n  overflow: hidden;\n  flex-shrink: 0;\n  margin: 0.5rem;\n}\n</style>\n","<template>\n  <div class=\"d-flex align-items-center\">\n    <div\n      v-if=\"currentlyPlayingString.length || podcastRadio\"\n      class=\"fw-bold me-1\"\n    >\n      {{ t(\"Currently\") }}&nbsp;:\n    </div>\n    <router-link\n      v-if=\"podcastRadio\"\n      class=\"d-flex align-items-center\"\n      :to=\"{\n        name: 'podcast',\n        params: { podcastId: podcastRadio.podcastId },\n      }\"\n      :title=\"t('Episode name page', { name: podcastRadio.title })\"\n    >\n      <img\n        v-lazy=\"useProxyImageUrl(podcastRadio.imageUrl, '80')\"\n        width=\"80\"\n        height=\"80\"\n        class=\"small-img-box\"\n        aria-hidden=\"true\"\n        alt=\"\"\n        :title=\"t('Episode name image', { name: podcastRadio.title })\"\n      />\n      <div>{{ podcastRadio.title }}</div>\n    </router-link>\n    <div v-else-if=\"currentlyPlayingString.length\">\n      {{ currentlyPlayingString }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useFetchRadio} from \"../../composable/radio/usefetchRadioData\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst currentMetadata: Ref<MediaRadio | undefined> = ref(undefined);\nconst currentPodcast: Ref<Podcast | undefined> = ref(undefined);\nconst radioInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n  \n//Composables\nconst { t } = useI18n();\nconst { fetchRadioMetadata, displayTitle } = useFetchRadio();\nconst { useProxyImageUrl } = useImageProxy();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst podcastRadio = computed(() => {\n  if (playingRadio.value) {\n    return playerStore.playerRadio?.podcast;\n  }\n  return currentPodcast.value;\n});\nconst currentlyPlayingString = computed(() => {\n  if (playingRadio.value && playerStore.playerRadio) {\n    return displayTitle(playerStore.playerRadio.metadata);\n  }\n  return displayTitle(currentMetadata.value);\n});\n\nonMounted(()=>{\n  fetchCurrentlyPlaying();\n  radioInterval.value = setInterval(() => {\n    fetchCurrentlyPlaying();\n  }, 10000);\n})\n\nonUnmounted(()=>{\n  clearInterval(radioInterval.value);\n  radioInterval.value= undefined;\n})\n\n\n//Methods\nasync function fetchCurrentlyPlaying(): Promise<void> {\n  if (!props.radio || playingRadio.value) {\n    return;\n  }\n  fetchRadioMetadata(\n    props.radio.id,\n    currentMetadata.value?.title ?? \"\",\n    updateMetadata,\n  );\n}\nfunction updateMetadata(metadata: MediaRadio|undefined, podcast?: Podcast): void {\n  currentMetadata.value = metadata;\n  currentPodcast.value = podcast;\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app .small-img-box {\n  height: 80px;\n  width: 80px;\n  border-radius: var(--octopus-border-radius);\n  overflow: hidden;\n  flex-shrink: 0;\n  margin: 0.5rem;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;EA6CA,MAAM,QAAQ;EAKd,MAAM,kBAA+C,IAAI,KAAA,CAAS;EAClE,MAAM,iBAA2C,IAAI,KAAA,CAAS;EAC9D,MAAM,gBAAgE,IAAI,KAAA,CAAS;EAInF,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,oBAAoB,iBAAiB,cAAc;EAC3D,MAAM,EAAE,qBAAqB,cAAc;EAC3C,MAAM,cAAc,eAAe;EAGnC,MAAM,eAAe,eAAe,YAAY,eAAe,YAAY,YAAY,YAAY,MAAM,OAAO,EAAE;EAClH,MAAM,eAAe,eAAe;GAClC,IAAI,aAAa,OACf,OAAO,YAAY,aAAa;GAElC,OAAO,eAAe;EACxB,CAAC;EACD,MAAM,yBAAyB,eAAe;GAC5C,IAAI,aAAa,SAAS,YAAY,aACpC,OAAO,aAAa,YAAY,YAAY,QAAQ;GAEtD,OAAO,aAAa,gBAAgB,KAAK;EAC3C,CAAC;EAED,gBAAc;GACZ,sBAAsB;GACtB,cAAc,QAAQ,kBAAkB;IACtC,sBAAsB;GACxB,GAAG,GAAK;EACV,CAAC;EAED,kBAAgB;GACd,cAAc,cAAc,KAAK;GACjC,cAAc,QAAO,KAAA;EACvB,CAAC;EAID,eAAe,wBAAuC;GACpD,IAAI,CAAC,MAAM,SAAS,aAAa,OAC/B;GAEF,mBACE,MAAM,MAAM,IACZ,gBAAgB,OAAO,SAAS,IAChC,cACF;EACF;EACA,SAAS,eAAe,UAAgC,SAAyB;GAC/E,gBAAgB,QAAQ;GACxB,eAAe,QAAQ;EACzB;;;;;;;;;;;;;;;;;;;;;;;;;;;mBCtGO,OAAM,4BAA2B;;;CAGlC,OAAM;;;;;;;qBAHV,mBA8BM,OA9BN,YA8BM,CA5BI,OAAA,uBAAuB,UAAU,OAAA,gBAAA,UAAA,GADzC,mBAKM,OALN,YAKM,gBADD,OAAA,EAAC,WAAA,CAAA,IAAgB,UACtB,CAAA,KAAA,mBAAA,QAAA,IAAA,GAEQ,OAAA,gBAAA,UAAA,GADR,YAmBc,wBAAA;;EAjBZ,OAAM;EACL,IAAE;;wBAA0D,OAAA,aAAa,UAAS;;EAIlF,OAAO,OAAA,EAAC,qBAAA,EAAA,MAA8B,OAAA,aAAa,MAAK,CAAA;;yBAUvD,CAAA,eARF,mBAQE,OAAA;GANA,OAAM;GACN,QAAO;GACP,OAAM;GACN,eAAY;GACZ,KAAI;GACH,OAAO,OAAA,EAAC,sBAAA,EAAA,MAA+B,OAAA,aAAa,MAAK,CAAA;8CANlD,OAAA,iBAAiB,OAAA,aAAa,UAAQ,IAAA,CAAA,CAAA,CAAA,GAQhD,mBAAmC,OAAA,MAAA,gBAA3B,OAAA,aAAa,KAAK,GAAA,CAAA,CAAA,CAAA;;2BAEZ,OAAA,uBAAuB,UAAA,UAAA,GAAvC,mBAEM,OAAA,YAAA,gBADD,OAAA,sBAAsB,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA,CAAA,CAAA"}

package/dist/RadioCurrently-CZePLInZ.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioCurrently-CZePLInZ.mjs","names":[],"sources":["../src/components/display/live/RadioCurrently.vue","../src/components/display/live/RadioCurrently.vue"],"sourcesContent":["<template>\n  <div class=\"d-flex align-items-center\">\n    <div\n      v-if=\"currentlyPlayingString.length || podcastRadio\"\n      class=\"fw-bold me-1\"\n    >\n      {{ t(\"Currently\") }}&nbsp;:\n    </div>\n    <router-link\n      v-if=\"podcastRadio\"\n      class=\"d-flex align-items-center\"\n      :to=\"{\n        name: 'podcast',\n        params: { podcastId: podcastRadio.podcastId },\n      }\"\n      :title=\"t('Episode name page', { name: podcastRadio.title })\"\n    >\n      <img\n        v-lazy=\"useProxyImageUrl(podcastRadio.imageUrl, '80')\"\n        width=\"80\"\n        height=\"80\"\n        class=\"small-img-box\"\n        aria-hidden=\"true\"\n        alt=\"\"\n        :title=\"t('Episode name image', { name: podcastRadio.title })\"\n      />\n      <div>{{ podcastRadio.title }}</div>\n    </router-link>\n    <div v-else-if=\"currentlyPlayingString.length\">\n      {{ currentlyPlayingString }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useFetchRadio} from \"../../composable/radio/usefetchRadioData\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst currentMetadata: Ref<MediaRadio | undefined> = ref(undefined);\nconst currentPodcast: Ref<Podcast | undefined> = ref(undefined);\nconst radioInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n  \n//Composables\nconst { t } = useI18n();\nconst { fetchRadioMetadata, displayTitle } = useFetchRadio();\nconst { useProxyImageUrl } = useImageProxy();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst podcastRadio = computed(() => {\n  if (playingRadio.value) {\n    return playerStore.playerRadio?.podcast;\n  }\n  return currentPodcast.value;\n});\nconst currentlyPlayingString = computed(() => {\n  if (playingRadio.value && playerStore.playerRadio) {\n    return displayTitle(playerStore.playerRadio.metadata);\n  }\n  return displayTitle(currentMetadata.value);\n});\n\nonMounted(()=>{\n  fetchCurrentlyPlaying();\n  radioInterval.value = setInterval(() => {\n    fetchCurrentlyPlaying();\n  }, 10000);\n})\n\nonUnmounted(()=>{\n  clearInterval(radioInterval.value);\n  radioInterval.value= undefined;\n})\n\n\n//Methods\nasync function fetchCurrentlyPlaying(): Promise<void> {\n  if (!props.radio || playingRadio.value) {\n    return;\n  }\n  fetchRadioMetadata(\n    props.radio.id,\n    currentMetadata.value?.title ?? \"\",\n    updateMetadata,\n  );\n}\nfunction updateMetadata(metadata: MediaRadio|undefined, podcast?: Podcast): void {\n  currentMetadata.value = metadata;\n  currentPodcast.value = podcast;\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app .small-img-box {\n  height: 80px;\n  width: 80px;\n  border-radius: var(--octopus-border-radius);\n  overflow: hidden;\n  flex-shrink: 0;\n  margin: 0.5rem;\n}\n</style>\n","<template>\n  <div class=\"d-flex align-items-center\">\n    <div\n      v-if=\"currentlyPlayingString.length || podcastRadio\"\n      class=\"fw-bold me-1\"\n    >\n      {{ t(\"Currently\") }}&nbsp;:\n    </div>\n    <router-link\n      v-if=\"podcastRadio\"\n      class=\"d-flex align-items-center\"\n      :to=\"{\n        name: 'podcast',\n        params: { podcastId: podcastRadio.podcastId },\n      }\"\n      :title=\"t('Episode name page', { name: podcastRadio.title })\"\n    >\n      <img\n        v-lazy=\"useProxyImageUrl(podcastRadio.imageUrl, '80')\"\n        width=\"80\"\n        height=\"80\"\n        class=\"small-img-box\"\n        aria-hidden=\"true\"\n        alt=\"\"\n        :title=\"t('Episode name image', { name: podcastRadio.title })\"\n      />\n      <div>{{ podcastRadio.title }}</div>\n    </router-link>\n    <div v-else-if=\"currentlyPlayingString.length\">\n      {{ currentlyPlayingString }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useFetchRadio} from \"../../composable/radio/usefetchRadioData\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst currentMetadata: Ref<MediaRadio | undefined> = ref(undefined);\nconst currentPodcast: Ref<Podcast | undefined> = ref(undefined);\nconst radioInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n  \n//Composables\nconst { t } = useI18n();\nconst { fetchRadioMetadata, displayTitle } = useFetchRadio();\nconst { useProxyImageUrl } = useImageProxy();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst podcastRadio = computed(() => {\n  if (playingRadio.value) {\n    return playerStore.playerRadio?.podcast;\n  }\n  return currentPodcast.value;\n});\nconst currentlyPlayingString = computed(() => {\n  if (playingRadio.value && playerStore.playerRadio) {\n    return displayTitle(playerStore.playerRadio.metadata);\n  }\n  return displayTitle(currentMetadata.value);\n});\n\nonMounted(()=>{\n  fetchCurrentlyPlaying();\n  radioInterval.value = setInterval(() => {\n    fetchCurrentlyPlaying();\n  }, 10000);\n})\n\nonUnmounted(()=>{\n  clearInterval(radioInterval.value);\n  radioInterval.value= undefined;\n})\n\n\n//Methods\nasync function fetchCurrentlyPlaying(): Promise<void> {\n  if (!props.radio || playingRadio.value) {\n    return;\n  }\n  fetchRadioMetadata(\n    props.radio.id,\n    currentMetadata.value?.title ?? \"\",\n    updateMetadata,\n  );\n}\nfunction updateMetadata(metadata: MediaRadio|undefined, podcast?: Podcast): void {\n  currentMetadata.value = metadata;\n  currentPodcast.value = podcast;\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app .small-img-box {\n  height: 80px;\n  width: 80px;\n  border-radius: var(--octopus-border-radius);\n  overflow: hidden;\n  flex-shrink: 0;\n  margin: 0.5rem;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;EA6CA,MAAM,QAAQ;EAKd,MAAM,kBAA+C,IAAI,KAAA,CAAS;EAClE,MAAM,iBAA2C,IAAI,KAAA,CAAS;EAC9D,MAAM,gBAAgE,IAAI,KAAA,CAAS;EAInF,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,oBAAoB,iBAAiB,cAAc;EAC3D,MAAM,EAAE,qBAAqB,cAAc;EAC3C,MAAM,cAAc,eAAe;EAGnC,MAAM,eAAe,eAAe,YAAY,eAAe,YAAY,YAAY,YAAY,MAAM,OAAO,EAAE;EAClH,MAAM,eAAe,eAAe;GAClC,IAAI,aAAa,OACf,OAAO,YAAY,aAAa;GAElC,OAAO,eAAe;EACxB,CAAC;EACD,MAAM,yBAAyB,eAAe;GAC5C,IAAI,aAAa,SAAS,YAAY,aACpC,OAAO,aAAa,YAAY,YAAY,QAAQ;GAEtD,OAAO,aAAa,gBAAgB,KAAK;EAC3C,CAAC;EAED,gBAAc;GACZ,sBAAsB;GACtB,cAAc,QAAQ,kBAAkB;IACtC,sBAAsB;GACxB,GAAG,GAAK;EACV,CAAC;EAED,kBAAgB;GACd,cAAc,cAAc,KAAK;GACjC,cAAc,QAAO,KAAA;EACvB,CAAC;EAID,eAAe,wBAAuC;GACpD,IAAI,CAAC,MAAM,SAAS,aAAa,OAC/B;GAEF,mBACE,MAAM,MAAM,IACZ,gBAAgB,OAAO,SAAS,IAChC,cACF;EACF;EACA,SAAS,eAAe,UAAgC,SAAyB;GAC/E,gBAAgB,QAAQ;GACxB,eAAe,QAAQ;EACzB;;;;;;;;;;;;;;;;;;;;;;;;;;;mBCtGO,OAAM,4BAA2B;;;CAGlC,OAAM;;;;;;;qBAHV,mBA8BM,OA9BN,YA8BM,CA5BI,OAAA,uBAAuB,UAAU,OAAA,gBAAA,UAAA,GADzC,mBAKM,OALN,YAKM,gBADD,OAAA,EAAC,WAAA,CAAA,IAAgB,UACtB,CAAA,KAAA,mBAAA,QAAA,IAAA,GAEQ,OAAA,gBAAA,UAAA,GADR,YAmBc,wBAAA;;EAjBZ,OAAM;EACL,IAAE;;wBAA0D,OAAA,aAAa,UAAS;;EAIlF,OAAO,OAAA,EAAC,qBAAA,EAAA,MAA8B,OAAA,aAAa,MAAK,CAAA;;yBAUvD,CAAA,eARF,mBAQE,OAAA;GANA,OAAM;GACN,QAAO;GACP,OAAM;GACN,eAAY;GACZ,KAAI;GACH,OAAO,OAAA,EAAC,sBAAA,EAAA,MAA+B,OAAA,aAAa,MAAK,CAAA;8CANlD,OAAA,iBAAiB,OAAA,aAAa,UAAQ,IAAA,CAAA,CAAA,CAAA,GAQhD,mBAAmC,OAAA,MAAA,gBAA3B,OAAA,aAAa,KAAK,GAAA,CAAA,CAAA,CAAA;;2BAEZ,OAAA,uBAAuB,UAAA,UAAA,GAAvC,mBAEM,OAAA,YAAA,gBADD,OAAA,sBAAsB,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA,CAAA,CAAA"}

package/dist/{RadioCurrently-D5M81oIX.mjs → RadioCurrently-DWySwV64.mjs}

@@ -1,8 +1,8 @@
 import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.mjs";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { n as usePlayerStore } from "./PlayerStore-DukkcHI_.mjs";
-import { t as useImageProxy } from "./useImageProxy-Bj0cOCct.mjs";
-import { t as useFetchRadio } from "./usefetchRadioData-C2cwiaCP.mjs";
+import { n as usePlayerStore } from "./PlayerStore-vYmnOEA_.mjs";
+import { t as useImageProxy } from "./useImageProxy-BdQJmj4a.mjs";
+import { t as useFetchRadio } from "./usefetchRadioData-CkrAfN1c.mjs";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, onMounted, onUnmounted, openBlock, ref, resolveComponent, resolveDirective, toDisplayString, withCtx, withDirectives } from "vue";
 import { useI18n } from "vue-i18n";
 //#region src/components/display/live/RadioCurrently.vue?vue&type=script&setup=true&lang.ts
@@ -109,4 +109,4 @@ var RadioCurrently_default = /*#__PURE__*/ _plugin_vue_export_helper_default(Rad
 //#endregion
 export { RadioCurrently_exports as n, RadioCurrently_default as t };
 
-//# sourceMappingURL=RadioCurrently-D5M81oIX.mjs.map
+//# sourceMappingURL=RadioCurrently-DWySwV64.mjs.map

package/dist/RadioCurrently-DWySwV64.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioCurrently-DWySwV64.mjs","names":[],"sources":["../src/components/display/live/RadioCurrently.vue","../src/components/display/live/RadioCurrently.vue"],"sourcesContent":["<template>\n  <div class=\"d-flex align-items-center\">\n    <div\n      v-if=\"currentlyPlayingString.length || podcastRadio\"\n      class=\"fw-bold me-1\"\n    >\n      {{ t(\"Currently\") }}&nbsp;:\n    </div>\n    <router-link\n      v-if=\"podcastRadio\"\n      class=\"d-flex align-items-center\"\n      :to=\"{\n        name: 'podcast',\n        params: { podcastId: podcastRadio.podcastId },\n      }\"\n      :title=\"t('Episode name page', { name: podcastRadio.title })\"\n    >\n      <img\n        v-lazy=\"useProxyImageUrl(podcastRadio.imageUrl, '80')\"\n        width=\"80\"\n        height=\"80\"\n        class=\"small-img-box\"\n        aria-hidden=\"true\"\n        alt=\"\"\n        :title=\"t('Episode name image', { name: podcastRadio.title })\"\n      />\n      <div>{{ podcastRadio.title }}</div>\n    </router-link>\n    <div v-else-if=\"currentlyPlayingString.length\">\n      {{ currentlyPlayingString }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useFetchRadio} from \"../../composable/radio/usefetchRadioData\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst currentMetadata: Ref<MediaRadio | undefined> = ref(undefined);\nconst currentPodcast: Ref<Podcast | undefined> = ref(undefined);\nconst radioInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n  \n//Composables\nconst { t } = useI18n();\nconst { fetchRadioMetadata, displayTitle } = useFetchRadio();\nconst { useProxyImageUrl } = useImageProxy();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst podcastRadio = computed(() => {\n  if (playingRadio.value) {\n    return playerStore.playerRadio?.podcast;\n  }\n  return currentPodcast.value;\n});\nconst currentlyPlayingString = computed(() => {\n  if (playingRadio.value && playerStore.playerRadio) {\n    return displayTitle(playerStore.playerRadio.metadata);\n  }\n  return displayTitle(currentMetadata.value);\n});\n\nonMounted(()=>{\n  fetchCurrentlyPlaying();\n  radioInterval.value = setInterval(() => {\n    fetchCurrentlyPlaying();\n  }, 10000);\n})\n\nonUnmounted(()=>{\n  clearInterval(radioInterval.value);\n  radioInterval.value= undefined;\n})\n\n\n//Methods\nasync function fetchCurrentlyPlaying(): Promise<void> {\n  if (!props.radio || playingRadio.value) {\n    return;\n  }\n  fetchRadioMetadata(\n    props.radio.id,\n    currentMetadata.value?.title ?? \"\",\n    updateMetadata,\n  );\n}\nfunction updateMetadata(metadata: MediaRadio|undefined, podcast?: Podcast): void {\n  currentMetadata.value = metadata;\n  currentPodcast.value = podcast;\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app .small-img-box {\n  height: 80px;\n  width: 80px;\n  border-radius: var(--octopus-border-radius);\n  overflow: hidden;\n  flex-shrink: 0;\n  margin: 0.5rem;\n}\n</style>\n","<template>\n  <div class=\"d-flex align-items-center\">\n    <div\n      v-if=\"currentlyPlayingString.length || podcastRadio\"\n      class=\"fw-bold me-1\"\n    >\n      {{ t(\"Currently\") }}&nbsp;:\n    </div>\n    <router-link\n      v-if=\"podcastRadio\"\n      class=\"d-flex align-items-center\"\n      :to=\"{\n        name: 'podcast',\n        params: { podcastId: podcastRadio.podcastId },\n      }\"\n      :title=\"t('Episode name page', { name: podcastRadio.title })\"\n    >\n      <img\n        v-lazy=\"useProxyImageUrl(podcastRadio.imageUrl, '80')\"\n        width=\"80\"\n        height=\"80\"\n        class=\"small-img-box\"\n        aria-hidden=\"true\"\n        alt=\"\"\n        :title=\"t('Episode name image', { name: podcastRadio.title })\"\n      />\n      <div>{{ podcastRadio.title }}</div>\n    </router-link>\n    <div v-else-if=\"currentlyPlayingString.length\">\n      {{ currentlyPlayingString }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useFetchRadio} from \"../../composable/radio/usefetchRadioData\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst currentMetadata: Ref<MediaRadio | undefined> = ref(undefined);\nconst currentPodcast: Ref<Podcast | undefined> = ref(undefined);\nconst radioInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n  \n//Composables\nconst { t } = useI18n();\nconst { fetchRadioMetadata, displayTitle } = useFetchRadio();\nconst { useProxyImageUrl } = useImageProxy();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst podcastRadio = computed(() => {\n  if (playingRadio.value) {\n    return playerStore.playerRadio?.podcast;\n  }\n  return currentPodcast.value;\n});\nconst currentlyPlayingString = computed(() => {\n  if (playingRadio.value && playerStore.playerRadio) {\n    return displayTitle(playerStore.playerRadio.metadata);\n  }\n  return displayTitle(currentMetadata.value);\n});\n\nonMounted(()=>{\n  fetchCurrentlyPlaying();\n  radioInterval.value = setInterval(() => {\n    fetchCurrentlyPlaying();\n  }, 10000);\n})\n\nonUnmounted(()=>{\n  clearInterval(radioInterval.value);\n  radioInterval.value= undefined;\n})\n\n\n//Methods\nasync function fetchCurrentlyPlaying(): Promise<void> {\n  if (!props.radio || playingRadio.value) {\n    return;\n  }\n  fetchRadioMetadata(\n    props.radio.id,\n    currentMetadata.value?.title ?? \"\",\n    updateMetadata,\n  );\n}\nfunction updateMetadata(metadata: MediaRadio|undefined, podcast?: Podcast): void {\n  currentMetadata.value = metadata;\n  currentPodcast.value = podcast;\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app .small-img-box {\n  height: 80px;\n  width: 80px;\n  border-radius: var(--octopus-border-radius);\n  overflow: hidden;\n  flex-shrink: 0;\n  margin: 0.5rem;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;EA6CA,MAAM,QAAQ;EAKd,MAAM,kBAA+C,IAAI,KAAA,CAAS;EAClE,MAAM,iBAA2C,IAAI,KAAA,CAAS;EAC9D,MAAM,gBAAgE,IAAI,KAAA,CAAS;EAInF,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,oBAAoB,iBAAiB,cAAc;EAC3D,MAAM,EAAE,qBAAqB,cAAc;EAC3C,MAAM,cAAc,eAAe;EAGnC,MAAM,eAAe,eAAe,YAAY,eAAe,YAAY,YAAY,YAAY,MAAM,OAAO,EAAE;EAClH,MAAM,eAAe,eAAe;GAClC,IAAI,aAAa,OACf,OAAO,YAAY,aAAa;GAElC,OAAO,eAAe;EACxB,CAAC;EACD,MAAM,yBAAyB,eAAe;GAC5C,IAAI,aAAa,SAAS,YAAY,aACpC,OAAO,aAAa,YAAY,YAAY,QAAQ;GAEtD,OAAO,aAAa,gBAAgB,KAAK;EAC3C,CAAC;EAED,gBAAc;GACZ,sBAAsB;GACtB,cAAc,QAAQ,kBAAkB;IACtC,sBAAsB;GACxB,GAAG,GAAK;EACV,CAAC;EAED,kBAAgB;GACd,cAAc,cAAc,KAAK;GACjC,cAAc,QAAO,KAAA;EACvB,CAAC;EAID,eAAe,wBAAuC;GACpD,IAAI,CAAC,MAAM,SAAS,aAAa,OAC/B;GAEF,mBACE,MAAM,MAAM,IACZ,gBAAgB,OAAO,SAAS,IAChC,cACF;EACF;EACA,SAAS,eAAe,UAAgC,SAAyB;GAC/E,gBAAgB,QAAQ;GACxB,eAAe,QAAQ;EACzB;;;;;;;;;;;;;;;;;;;;;;;;;;;mBCtGO,OAAM,4BAA2B;;;CAGlC,OAAM;;;;;;;qBAHV,mBA8BM,OA9BN,YA8BM,CA5BI,OAAA,uBAAuB,UAAU,OAAA,gBAAA,UAAA,GADzC,mBAKM,OALN,YAKM,gBADD,OAAA,EAAC,WAAA,CAAA,IAAgB,UACtB,CAAA,KAAA,mBAAA,QAAA,IAAA,GAEQ,OAAA,gBAAA,UAAA,GADR,YAmBc,wBAAA;;EAjBZ,OAAM;EACL,IAAE;;wBAA0D,OAAA,aAAa,UAAS;;EAIlF,OAAO,OAAA,EAAC,qBAAA,EAAA,MAA8B,OAAA,aAAa,MAAK,CAAA;;yBAUvD,CAAA,eARF,mBAQE,OAAA;GANA,OAAM;GACN,QAAO;GACP,OAAM;GACN,eAAY;GACZ,KAAI;GACH,OAAO,OAAA,EAAC,sBAAA,EAAA,MAA+B,OAAA,aAAa,MAAK,CAAA;8CANlD,OAAA,iBAAiB,OAAA,aAAa,UAAQ,IAAA,CAAA,CAAA,CAAA,GAQhD,mBAAmC,OAAA,MAAA,gBAA3B,OAAA,aAAa,KAAK,GAAA,CAAA,CAAA,CAAA;;2BAEZ,OAAA,uBAAuB,UAAA,UAAA,GAAvC,mBAEM,OAAA,YAAA,gBADD,OAAA,sBAAsB,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA,CAAA,CAAA"}

package/dist/RadioHistory-7EGvEAMx.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioHistory-7EGvEAMx.mjs","names":[],"sources":["../src/components/misc/player/radio/RadioHistory.vue","../src/components/misc/player/radio/RadioHistory.vue"],"sourcesContent":["<template>\n  <div v-if=\"playerRadioHistory.length\" class=\"d-flex align-items-center mt-3\">\n    <div class=\"fw-bold me-3\">\n      {{ t(\"Previously\") + \":\" }}\n    </div>\n    <button\n      v-if=\"indexStart !== 0\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(0)\"\n    >\n      <ChevronLeftIcon />\n    </button>\n    <div ref=\"historyListContainer\" class=\"history-list-container\">\n      <div\n        v-for=\"(pastItem, index) in playerRadioHistory\"\n        :id=\"'history' + index\"\n        :key=\"pastItem.title\"\n        class=\"d-flex flex-shrink-0\"\n      >\n        <div class=\"d-flex flex-shrink-0 align-items-end\">\n          <time :datetime=\"pastItem.startDate\" class=\"me-2 hour-past-item\">{{\n            displayTimeItem(pastItem)\n          }}</time>\n          <span class=\"me-3\">{{ displayPreviousItem(pastItem) }}</span>\n        </div>\n      </div>\n    </div>\n    <button\n      v-if=\"indexNotDisplay <= playerRadioHistory.length - 1\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(indexNotDisplay)\"\n    >\n      <ChevronRightIcon />\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronLeftIcon from \"vue-material-design-icons/ChevronLeft.vue\";\nimport ChevronRightIcon from \"vue-material-design-icons/ChevronRight.vue\";\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { computed, nextTick, onMounted, onUnmounted, ref, useTemplateRef, watch } from \"vue\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { useI18n } from \"vue-i18n\";\nimport { useFetchRadio } from \"../../../composable/radio/usefetchRadioData\";\n\n\n//Data \nconst indexStart = ref(0);\nconst indexNotDisplay = ref(100);\nconst historyListContainerRef = useTemplateRef('historyListContainer');\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst {displayTitle} = useFetchRadio();\n\n\n//Computed\nconst playerRadioHistory = computed(() => playerStore.playerRadio?.history ?? []);\n   \n\n//Watch\nwatch(playerRadioHistory, () => {\n  nextTick(() => {\n    handleResize(0);\n  });\n}, {deep: true,immediate: true});\n\n\nonMounted(()=>window.addEventListener(\"resize\", () => {handleResize(0);}))\nonUnmounted(()=>window.removeEventListener(\"resize\", () => {handleResize(0);}))\n\n\n//Methods\nfunction displayEverythingAfterIndex(indexAsked: number) {\n  for (let index = 0; index < playerRadioHistory.value.length; index++) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index < indexAsked && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    if (index >= indexAsked && el.classList.contains(\"hid\")) {\n      el.classList.remove(\"hid\");\n    }\n  }\n}\nfunction handleResize(indexAsked: number): void {\n  const historyList = historyListContainerRef?.value as HTMLElement;\n  if (null === historyList || !historyList) {\n    return;\n  }\n  indexStart.value = indexAsked;\n  indexNotDisplay.value = playerRadioHistory.value.length;\n  displayEverythingAfterIndex(indexAsked);\n  for (\n    let index = indexStart.value + 1;\n    index < playerRadioHistory.value.length;\n    index++\n  ) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index > indexNotDisplay.value && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    const parent = el.parentElement;\n    if (parent && el.offsetLeft + el.clientWidth > parent.clientWidth) {\n      indexNotDisplay.value = index;\n      el.classList.add(\"hid\");\n    }\n  }\n}\nfunction displayTimeItem(item: MediaRadio): string {\n  return dayjs(item.startDate).format(\"HH:mm\");\n}\nfunction displayPreviousItem(item: MediaRadio): string {\n  if (item.podcastId) {\n    return item.title;\n  }\n  return displayTitle(item);\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .history-list-container {\n    display: inline-flex;\n    justify-content: flex-start;\n    overflow: hidden;\n    flex-grow: 1;\n    width: 0;\n    position: relative;\n  }\n\n  .hour-past-item {\n    font-size: 0.8rem;\n    color: oklch(89% 0 0deg);\n  }\n}\n</style>\n","<template>\n  <div v-if=\"playerRadioHistory.length\" class=\"d-flex align-items-center mt-3\">\n    <div class=\"fw-bold me-3\">\n      {{ t(\"Previously\") + \":\" }}\n    </div>\n    <button\n      v-if=\"indexStart !== 0\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(0)\"\n    >\n      <ChevronLeftIcon />\n    </button>\n    <div ref=\"historyListContainer\" class=\"history-list-container\">\n      <div\n        v-for=\"(pastItem, index) in playerRadioHistory\"\n        :id=\"'history' + index\"\n        :key=\"pastItem.title\"\n        class=\"d-flex flex-shrink-0\"\n      >\n        <div class=\"d-flex flex-shrink-0 align-items-end\">\n          <time :datetime=\"pastItem.startDate\" class=\"me-2 hour-past-item\">{{\n            displayTimeItem(pastItem)\n          }}</time>\n          <span class=\"me-3\">{{ displayPreviousItem(pastItem) }}</span>\n        </div>\n      </div>\n    </div>\n    <button\n      v-if=\"indexNotDisplay <= playerRadioHistory.length - 1\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(indexNotDisplay)\"\n    >\n      <ChevronRightIcon />\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronLeftIcon from \"vue-material-design-icons/ChevronLeft.vue\";\nimport ChevronRightIcon from \"vue-material-design-icons/ChevronRight.vue\";\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { computed, nextTick, onMounted, onUnmounted, ref, useTemplateRef, watch } from \"vue\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { useI18n } from \"vue-i18n\";\nimport { useFetchRadio } from \"../../../composable/radio/usefetchRadioData\";\n\n\n//Data \nconst indexStart = ref(0);\nconst indexNotDisplay = ref(100);\nconst historyListContainerRef = useTemplateRef('historyListContainer');\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst {displayTitle} = useFetchRadio();\n\n\n//Computed\nconst playerRadioHistory = computed(() => playerStore.playerRadio?.history ?? []);\n   \n\n//Watch\nwatch(playerRadioHistory, () => {\n  nextTick(() => {\n    handleResize(0);\n  });\n}, {deep: true,immediate: true});\n\n\nonMounted(()=>window.addEventListener(\"resize\", () => {handleResize(0);}))\nonUnmounted(()=>window.removeEventListener(\"resize\", () => {handleResize(0);}))\n\n\n//Methods\nfunction displayEverythingAfterIndex(indexAsked: number) {\n  for (let index = 0; index < playerRadioHistory.value.length; index++) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index < indexAsked && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    if (index >= indexAsked && el.classList.contains(\"hid\")) {\n      el.classList.remove(\"hid\");\n    }\n  }\n}\nfunction handleResize(indexAsked: number): void {\n  const historyList = historyListContainerRef?.value as HTMLElement;\n  if (null === historyList || !historyList) {\n    return;\n  }\n  indexStart.value = indexAsked;\n  indexNotDisplay.value = playerRadioHistory.value.length;\n  displayEverythingAfterIndex(indexAsked);\n  for (\n    let index = indexStart.value + 1;\n    index < playerRadioHistory.value.length;\n    index++\n  ) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index > indexNotDisplay.value && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    const parent = el.parentElement;\n    if (parent && el.offsetLeft + el.clientWidth > parent.clientWidth) {\n      indexNotDisplay.value = index;\n      el.classList.add(\"hid\");\n    }\n  }\n}\nfunction displayTimeItem(item: MediaRadio): string {\n  return dayjs(item.startDate).format(\"HH:mm\");\n}\nfunction displayPreviousItem(item: MediaRadio): string {\n  if (item.podcastId) {\n    return item.title;\n  }\n  return displayTitle(item);\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .history-list-container {\n    display: inline-flex;\n    justify-content: flex-start;\n    overflow: hidden;\n    flex-grow: 1;\n    width: 0;\n    position: relative;\n  }\n\n  .hour-past-item {\n    font-size: 0.8rem;\n    color: oklch(89% 0 0deg);\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/RadioHistory-BdMa013x.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioHistory-BdMa013x.mjs","names":[],"sources":["../src/components/misc/player/radio/RadioHistory.vue","../src/components/misc/player/radio/RadioHistory.vue"],"sourcesContent":["<template>\n  <div v-if=\"playerRadioHistory.length\" class=\"d-flex align-items-center mt-3\">\n    <div class=\"fw-bold me-3\">\n      {{ t(\"Previously\") + \":\" }}\n    </div>\n    <button\n      v-if=\"indexStart !== 0\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(0)\"\n    >\n      <ChevronLeftIcon />\n    </button>\n    <div ref=\"historyListContainer\" class=\"history-list-container\">\n      <div\n        v-for=\"(pastItem, index) in playerRadioHistory\"\n        :id=\"'history' + index\"\n        :key=\"pastItem.title\"\n        class=\"d-flex flex-shrink-0\"\n      >\n        <div class=\"d-flex flex-shrink-0 align-items-end\">\n          <time :datetime=\"pastItem.startDate\" class=\"me-2 hour-past-item\">{{\n            displayTimeItem(pastItem)\n          }}</time>\n          <span class=\"me-3\">{{ displayPreviousItem(pastItem) }}</span>\n        </div>\n      </div>\n    </div>\n    <button\n      v-if=\"indexNotDisplay <= playerRadioHistory.length - 1\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(indexNotDisplay)\"\n    >\n      <ChevronRightIcon />\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronLeftIcon from \"vue-material-design-icons/ChevronLeft.vue\";\nimport ChevronRightIcon from \"vue-material-design-icons/ChevronRight.vue\";\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { computed, nextTick, onMounted, onUnmounted, ref, useTemplateRef, watch } from \"vue\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { useI18n } from \"vue-i18n\";\nimport { useFetchRadio } from \"../../../composable/radio/usefetchRadioData\";\n\n\n//Data \nconst indexStart = ref(0);\nconst indexNotDisplay = ref(100);\nconst historyListContainerRef = useTemplateRef('historyListContainer');\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst {displayTitle} = useFetchRadio();\n\n\n//Computed\nconst playerRadioHistory = computed(() => playerStore.playerRadio?.history ?? []);\n   \n\n//Watch\nwatch(playerRadioHistory, () => {\n  nextTick(() => {\n    handleResize(0);\n  });\n}, {deep: true,immediate: true});\n\n\nonMounted(()=>window.addEventListener(\"resize\", () => {handleResize(0);}))\nonUnmounted(()=>window.removeEventListener(\"resize\", () => {handleResize(0);}))\n\n\n//Methods\nfunction displayEverythingAfterIndex(indexAsked: number) {\n  for (let index = 0; index < playerRadioHistory.value.length; index++) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index < indexAsked && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    if (index >= indexAsked && el.classList.contains(\"hid\")) {\n      el.classList.remove(\"hid\");\n    }\n  }\n}\nfunction handleResize(indexAsked: number): void {\n  const historyList = historyListContainerRef?.value as HTMLElement;\n  if (null === historyList || !historyList) {\n    return;\n  }\n  indexStart.value = indexAsked;\n  indexNotDisplay.value = playerRadioHistory.value.length;\n  displayEverythingAfterIndex(indexAsked);\n  for (\n    let index = indexStart.value + 1;\n    index < playerRadioHistory.value.length;\n    index++\n  ) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index > indexNotDisplay.value && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    const parent = el.parentElement;\n    if (parent && el.offsetLeft + el.clientWidth > parent.clientWidth) {\n      indexNotDisplay.value = index;\n      el.classList.add(\"hid\");\n    }\n  }\n}\nfunction displayTimeItem(item: MediaRadio): string {\n  return dayjs(item.startDate).format(\"HH:mm\");\n}\nfunction displayPreviousItem(item: MediaRadio): string {\n  if (item.podcastId) {\n    return item.title;\n  }\n  return displayTitle(item);\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .history-list-container {\n    display: inline-flex;\n    justify-content: flex-start;\n    overflow: hidden;\n    flex-grow: 1;\n    width: 0;\n    position: relative;\n  }\n\n  .hour-past-item {\n    font-size: 0.8rem;\n    color: oklch(89% 0 0deg);\n  }\n}\n</style>\n","<template>\n  <div v-if=\"playerRadioHistory.length\" class=\"d-flex align-items-center mt-3\">\n    <div class=\"fw-bold me-3\">\n      {{ t(\"Previously\") + \":\" }}\n    </div>\n    <button\n      v-if=\"indexStart !== 0\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(0)\"\n    >\n      <ChevronLeftIcon />\n    </button>\n    <div ref=\"historyListContainer\" class=\"history-list-container\">\n      <div\n        v-for=\"(pastItem, index) in playerRadioHistory\"\n        :id=\"'history' + index\"\n        :key=\"pastItem.title\"\n        class=\"d-flex flex-shrink-0\"\n      >\n        <div class=\"d-flex flex-shrink-0 align-items-end\">\n          <time :datetime=\"pastItem.startDate\" class=\"me-2 hour-past-item\">{{\n            displayTimeItem(pastItem)\n          }}</time>\n          <span class=\"me-3\">{{ displayPreviousItem(pastItem) }}</span>\n        </div>\n      </div>\n    </div>\n    <button\n      v-if=\"indexNotDisplay <= playerRadioHistory.length - 1\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(indexNotDisplay)\"\n    >\n      <ChevronRightIcon />\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronLeftIcon from \"vue-material-design-icons/ChevronLeft.vue\";\nimport ChevronRightIcon from \"vue-material-design-icons/ChevronRight.vue\";\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { computed, nextTick, onMounted, onUnmounted, ref, useTemplateRef, watch } from \"vue\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { useI18n } from \"vue-i18n\";\nimport { useFetchRadio } from \"../../../composable/radio/usefetchRadioData\";\n\n\n//Data \nconst indexStart = ref(0);\nconst indexNotDisplay = ref(100);\nconst historyListContainerRef = useTemplateRef('historyListContainer');\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst {displayTitle} = useFetchRadio();\n\n\n//Computed\nconst playerRadioHistory = computed(() => playerStore.playerRadio?.history ?? []);\n   \n\n//Watch\nwatch(playerRadioHistory, () => {\n  nextTick(() => {\n    handleResize(0);\n  });\n}, {deep: true,immediate: true});\n\n\nonMounted(()=>window.addEventListener(\"resize\", () => {handleResize(0);}))\nonUnmounted(()=>window.removeEventListener(\"resize\", () => {handleResize(0);}))\n\n\n//Methods\nfunction displayEverythingAfterIndex(indexAsked: number) {\n  for (let index = 0; index < playerRadioHistory.value.length; index++) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index < indexAsked && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    if (index >= indexAsked && el.classList.contains(\"hid\")) {\n      el.classList.remove(\"hid\");\n    }\n  }\n}\nfunction handleResize(indexAsked: number): void {\n  const historyList = historyListContainerRef?.value as HTMLElement;\n  if (null === historyList || !historyList) {\n    return;\n  }\n  indexStart.value = indexAsked;\n  indexNotDisplay.value = playerRadioHistory.value.length;\n  displayEverythingAfterIndex(indexAsked);\n  for (\n    let index = indexStart.value + 1;\n    index < playerRadioHistory.value.length;\n    index++\n  ) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index > indexNotDisplay.value && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    const parent = el.parentElement;\n    if (parent && el.offsetLeft + el.clientWidth > parent.clientWidth) {\n      indexNotDisplay.value = index;\n      el.classList.add(\"hid\");\n    }\n  }\n}\nfunction displayTimeItem(item: MediaRadio): string {\n  return dayjs(item.startDate).format(\"HH:mm\");\n}\nfunction displayPreviousItem(item: MediaRadio): string {\n  if (item.podcastId) {\n    return item.title;\n  }\n  return displayTitle(item);\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .history-list-container {\n    display: inline-flex;\n    justify-content: flex-start;\n    overflow: hidden;\n    flex-grow: 1;\n    width: 0;\n    position: relative;\n  }\n\n  .hour-past-item {\n    font-size: 0.8rem;\n    color: oklch(89% 0 0deg);\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/{RadioHistory-BgOve4jk.mjs → RadioHistory-DlQFZYp2.mjs}

@@ -1,6 +1,6 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { n as usePlayerStore } from "./PlayerStore-DukkcHI_.mjs";
-import { t as useFetchRadio } from "./usefetchRadioData-C2cwiaCP.mjs";
+import { n as usePlayerStore } from "./PlayerStore-vYmnOEA_.mjs";
+import { t as useFetchRadio } from "./usefetchRadioData-CkrAfN1c.mjs";
 import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, nextTick, onMounted, onUnmounted, openBlock, ref, renderList, toDisplayString, useTemplateRef, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import dayjs from "dayjs";
@@ -136,4 +136,4 @@ var RadioHistory_default = /*#__PURE__*/ _plugin_vue_export_helper_default(Radio
 //#endregion
 export { RadioHistory_default as default };
 
-//# sourceMappingURL=RadioHistory-BgOve4jk.mjs.map
+//# sourceMappingURL=RadioHistory-DlQFZYp2.mjs.map

package/dist/RadioHistory-DlQFZYp2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioHistory-DlQFZYp2.mjs","names":[],"sources":["../src/components/misc/player/radio/RadioHistory.vue","../src/components/misc/player/radio/RadioHistory.vue"],"sourcesContent":["<template>\n  <div v-if=\"playerRadioHistory.length\" class=\"d-flex align-items-center mt-3\">\n    <div class=\"fw-bold me-3\">\n      {{ t(\"Previously\") + \":\" }}\n    </div>\n    <button\n      v-if=\"indexStart !== 0\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(0)\"\n    >\n      <ChevronLeftIcon />\n    </button>\n    <div ref=\"historyListContainer\" class=\"history-list-container\">\n      <div\n        v-for=\"(pastItem, index) in playerRadioHistory\"\n        :id=\"'history' + index\"\n        :key=\"pastItem.title\"\n        class=\"d-flex flex-shrink-0\"\n      >\n        <div class=\"d-flex flex-shrink-0 align-items-end\">\n          <time :datetime=\"pastItem.startDate\" class=\"me-2 hour-past-item\">{{\n            displayTimeItem(pastItem)\n          }}</time>\n          <span class=\"me-3\">{{ displayPreviousItem(pastItem) }}</span>\n        </div>\n      </div>\n    </div>\n    <button\n      v-if=\"indexNotDisplay <= playerRadioHistory.length - 1\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(indexNotDisplay)\"\n    >\n      <ChevronRightIcon />\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronLeftIcon from \"vue-material-design-icons/ChevronLeft.vue\";\nimport ChevronRightIcon from \"vue-material-design-icons/ChevronRight.vue\";\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { computed, nextTick, onMounted, onUnmounted, ref, useTemplateRef, watch } from \"vue\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { useI18n } from \"vue-i18n\";\nimport { useFetchRadio } from \"../../../composable/radio/usefetchRadioData\";\n\n\n//Data \nconst indexStart = ref(0);\nconst indexNotDisplay = ref(100);\nconst historyListContainerRef = useTemplateRef('historyListContainer');\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst {displayTitle} = useFetchRadio();\n\n\n//Computed\nconst playerRadioHistory = computed(() => playerStore.playerRadio?.history ?? []);\n   \n\n//Watch\nwatch(playerRadioHistory, () => {\n  nextTick(() => {\n    handleResize(0);\n  });\n}, {deep: true,immediate: true});\n\n\nonMounted(()=>window.addEventListener(\"resize\", () => {handleResize(0);}))\nonUnmounted(()=>window.removeEventListener(\"resize\", () => {handleResize(0);}))\n\n\n//Methods\nfunction displayEverythingAfterIndex(indexAsked: number) {\n  for (let index = 0; index < playerRadioHistory.value.length; index++) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index < indexAsked && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    if (index >= indexAsked && el.classList.contains(\"hid\")) {\n      el.classList.remove(\"hid\");\n    }\n  }\n}\nfunction handleResize(indexAsked: number): void {\n  const historyList = historyListContainerRef?.value as HTMLElement;\n  if (null === historyList || !historyList) {\n    return;\n  }\n  indexStart.value = indexAsked;\n  indexNotDisplay.value = playerRadioHistory.value.length;\n  displayEverythingAfterIndex(indexAsked);\n  for (\n    let index = indexStart.value + 1;\n    index < playerRadioHistory.value.length;\n    index++\n  ) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index > indexNotDisplay.value && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    const parent = el.parentElement;\n    if (parent && el.offsetLeft + el.clientWidth > parent.clientWidth) {\n      indexNotDisplay.value = index;\n      el.classList.add(\"hid\");\n    }\n  }\n}\nfunction displayTimeItem(item: MediaRadio): string {\n  return dayjs(item.startDate).format(\"HH:mm\");\n}\nfunction displayPreviousItem(item: MediaRadio): string {\n  if (item.podcastId) {\n    return item.title;\n  }\n  return displayTitle(item);\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .history-list-container {\n    display: inline-flex;\n    justify-content: flex-start;\n    overflow: hidden;\n    flex-grow: 1;\n    width: 0;\n    position: relative;\n  }\n\n  .hour-past-item {\n    font-size: 0.8rem;\n    color: oklch(89% 0 0deg);\n  }\n}\n</style>\n","<template>\n  <div v-if=\"playerRadioHistory.length\" class=\"d-flex align-items-center mt-3\">\n    <div class=\"fw-bold me-3\">\n      {{ t(\"Previously\") + \":\" }}\n    </div>\n    <button\n      v-if=\"indexStart !== 0\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(0)\"\n    >\n      <ChevronLeftIcon />\n    </button>\n    <div ref=\"historyListContainer\" class=\"history-list-container\">\n      <div\n        v-for=\"(pastItem, index) in playerRadioHistory\"\n        :id=\"'history' + index\"\n        :key=\"pastItem.title\"\n        class=\"d-flex flex-shrink-0\"\n      >\n        <div class=\"d-flex flex-shrink-0 align-items-end\">\n          <time :datetime=\"pastItem.startDate\" class=\"me-2 hour-past-item\">{{\n            displayTimeItem(pastItem)\n          }}</time>\n          <span class=\"me-3\">{{ displayPreviousItem(pastItem) }}</span>\n        </div>\n      </div>\n    </div>\n    <button\n      v-if=\"indexNotDisplay <= playerRadioHistory.length - 1\"\n      class=\"btn btn-transparent text-light\"\n      @click=\"handleResize(indexNotDisplay)\"\n    >\n      <ChevronRightIcon />\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronLeftIcon from \"vue-material-design-icons/ChevronLeft.vue\";\nimport ChevronRightIcon from \"vue-material-design-icons/ChevronRight.vue\";\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { computed, nextTick, onMounted, onUnmounted, ref, useTemplateRef, watch } from \"vue\";\nimport { MediaRadio } from \"@/stores/class/general/player\";\nimport { useI18n } from \"vue-i18n\";\nimport { useFetchRadio } from \"../../../composable/radio/usefetchRadioData\";\n\n\n//Data \nconst indexStart = ref(0);\nconst indexNotDisplay = ref(100);\nconst historyListContainerRef = useTemplateRef('historyListContainer');\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\nconst {displayTitle} = useFetchRadio();\n\n\n//Computed\nconst playerRadioHistory = computed(() => playerStore.playerRadio?.history ?? []);\n   \n\n//Watch\nwatch(playerRadioHistory, () => {\n  nextTick(() => {\n    handleResize(0);\n  });\n}, {deep: true,immediate: true});\n\n\nonMounted(()=>window.addEventListener(\"resize\", () => {handleResize(0);}))\nonUnmounted(()=>window.removeEventListener(\"resize\", () => {handleResize(0);}))\n\n\n//Methods\nfunction displayEverythingAfterIndex(indexAsked: number) {\n  for (let index = 0; index < playerRadioHistory.value.length; index++) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index < indexAsked && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    if (index >= indexAsked && el.classList.contains(\"hid\")) {\n      el.classList.remove(\"hid\");\n    }\n  }\n}\nfunction handleResize(indexAsked: number): void {\n  const historyList = historyListContainerRef?.value as HTMLElement;\n  if (null === historyList || !historyList) {\n    return;\n  }\n  indexStart.value = indexAsked;\n  indexNotDisplay.value = playerRadioHistory.value.length;\n  displayEverythingAfterIndex(indexAsked);\n  for (\n    let index = indexStart.value + 1;\n    index < playerRadioHistory.value.length;\n    index++\n  ) {\n    const el = historyListContainerRef?.value?.querySelector('#history' + index);\n    if (!el) continue;\n    if (index > indexNotDisplay.value && !el.classList.contains(\"hid\")) {\n      el.classList.add(\"hid\");\n      continue;\n    }\n    const parent = el.parentElement;\n    if (parent && el.offsetLeft + el.clientWidth > parent.clientWidth) {\n      indexNotDisplay.value = index;\n      el.classList.add(\"hid\");\n    }\n  }\n}\nfunction displayTimeItem(item: MediaRadio): string {\n  return dayjs(item.startDate).format(\"HH:mm\");\n}\nfunction displayPreviousItem(item: MediaRadio): string {\n  if (item.podcastId) {\n    return item.title;\n  }\n  return displayTitle(item);\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .history-list-container {\n    display: inline-flex;\n    justify-content: flex-start;\n    overflow: hidden;\n    flex-grow: 1;\n    width: 0;\n    position: relative;\n  }\n\n  .hour-past-item {\n    font-size: 0.8rem;\n    color: oklch(89% 0 0deg);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;EAiDA,MAAM,aAAa,IAAI,CAAC;EACxB,MAAM,kBAAkB,IAAI,GAAG;EAC/B,MAAM,0BAA0B,eAAe,sBAAsB;EAGrE,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,cAAc,eAAe;EACnC,MAAM,EAAC,iBAAgB,cAAc;EAIrC,MAAM,qBAAqB,eAAe,YAAY,aAAa,WAAW,CAAC,CAAC;EAIhF,MAAM,0BAA0B;GAC9B,eAAe;IACb,aAAa,CAAC;GAChB,CAAC;EACH,GAAG;GAAC,MAAM;GAAK,WAAW;EAAI,CAAC;EAG/B,gBAAc,OAAO,iBAAiB,gBAAgB;GAAC,aAAa,CAAC;EAAE,CAAC,CAAC;EACzE,kBAAgB,OAAO,oBAAoB,gBAAgB;GAAC,aAAa,CAAC;EAAE,CAAC,CAAC;EAI9E,SAAS,4BAA4B,YAAoB;GACvD,KAAK,IAAI,QAAQ,GAAG,QAAQ,mBAAmB,MAAM,QAAQ,SAAS;IACpE,MAAM,KAAK,yBAAyB,OAAO,cAAc,aAAa,KAAK;IAC3E,IAAI,CAAC,IAAI;IACT,IAAI,QAAQ,cAAc,CAAC,GAAG,UAAU,SAAS,KAAK,GAAG;KACvD,GAAG,UAAU,IAAI,KAAK;KACtB;IACF;IACA,IAAI,SAAS,cAAc,GAAG,UAAU,SAAS,KAAK,GACpD,GAAG,UAAU,OAAO,KAAK;GAE7B;EACF;EACA,SAAS,aAAa,YAA0B;GAC9C,MAAM,cAAc,yBAAyB;GAC7C,IAAI,SAAS,eAAe,CAAC,aAC3B;GAEF,WAAW,QAAQ;GACnB,gBAAgB,QAAQ,mBAAmB,MAAM;GACjD,4BAA4B,UAAU;GACtC,KACE,IAAI,QAAQ,WAAW,QAAQ,GAC/B,QAAQ,mBAAmB,MAAM,QACjC,SACA;IACA,MAAM,KAAK,yBAAyB,OAAO,cAAc,aAAa,KAAK;IAC3E,IAAI,CAAC,IAAI;IACT,IAAI,QAAQ,gBAAgB,SAAS,CAAC,GAAG,UAAU,SAAS,KAAK,GAAG;KAClE,GAAG,UAAU,IAAI,KAAK;KACtB;IACF;IACA,MAAM,SAAS,GAAG;IAClB,IAAI,UAAU,GAAG,aAAa,GAAG,cAAc,OAAO,aAAa;KACjE,gBAAgB,QAAQ;KACxB,GAAG,UAAU,IAAI,KAAK;IACxB;GACF;EACF;EACA,SAAS,gBAAgB,MAA0B;GACjD,OAAO,MAAM,KAAK,SAAS,EAAE,OAAO,OAAO;EAC7C;EACA,SAAS,oBAAoB,MAA0B;GACrD,IAAI,KAAK,WACP,OAAO,KAAK;GAEd,OAAO,aAAa,IAAI;EAC1B;;;;;;;;;;;;;;;;;;;;;;;;;;;CC1HwC,OAAM;;mBACrC,OAAM,eAAc;;CAUpB,KAAI;CAAuB,OAAM;;;mBAO7B,OAAM,uCAAsC;;mBAIzC,OAAM,OAAM;;QAtBf,OAAA,mBAAmB,UAAA,UAAA,GAA9B,mBAiCM,OAjCN,YAiCM;EAhCJ,mBAEM,OAFN,YAEM,gBADD,OAAA,EAAC,YAAA,IAAA,GAAA,GAAA,CAAA;EAGE,OAAA,eAAU,KAAA,UAAA,GADlB,mBAMS,UAAA;;GAJP,OAAM;GACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,OAAA,aAAY,CAAA;MAEpB,YAAmB,OAAA,kBAAA,CAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;EAErB,mBAcM,OAdN,YAcM,EAAA,UAAA,IAAA,GAbJ,mBAYM,UAAA,MAAA,WAXwB,OAAA,qBAApB,UAAU,UAAK;uBADzB,mBAYM,OAAA;IAVH,IAAE,YAAc;IAChB,KAAK,SAAS;IACf,OAAM;OAEN,mBAKM,OALN,YAKM,CAJJ,mBAES,QAAA;IAFF,UAAU,SAAS;IAAW,OAAM;sBACzC,OAAA,gBAAgB,QAAQ,CAAA,GAAA,GAAA,UAAA,GAE1B,mBAA6D,QAA7D,YAA6D,gBAAvC,OAAA,oBAAoB,QAAQ,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,GAAA,UAAA;;EAKhD,OAAA,mBAAmB,OAAA,mBAAmB,SAAM,KAAA,UAAA,GADpD,mBAMS,UAAA;;GAJP,OAAM;GACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,OAAA,aAAa,OAAA,eAAe;MAEpC,YAAoB,OAAA,mBAAA,CAAA,CAAA,KAAA,mBAAA,QAAA,IAAA"}

package/dist/{RadioImage-CUTRr3DL.mjs → RadioImage-BIe2KpG_.mjs}

@@ -1,8 +1,8 @@
 import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.mjs";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { i as useAuthStore } from "./classicApi-CkDHWZG1.mjs";
-import { n as usePlayerStore } from "./PlayerStore-DukkcHI_.mjs";
-import { t as useImageProxy } from "./useImageProxy-Bj0cOCct.mjs";
+import { i as useAuthStore } from "./classicApi-xjOqAovv.mjs";
+import { n as usePlayerStore } from "./PlayerStore-vYmnOEA_.mjs";
+import { t as useImageProxy } from "./useImageProxy-BdQJmj4a.mjs";
 import { computed, createBlock, createElementBlock, createElementVNode, defineAsyncComponent, defineComponent, openBlock, resolveDirective, toDisplayString, withDirectives } from "vue";
 import { useI18n } from "vue-i18n";
 import PlayIcon from "vue-material-design-icons/Play.vue";
@@ -15,7 +15,7 @@ var RadioImage_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 	} },
 	setup(__props, { expose: __expose }) {
 		__expose();
-		const PodcastIsPlaying = defineAsyncComponent(() => import("./PodcastIsPlaying-B7YVeSyB.mjs"));
+		const PodcastIsPlaying = defineAsyncComponent(() => import("./PodcastIsPlaying-BsObdQGR.mjs"));
 		const props = __props;
 		const { t } = useI18n();
 		const { useProxyImageUrl } = useImageProxy();
@@ -82,4 +82,4 @@ var RadioImage_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RadioIm
 //#endregion
 export { RadioImage_exports as n, RadioImage_default as t };
 
-//# sourceMappingURL=RadioImage-CUTRr3DL.mjs.map
+//# sourceMappingURL=RadioImage-BIe2KpG_.mjs.map

package/dist/RadioImage-BIe2KpG_.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioImage-BIe2KpG_.mjs","names":[],"sources":["../src/components/display/live/RadioImage.vue","../src/components/display/live/RadioImage.vue"],"sourcesContent":["<template>\n  <div\n    class=\"img-box img-box-podcast position-relative flex-shrink-0 mb-3 me-3 float-start\"\n  >\n    <img\n      v-lazy=\"\n        radio.imageUrl\n          ? useProxyImageUrl(radio.imageUrl, '270')\n          : '/img/emptyradio.webp'\n      \"\n      width=\"270\"\n      height=\"270\"\n      aria-hidden=\"true\"\n        alt=\"\"\n      \n      class=\"img-box img-box-podcast\"\n      :title=\"t('Canal name image', { name: radio.name })\"\n    />\n    <button class=\"radio-play-button\" @click=\"playRadio\">\n      <PlayIcon v-if=\"!playingRadio\" :title=\"t('Play')\" :size=\"40\" />\n      <PodcastIsPlaying v-else />\n      <div class=\"mx-2\">\n        {{ playText }}\n      </div>\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport PlayIcon from \"vue-material-design-icons/Play.vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useAuthStore } from \"../../../stores/AuthStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\nconst PodcastIsPlaying = defineAsyncComponent(() => import(\"../podcasts/PodcastIsPlaying.vue\"));\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst playText = computed(() => {\n  return playingRadio.value && \"PLAYING\" === playerStore.playerStatus? t(\"Pause\") : t(\"Play\");\n});\n\n\n//Methods\nfunction playRadio(): void {\n  if (!props.radio) {\n    return;\n  }\n  if (playingRadio.value) {\n    playerStore.playerChangeStatus(\"PLAYING\" === playerStore.playerStatus);\n  } else {\n    playerStore.playerPlay({\n      canalId: props.radio.id,\n      url: \"https://\" + props.radio.url + \"/live.m3u8\",\n      metadata: \"\",\n      secured: props.radio.organisationId === authStore.authOrganisation?.id && \"SECURED\"===authStore.authOrganisation?.privacy\n    });\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app .radio-play-button{\n  display: flex;\n  align-items: center;\n  position: absolute;\n  bottom: 0;\n  font-size: 1rem;\n  color: var(--octopus-color-on-primary);\n  background-color: var(--octopus-primary-less-transparent);\n  border-radius: var(--octopus-border-radius);\n  padding:  0.2rem;\n  border: 0;\n}\n</style>\n","<template>\n  <div\n    class=\"img-box img-box-podcast position-relative flex-shrink-0 mb-3 me-3 float-start\"\n  >\n    <img\n      v-lazy=\"\n        radio.imageUrl\n          ? useProxyImageUrl(radio.imageUrl, '270')\n          : '/img/emptyradio.webp'\n      \"\n      width=\"270\"\n      height=\"270\"\n      aria-hidden=\"true\"\n        alt=\"\"\n      \n      class=\"img-box img-box-podcast\"\n      :title=\"t('Canal name image', { name: radio.name })\"\n    />\n    <button class=\"radio-play-button\" @click=\"playRadio\">\n      <PlayIcon v-if=\"!playingRadio\" :title=\"t('Play')\" :size=\"40\" />\n      <PodcastIsPlaying v-else />\n      <div class=\"mx-2\">\n        {{ playText }}\n      </div>\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport PlayIcon from \"vue-material-design-icons/Play.vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useAuthStore } from \"../../../stores/AuthStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\nconst PodcastIsPlaying = defineAsyncComponent(() => import(\"../podcasts/PodcastIsPlaying.vue\"));\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst playText = computed(() => {\n  return playingRadio.value && \"PLAYING\" === playerStore.playerStatus? t(\"Pause\") : t(\"Play\");\n});\n\n\n//Methods\nfunction playRadio(): void {\n  if (!props.radio) {\n    return;\n  }\n  if (playingRadio.value) {\n    playerStore.playerChangeStatus(\"PLAYING\" === playerStore.playerStatus);\n  } else {\n    playerStore.playerPlay({\n      canalId: props.radio.id,\n      url: \"https://\" + props.radio.url + \"/live.m3u8\",\n      metadata: \"\",\n      secured: props.radio.organisationId === authStore.authOrganisation?.id && \"SECURED\"===authStore.authOrganisation?.privacy\n    });\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app .radio-play-button{\n  display: flex;\n  align-items: center;\n  position: absolute;\n  bottom: 0;\n  font-size: 1rem;\n  color: var(--octopus-color-on-primary);\n  background-color: var(--octopus-primary-less-transparent);\n  border-radius: var(--octopus-border-radius);\n  padding:  0.2rem;\n  border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;EAoCA,MAAM,mBAAmB,2BAA2B,OAAO,kCAAmC;EAG9F,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,qBAAqB,cAAc;EAC3C,MAAM,YAAY,aAAa;EAC/B,MAAM,cAAc,eAAe;EAGnC,MAAM,eAAe,eAAe,YAAY,eAAe,YAAY,YAAY,YAAY,MAAM,OAAO,EAAE;EAClH,MAAM,WAAW,eAAe;GAC9B,OAAO,aAAa,SAAS,cAAc,YAAY,eAAc,EAAE,OAAO,IAAI,EAAE,MAAM;EAC5F,CAAC;EAID,SAAS,YAAkB;GACzB,IAAI,CAAC,MAAM,OACT;GAEF,IAAI,aAAa,OACf,YAAY,mBAAmB,cAAc,YAAY,YAAY;QAErE,YAAY,WAAW;IACrB,SAAS,MAAM,MAAM;IACrB,KAAK,aAAa,MAAM,MAAM,MAAM;IACpC,UAAU;IACV,SAAS,MAAM,MAAM,mBAAmB,UAAU,kBAAkB,MAAM,cAAY,UAAU,kBAAkB;GACpH,CAAC;EAEL;;;;;;;;;;;;;;;;;;;;;;;mBCrEI,OAAM,gFAA+E;;mBAmB9E,OAAM,OAAM;;;qBApBrB,mBAwBM,OAxBN,YAwBM,CAAA,eArBJ,mBAaE,OAAA;EAPA,OAAM;EACN,QAAO;EACP,eAAY;EACV,KAAI;EAEN,OAAM;EACL,OAAO,OAAA,EAAC,oBAAA,EAAA,MAA6B,OAAA,MAAM,KAAI,CAAA;6CAX/B,OAAA,MAAM,WAAqB,OAAA,iBAAiB,OAAA,MAAM,UAAQ,KAAA,IAAA,sBAAA,CAAA,CAAA,GAa7E,mBAMS,UAAA;EAND,OAAM;EAAqB,SAAO,OAAA;MACvB,OAAA,gBAAA,UAAA,GAAjB,YAA+D,OAAA,aAAA;;EAA/B,OAAO,OAAA,EAAC,MAAA;EAAW,MAAM;yCACzD,YAA2B,OAAA,qBAAA,EAAA,KAAA,EAAA,CAAA,IAC3B,mBAEM,OAFN,YAEM,gBADD,OAAA,QAAQ,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/RadioImage-CXFZXN1N.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioImage-CXFZXN1N.mjs","names":[],"sources":["../src/components/display/live/RadioImage.vue","../src/components/display/live/RadioImage.vue"],"sourcesContent":["<template>\n  <div\n    class=\"img-box img-box-podcast position-relative flex-shrink-0 mb-3 me-3 float-start\"\n  >\n    <img\n      v-lazy=\"\n        radio.imageUrl\n          ? useProxyImageUrl(radio.imageUrl, '270')\n          : '/img/emptyradio.webp'\n      \"\n      width=\"270\"\n      height=\"270\"\n      aria-hidden=\"true\"\n        alt=\"\"\n      \n      class=\"img-box img-box-podcast\"\n      :title=\"t('Canal name image', { name: radio.name })\"\n    />\n    <button class=\"radio-play-button\" @click=\"playRadio\">\n      <PlayIcon v-if=\"!playingRadio\" :title=\"t('Play')\" :size=\"40\" />\n      <PodcastIsPlaying v-else />\n      <div class=\"mx-2\">\n        {{ playText }}\n      </div>\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport PlayIcon from \"vue-material-design-icons/Play.vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useAuthStore } from \"../../../stores/AuthStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\nconst PodcastIsPlaying = defineAsyncComponent(() => import(\"../podcasts/PodcastIsPlaying.vue\"));\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst playText = computed(() => {\n  return playingRadio.value && \"PLAYING\" === playerStore.playerStatus? t(\"Pause\") : t(\"Play\");\n});\n\n\n//Methods\nfunction playRadio(): void {\n  if (!props.radio) {\n    return;\n  }\n  if (playingRadio.value) {\n    playerStore.playerChangeStatus(\"PLAYING\" === playerStore.playerStatus);\n  } else {\n    playerStore.playerPlay({\n      canalId: props.radio.id,\n      url: \"https://\" + props.radio.url + \"/live.m3u8\",\n      metadata: \"\",\n      secured: props.radio.organisationId === authStore.authOrganisation?.id && \"SECURED\"===authStore.authOrganisation?.privacy\n    });\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app .radio-play-button{\n  display: flex;\n  align-items: center;\n  position: absolute;\n  bottom: 0;\n  font-size: 1rem;\n  color: var(--octopus-color-on-primary);\n  background-color: var(--octopus-primary-less-transparent);\n  border-radius: var(--octopus-border-radius);\n  padding:  0.2rem;\n  border: 0;\n}\n</style>\n","<template>\n  <div\n    class=\"img-box img-box-podcast position-relative flex-shrink-0 mb-3 me-3 float-start\"\n  >\n    <img\n      v-lazy=\"\n        radio.imageUrl\n          ? useProxyImageUrl(radio.imageUrl, '270')\n          : '/img/emptyradio.webp'\n      \"\n      width=\"270\"\n      height=\"270\"\n      aria-hidden=\"true\"\n        alt=\"\"\n      \n      class=\"img-box img-box-podcast\"\n      :title=\"t('Canal name image', { name: radio.name })\"\n    />\n    <button class=\"radio-play-button\" @click=\"playRadio\">\n      <PlayIcon v-if=\"!playingRadio\" :title=\"t('Play')\" :size=\"40\" />\n      <PodcastIsPlaying v-else />\n      <div class=\"mx-2\">\n        {{ playText }}\n      </div>\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport PlayIcon from \"vue-material-design-icons/Play.vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useAuthStore } from \"../../../stores/AuthStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\nconst PodcastIsPlaying = defineAsyncComponent(() => import(\"../podcasts/PodcastIsPlaying.vue\"));\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst playText = computed(() => {\n  return playingRadio.value && \"PLAYING\" === playerStore.playerStatus? t(\"Pause\") : t(\"Play\");\n});\n\n\n//Methods\nfunction playRadio(): void {\n  if (!props.radio) {\n    return;\n  }\n  if (playingRadio.value) {\n    playerStore.playerChangeStatus(\"PLAYING\" === playerStore.playerStatus);\n  } else {\n    playerStore.playerPlay({\n      canalId: props.radio.id,\n      url: \"https://\" + props.radio.url + \"/live.m3u8\",\n      metadata: \"\",\n      secured: props.radio.organisationId === authStore.authOrganisation?.id && \"SECURED\"===authStore.authOrganisation?.privacy\n    });\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app .radio-play-button{\n  display: flex;\n  align-items: center;\n  position: absolute;\n  bottom: 0;\n  font-size: 1rem;\n  color: var(--octopus-color-on-primary);\n  background-color: var(--octopus-primary-less-transparent);\n  border-radius: var(--octopus-border-radius);\n  padding:  0.2rem;\n  border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;EAoCA,MAAM,mBAAmB,2BAA2B,OAAO,kCAAmC;EAG9F,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,qBAAqB,cAAc;EAC3C,MAAM,YAAY,aAAa;EAC/B,MAAM,cAAc,eAAe;EAGnC,MAAM,eAAe,eAAe,YAAY,eAAe,YAAY,YAAY,YAAY,MAAM,OAAO,EAAE;EAClH,MAAM,WAAW,eAAe;GAC9B,OAAO,aAAa,SAAS,cAAc,YAAY,eAAc,EAAE,OAAO,IAAI,EAAE,MAAM;EAC5F,CAAC;EAID,SAAS,YAAkB;GACzB,IAAI,CAAC,MAAM,OACT;GAEF,IAAI,aAAa,OACf,YAAY,mBAAmB,cAAc,YAAY,YAAY;QAErE,YAAY,WAAW;IACrB,SAAS,MAAM,MAAM;IACrB,KAAK,aAAa,MAAM,MAAM,MAAM;IACpC,UAAU;IACV,SAAS,MAAM,MAAM,mBAAmB,UAAU,kBAAkB,MAAM,cAAY,UAAU,kBAAkB;GACpH,CAAC;EAEL;;;;;;;;;;;;;;;;;;;;;;;mBCrEI,OAAM,gFAA+E;;mBAmB9E,OAAM,OAAM;;;qBApBrB,mBAwBM,OAxBN,YAwBM,CAAA,eArBJ,mBAaE,OAAA;EAPA,OAAM;EACN,QAAO;EACP,eAAY;EACV,KAAI;EAEN,OAAM;EACL,OAAO,OAAA,EAAC,oBAAA,EAAA,MAA6B,OAAA,MAAM,KAAI,CAAA;6CAX/B,OAAA,MAAM,WAAqB,OAAA,iBAAiB,OAAA,MAAM,UAAQ,KAAA,IAAA,sBAAA,CAAA,CAAA,GAa7E,mBAMS,UAAA;EAND,OAAM;EAAqB,SAAO,OAAA;MACvB,OAAA,gBAAA,UAAA,GAAjB,YAA+D,OAAA,aAAA;;EAA/B,OAAO,OAAA,EAAC,MAAA;EAAW,MAAM;yCACzD,YAA2B,OAAA,qBAAA,EAAA,KAAA,EAAA,CAAA,IAC3B,mBAEM,OAFN,YAEM,gBADD,OAAA,QAAQ,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/RadioImage-CpJmuc8a.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioImage-CpJmuc8a.mjs","names":[],"sources":["../src/components/display/live/RadioImage.vue","../src/components/display/live/RadioImage.vue"],"sourcesContent":["<template>\n  <div\n    class=\"img-box img-box-podcast position-relative flex-shrink-0 mb-3 me-3 float-start\"\n  >\n    <img\n      v-lazy=\"\n        radio.imageUrl\n          ? useProxyImageUrl(radio.imageUrl, '270')\n          : '/img/emptyradio.webp'\n      \"\n      width=\"270\"\n      height=\"270\"\n      aria-hidden=\"true\"\n        alt=\"\"\n      \n      class=\"img-box img-box-podcast\"\n      :title=\"t('Canal name image', { name: radio.name })\"\n    />\n    <button class=\"radio-play-button\" @click=\"playRadio\">\n      <PlayIcon v-if=\"!playingRadio\" :title=\"t('Play')\" :size=\"40\" />\n      <PodcastIsPlaying v-else />\n      <div class=\"mx-2\">\n        {{ playText }}\n      </div>\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport PlayIcon from \"vue-material-design-icons/Play.vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useAuthStore } from \"../../../stores/AuthStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\nconst PodcastIsPlaying = defineAsyncComponent(() => import(\"../podcasts/PodcastIsPlaying.vue\"));\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst playText = computed(() => {\n  return playingRadio.value && \"PLAYING\" === playerStore.playerStatus? t(\"Pause\") : t(\"Play\");\n});\n\n\n//Methods\nfunction playRadio(): void {\n  if (!props.radio) {\n    return;\n  }\n  if (playingRadio.value) {\n    playerStore.playerChangeStatus(\"PLAYING\" === playerStore.playerStatus);\n  } else {\n    playerStore.playerPlay({\n      canalId: props.radio.id,\n      url: \"https://\" + props.radio.url + \"/live.m3u8\",\n      metadata: \"\",\n      secured: props.radio.organisationId === authStore.authOrganisation?.id && \"SECURED\"===authStore.authOrganisation?.privacy\n    });\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app .radio-play-button{\n  display: flex;\n  align-items: center;\n  position: absolute;\n  bottom: 0;\n  font-size: 1rem;\n  color: var(--octopus-color-on-primary);\n  background-color: var(--octopus-primary-less-transparent);\n  border-radius: var(--octopus-border-radius);\n  padding:  0.2rem;\n  border: 0;\n}\n</style>\n","<template>\n  <div\n    class=\"img-box img-box-podcast position-relative flex-shrink-0 mb-3 me-3 float-start\"\n  >\n    <img\n      v-lazy=\"\n        radio.imageUrl\n          ? useProxyImageUrl(radio.imageUrl, '270')\n          : '/img/emptyradio.webp'\n      \"\n      width=\"270\"\n      height=\"270\"\n      aria-hidden=\"true\"\n        alt=\"\"\n      \n      class=\"img-box img-box-podcast\"\n      :title=\"t('Canal name image', { name: radio.name })\"\n    />\n    <button class=\"radio-play-button\" @click=\"playRadio\">\n      <PlayIcon v-if=\"!playingRadio\" :title=\"t('Play')\" :size=\"40\" />\n      <PodcastIsPlaying v-else />\n      <div class=\"mx-2\">\n        {{ playText }}\n      </div>\n    </button>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport PlayIcon from \"vue-material-design-icons/Play.vue\";\nimport { usePlayerStore } from \"../../../stores/PlayerStore\";\nimport { useAuthStore } from \"../../../stores/AuthStore\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\nconst PodcastIsPlaying = defineAsyncComponent(() => import(\"../podcasts/PodcastIsPlaying.vue\"));\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst playerStore = usePlayerStore();\n\n//Computed\nconst playingRadio = computed(() => playerStore.playerRadio && playerStore.playerRadio.canalId === props.radio?.id);\nconst playText = computed(() => {\n  return playingRadio.value && \"PLAYING\" === playerStore.playerStatus? t(\"Pause\") : t(\"Play\");\n});\n\n\n//Methods\nfunction playRadio(): void {\n  if (!props.radio) {\n    return;\n  }\n  if (playingRadio.value) {\n    playerStore.playerChangeStatus(\"PLAYING\" === playerStore.playerStatus);\n  } else {\n    playerStore.playerPlay({\n      canalId: props.radio.id,\n      url: \"https://\" + props.radio.url + \"/live.m3u8\",\n      metadata: \"\",\n      secured: props.radio.organisationId === authStore.authOrganisation?.id && \"SECURED\"===authStore.authOrganisation?.privacy\n    });\n  }\n}\n</script>\n<style lang=\"scss\">\n.octopus-app .radio-play-button{\n  display: flex;\n  align-items: center;\n  position: absolute;\n  bottom: 0;\n  font-size: 1rem;\n  color: var(--octopus-color-on-primary);\n  background-color: var(--octopus-primary-less-transparent);\n  border-radius: var(--octopus-border-radius);\n  padding:  0.2rem;\n  border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;EAoCA,MAAM,mBAAmB,2BAA2B,OAAO,kCAAmC;EAG9F,MAAM,QAAQ;EAKd,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAE,qBAAqB,cAAc;EAC3C,MAAM,YAAY,aAAa;EAC/B,MAAM,cAAc,eAAe;EAGnC,MAAM,eAAe,eAAe,YAAY,eAAe,YAAY,YAAY,YAAY,MAAM,OAAO,EAAE;EAClH,MAAM,WAAW,eAAe;GAC9B,OAAO,aAAa,SAAS,cAAc,YAAY,eAAc,EAAE,OAAO,IAAI,EAAE,MAAM;EAC5F,CAAC;EAID,SAAS,YAAkB;GACzB,IAAI,CAAC,MAAM,OACT;GAEF,IAAI,aAAa,OACf,YAAY,mBAAmB,cAAc,YAAY,YAAY;QAErE,YAAY,WAAW;IACrB,SAAS,MAAM,MAAM;IACrB,KAAK,aAAa,MAAM,MAAM,MAAM;IACpC,UAAU;IACV,SAAS,MAAM,MAAM,mBAAmB,UAAU,kBAAkB,MAAM,cAAY,UAAU,kBAAkB;GACpH,CAAC;EAEL;;;;;;;;;;;;;;;;;;;;;;;mBCrEI,OAAM,gFAA+E;;mBAmB9E,OAAM,OAAM;;;qBApBrB,mBAwBM,OAxBN,YAwBM,CAAA,eArBJ,mBAaE,OAAA;EAPA,OAAM;EACN,QAAO;EACP,eAAY;EACV,KAAI;EAEN,OAAM;EACL,OAAO,OAAA,EAAC,oBAAA,EAAA,MAA6B,OAAA,MAAM,KAAI,CAAA;6CAX/B,OAAA,MAAM,WAAqB,OAAA,iBAAiB,OAAA,MAAM,UAAQ,KAAA,IAAA,sBAAA,CAAA,CAAA,GAa7E,mBAMS,UAAA;EAND,OAAM;EAAqB,SAAO,OAAA;MACvB,OAAA,gBAAA,UAAA,GAAjB,YAA+D,OAAA,aAAA;;EAA/B,OAAO,OAAA,EAAC,MAAA;EAAW,MAAM;yCACzD,YAA2B,OAAA,qBAAA,EAAA,KAAA,EAAA,CAAA,IAC3B,mBAEM,OAFN,YAEM,gBADD,OAAA,QAAQ,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/{RadioList-CwzOFHc1.mjs → RadioList-B23gsiEF.mjs}

@@ -1,8 +1,8 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { r as useFilterStore, t as classicApi_default } from "./classicApi-CkDHWZG1.mjs";
-import { t as useErrorHandler } from "./useErrorHandler-DtLjD9t_.mjs";
-import { t as RadioCurrently_default } from "./RadioCurrently-D5M81oIX.mjs";
-import { t as RadioImage_default } from "./RadioImage-CUTRr3DL.mjs";
+import { r as useFilterStore, t as classicApi_default } from "./classicApi-xjOqAovv.mjs";
+import { t as useErrorHandler } from "./useErrorHandler-D3XVxUh6.mjs";
+import { t as RadioCurrently_default } from "./RadioCurrently-DWySwV64.mjs";
+import { t as RadioImage_default } from "./RadioImage-BIe2KpG_.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, ref, renderList, resolveComponent, toDisplayString, watch, withCtx } from "vue";
 import { useI18n } from "vue-i18n";
 //#region src/components/display/live/RadioItem.vue?vue&type=script&setup=true&lang.ts
@@ -122,4 +122,4 @@ var RadioList_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RadioLis
 //#endregion
 export { RadioList_default as default };
 
-//# sourceMappingURL=RadioList-CwzOFHc1.mjs.map
+//# sourceMappingURL=RadioList-B23gsiEF.mjs.map

package/dist/RadioList-B23gsiEF.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioList-B23gsiEF.mjs","names":[],"sources":["../src/components/display/live/RadioItem.vue","../src/components/display/live/RadioItem.vue","../src/components/display/live/RadioList.vue","../src/components/display/live/RadioList.vue"],"sourcesContent":["<template>\n  <div v-if=\"radio\" class=\"d-flex border w-100 p-3\">\n    <RadioImage :radio=\"radio\" />\n    <router-link\n      :to=\"{\n        name: 'radio',\n        params: { canalId: radio.id },\n      }\"\n      class=\"text-dark classic-element-text\"\n      :title=\"t('Radio name page', { name: radio.name })\"\n    >\n      <div class=\"element-name mb-2 basic-line-clamp\">\n        {{ radio.name }}\n      </div>\n      <div v-if=\"radio.description\" class=\"basic-line-clamp ten-line\">\n        {{ radio.description }}\n      </div>\n      <RadioCurrently :radio=\"radio\" />\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioImage from \"./RadioImage.vue\";\nimport RadioCurrently from \"./RadioCurrently.vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\n</script>\n","<template>\n  <div v-if=\"radio\" class=\"d-flex border w-100 p-3\">\n    <RadioImage :radio=\"radio\" />\n    <router-link\n      :to=\"{\n        name: 'radio',\n        params: { canalId: radio.id },\n      }\"\n      class=\"text-dark classic-element-text\"\n      :title=\"t('Radio name page', { name: radio.name })\"\n    >\n      <div class=\"element-name mb-2 basic-line-clamp\">\n        {{ radio.name }}\n      </div>\n      <div v-if=\"radio.description\" class=\"basic-line-clamp ten-line\">\n        {{ radio.description }}\n      </div>\n      <RadioCurrently :radio=\"radio\" />\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioImage from \"./RadioImage.vue\";\nimport RadioCurrently from \"./RadioCurrently.vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\n</script>\n","<template>\n  <section\n    v-if=\"(filterStore.filterOrgaId || organisationId) && radio.length\"\n    class=\"d-flex flex-column align-items-start mt-3\"\n  >\n    <h2 class=\"mb-0 mb-3\">\n      {{ t(\"Radio\") }}\n    </h2>\n    <template v-if=\"radio.length\">\n      <RadioItem\n        v-for=\"radioItem in radio\"\n        :key=\"radioItem.id\"\n        :radio=\"radioItem\"\n      />\n    </template>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioItem from \"./RadioItem.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport classicApi from \"../../../api/classicApi\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { computed, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  organisationId: { default: undefined, type: String },\n})\n\n//Data \nconst radio: Ref<Array<Canal>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst filterOrgaUsed = computed(() => filterStore.filterOrgaId ? filterStore.filterOrgaId : props.organisationId);\n\n//Watch\nwatch(filterOrgaUsed, () =>fetchContent(), {immediate: true});\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  radio.value.length = 0;\n  if (!filterOrgaUsed.value) {\n    return;\n  }\n  try {\n    radio.value = await classicApi.fetchData<Array<Canal>>({\n      api: 14,\n      path: \"canal/orga/\" + filterOrgaUsed.value + \"/\",\n    });\n  } catch (error) {\n    handle403(error as AxiosError);\n  }\n}\n</script>\n","<template>\n  <section\n    v-if=\"(filterStore.filterOrgaId || organisationId) && radio.length\"\n    class=\"d-flex flex-column align-items-start mt-3\"\n  >\n    <h2 class=\"mb-0 mb-3\">\n      {{ t(\"Radio\") }}\n    </h2>\n    <template v-if=\"radio.length\">\n      <RadioItem\n        v-for=\"radioItem in radio\"\n        :key=\"radioItem.id\"\n        :radio=\"radioItem\"\n      />\n    </template>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioItem from \"./RadioItem.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport classicApi from \"../../../api/classicApi\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { computed, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  organisationId: { default: undefined, type: String },\n})\n\n//Data \nconst radio: Ref<Array<Canal>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst filterOrgaUsed = computed(() => filterStore.filterOrgaId ? filterStore.filterOrgaId : props.organisationId);\n\n//Watch\nwatch(filterOrgaUsed, () =>fetchContent(), {immediate: true});\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  radio.value.length = 0;\n  if (!filterOrgaUsed.value) {\n    return;\n  }\n  try {\n    radio.value = await classicApi.fetchData<Array<Canal>>({\n      api: 14,\n      path: \"canal/orga/\" + filterOrgaUsed.value + \"/\",\n    });\n  } catch (error) {\n    handle403(error as AxiosError);\n  }\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;EAkCA,MAAM,EAAE,MAAM,QAAQ;;;;;;;;;;;;;;;;;CCjCF,OAAM;;qBAUf,OAAM,qCAAoC;;;CAGjB,OAAM;;;;QAb7B,OAAA,SAAA,UAAA,GAAX,mBAkBM,OAlBN,cAkBM,CAjBJ,YAA6B,OAAA,eAAA,EAAhB,OAAO,OAAA,MAAK,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,GACzB,YAec,wBAAA;EAdX,IAAE;;sBAAsD,OAAA,MAAM,GAAE;;EAIjE,OAAM;EACL,OAAO,OAAA,EAAC,mBAAA,EAAA,MAA4B,OAAA,MAAM,KAAI,CAAA;;yBAIzC;GAFN,mBAEM,OAFN,cAEM,gBADD,OAAA,MAAM,IAAI,GAAA,CAAA;GAEJ,OAAA,MAAM,eAAA,UAAA,GAAjB,mBAEM,OAFN,YAEM,gBADD,OAAA,MAAM,WAAW,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;GAEtB,YAAiC,OAAA,mBAAA,EAAhB,OAAO,OAAA,MAAK,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA;;;;;;;;;;;;;;;;ECanC,MAAM,QAAQ;EAKd,MAAM,QAA2B,IAAI,CAAC,CAAC;EAGvC,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAC,cAAa,gBAAgB;EACpC,MAAM,cAAc,eAAe;EAGnC,MAAM,iBAAiB,eAAe,YAAY,eAAe,YAAY,eAAe,MAAM,cAAc;EAGhH,MAAM,sBAAqB,aAAa,GAAG,EAAC,WAAW,KAAI,CAAC;EAG5D,eAAe,eAA8B;GAC3C,MAAM,MAAM,SAAS;GACrB,IAAI,CAAC,eAAe,OAClB;GAEF,IAAI;IACF,MAAM,QAAQ,MAAM,mBAAW,UAAwB;KACrD,KAAK;KACL,MAAM,gBAAgB,eAAe,QAAQ;IAC/C,CAAC;GACH,SAAS,OAAO;IACd,UAAU,KAAmB;GAC/B;EACF;;;;;;;;;;;;;;;;;;;;;;CC3DI,OAAM;;mBAEF,OAAM,YAAW;;SAHd,OAAA,YAAY,gBAAgB,OAAA,mBAAmB,OAAA,MAAM,UAAA,UAAA,GAD9D,mBAcU,WAdV,YAcU,CAVR,mBAEK,MAFL,YAEK,gBADA,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA,GAEU,OAAA,MAAM,UAAA,UAAA,IAAA,GACpB,mBAIE,UAAA,EAAA,KAAA,EAAA,GAAA,WAHoB,OAAA,QAAb,cAAS;sBADlB,YAIE,OAAA,cAAA;GAFC,KAAK,UAAU;GACf,OAAO"}

package/dist/RadioList-BwzgNcMO.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioList-BwzgNcMO.mjs","names":[],"sources":["../src/components/display/live/RadioItem.vue","../src/components/display/live/RadioItem.vue","../src/components/display/live/RadioList.vue","../src/components/display/live/RadioList.vue"],"sourcesContent":["<template>\n  <div v-if=\"radio\" class=\"d-flex border w-100 p-3\">\n    <RadioImage :radio=\"radio\" />\n    <router-link\n      :to=\"{\n        name: 'radio',\n        params: { canalId: radio.id },\n      }\"\n      class=\"text-dark classic-element-text\"\n      :title=\"t('Radio name page', { name: radio.name })\"\n    >\n      <div class=\"element-name mb-2 basic-line-clamp\">\n        {{ radio.name }}\n      </div>\n      <div v-if=\"radio.description\" class=\"basic-line-clamp ten-line\">\n        {{ radio.description }}\n      </div>\n      <RadioCurrently :radio=\"radio\" />\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioImage from \"./RadioImage.vue\";\nimport RadioCurrently from \"./RadioCurrently.vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\n</script>\n","<template>\n  <div v-if=\"radio\" class=\"d-flex border w-100 p-3\">\n    <RadioImage :radio=\"radio\" />\n    <router-link\n      :to=\"{\n        name: 'radio',\n        params: { canalId: radio.id },\n      }\"\n      class=\"text-dark classic-element-text\"\n      :title=\"t('Radio name page', { name: radio.name })\"\n    >\n      <div class=\"element-name mb-2 basic-line-clamp\">\n        {{ radio.name }}\n      </div>\n      <div v-if=\"radio.description\" class=\"basic-line-clamp ten-line\">\n        {{ radio.description }}\n      </div>\n      <RadioCurrently :radio=\"radio\" />\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioImage from \"./RadioImage.vue\";\nimport RadioCurrently from \"./RadioCurrently.vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\n</script>\n","<template>\n  <section\n    v-if=\"(filterStore.filterOrgaId || organisationId) && radio.length\"\n    class=\"d-flex flex-column align-items-start mt-3\"\n  >\n    <h2 class=\"mb-0 mb-3\">\n      {{ t(\"Radio\") }}\n    </h2>\n    <template v-if=\"radio.length\">\n      <RadioItem\n        v-for=\"radioItem in radio\"\n        :key=\"radioItem.id\"\n        :radio=\"radioItem\"\n      />\n    </template>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioItem from \"./RadioItem.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport classicApi from \"../../../api/classicApi\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { computed, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  organisationId: { default: undefined, type: String },\n})\n\n//Data \nconst radio: Ref<Array<Canal>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst filterOrgaUsed = computed(() => filterStore.filterOrgaId ? filterStore.filterOrgaId : props.organisationId);\n\n//Watch\nwatch(filterOrgaUsed, () =>fetchContent(), {immediate: true});\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  radio.value.length = 0;\n  if (!filterOrgaUsed.value) {\n    return;\n  }\n  try {\n    radio.value = await classicApi.fetchData<Array<Canal>>({\n      api: 14,\n      path: \"canal/orga/\" + filterOrgaUsed.value + \"/\",\n    });\n  } catch (error) {\n    handle403(error as AxiosError);\n  }\n}\n</script>\n","<template>\n  <section\n    v-if=\"(filterStore.filterOrgaId || organisationId) && radio.length\"\n    class=\"d-flex flex-column align-items-start mt-3\"\n  >\n    <h2 class=\"mb-0 mb-3\">\n      {{ t(\"Radio\") }}\n    </h2>\n    <template v-if=\"radio.length\">\n      <RadioItem\n        v-for=\"radioItem in radio\"\n        :key=\"radioItem.id\"\n        :radio=\"radioItem\"\n      />\n    </template>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioItem from \"./RadioItem.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport classicApi from \"../../../api/classicApi\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { computed, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  organisationId: { default: undefined, type: String },\n})\n\n//Data \nconst radio: Ref<Array<Canal>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst filterOrgaUsed = computed(() => filterStore.filterOrgaId ? filterStore.filterOrgaId : props.organisationId);\n\n//Watch\nwatch(filterOrgaUsed, () =>fetchContent(), {immediate: true});\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  radio.value.length = 0;\n  if (!filterOrgaUsed.value) {\n    return;\n  }\n  try {\n    radio.value = await classicApi.fetchData<Array<Canal>>({\n      api: 14,\n      path: \"canal/orga/\" + filterOrgaUsed.value + \"/\",\n    });\n  } catch (error) {\n    handle403(error as AxiosError);\n  }\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;EAkCA,MAAM,EAAE,MAAM,QAAQ;;;;;;;;;;;;;;;;;CCjCF,OAAM;;qBAUf,OAAM,qCAAoC;;;CAGjB,OAAM;;;;QAb7B,OAAA,SAAA,UAAA,GAAX,mBAkBM,OAlBN,cAkBM,CAjBJ,YAA6B,OAAA,eAAA,EAAhB,OAAO,OAAA,MAAK,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,GACzB,YAec,wBAAA;EAdX,IAAE;;sBAAsD,OAAA,MAAM,GAAE;;EAIjE,OAAM;EACL,OAAO,OAAA,EAAC,mBAAA,EAAA,MAA4B,OAAA,MAAM,KAAI,CAAA;;yBAIzC;GAFN,mBAEM,OAFN,cAEM,gBADD,OAAA,MAAM,IAAI,GAAA,CAAA;GAEJ,OAAA,MAAM,eAAA,UAAA,GAAjB,mBAEM,OAFN,YAEM,gBADD,OAAA,MAAM,WAAW,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;GAEtB,YAAiC,OAAA,mBAAA,EAAhB,OAAO,OAAA,MAAK,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA;;;;;;;;;;;;;;;;ECanC,MAAM,QAAQ;EAKd,MAAM,QAA2B,IAAI,CAAC,CAAC;EAGvC,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAC,cAAa,gBAAgB;EACpC,MAAM,cAAc,eAAe;EAGnC,MAAM,iBAAiB,eAAe,YAAY,eAAe,YAAY,eAAe,MAAM,cAAc;EAGhH,MAAM,sBAAqB,aAAa,GAAG,EAAC,WAAW,KAAI,CAAC;EAG5D,eAAe,eAA8B;GAC3C,MAAM,MAAM,SAAS;GACrB,IAAI,CAAC,eAAe,OAClB;GAEF,IAAI;IACF,MAAM,QAAQ,MAAM,mBAAW,UAAwB;KACrD,KAAK;KACL,MAAM,gBAAgB,eAAe,QAAQ;IAC/C,CAAC;GACH,SAAS,OAAO;IACd,UAAU,KAAmB;GAC/B;EACF;;;;;;;;;;;;;;;;;;;;;;CC3DI,OAAM;;mBAEF,OAAM,YAAW;;SAHd,OAAA,YAAY,gBAAgB,OAAA,mBAAmB,OAAA,MAAM,UAAA,UAAA,GAD9D,mBAcU,WAdV,YAcU,CAVR,mBAEK,MAFL,YAEK,gBADA,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA,GAEU,OAAA,MAAM,UAAA,UAAA,IAAA,GACpB,mBAIE,UAAA,EAAA,KAAA,EAAA,GAAA,WAHoB,OAAA,QAAb,cAAS;sBADlB,YAIE,OAAA,cAAA;GAFC,KAAK,UAAU;GACf,OAAO"}

package/dist/RadioList-KvAacjmD.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioList-KvAacjmD.mjs","names":[],"sources":["../src/components/display/live/RadioItem.vue","../src/components/display/live/RadioItem.vue","../src/components/display/live/RadioList.vue","../src/components/display/live/RadioList.vue"],"sourcesContent":["<template>\n  <div v-if=\"radio\" class=\"d-flex border w-100 p-3\">\n    <RadioImage :radio=\"radio\" />\n    <router-link\n      :to=\"{\n        name: 'radio',\n        params: { canalId: radio.id },\n      }\"\n      class=\"text-dark classic-element-text\"\n      :title=\"t('Radio name page', { name: radio.name })\"\n    >\n      <div class=\"element-name mb-2 basic-line-clamp\">\n        {{ radio.name }}\n      </div>\n      <div v-if=\"radio.description\" class=\"basic-line-clamp ten-line\">\n        {{ radio.description }}\n      </div>\n      <RadioCurrently :radio=\"radio\" />\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioImage from \"./RadioImage.vue\";\nimport RadioCurrently from \"./RadioCurrently.vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\n</script>\n","<template>\n  <div v-if=\"radio\" class=\"d-flex border w-100 p-3\">\n    <RadioImage :radio=\"radio\" />\n    <router-link\n      :to=\"{\n        name: 'radio',\n        params: { canalId: radio.id },\n      }\"\n      class=\"text-dark classic-element-text\"\n      :title=\"t('Radio name page', { name: radio.name })\"\n    >\n      <div class=\"element-name mb-2 basic-line-clamp\">\n        {{ radio.name }}\n      </div>\n      <div v-if=\"radio.description\" class=\"basic-line-clamp ten-line\">\n        {{ radio.description }}\n      </div>\n      <RadioCurrently :radio=\"radio\" />\n    </router-link>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioImage from \"./RadioImage.vue\";\nimport RadioCurrently from \"./RadioCurrently.vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Composables\nconst { t } = useI18n();\n</script>\n","<template>\n  <section\n    v-if=\"(filterStore.filterOrgaId || organisationId) && radio.length\"\n    class=\"d-flex flex-column align-items-start mt-3\"\n  >\n    <h2 class=\"mb-0 mb-3\">\n      {{ t(\"Radio\") }}\n    </h2>\n    <template v-if=\"radio.length\">\n      <RadioItem\n        v-for=\"radioItem in radio\"\n        :key=\"radioItem.id\"\n        :radio=\"radioItem\"\n      />\n    </template>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioItem from \"./RadioItem.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport classicApi from \"../../../api/classicApi\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { computed, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  organisationId: { default: undefined, type: String },\n})\n\n//Data \nconst radio: Ref<Array<Canal>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst filterOrgaUsed = computed(() => filterStore.filterOrgaId ? filterStore.filterOrgaId : props.organisationId);\n\n//Watch\nwatch(filterOrgaUsed, () =>fetchContent(), {immediate: true});\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  radio.value.length = 0;\n  if (!filterOrgaUsed.value) {\n    return;\n  }\n  try {\n    radio.value = await classicApi.fetchData<Array<Canal>>({\n      api: 14,\n      path: \"canal/orga/\" + filterOrgaUsed.value + \"/\",\n    });\n  } catch (error) {\n    handle403(error as AxiosError);\n  }\n}\n</script>\n","<template>\n  <section\n    v-if=\"(filterStore.filterOrgaId || organisationId) && radio.length\"\n    class=\"d-flex flex-column align-items-start mt-3\"\n  >\n    <h2 class=\"mb-0 mb-3\">\n      {{ t(\"Radio\") }}\n    </h2>\n    <template v-if=\"radio.length\">\n      <RadioItem\n        v-for=\"radioItem in radio\"\n        :key=\"radioItem.id\"\n        :radio=\"radioItem\"\n      />\n    </template>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport RadioItem from \"./RadioItem.vue\";\nimport {useErrorHandler} from \"../../composable/useErrorHandler\";\nimport classicApi from \"../../../api/classicApi\";\nimport { useFilterStore } from \"../../../stores/FilterStore\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { computed, Ref, ref, watch } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  organisationId: { default: undefined, type: String },\n})\n\n//Data \nconst radio: Ref<Array<Canal>> = ref([]);\n\n//Composables\nconst { t } = useI18n();\nconst {handle403} = useErrorHandler();\nconst filterStore = useFilterStore();\n\n//Computed\nconst filterOrgaUsed = computed(() => filterStore.filterOrgaId ? filterStore.filterOrgaId : props.organisationId);\n\n//Watch\nwatch(filterOrgaUsed, () =>fetchContent(), {immediate: true});\n\n//Methods\nasync function fetchContent(): Promise<void> {\n  radio.value.length = 0;\n  if (!filterOrgaUsed.value) {\n    return;\n  }\n  try {\n    radio.value = await classicApi.fetchData<Array<Canal>>({\n      api: 14,\n      path: \"canal/orga/\" + filterOrgaUsed.value + \"/\",\n    });\n  } catch (error) {\n    handle403(error as AxiosError);\n  }\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;EAkCA,MAAM,EAAE,MAAM,QAAQ;;;;;;;;;;;;;;;;;CCjCF,OAAM;;qBAUf,OAAM,qCAAoC;;;CAGjB,OAAM;;;;QAb7B,OAAA,SAAA,UAAA,GAAX,mBAkBM,OAlBN,cAkBM,CAjBJ,YAA6B,OAAA,eAAA,EAAhB,OAAO,OAAA,MAAK,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,GACzB,YAec,wBAAA;EAdX,IAAE;;sBAAsD,OAAA,MAAM,GAAE;;EAIjE,OAAM;EACL,OAAO,OAAA,EAAC,mBAAA,EAAA,MAA4B,OAAA,MAAM,KAAI,CAAA;;yBAIzC;GAFN,mBAEM,OAFN,cAEM,gBADD,OAAA,MAAM,IAAI,GAAA,CAAA;GAEJ,OAAA,MAAM,eAAA,UAAA,GAAjB,mBAEM,OAFN,YAEM,gBADD,OAAA,MAAM,WAAW,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;GAEtB,YAAiC,OAAA,mBAAA,EAAhB,OAAO,OAAA,MAAK,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA;;;;;;;;;;;;;;;;ECanC,MAAM,QAAQ;EAKd,MAAM,QAA2B,IAAI,CAAC,CAAC;EAGvC,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,EAAC,cAAa,gBAAgB;EACpC,MAAM,cAAc,eAAe;EAGnC,MAAM,iBAAiB,eAAe,YAAY,eAAe,YAAY,eAAe,MAAM,cAAc;EAGhH,MAAM,sBAAqB,aAAa,GAAG,EAAC,WAAW,KAAI,CAAC;EAG5D,eAAe,eAA8B;GAC3C,MAAM,MAAM,SAAS;GACrB,IAAI,CAAC,eAAe,OAClB;GAEF,IAAI;IACF,MAAM,QAAQ,MAAM,mBAAW,UAAwB;KACrD,KAAK;KACL,MAAM,gBAAgB,eAAe,QAAQ;IAC/C,CAAC;GACH,SAAS,OAAO;IACd,UAAU,KAAmB;GAC/B;EACF;;;;;;;;;;;;;;;;;;;;;;CC3DI,OAAM;;mBAEF,OAAM,YAAW;;SAHd,OAAA,YAAY,gBAAgB,OAAA,mBAAmB,OAAA,MAAM,UAAA,UAAA,GAD9D,mBAcU,WAdV,YAcU,CAVR,mBAEK,MAFL,YAEK,gBADA,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA,GAEU,OAAA,MAAM,UAAA,UAAA,IAAA,GACpB,mBAIE,UAAA,EAAA,KAAA,EAAA,GAAA,WAHoB,OAAA,QAAb,cAAS;sBADlB,YAIE,OAAA,cAAA;GAFC,KAAK,UAAU;GACf,OAAO"}

package/dist/RadioPage-CM_4A1AQ.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioPage-CM_4A1AQ.mjs","names":[],"sources":["../src/components/pages/RadioPage.vue","../src/components/pages/RadioPage.vue"],"sourcesContent":["<template>\n  <section class=\"page-box\">\n    <template v-if=\"loaded && !error && radio\">\n      <PodcastmakerHeader\n        v-if=\"isPodcastmaker\"\n        :page-title=\"t('Radio')\"\n        :img-url=\"radio.imageUrl\"\n      />\n      <div\n        v-if=\"radio\"\n        class=\"d-flex flex-column page-element\"\n        :class=\"isPodcastmaker ? 'page-element-podcastmaker' : ''\"\n      >\n        <section class=\"module-box\">\n          <div class=\"mb-5 description-text\">\n            <RadioImage :radio=\"radio\" />\n            <div class=\"d-flex align-items-center justify-content-between\">\n              <h2>{{ radio.name }}</h2>\n              <ShareAnonymous class=\"d-flex justify-content-end flex-grow-1\" :organisation-id=\"radio.organisationId\"/>\n            </div>\n            <div v-if=\"radio.description\">\n              {{ radio.description }}\n            </div>\n          </div>\n          <RadioCurrently :radio=\"radio\" />\n          <slot v-if=\"editRight\" name=\"edit-box-radio\" :radio=\"radio\" />\n        </section>\n        <ShareSocialsButtons :organisation-id=\"radio.organisationId\" />\n        <RadioPlanning :radio=\"radio\" />\n        <SharePlayerRadio\n          v-if=\"editRight\"\n          :canal=\"radio\"\n          :organisation-id=\"authOrgaId\"\n        />\n      </div>\n    </template>\n    <ClassicLoading\n      :loading-text=\"!loaded ? t('Loading content ...') : undefined\"\n      :error-text=\"error ? t(`Emission doesn't exist`) : undefined\"\n    />\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport classicApi from \"../../api/classicApi\";\nimport {useSeoTitleUrl} from \"../composable/route/useSeoTitleUrl\";\nimport {useOrgaComputed} from \"../composable/useOrgaComputed\";\nimport {useErrorHandler} from \"../composable/useErrorHandler\";\nimport ClassicLoading from \"../form/ClassicLoading.vue\";\nimport {  defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useI18n } from \"vue-i18n\";\nconst SharePlayerRadio = defineAsyncComponent(\n  () => import(\"../display/sharing/SharePlayerRadio.vue\"),\n);\nconst ShareSocialsButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/ShareSocialsButtons.vue\"),\n);\nconst RadioCurrently = defineAsyncComponent(\n  () => import(\"../display/live/RadioCurrently.vue\"),\n);\nconst RadioImage = defineAsyncComponent(\n  () => import(\"../display/live/RadioImage.vue\"),\n);\nconst RadioPlanning = defineAsyncComponent(\n  () => import(\"../display/live/RadioPlanning.vue\"),\n);\nconst PodcastmakerHeader = defineAsyncComponent(\n  () => import(\"../display/podcastmaker/PodcastmakerHeader.vue\"),\n);\nconst ShareAnonymous = defineAsyncComponent(() => import(\"../display/sharing/ShareAnonymous.vue\"));\n \n//Props \nconst props = defineProps({\n  canalId: { default: undefined, type: Number },\n});\n\n\n//Data \nconst loaded = ref(false);\nconst error = ref(false);\nconst radio: Ref<Canal|undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker, isEditRights, authOrgaId } = useOrgaComputed();\nconst { updatePathParams } = useSeoTitleUrl();\nconst {handle403} = useErrorHandler();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n\n//Computed\nconst editRight = computed(() =>isEditRights(radio.value?.organisationId, authStore.isRoleRadio));\n\n\n//Watch\nwatch(()=>props.canalId, () => {getRadioDetails()}, {immediate: true});\n\n\nonBeforeUnmount(() => {\n  generalStore.contentToDisplayUpdate(null);\n});\n\n\n//Methods\nasync function getRadioDetails(): Promise<void> {\n  loaded.value = false;\n  loaded.value = false;\n  try {\n    radio.value = await classicApi.fetchData<Canal>({\n      api: 14,\n      path: \"canal/\" + props.canalId,\n    });\n    generalStore.contentToDisplayUpdate(radio.value);\n    updatePathParams(radio.value.name);\n  } catch (error) {\n    handle403(error as AxiosError);\n    loaded.value = true;\n  }\n  loaded.value = true;\n}\n</script>\n","<template>\n  <section class=\"page-box\">\n    <template v-if=\"loaded && !error && radio\">\n      <PodcastmakerHeader\n        v-if=\"isPodcastmaker\"\n        :page-title=\"t('Radio')\"\n        :img-url=\"radio.imageUrl\"\n      />\n      <div\n        v-if=\"radio\"\n        class=\"d-flex flex-column page-element\"\n        :class=\"isPodcastmaker ? 'page-element-podcastmaker' : ''\"\n      >\n        <section class=\"module-box\">\n          <div class=\"mb-5 description-text\">\n            <RadioImage :radio=\"radio\" />\n            <div class=\"d-flex align-items-center justify-content-between\">\n              <h2>{{ radio.name }}</h2>\n              <ShareAnonymous class=\"d-flex justify-content-end flex-grow-1\" :organisation-id=\"radio.organisationId\"/>\n            </div>\n            <div v-if=\"radio.description\">\n              {{ radio.description }}\n            </div>\n          </div>\n          <RadioCurrently :radio=\"radio\" />\n          <slot v-if=\"editRight\" name=\"edit-box-radio\" :radio=\"radio\" />\n        </section>\n        <ShareSocialsButtons :organisation-id=\"radio.organisationId\" />\n        <RadioPlanning :radio=\"radio\" />\n        <SharePlayerRadio\n          v-if=\"editRight\"\n          :canal=\"radio\"\n          :organisation-id=\"authOrgaId\"\n        />\n      </div>\n    </template>\n    <ClassicLoading\n      :loading-text=\"!loaded ? t('Loading content ...') : undefined\"\n      :error-text=\"error ? t(`Emission doesn't exist`) : undefined\"\n    />\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport classicApi from \"../../api/classicApi\";\nimport {useSeoTitleUrl} from \"../composable/route/useSeoTitleUrl\";\nimport {useOrgaComputed} from \"../composable/useOrgaComputed\";\nimport {useErrorHandler} from \"../composable/useErrorHandler\";\nimport ClassicLoading from \"../form/ClassicLoading.vue\";\nimport {  defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useI18n } from \"vue-i18n\";\nconst SharePlayerRadio = defineAsyncComponent(\n  () => import(\"../display/sharing/SharePlayerRadio.vue\"),\n);\nconst ShareSocialsButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/ShareSocialsButtons.vue\"),\n);\nconst RadioCurrently = defineAsyncComponent(\n  () => import(\"../display/live/RadioCurrently.vue\"),\n);\nconst RadioImage = defineAsyncComponent(\n  () => import(\"../display/live/RadioImage.vue\"),\n);\nconst RadioPlanning = defineAsyncComponent(\n  () => import(\"../display/live/RadioPlanning.vue\"),\n);\nconst PodcastmakerHeader = defineAsyncComponent(\n  () => import(\"../display/podcastmaker/PodcastmakerHeader.vue\"),\n);\nconst ShareAnonymous = defineAsyncComponent(() => import(\"../display/sharing/ShareAnonymous.vue\"));\n \n//Props \nconst props = defineProps({\n  canalId: { default: undefined, type: Number },\n});\n\n\n//Data \nconst loaded = ref(false);\nconst error = ref(false);\nconst radio: Ref<Canal|undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker, isEditRights, authOrgaId } = useOrgaComputed();\nconst { updatePathParams } = useSeoTitleUrl();\nconst {handle403} = useErrorHandler();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n\n//Computed\nconst editRight = computed(() =>isEditRights(radio.value?.organisationId, authStore.isRoleRadio));\n\n\n//Watch\nwatch(()=>props.canalId, () => {getRadioDetails()}, {immediate: true});\n\n\nonBeforeUnmount(() => {\n  generalStore.contentToDisplayUpdate(null);\n});\n\n\n//Methods\nasync function getRadioDetails(): Promise<void> {\n  loaded.value = false;\n  loaded.value = false;\n  try {\n    radio.value = await classicApi.fetchData<Canal>({\n      api: 14,\n      path: \"canal/\" + props.canalId,\n    });\n    generalStore.contentToDisplayUpdate(radio.value);\n    updatePathParams(radio.value.name);\n  } catch (error) {\n    handle403(error as AxiosError);\n    loaded.value = true;\n  }\n  loaded.value = true;\n}\n</script>\n"],"mappings":"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"}