@saooti/octopus-sdk 38.0.22 → 38.0.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saooti/octopus-sdk",
-  "version": "38.0.22",
+  "version": "38.0.25",
   "private": false,
   "description": "Javascript SDK for using octopus",
   "author": "Saooti",

package/public/img/wave.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="uuid-cd939b38-9c51-44e2-969a-c00901ca97ed" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg"
+     viewBox="0 0 95.43 34.27">
+    <path d="m95.43,11.57c-1.9.01-2.49,3.87-3.23,7.62-.25,1.28-.9,4.54-1.42,5.22-.14-.26-.39-.89-.67-2.33-.37-1.85-.67-4.38-.96-6.83-.93-7.84-1.45-10.8-3.25-10.8-1.16,0-1.74,1.3-2.28,5.14-.38,2.65-.68,6.23-.98,9.73-.28,3.28-.57,6.66-.91,9.22-.24,1.77-.47,2.79-.63,3.37-.15-.48-.35-1.28-.56-2.59-.35-2.14-.63-4.98-.92-7.82-.96-9.52-1.42-12.6-3.25-12.6s-2.39,3.09-3.25,9c-.29,2.01-.59,4.09-.95,5.6-.21.86-.39,1.35-.52,1.63-.15-.36-.37-1.06-.62-2.38-.36-1.93-.65-4.53-.94-7.04-.93-8.17-1.45-11.25-3.25-11.25s-2.38,3.22-3.25,9.94c-.29,2.22-.59,4.51-.95,6.18-.27,1.26-.51,1.82-.65,2.06-.55-.71-1.19-3.94-1.45-5.22-.74-3.76-1.33-6.73-3.24-6.73s-2.37,3.07-3.25,9.45c-.29,2.12-.59,4.31-.95,5.9-.18.8-.35,1.3-.47,1.61-.17-.54-.43-1.58-.69-3.56-.35-2.57-.64-5.97-.91-9.25-.29-3.46-.6-7.04-.97-9.7-.54-3.84-1.12-5.14-2.28-5.14-1.83,0-2.3,3.3-3.25,13.49-.28,2.98-.57,6.07-.92,8.39-.26,1.76-.51,2.68-.66,3.14-.13-.31-.31-.82-.5-1.66-.36-1.59-.66-3.79-.95-5.91-.88-6.38-1.38-9.45-3.25-9.45s-2.31,3.15-3.25,12.18c-.28,2.68-.57,5.45-.92,7.52-.22,1.28-.42,2.04-.56,2.49-.17-.53-.39-1.48-.63-3.13-.35-2.4-.64-5.59-.92-8.67-.96-10.54-1.42-13.94-3.25-13.94s-2.29,3.08-3.25,12.63c-.28,2.77-.57,5.64-.92,7.79-.24,1.51-.47,2.35-.63,2.8-.14-.34-.32-.92-.52-1.89-.37-1.76-.67-4.18-.96-6.52-.87-6.99-1.37-10.35-3.25-10.35s-2.37,3.07-3.25,9.45c-.29,2.12-.59,4.31-.95,5.91-.21.9-.39,1.42-.53,1.72-.15-.39-.38-1.14-.63-2.54-.35-2.01-.65-4.69-.93-7.28-.95-8.67-1.44-11.7-3.25-11.7s-2.32,2.96-3.25,10.82c-.29,2.44-.59,4.97-.96,6.81-.26,1.32-.49,1.96-.64,2.25-.12-.19-.3-.55-.51-1.23-.36-1.16-.66-2.79-.94-4.36-.74-4.02-1.32-7.19-3.24-7.19-.03,0-.06,0-.09,0v1.73s0,0,0,0c.01,0,.29.18.67,1.43.36,1.16.66,2.79.94,4.36.74,4.01,1.32,7.18,3.24,7.18,1.8,0,2.32-2.96,3.25-10.8.29-2.45.59-4.98.96-6.83.21-1.07.4-1.69.54-2.05.15.41.37,1.15.6,2.48.35,2,.65,4.69.93,7.28.95,8.67,1.44,11.7,3.25,11.7s2.37-3.07,3.25-9.47c.29-2.11.59-4.3.95-5.89.22-.95.41-1.48.55-1.76.14.32.35.92.58,2.03.37,1.77.67,4.19.96,6.52.87,6.99,1.37,10.35,3.25,10.35s2.29-3.08,3.25-12.63c.28-2.77.57-5.64.92-7.79.22-1.35.42-2.16.57-2.63.17.54.39,1.48.62,3.11.35,2.4.64,5.59.92,8.67.95,10.54,1.42,13.94,3.25,13.94s2.31-3.15,3.25-12.15c.28-2.69.57-5.46.92-7.55.25-1.49.48-2.28.64-2.7.13.3.32.82.52,1.7.36,1.59.66,3.77.95,5.9.88,6.39,1.38,9.45,3.25,9.45s2.29-3.3,3.25-13.5c.28-2.98.57-6.06.92-8.38.22-1.45.42-2.33.58-2.86.17.59.39,1.6.62,3.33.35,2.56.63,5.95.92,9.26.29,3.46.6,7.04.97,9.69.54,3.84,1.12,5.14,2.28,5.14,1.87,0,2.37-3.07,3.25-9.45.29-2.11.59-4.3.95-5.9.27-1.19.51-1.72.64-1.94.56.69,1.2,3.95,1.45,5.23.74,3.76,1.33,6.73,3.24,6.73s2.38-3.22,3.25-9.94c.29-2.22.59-4.51.95-6.17.21-.97.4-1.53.54-1.84.15.37.37,1.06.6,2.34.36,1.93.65,4.53.94,7.04.93,8.17,1.45,11.25,3.25,11.25s2.39-3.09,3.25-9c.29-2.01.59-4.09.95-5.6.2-.81.37-1.29.5-1.58.16.43.4,1.27.66,2.87.35,2.16.64,5.04.92,7.82.96,9.52,1.42,12.6,3.25,12.6,1.16,0,1.74-1.3,2.28-5.14.38-2.66.68-6.24.97-9.7.28-3.28.57-6.68.91-9.25.26-1.89.5-2.92.66-3.48.14.37.31.97.5,1.92.37,1.85.67,4.38.96,6.83.93,7.84,1.45,10.8,3.25,10.8,1.91,0,2.5-2.97,3.24-6.74.27-1.36.98-5.86,1.52-6.2v-1.75Z"/>
+</svg>

package/src/assets/general.scss

@@ -111,7 +111,6 @@ body{
       margin: 1rem 0;
     }
   }
-
   .flex-super-grow{
     flex-grow: 2;
   }

package/src/assets/progressbar.scss

@@ -20,19 +20,6 @@
       background-color: $octopus-primary-color;
       transition: width 0.6s ease;
     }
-    .octopus-chapter{
-      position: absolute;
-      background: transparent;
-      background-clip: content-box;
-      padding: 0 5px;
-      box-shadow: inset -2px 1px 0px 0px rgb(0 0 0),
-                  inset 2px 1px 0px 0px rgb(0 0 0);
-
-      &:hover{
-        background: rgba(255, 255, 255, 0.4);
-        box-shadow: -4px 1px 0px 0px rgb(0 0 0);
-      }
-    }
     &,.octopus-progress-bar{
       height: 4px;
       @media (max-width: 960px) {

package/src/components/display/podcasts/PodcastModuleBox.vue

@@ -77,6 +77,11 @@
           <div v-if="'' !== audioCredit" class="mb-1">
             {{ $t("Audio credits") + " : " + audioCredit }}
           </div>
+          <div v-if="'' !== authorCredit" class="mb-1">
+            {{ $t("Author credits") + " : " + authorCredit }}
+          </div>
+
+          
           <a
             v-if="podcast.article"
             class="btn d-flex align-items-center my-2 width-fit-content mb-1"
@@ -267,6 +272,9 @@ export default defineComponent({
     audioCredit(): string {
       return (this.podcast?.annotations?.audioCredit as string) ?? "";
     },
+    authorCredit(): string {
+      return (this.podcast?.annotations?.authorCredit as string) ?? "";
+    },
     isEditBox(): boolean {
       return (state.podcastPage.EditBox as boolean) ?? false;
     },

package/src/components/display/sharing/ShareButtons.vue

@@ -10,11 +10,11 @@
         role="button"
         tabindex="0"
         class="saooti-help ms-2"
+        :aria-label="$t('Help')"
       />
       <ClassicPopover
         v-if="authenticated"
         target="popover-share-help"
-        :title="$t('Help')"
         :content="$t('Share this page without edit and share blocks')"
         relative-class="page-element"
         :is-fixed="true"

package/src/components/display/sharing/ShareButtonsIntern.vue

@@ -18,7 +18,7 @@
             <div :class="button.icon" />
           </a>
         </template>
-        <!-- <router-link
+        <router-link
           v-if="!isPodcastmaker && authenticated && podcast && isProduction"
           :class="getClass('saooti-share')"
           :title="$t('Advanced sharing')"
@@ -26,7 +26,7 @@
             name: 'advancedShare',
             params: { podcastId: podcast.podcastId },
           }"
-        /> -->
+        />
       </div>
     </div>
     <div v-if="podcast || emission || playlist" class="d-flex flex-column me-2">

package/src/components/display/sharing/SharePlayerColors.vue

@@ -8,6 +8,7 @@
         :model-value="color"
         class="c-hand"
         show-fallback
+        fallback-input-type="color"
         colors="text-advanced"
         popover-to="right"
         :data-color="color"
@@ -22,6 +23,7 @@
         :model-value="theme"
         class="c-hand"
         show-fallback
+        fallback-input-type="color"
         colors="text-advanced"
         popover-to="right"
         :data-color="theme"

package/src/components/form/ClassicSelect.vue

@@ -61,13 +61,32 @@ export default defineComponent({
 });
 </script>
 <style lang="scss">
+@import "@scss/_variables.scss";
 .octopus-app {
+  select option:checked,
+  select option:hover {
+    box-shadow: 0 0 10px 100px #dddddd inset;
+  }
+  select:focus > option:checked { 
+      background: #dddddd !important;
+  }
+  .classic-select select{
+    -webkit-appearance: none;
+		-moz-appearance: none;
+		background-image: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"10\" role=\"presentation\"><path fill=\"%233c3c3c80\" d=\"M9.211364 7.59931l4.48338-4.867229c.407008-.441854.407008-1.158247 0-1.60046l-.73712-.80023c-.407008-.441854-1.066904-.441854-1.474243 0L7 5.198617 2.51662.33139c-.407008-.441853-1.066904-.441853-1.474243 0l-.737121.80023c-.407008.441854-.407008 1.158248 0 1.600461l4.48338 4.867228L7 10l2.211364-2.40069z\"></path></svg>") !important;
+		background-repeat: no-repeat !important;
+    background-position-x: calc(100% - 6px) !important;
+    background-position-y: 0.7rem !important;
+  }
+
   select.transparent {
     background: transparent !important;
     outline-color: transparent !important;
     padding: 0;
     border: 0;
     height: unset;
+    -webkit-appearance: auto !important;
+		-moz-appearance: auto !important;
   }
 }
 </style>

package/src/components/misc/ClassicAccordion.vue

@@ -1,10 +1,9 @@
 <template>
-  <div class="my-2" :class="displayAccordion ? 'octopus-accordion' : ''">
+  <div class="my-2" :class="[displayAccordion ? 'octopus-accordion' : '', isOpen?'octopus-accordion-open':'' ]">
     <template v-if="displayAccordion">
       <button
         :id="'accordion-' + idComposer"
-        class="btn-transparent bg-white w-100 p-2 text-start d-flex flex-no-wrap align-items-center"
-        :class="isOpen ? 'really-light-primary-bg' : ''"
+        class="w-100 py-2 text-start d-flex flex-nowrap align-items-center"
         @click="isOpen = !isOpen"
       >
         <span v-if="icon" class="img-accordion text-primary" :class="icon" />
@@ -52,10 +51,23 @@ export default defineComponent({
 });
 </script>
 <style lang="scss">
-.octopus-accordion {
-  border: 1px solid #ccc;
-  > button {
+@import '@scss/_variables.scss';
+.octopus-accordion{
+  > button{
+    background: white;
     min-height: 50px;
+    color: $octopus-primary-color;
+    border: 1px solid transparent;
+    &:hover{
+      border: 1px solid $octopus-primary-color;
+    }
+  }
+  &.octopus-accordion-open{
+    border: 1px solid $octopus-primary-color;
+    > button{
+      background: $octopus-primary-color;
+      color: white;
+    }
   }
   .img-accordion {
     width: 30px;
@@ -67,7 +79,7 @@ export default defineComponent({
     align-items: center;
   }
   .body {
-    border-top: 1px solid #ccc;
+    border-top: 1px solid $octopus-primary-color;
   }
 }
 </style>

package/src/components/misc/ClassicNav.vue

@@ -85,12 +85,16 @@ export default defineComponent({
       background-color 0.15s ease-in-out,
       border-color 0.15s ease-in-out;
     border: 0.1rem solid transparent;
-    &:hover,
-    &.active {
+    &:hover{
       border-color: #dee2e6;
       border-bottom-color: $octopus-primary-color;
       color: $octopus-primary-color;
     }
+    &.active{
+      border-color: $octopus-primary-color;
+      background: $octopus-primary-color;
+      color:white;
+    }
   }
   .octopus-nav.light .octopus-nav-link {
     border-top: 0 !important;

package/src/components/misc/ClassicPopover.vue

@@ -5,9 +5,11 @@
     ref="popover"
     tabindex="0"
     class="octopus-popover"
-    :class="[onlyClick ? 'octopus-dropdown' : '', popoverClass]"
+    :class="onlyClick ? 'octopus-dropdown' : ''"
     :style="positionInlineStyle"
     @blur="clearDataBlur"
+    @mouseenter="overPopover=true"
+    @mouseleave="overPopover=false;clearData();"
   >
     <div v-if="title" class="bg-secondary p-2">
       {{ title }}
@@ -28,12 +30,10 @@ export default defineComponent({
     target: { type: String, required: true },
     disable: { type: Boolean, default: false },
     onlyClick: { type: Boolean, default: false },
-    onlyMouse: { type: Boolean, default: false },
     isFixed: { type: Boolean, default: false },
     relativeClass: { type: String, default: undefined },
     leftPos: { type: Boolean, default: false },
     topPos: { type: Boolean, default: false },
-    popoverClass: { type: String, default: undefined },
   },
   data() {
     return {
@@ -42,6 +42,7 @@ export default defineComponent({
       posX: 0 as number,
       posY: 0 as number,
       targetElement: null as HTMLElement | null,
+      overPopover: false as boolean
     };
   },
   computed: {
@@ -67,11 +68,9 @@ export default defineComponent({
             "mouseenter",
             this.setPopoverData,
           );
-          this.targetElement.addEventListener("mouseleave", this.clearData);
-        }
-        if (!this.onlyMouse) {
-          this.targetElement.addEventListener("click", this.setPopoverData);
+          this.targetElement.addEventListener("mouseleave", this.clearDataTimeout);
         }
+        this.targetElement.addEventListener("click", this.setPopoverData);
         this.targetElement.addEventListener("blur", this.clearDataBlur);
       }
     },
@@ -82,11 +81,9 @@ export default defineComponent({
             "mouseenter",
             this.setPopoverData,
           );
-          this.targetElement.removeEventListener("mouseleave", this.clearData);
-        }
-        if (!this.onlyMouse) {
-          this.targetElement.removeEventListener("click", this.setPopoverData);
+          this.targetElement.removeEventListener("mouseleave", this.clearDataTimeout);
         }
+        this.targetElement.removeEventListener("click", this.setPopoverData);
         this.targetElement.addEventListener("blur", this.clearDataBlur);
       }
     },
@@ -180,6 +177,13 @@ export default defineComponent({
       this.isClick = false;
       this.clearData();
     },
+    clearDataTimeout() {
+      setTimeout(() => {
+        if(!this.overPopover){
+          this.clearData();
+        }
+      }, 500);
+    },
     clearData() {
       if (this.isClick) {
         return;

package/src/components/misc/HomeDropdown.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="d-flex align-items-center">
-    <router-link
+    <button
       v-if="isAuthenticatedWithOrga"
       :title="$t('My space')"
-      to="/main/priv/backoffice"
+      @click="goToAdministration"
       class="btn admin-button hide-smallest-screen m-1 saooti-admin-menu"
     />
     <router-link
@@ -147,5 +147,16 @@ export default defineComponent({
       return state.generalParameters.isContribution ?? false;
     },
   },
+  methods:{
+    goToAdministration(){
+      if("homePriv" !== this.$route.name){
+        this.$router.push("/main/priv/backoffice");
+      }else if (window.history.length > 1) {
+        this.$router.go(-1);
+      } else {
+        this.$router.push("/");
+      }
+    }
+  }
 });
 </script>

package/src/components/misc/ProgressBar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="display" id="test-menu-dropdown" class="octopus-progress">
+  <div class="octopus-progress">
     <div
       v-if="secondaryProgress"
       class="octopus-progress-bar bg-light"
@@ -48,50 +48,18 @@
     />
     <div
       v-if="isProgressCursor"
-      class="octopus-progress-bar-cursor"
+      class="progress-bar-cursor"
       :style="'left:' + mainProgress + '%'"
     />
-    <template v-if="playerChapteringPercent">
-      <template v-for="chapter in playerChapteringPercent" :key="chapter">
-        <div
-          :id="'chapter-' + chapter.startPercent"
-          class="octopus-progress-bar octopus-chapter"
-          role="progressbar"
-          aria-valuenow="0"
-          aria-valuemin="0"
-          aria-valuemax="100"
-          :style="{
-            left: chapter.startPercent + '%',
-            right: 100 - chapter.endPercent + '%',
-          }"
-        />
-        <Teleport to="#octopus-player-component">
-          <ClassicPopover
-            :target="'chapter-' + chapter.startPercent"
-            :is-fixed="true"
-            relative-class="player-container"
-            :only-mouse="true"
-            popover-class="octopus-small-popover"
-            :content="chapter.title"
-          />
-        </Teleport>
-      </template>
-    </template>
   </div>
 </template>
 
 <script lang="ts">
 import { usePlayerStore } from "@/stores/PlayerStore";
 import { mapState } from "pinia";
-import { defineAsyncComponent, defineComponent } from "vue";
-const ClassicPopover = defineAsyncComponent(
-  () => import("../misc/ClassicPopover.vue"),
-);
+import { defineComponent } from "vue";
 export default defineComponent({
   name: "ProgressBar",
-  components: {
-    ClassicPopover,
-  },
   props: {
     alertBar: { default: undefined, type: Number },
     mainProgress: { default: 0, type: Number },
@@ -105,14 +73,7 @@ export default defineComponent({
     };
   },
   computed: {
-    ...mapState(usePlayerStore, [
-      "playerMedia",
-      "playerChapteringPercent",
-      "playerStatus",
-    ]),
-    display() {
-      return "STOPPED" !== this.playerStatus;
-    },
+    ...mapState(usePlayerStore, ["playerMedia"]),
   },
   watch: {
     playerMedia: {
@@ -143,15 +104,4 @@ export default defineComponent({
 
 <style lang="scss">
 @import "../../assets/progressbar.scss";
-.octopus-app .player-container {
-  .octopus-small-popover {
-    font-size: 0.7rem;
-    background: #282828;
-    color: white;
-    border: 0;
-    .p-2 {
-      padding: 0.2rem !important;
-    }
-  }
-}
 </style>

package/src/components/misc/modal/NewsletterModal.vue

@@ -39,6 +39,7 @@
               v-model="color"
               class="c-hand me-2 mt-2"
               show-fallback
+              fallback-input-type="color"
               colors="text-advanced"
               popover-to="right"
               :data-color="color"

package/src/components/misc/player/PlayerCompact.vue

@@ -34,7 +34,6 @@
           {{ playedTime }} / {{ totalTime }}
         </div>
       </div>
-      <PlayerChaptering />
       <PlayerProgressBar
         v-if="!radioUrl"
         :show-timeline="showTimeline"
@@ -70,7 +69,6 @@ import { playerDisplay } from "../../mixins/player/playerDisplay";
 import imageProxy from "../../mixins/imageProxy";
 import ClassicSpinner from "../ClassicSpinner.vue";
 import PlayerTimeline from "./PlayerTimeline.vue";
-import PlayerChaptering from "./PlayerChaptering.vue";
 import { defineAsyncComponent, defineComponent } from "vue";
 const RadioProgressBar = defineAsyncComponent(
   () => import("./radio/RadioProgressBar.vue"),
@@ -86,7 +84,6 @@ export default defineComponent({
     RadioProgressBar,
     PlayerTimeline,
     ClassicSpinner,
-    PlayerChaptering,
   },
   mixins: [playerDisplay, imageProxy],
 

package/src/components/misc/player/PlayerComponent.vue

@@ -1,12 +1,11 @@
 <template>
   <div
-    id="octopus-player-component"
     class="player-container"
     :class="playerVideo ? 'player-video' : ''"
     :style="{ height: playerHeight }"
     @transitionend="onHidden"
   >
-    <template v-if="displayWithTimeout">
+    <template v-if="display">
       <PlayerVideo v-if="playerVideo" />
       <template v-else>
         <audio
@@ -87,7 +86,6 @@ export default defineComponent({
       comments: [] as Array<CommentPodcast>,
       audioUrlToPlay: "" as string,
       hlsReady: false as boolean,
-      displayWithTimeout: false as boolean,
     };
   },
   computed: {
@@ -106,15 +104,6 @@ export default defineComponent({
     playerHeight(): void {
       this.$emit("hide", 0 === this.playerHeight);
     },
-    display(): void {
-      if (this.display) {
-        this.displayWithTimeout = this.display;
-      } else {
-        setTimeout(() => {
-          this.displayWithTimeout = this.display;
-        }, 3000);
-      }
-    },
   },
 
   methods: {
@@ -152,12 +141,6 @@ export default defineComponent({
     transition: height 1s;
     background: #282828 !important;
     font-size: 1rem;
-    .medium-text {
-      font-size: 0.65rem;
-    }
-    .small-text {
-      font-size: 0.5rem;
-    }
 
     @media (max-width: 960px) {
       .d-flex {

package/src/components/misc/player/PlayerLarge.vue

@@ -24,7 +24,6 @@
         {{ podcastTitle }}
       </div>
     </div>
-    <PlayerChaptering class="justify-content-center w-100" />
     <div class="player-grow-large-content">
       <PlayerProgressBar
         v-if="!radioUrl"
@@ -87,7 +86,6 @@ import ClassicSpinner from "../ClassicSpinner.vue";
 import { playerDisplay } from "../../mixins/player/playerDisplay";
 import imageProxy from "../../mixins/imageProxy";
 import PlayerTimeline from "./PlayerTimeline.vue";
-import PlayerChaptering from "./PlayerChaptering.vue";
 import { defineAsyncComponent, defineComponent } from "vue";
 import { CommentPodcast } from "@/stores/class/general/comment";
 const RadioProgressBar = defineAsyncComponent(
@@ -108,7 +106,6 @@ export default defineComponent({
     PlayerTimeline,
     ClassicSpinner,
     RadioHistory,
-    PlayerChaptering,
   },
   mixins: [playerDisplay, imageProxy],
 

package/src/components/mixins/player/playerLogicProgress.ts

@@ -41,7 +41,7 @@ export const playerLogicProgress = defineComponent({
       );
     },
     playerSeekTime() {
-      if (undefined===this.playerSeekTime) {
+      if (!this.playerSeekTime) {
         return;
       }
       if (this.playerPodcast || this.playerLive) {

package/src/components/pages/RadioPage.vue

@@ -91,8 +91,7 @@ export default defineComponent({
   computed: {
     editRight(): boolean {
       return (
-        (true === this.authenticated &&
-          true === state.generalParameters.isRadio &&
+        (true === this.authenticated && true === state.generalParameters.isRadio && 
           this.myOrganisationId === this.radio?.organisationId) ||
         true === state.generalParameters.isAdmin
       );

package/src/helper/duration.ts

@@ -1,18 +1,20 @@
 export default {
-  convertTimestamptoSeconds(timestamp: string){
-    const [hours, minutes, seconds] = timestamp.split(':');
-    return Number(hours) * 60 * 60 + Number(minutes) * 60 + Number(seconds);
-  },
   formatToString(value: number) {
     if (value < 10) {
       return "0" + value;
     }
     return value.toString();
   },
-  formatDuration(totalSeconds: number, separator="'", isLast=true): string {
+  formatDuration(totalSeconds: number): string {
     const hours = Math.floor(totalSeconds / 3600);
     const minutes = Math.floor((totalSeconds - hours * 3600) / 60);
     const seconds = totalSeconds - hours * 3600 - minutes * 60;
-    return (hours > 0? this.formatToString(hours)+separator:"") + this.formatToString(minutes) +separator+ this.formatToString(seconds) + (isLast?separator:'' );
+    return (
+      (hours > 0 ? this.formatToString(hours) + "'" : "") +
+      this.formatToString(minutes) +
+      "'" +
+      this.formatToString(seconds) +
+      "''"
+    );
   },
 };

package/src/locale/de.ts

@@ -310,6 +310,7 @@ export default {
     "Wenn die Abschrift vorhanden ist, zeigen Sie sie",
   "Photo credits": "Bildnachweis",
   "Audio credits": "Audio-Credits",
+  "Author credits": "Autorennachweise",
   "View transcript": "Transkript ansehen",
   "Suggested listening": "Anhören empfohlen",
   More: "Mehr",
@@ -350,5 +351,4 @@ export default {
   "Trigger automatic reading if this is possible":"Wenn möglich, automatisches Auslesen auslösen",
   "High version":"Hohe Version",
   "Advanced sharing":"Erweitertes Teilen",
-  "Chaptering":"Kapitelaufteilung",
 }

package/src/locale/en.ts

@@ -310,6 +310,7 @@ export default {
     "If the transcript is available, show it",
   "Photo credits": "Photo credits",
   "Audio credits": "Audio credits",
+  "Author credits": "Author credits",
   "View transcript": "View transcript",
   "Suggested listening": "Suggested listening",
   More: "More",
@@ -350,5 +351,4 @@ export default {
   "Trigger automatic reading if this is possible":"Trigger automatic reading if this is possible",
   "High version":"High version",
   "Advanced sharing":"Advanced sharing",
-  "Chaptering":"Chaptering",
 };

package/src/locale/es.ts

@@ -311,6 +311,7 @@ export default {
     "Si la transcripción está disponible, muéstrela",
   "Photo credits": "Créditos fotográficos",
   "Audio credits": "Créditos de audio",
+  "Author credits": "Créditos del autor",
   "View transcript": "Ver transcripción",
   "Suggested listening": "Escucha sugerida",
   More: "Más",
@@ -351,5 +352,4 @@ export default {
   "Trigger automatic reading if this is possible":"Activar la lectura automática si esto es posible",
   "High version":"Versión alta",
   "Advanced sharing":"Reparto adelantado",
-  "Chaptering":"Capítulos",
 }

package/src/locale/fr.ts

@@ -32,7 +32,7 @@ export default {
   Emission: "Émission",
   "Emission description": "Description de l'émission",
   "Emission image": "Image de l'émission",
-  "Emission name": "Nom de l'émission",
+  "Emission name": "Title de l'émission",
   "No elements found. Consider changing the search query.":
     "Aucun élement ne correspond à votre recherche",
   "Podcast is not visible for listeners":
@@ -317,6 +317,7 @@ export default {
     "Si la transcription est disponible, l'afficher",
   "Photo credits": "Crédits photo",
   "Audio credits": "Crédits audio",
+  "Author credits": "Crédits auteur",
   "View transcript": "Afficher la transcription",
   "Suggested listening": "Suggestion d'écoute",
   More: "Plus",
@@ -357,5 +358,4 @@ export default {
   "Trigger automatic reading if this is possible":"Déclencher la lecture automatique si celle ci est possible",
   "High version":"Version en hauteur",
   "Advanced sharing":"Partage avancé",
-  "Chaptering":"Chapitrage",
 };

package/src/locale/it.ts

@@ -303,6 +303,7 @@ export default{
     "If the transcript is available, show it":"Se la trascrizione è disponibile, mostrala",
     "Photo credits":"Crediti fotografici",
     "Audio credits":"Crediti audio",
+    "Author credits": "Crediti dell'autore",
     "View transcript":"Visualizza trascrizione",
     "Suggested listening":"Ascolto suggerito",
     "More":"Di più",
@@ -343,5 +344,4 @@ export default{
   "Trigger automatic reading if this is possible":"Attivare la lettura automatica, se possibile",
   "High version":"Versione alta",
   "Advanced sharing":"Condivisione avanzata",
-  "Chaptering":"Capitolazione",
   };

package/src/locale/sl.ts

@@ -300,6 +300,7 @@ export default {
     "Če je prepis na voljo, ga pokažite",
   "Photo credits": "Avtorji fotografij",
   "Audio credits": "Avdio krediti",
+  "Author credits": "Zasluge avtorja",
   "View transcript": "Ogled prepisa",
   "Suggested listening": "Predlagano poslušanje",
   More: "Več",
@@ -340,5 +341,4 @@ export default {
   "Trigger automatic reading if this is possible":"Sprožite samodejno branje, če je to mogoče",
   "High version":"Visoka različica",
   "Advanced sharing":"Napredno deljenje",
-  "Chaptering":"Poglavje",
 }

package/src/stores/ParamSdkStore.ts

@@ -3,17 +3,17 @@ import { Category } from "./class/general/category";
 
 const state: ParamStore = {
   generalParameters: {
-    organisationId:undefined/*  "ecbd98d9-79bd-4312-ad5e-fc7c1c4a191c" */,
-    authenticated: false,
-    isAdmin: false,
-    isRoleLive: false,
-    isCommments: false,
-    isOrganisation:false,
-    isPlaylist: false,
-    isProduction: false,
-    isContribution: false,
-    isRadio: false,
-    ApiUri: "https://api.dev2.saooti.org/",
+    organisationId: "ecbd98d9-79bd-4312-ad5e-fc7c1c4a191c",
+    authenticated: true,
+    isAdmin: true,
+    isRoleLive: true,
+    isCommments: true,
+    isOrganisation:true,
+    isPlaylist: true,
+    isProduction: true,
+    isContribution: true,
+    isRadio: true,
+    ApiUri: "https://api.staging.saooti.org/",
     podcastmaker: false,
     buttonPlus: true,
     allCategories: [],
@@ -27,8 +27,8 @@ const state: ParamStore = {
     SharePlayer: true,
     ShareButtons: true,
     ShareDistribution: true,
-    MiniplayerUri: "https://playerbeta.dev2.saooti.org/",
-    hlsUri: "https://hls.live.dev2.saooti.org/",
+    MiniplayerUri: "https://playerbeta.staging.saooti.org/",
+    hlsUri: "https://hls.live.staging.saooti.org/",
     mainRubrique: 0,
     resourceUrl: undefined,
     podcastItemShowEmission: false,
@@ -80,14 +80,14 @@ const state: ParamStore = {
     userName: "",
   },
   octopusApi: {
-    url: "https://api.dev2.saooti.org/",
-    commentsUrl: "https://comments.dev2.saooti.org/",
-    imageUrl: "https://imageproxy.dev2.saooti.org/",
-    studioUrl: "https://studio.dev2.saooti.org/",
-    playerUrl: "https://playerbeta.dev2.saooti.org/",
-    speechToTextUrl: "https://speech2text.dev2.saooti.org/",
-    radioUrl:"https://radio.dev2.saooti.org/",
-    recoUrl: "https://reco.dev2.saooti.org/",
+    url: "https://api.staging.saooti.org/",
+    commentsUrl: "https://comments.staging.saooti.org/",
+    imageUrl: "https://imageproxy.staging.saooti.org/",
+    studioUrl: "https://studio.staging.saooti.org/",
+    playerUrl: "https://playerbeta.staging.saooti.org/",
+    speechToTextUrl: "https://speech2text.staging.saooti.org/",
+    radioUrl:"https://radio.staging.saooti.org/",
+    recoUrl: "https://reco.staging.saooti.org/",
     organisationId: undefined,
     rubriqueIdFilter: undefined,
   },

package/src/stores/PlayerStore.ts

@@ -3,8 +3,6 @@ import { Media } from "@/stores/class/general/media";
 import { MediaRadio, Radio } from "@/stores/class/general/player";
 import { Podcast } from "@/stores/class/general/podcast";
 import { defineStore } from "pinia";
-import { Chaptering, ChapteringPercent } from "./class/chaptering/chaptering";
-import octopusApi from "@saooti/octopus-api";
 interface Transcript {
   actual: number;
   actualText: string;
@@ -24,7 +22,6 @@ interface PlayerState {
   playerTranscript?: Transcript;
   playerLargeVersion: boolean;
   playerVideo: boolean;
-  playerChaptering?: Chaptering;
 }
 export const usePlayerStore = defineStore("PlayerStore", {
   state: (): PlayerState => ({
@@ -39,33 +36,13 @@ export const usePlayerStore = defineStore("PlayerStore", {
     playerSeekTime: 0,
     playerLargeVersion: false,
     playerVideo: false,
-    playerChaptering: undefined,
   }),
   getters: {
-    playerChapteringPercent(): ChapteringPercent|undefined{
-      if(!this.playerChaptering || 0===this.playerTotal){
-        return;
-      }
-      let chapteringPercent: ChapteringPercent = [];
-      for (let i = 0, len = this.playerChaptering.chapters.length; i < len; i++) {
-        chapteringPercent.push({
-          startTime : this.playerChaptering.chapters[i].startTime,
-          startDisplay: DurationHelper.formatDuration(this.playerChaptering.chapters[i].startTime, ':', false),
-          startPercent: (this.playerChaptering.chapters[i].startTime * 100 ) / (Math.round(this.playerTotal)),
-          endPercent:100,
-          title: this.playerChaptering.chapters[i].title
-        });
-      }
-      for (let i = 0, len = chapteringPercent.length; i < len; i++) {
-        chapteringPercent[i].endPercent = chapteringPercent[i].startPercent + ((chapteringPercent[i+1]?.startPercent ?? 100) - chapteringPercent[i].startPercent);
-      }
-      return chapteringPercent;
-    },
     playerHeight() {
       if ("STOPPED" === this.playerStatus) return 0;
       if (this.playerVideo) return "0px"/* "281px" */;
       if (this.playerLargeVersion) return "27rem";
-      if (window.innerWidth > 450) return "6rem";
+      if (window.innerWidth > 450) return "5rem";
       return "3.5rem";
     },
     playedTime(): string {
@@ -114,7 +91,7 @@ export const usePlayerStore = defineStore("PlayerStore", {
     },
   },
   actions: {
-    async playerPlay(param?: any, isVideo = false) {
+    playerPlay(param?: any, isVideo = false) {
       if (!param) {
         this.playerStatus = "STOPPED";
         this.playerPodcast = undefined;
@@ -123,7 +100,6 @@ export const usePlayerStore = defineStore("PlayerStore", {
         this.playerRadio = undefined;
         this.playerElapsed = 0;
         this.playerVideo = false;
-        this.playerChaptering=undefined;
         return;
       }
       if (
@@ -142,26 +118,16 @@ export const usePlayerStore = defineStore("PlayerStore", {
       this.playerRadio = undefined;
       this.playerVideo = isVideo;
       this.playerElapsed = 0;
-      this.playerChaptering=undefined;
       if (
         param.conferenceId &&
         (!param.podcastId || param.processingStatus !== "READY")
       ) {
         this.playerLive = param;
-        return;
-      }
-      if (param.podcastId) {
+      } else if (param.podcastId) {
         this.playerPodcast = param;
-        if(param.annotations?.chaptering){
-          this.playerChaptering =  await octopusApi.fetchDataPublic<Chaptering>(4, (param.annotations.chaptering as string));
-        }
-        return;
-      }
-      if (param.mediaId) {
+      } else if (param.mediaId) {
         this.playerMedia = param;
-        return;
-      }
-      if (param.canalId) {
+      } else if (param.canalId) {
         this.playerRadio = { ...param, ...{ isInit: false } };
       }
     },
@@ -192,11 +158,9 @@ export const usePlayerStore = defineStore("PlayerStore", {
       this.playerRadio.podcast = podcast;
     },
 
-    playerUpdateElapsed(elapsed: number, total?: number) {
+    playerUpdateElapsed(elapsed: number, total: number) {
       this.playerElapsed = elapsed;
-      if(total){
-        this.playerTotal = total;
-      }
+      this.playerTotal = total;
     },
 
     playerUpdateTranscript(transcript?: Transcript) {

package/src/components/misc/player/ChapteringModal.vue

@@ -1,95 +0,0 @@
-<template>
-  <ClassicModal
-    id-modal="chaptering-modal"
-    :title-modal="$t('Chaptering')"
-    @close="closePopup"
-  >
-    <template #body>
-      <div class="d-flex flex-column">
-        <button
-          v-for="(chapter, index) in playerChapteringPercent"
-          :key="chapter"
-          class="btn d-flex flex-nowrap align-items-center p-2 mt-1 c-hand text-truncate mb-1"
-          :class="actualChapter === index ? 'chapter-selected':'border'"
-          @click="goToChapter(index)"
-        >
-          <div class="d-flex align-items-center me-auto">
-            <svg v-if="actualChapter === index" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-soundwave" viewBox="0 0 16 16">
-              <path fill-rule="evenodd" d="M8.5 2a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-1 0v-11a.5.5 0 0 1 .5-.5m-2 2a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5m4 0a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5m-6 1.5A.5.5 0 0 1 5 6v4a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5m8 0a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5m-10 1A.5.5 0 0 1 3 7v2a.5.5 0 0 1-1 0V7a.5.5 0 0 1 .5-.5m12 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0V7a.5.5 0 0 1 .5-.5"/>
-            </svg>
-            <div v-else>{{ index + 1 }}</div>
-            <div class="ms-2">{{ "- " + chapter.title }}</div>
-          </div>
-          <div>{{ chapter.startDisplay }}</div>
-        </button>
-      </div>
-    </template>
-    <template #footer>
-      <button class="btn m-1" @click="closePopup">
-        {{ $t("Close") }}
-      </button>
-    </template>
-  </ClassicModal>
-</template>
-
-<script lang="ts">
-import { usePlayerStore } from "@/stores/PlayerStore";
-import { mapState, mapActions } from "pinia";
-import ClassicModal from "../modal/ClassicModal.vue";
-import { defineComponent } from "vue";
-export default defineComponent({
-  name: "ChapteringModal",
-  components: {
-    ClassicModal,
-  },
-  props: {actualChapter: {default: -1, type: Number}},
-  emits: ["close"],
-  data() {
-    return {
-      audioPlayer: null as HTMLAudioElement | null,
-    };
-  },
-  computed: {
-    ...mapState(usePlayerStore, [
-      "playerPodcast",
-      "playerLive",
-      "playerChapteringPercent",
-      "playerTotal",
-      "playerElapsed",
-    ]),
-  },
-  created() {
-    this.audioPlayer = document.querySelector("#audio-player");
-  },
-  methods: {
-    ...mapActions(usePlayerStore, [
-      "playerUpdateSeekTime",
-      "playerUpdateElapsed",
-    ]),
-    closePopup(): void {
-      this.$emit("close");
-    },
-    goToChapter(index: number) {
-      if (!this.playerChapteringPercent || !this.audioPlayer) {
-        return;
-      }
-      const seekTime =
-        this.playerTotal *
-        (this.playerChapteringPercent[index].startPercent / 100);
-      this.playerUpdateSeekTime(seekTime);
-      if (0 === seekTime) {
-        this.playerUpdateElapsed(0);
-      }
-      this.audioPlayer.currentTime = seekTime;
-    },
-  },
-});
-</script>
-<style lang="scss">
-@import "@scss/_variables.scss";
-.octopus-app {
- .chapter-selected{
-    border: $octopus-primary-color 3px solid;
- }
-}
-</style>

package/src/components/misc/player/PlayerChaptering.vue

@@ -1,86 +0,0 @@
-<template>
-  <div v-if="actualChapter" class="d-flex mb-1">
-    <button
-      class="btn-transparent d-flex align-items-center text-truncate medium-text text-light"
-      @click="showChaptering = !showChaptering"
-    >
-      <div class="text-truncate">
-        {{ actualIndex + 1 + " - " + actualChapter.title }}
-      </div>
-      <span class="saooti-right small-text" />
-    </button>
-    <ChapteringModal v-if="showChaptering" @close="showChaptering = false" :actual-chapter="actualIndex" />
-  </div>
-  <div v-else-if="playerChapteringPercent" class="margin-chaptering"></div>
-</template>
-<script lang="ts">
-import { ChapterPercent } from "@/stores/class/chaptering/chaptering";
-import { usePlayerStore } from "@/stores/PlayerStore";
-import { mapState } from "pinia";
-import { defineAsyncComponent, defineComponent } from "vue";
-const ChapteringModal = defineAsyncComponent(
-  () => import("./ChapteringModal.vue"),
-);
-export default defineComponent({
-  name: "PlayerChaptering",
-
-  components: {
-    ChapteringModal,
-  },
-  data() {
-    return {
-      actualChapter: undefined as ChapterPercent | undefined,
-      actualIndex: -1 as number,
-      showChaptering: false as boolean,
-    };
-  },
-  computed: {
-    ...mapState(usePlayerStore, ["playerChapteringPercent", "playerElapsed"]),
-  },
-  watch: {
-    playerElapsed: {
-      immediate: true,
-      handler() {
-        if (!this.playerChapteringPercent) {
-          this.actualChapter = undefined;
-          return;
-        }
-        const progressPercent = (this.playerElapsed ?? 0) * 100;
-        if (
-          this.actualChapter &&
-          this.isInChapter(progressPercent, this.actualChapter)
-        ) {
-          return;
-        }
-        for (
-          let i = 0, len = this.playerChapteringPercent.length;
-          i < len;
-          i++
-        ) {
-          if (
-            this.isInChapter(progressPercent, this.playerChapteringPercent[i])
-          ) {
-            this.actualChapter = this.playerChapteringPercent[i];
-            this.actualIndex = i;
-            return;
-          }
-        }
-        this.actualChapter = undefined;
-        this.actualIndex = -1;
-      },
-    },
-  },
-  methods: {
-    isInChapter(val: number, chapter: ChapterPercent) {
-      return Math.floor(chapter.startPercent) <= val && val < Math.floor(chapter.endPercent);
-    },
-  },
-});
-</script>
-<style lang="scss">
-.octopus-app {
- .margin-chaptering{
-  height: 23px;
- }
-}
-</style>

package/src/stores/class/chaptering/chaptering.ts

@@ -1,23 +0,0 @@
-//https://github.com/Podcastindex-org/podcast-namespace/blob/main/chapters/jsonChapters.md
-export interface Chaptering {
-  version: string;
-  chapters: Array<Chapter>;
-}
-
-export interface Chapter{
-  startTime: number;
-  title: string;
-  img?: string;
-  url?:string
-}
-
-export interface ChapterPercent {
-  startTime: number;
-  startDisplay: string;
-  startPercent: number;
-  endPercent: number;
-  title: string;
-}
-
-
-export type ChapteringPercent = Array<ChapterPercent>;