@saooti/octopus-sdk 40.2.13 → 40.2.15

package/package.json

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

package/src/components/composable/player/usePlayerLive.ts

@@ -32,7 +32,8 @@ export const usePlayerLive = (hlsReady: Ref<boolean>)=>{
   function playRadio() {
     if (!playerStore.playerRadio) return;
     handleSessionIdRadio();
-    playHls(playerStore.playerRadio.url+"?origin=octopus&sessionId="+playerStore.playerRadio.sessionId);
+    playerStore.playerUpdatePlayerHlsUrl(playerStore.playerRadio.url+"?origin=octopus&sessionId="+playerStore.playerRadio.sessionId);
+    playHls();
   }
 
   function handleSessionIdRadio(){
@@ -45,20 +46,20 @@ export const usePlayerLive = (hlsReady: Ref<boolean>)=>{
 
   function playLive() {
     if (!playerStore.playerLive) return;
-    const hlsStreamUrl = `${apiStore.hlsUrl}live/dev.${playerStore.playerLive.conferenceId}/index.m3u8`;
-    playHls(hlsStreamUrl);
+    playerStore.playerUpdatePlayerHlsUrl(`${apiStore.hlsUrl}live/dev.${playerStore.playerLive.conferenceId}/index.m3u8`);
+    playHls();
   }
 
-  async function playHls(hlsStreamUrl: string): Promise<void> {
+  async function playHls(): Promise<void> {
     try {
       if(null===audioElement.value){
         audioElement.value = document.getElementById(
           "audio-player",
         ) as HTMLAudioElement;
       }
-      if (null === audioElement.value) {
+      if (null === audioElement.value || !playerStore.playerHlsUrl) {
         setTimeout(() => {
-          playHls(hlsStreamUrl);
+          playHls();
         }, 1000);
         return;
       }
@@ -69,33 +70,33 @@ export const usePlayerLive = (hlsReady: Ref<boolean>)=>{
         !isAndroid
       ) {
         if ("SECURED" === playerStore.playerLive?.organisation?.privacy && authStore.authParam.accessToken) {
-          audioElement.value.src = hlsStreamUrl+"?access_token="+authStore.authParam.accessToken;
+          audioElement.value.src = playerStore.playerHlsUrl+"?access_token="+authStore.authParam.accessToken;
         }else{
-          audioElement.value.src = hlsStreamUrl;
+          audioElement.value.src = playerStore.playerHlsUrl;
         }
         await initLiveDownloadId();
         hlsReady.value = true;
         await audioElement.value.play();
         onPlay();
       } else {
-        await initHls(hlsStreamUrl);
+        await initHls();
       }
     } catch {
-      onHlsError(hlsStreamUrl);
+      onHlsError();
     }
   }
 
-  function onHlsError(hlsStreamUrl:string){
+  function onHlsError(){
     if("STOPPED"!==playerStore.playerStatus && undefined===hlsRetryTimeout.value){
       hlsRetryTimeout.value = setTimeout(() => {
         errorHls.value = false;
-        playHls(hlsStreamUrl);
+        playHls();
         hlsRetryTimeout.value = undefined;
       }, 5000);
     }
   }
 
-  async function initHls(hlsStreamUrl: string) {
+  async function initHls() {
     if (null === Hls) {
       await import("hls.js").then((hlsLibrary) => {
         Hls = hlsLibrary.default;
@@ -122,17 +123,17 @@ export const usePlayerLive = (hlsReady: Ref<boolean>)=>{
         playPromise.value = undefined;
         onPlay();
       }).catch(()=>{
-        onHlsError(hlsStreamUrl);
+        onHlsError();
         playPromise.value = undefined;
       })
     });
     hls.value.on(Hls.Events.ERROR, async (e, data:any) => {
       errorHls.value = true;
       if(undefined===playPromise.value && data.fatal){
-        onHlsError(hlsStreamUrl);
+        onHlsError();
       }
     });
-    hls.value.loadSource(hlsStreamUrl);
+    hls.value.loadSource(playerStore.playerHlsUrl);
     hls.value.attachMedia(audioElement.value as HTMLAudioElement);
   }
 

package/src/components/composable/player/usePlayerLogicProgress.ts

@@ -8,6 +8,7 @@ export const usePlayerLogicProgress = ()=>{
   const notListenTime= ref(0);
   const lastSend= ref(0);
   const downloadId: Ref<string | null>= ref(null);
+  const urlLiveSent= ref(false);
 
   const playerStore = usePlayerStore();
   const authStore = useAuthStore();
@@ -31,11 +32,7 @@ export const usePlayerLogicProgress = ()=>{
       return;
     }
     lastSend.value = newVal;
-    await classicApi.putData({
-      api: 0,
-      path:"podcast/listen/" + downloadId.value + "?seconds=" + Math.round(newVal),
-      isNotAuth:true
-    });
+    await sendListeningProgress(newVal);
   });
 
   watch(()=>playerStore.playerSeekTime, async () => {
@@ -65,24 +62,16 @@ export const usePlayerLogicProgress = ()=>{
     }
     try {
       const mediaType = playerStore.playerVideo ? "VIDEO":"AUDIO";
-      const downloadId = await classicApi.putData<string | null>({
-        api: 0,
-        path:"podcast/prepare/live/" + playerStore.playerLive.podcastId+"?mediaType="+mediaType,
+      const downloadIdFetched = await classicApi.fetchData<string | null>({
+        api:0,
+        path: "podcast/download/live2/" + playerStore.playerLive.podcastId,
+        parameters:{
+          mediaType: mediaType,
+          origin: "octopus",
+          distributorId: authStore.authOrgaId,
+        },
       });
-      try {
-        await classicApi.fetchData<string | null>({
-          api:0,
-          path: "podcast/download/live/" + playerStore.playerLive.podcastId + ".m3u8",
-          parameters:{
-            downloadId: downloadId ?? undefined,
-            origin: "octopus",
-            distributorId: authStore.authOrgaId,
-          },
-        });
-      } catch {
-        // Remove try/catch when back will no longer redirect with a 403 in a secured context #13594
-      }
-      setDownloadId(downloadId);
+      setDownloadId(downloadIdFetched);
     } catch {
       downloadId.value = null;
       console.log("ERROR downloadId");
@@ -116,22 +105,30 @@ export const usePlayerLogicProgress = ()=>{
 
   async function endListeningProgress(): Promise<void> {
     if (!downloadId.value) return;
+    await sendListeningProgress(listenTime.value);
+    downloadId.value = null;
+    notListenTime.value = 0;
+    lastSend.value = 0;
+    listenTime.value = 0;
+    urlLiveSent.value = false;
+    playerStore.playerUpdatePlayerHlsUrl(undefined);
+  }
+
+  async function sendListeningProgress(listenTime:number){
+    let paramUrlLive= "";
+    if(!urlLiveSent.value && playerStore.playerHlsUrl){
+      paramUrlLive="&url="+encodeURI(playerStore.playerHlsUrl);
+      urlLiveSent.value = true;
+    }
     try {
       await classicApi.putData<string | null>({
         api: 0,
-        path:"podcast/listen/" +
-        downloadId.value +
-          "?seconds=" +
-          Math.round(listenTime.value),
+        path:"podcast/listen/" +downloadId.value +"?seconds=" +Math.round(listenTime)+paramUrlLive,
         isNotAuth:true
       });
     } catch {
       //Do nothing
     }
-    downloadId.value = null;
-    notListenTime.value = 0;
-    lastSend.value = 0;
-    listenTime.value = 0;
   }
 
 

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

@@ -162,7 +162,7 @@ export default defineComponent({
       }
       if(!filterToAdd){return;}
       const queries = this.returnRubriquesFilter((a) => {
-        let indexRubriquage = a.findIndex(filter => filter.rubriquageId === filterToAdd.rubriquageId);
+        const indexRubriquage = a.findIndex(filter => filter.rubriquageId === filterToAdd.rubriquageId);
         if (indexRubriquage === -1) {
           a.push(filterToAdd);
         } else {

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

@@ -27,6 +27,7 @@
             height="20"
             class="ouest-france-logo"
             role="presentation"
+            title="Ouest France"
             alt=""
             src="/img/ouest_france_logo.svg" 
           />

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

@@ -28,7 +28,7 @@
           @keydown.enter="clickButton(button.emitName)"
         >
           <component :is="button.icon" />
-          <div class="ms-1">{{ button.title }}</div>
+          <span class="ms-1">{{ button.title }}</span>
         </button>
       </div>
     </ClassicPopover>

package/src/components/misc/TopBarMainContent.vue

@@ -15,6 +15,7 @@
         alt=""
         width="140"
         height="50"
+        title="Logo"
         :class="platformEducation ? 'education-logo' : 'octopus-logo'"
       />
       <img
@@ -23,6 +24,7 @@
         role="presentation"
         alt=""
         class="client-logo"
+        title="Logo"
         :class="platformEducation ? 'education-logo' : ''"
       />
     </router-link>
@@ -46,6 +48,7 @@
           width="100"
           height="29"
           class="ms-2"
+          title="Logo"
           :class="platformEducation ? 'education-logo' : 'octopus-logo'"
         />
         <a
@@ -59,6 +62,7 @@
             :src="logoUrl"
             role="presentation"
             alt=""
+            title="Saooti"
             width="100"
             height="29"
             class="ms-2"
@@ -91,9 +95,9 @@
           :title="$t('More')"
           class="d-flex-column flex-nowrap align-items-center btn-transparent py-2 px-3 text-white"
         >
-          <div class="link-hover">
+          <span class="link-hover">
             {{ $t("More") }}
-          </div>
+          </span>
           <ChevronDownIcon />
         </button>
         <ClassicPopover

package/src/components/misc/player/video/PlayerVideoHls.vue

@@ -30,7 +30,7 @@ export default defineComponent({
   props: {
     hlsUrl: { default: "", type: String },
     responsive: { default: false, type: Boolean },
-    isSecured: { default: true, type: Boolean }, //TODO
+    isSecured: { default: true, type: Boolean },
   },
   emits: ["changeValid"],
 
@@ -75,6 +75,7 @@ export default defineComponent({
     },
   },
   mounted() {
+    this.playerUpdatePlayerHlsUrl(this.hlsUrl);
     this.useVideoSrc =
       "" !== this.videoElement.canPlayType("application/vnd.apple.mpegurl") &&
       !navigator.userAgent.includes("Android");
@@ -88,7 +89,7 @@ export default defineComponent({
   },
 
   methods: {
-    ...mapActions(usePlayerStore, ["playerUpdateSeekTime"]),
+    ...mapActions(usePlayerStore, ["playerUpdateSeekTime", "playerUpdatePlayerHlsUrl"]),
     definedStalledTimeout() {
       this.isPaused = false;
       this.stalledTimout = setTimeout(() => {
@@ -177,9 +178,11 @@ export default defineComponent({
       this.videoElement.onseeking = async () => {
         this.playerUpdateSeekTime(this.videoElement.currentTime);
       };
-      /* if ("SECURED" === playerStore.playerLive?.organisation?.privacy && authStore.authParam.accessToken) {
-      } */
-     //TODO
+      if (this.isSecured && this.authParam.accessToken) {
+        this.videoElement.src = this.hlsUrl + "access_token="+this.authParam.accessToken;
+      }else{
+        this.videoElement.src = this.hlsUrl;
+      }
       this.videoElement.src = this.hlsUrl;
     },
     videoClean(): void {

package/src/components/pages/Error403Page.vue

@@ -8,6 +8,7 @@
           class="logo-octopus"
           src="/img/logo_saooti_play_black.webp"
           role="presentation"
+          title="Saooti"
           alt=""
         />
         <h2>{{ $t("You do not have the right to access this page") }}</h2>
@@ -19,6 +20,7 @@
         src="/img/403.webp"
         role="presentation"
         alt=""
+        title="403"
       />
     </div>
 

package/src/components/pages/TagPage.vue

@@ -9,6 +9,7 @@
         class="ouest-france-logo-tag-page"
         role="presentation"
         alt=""
+        title="Ouest France"
         src="/img/ouest_france_logo.svg" 
       />
     </h1>

package/src/stores/PlayerStore.ts

@@ -31,6 +31,7 @@ interface PlayerState {
   playerVideo: boolean;
   playerChaptering?: Chaptering;
   playerDelayStitching: number;
+  playerHlsUrl?: string;
 }
 export const usePlayerStore = defineStore("PlayerStore", {
   state: (): PlayerState => ({
@@ -248,5 +249,8 @@ export const usePlayerStore = defineStore("PlayerStore", {
     playerUpdateDelayStitching(delay: number) {
       this.playerDelayStitching = delay;
     },
+    playerUpdatePlayerHlsUrl(hlsUrl: string|undefined) {
+      this.playerHlsUrl = hlsUrl;
+    },
   },
 });