@saooti/octopus-sdk 32.0.29 → 32.0.31

package/README.md

@@ -643,6 +643,12 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
  * 31.0.50 Améliorations responsive
  * 31.0.51 Newest
  * 31.0.52 Locale
+ * 31.0.53 Correction playerLogic
+ * 31.0.54 Test live ios
+ * 31.0.55 Test live ios
+ * 31.0.56 Test live ios
+ * 31.0.57 Test live ios
+
 
  * 32.0.0 Passage en 32
  * 32.0.1 Navigation clavier
@@ -673,4 +679,6 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
  * 32.0.26 Image Proxy
  * 32.0.27 Image Proxy -> webp
  * 32.0.28 Image Proxy
- * 32.0.29 SpeechToText
+ * 32.0.29 SpeechToText
+ * 32.0.30 SpeechToText
+ * 32.0.31 Merge live IOS

package/package.json

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

package/src/api/classicCrud.ts

@@ -16,8 +16,8 @@ enum ModuleApi {
   }
 /* eslint-disable */
 export default {
-    async fetchData<Type>(state: StoreState,moduleName: ModuleApi,wsPath:string): Promise<Type>{
-        console.log(state,moduleName,wsPath);
+    async fetchData<Type>(state: StoreState,moduleName: ModuleApi,wsPath:string, forceRefresh?:boolean): Promise<Type>{
+        console.log(state,moduleName,wsPath,forceRefresh);
         const response = await axios.get('/mock');
         return response.data;
     },

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

@@ -82,7 +82,7 @@
             />
           </div>
           <div
-            v-else
+            v-if="displayArticleParam"
             class="d-flex flex-column flex-grow-1"
           >
             <ClassicCheckbox
@@ -91,6 +91,16 @@
               :label="$t('Display associated article')"
             />
           </div>
+          <div 
+            v-if="displayTranscriptParam"
+            class="d-flex flex-column flex-grow-1"
+          >
+            <ClassicCheckbox
+              v-model:textInit="displayTranscript"
+              id-checkbox="display-transcript-checkbox"
+              :label="$t('If the transcript is available, show it')"
+            />
+          </div>
         </div>
       </div>
     </div>
@@ -107,9 +117,11 @@ export default defineComponent({
   props: {
     isVisible: { default: false, type: Boolean},
     choseNumberEpisode: {default: false, type: Boolean},
-    displayChoiceAllEpisodes: {default: false, type: Boolean}
+    displayChoiceAllEpisodes: {default: false, type: Boolean},
+    displayTranscriptParam: {default: false, type: Boolean},
+    displayArticleParam: {default: false, type: Boolean},
   },
-  emits: ['episodeNumbers', 'proceedReading', 'isVisible', 'iFrameNumber', 'displayArticle'],
+  emits: ['episodeNumbers', 'proceedReading', 'isVisible', 'iFrameNumber', 'displayArticle', 'displayTranscript'],
 
   data() {
     return {
@@ -118,6 +130,7 @@ export default defineComponent({
       iFrameNumberPriv: '3' as string,
       isVisibleTemp: this.isVisible as boolean,
       displayArticle: true as boolean,
+      displayTranscript:true as boolean,
     };
   },
   computed: {
@@ -151,6 +164,9 @@ export default defineComponent({
     },
     displayArticle(): void{
       this.$emit('displayArticle', this.displayArticle);
+    },
+    displayTranscript(): void{
+      this.$emit('displayTranscript', this.displayTranscript);
     }
   },
 })

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

@@ -44,7 +44,10 @@
           :is-visible="isVisible"
           :chose-number-episode="displayChoiceAllEpisodes|| isLargeSuggestion"
           :display-choice-all-episodes="displayChoiceAllEpisodes"
+          :displayTranscriptParam="displayTranscriptParam"
+          :displayArticleParam="displayArticleParam"
           @displayArticle="displayArticle = $event"
+          @displayTranscript="displayTranscript = $event"
           @episodeNumbers="episodeNumbers = $event"
           @proceedReading="proceedReading = $event"
           @isVisible="isVisible = $event"
@@ -119,17 +122,32 @@ export default defineComponent({
       iFrameNumber: '3' as string,
       isVisible: false as boolean,
       displayArticle: true as boolean,
+      displayTranscript: true as boolean,
       colors: ['#000000', '#ffffff'],
+      orgaAttributes: undefined as{[key: string]:string|number|boolean|undefined}|undefined,
     };
   },
   
   computed: {
+    displayArticleParam():boolean{
+      return undefined!==this.podcast && undefined!==this.podcast.article && 0 !== this.podcast.article.length;
+    },
+    displayTranscriptParam():boolean{
+      return this.isTranscriptionAuthorize && (this.isDefault || this.isEmission);
+    },
+    isTranscriptionAuthorize(): boolean{
+      if(!this.orgaAttributes){return false;}
+      return this.orgaAttributes && Object.prototype.hasOwnProperty.call(this.orgaAttributes,'speechtotext.active')?(this.orgaAttributes['speechtotext.active'] as boolean): false;
+    },
     displayChoiceAllEpisodes():boolean{
       return !this.podcast || this.isEmission || this.isLargeEmission;
     },
     baseUrl(): string{
       return (state.podcastPage.MiniplayerUri as string); 
     },
+    isDefault(): boolean {
+      return 'default' === this.iFrameModel;
+    },
     isEmission(): boolean {
       return 'emission' === this.iFrameModel;
     },
@@ -193,6 +211,9 @@ export default defineComponent({
       if(!this.displayArticle){
         url.push('&article=false');
       }
+      if(!this.displayTranscript){
+        url.push('&transcript=false');
+      }
       if (this.isVisible) {
         url.push('&key=' + window.btoa(this.dataTitle.toString()));
       }
@@ -247,26 +268,32 @@ export default defineComponent({
       return 0;
     },
     isPlayerParameter(): boolean{
-      return (!this.podcast || (this.podcast.article && 0 !== this.podcast.article.length) || this.isEmission || this.isLargeEmission || this.isLargeSuggestion) && !this.playlist;
+      return (!this.podcast || 
+      (this.displayArticle) ||
+      this.isEmission || this.isLargeEmission || this.isLargeSuggestion || 
+      (this.displayTranscriptParam))
+      && !this.playlist;
     }
   },
   async created() {
+    await this.fetchOrgaAttributes();
     await this.initColor();
     if (this.isLiveReadyToRecord) {
       this.iFrameModel = 'large';
     }
   },
   methods: {
-    async initColor(): Promise<void> {
-      if (!this.authenticated) return;
-      let data;
+    async fetchOrgaAttributes(): Promise<void>{
       if(this.$store.state.organisation?.attributes && Object.keys(this.$store.state.organisation.attributes).length > 1){
-        data = this.$store.state.organisation.attributes;
+        this.orgaAttributes = this.$store.state.organisation.attributes;
       }else{
-        data= await octopusApi.fetchData<{[key:string]:string}>(0, 'organisation/attributes/'+this.myOrganisationId);
+        this.orgaAttributes= await octopusApi.fetchData<{[key:string]:string}>(0, 'organisation/attributes/'+this.myOrganisationId);
       }
-      this.color = Object.prototype.hasOwnProperty.call(data,'COLOR') ? data.COLOR : '#40a372';
-      this.theme = Object.prototype.hasOwnProperty.call(data,'THEME') ? data.THEME : '#000000';
+    },
+    initColor(): void {
+      if(!this.orgaAttributes){return;}
+      this.color = Object.prototype.hasOwnProperty.call(this.orgaAttributes,'COLOR') ? (this.orgaAttributes.COLOR as string) : '#40a372';
+      this.theme = Object.prototype.hasOwnProperty.call(this.orgaAttributes,'THEME') ? (this.orgaAttributes.THEME as string) : '#000000';
     },
   },
 })

package/src/components/form/ClassicLoading.vue

@@ -1,9 +1,9 @@
 <template>
   <div
     v-if="loadingText"
-    class="d-flex justify-content-center"
+    class="d-flex align-items-center justify-content-center"
   >
-    <div class="spinner-border me-3" />
+    <div class="spinner-border me-3 flex-shrink-0" />
     <div class="h3 mt-2">
       {{ loadingText }}
     </div>

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

@@ -14,6 +14,7 @@ export const playerLive = defineComponent({
       lastSend: 0 as number,
       hlsReady: false as boolean,
       downloadId: null as string|null,
+      audioElement: null as HTMLAudioElement|null
     };
   },
   computed: {
@@ -33,14 +34,43 @@ export const playerLive = defineComponent({
         this.live.conferenceId +
         '/index.m3u8';
       try {
-        await this.initHls(hlsStreamUrl);
+        this.audioElement = (document.getElementById('audio-player') as HTMLAudioElement);
+        if(null===this.audioElement){
+          setTimeout(() => {
+            this.playLive();
+          }, 1000);
+          return;
+        }
+        if (this.audioElement.canPlayType('application/vnd.apple.mpegurl')) {
+          this.audioElement.src = hlsStreamUrl;
+          await this.initLiveDownloadId();
+          await (this.audioElement as HTMLAudioElement).play();
+          this.onPlay();
+        }else{
+          await this.initHls(hlsStreamUrl);
+        }
       } catch (error) {
-        console.log(error);
         setTimeout(() => {
           this.playLive();
         }, 1000);
       }
     },
+    async initLiveDownloadId(){
+      if(!this.live){ return;}
+      let downloadId = null;
+      try {
+        downloadId = await octopusApi.putDataPublic<string | null>(0, 'podcast/prepare/live/'+this.live.livePodcastId, undefined);
+        await octopusApi.fetchDataPublicWithParams<string | null>(0,'podcast/download/live/' + this.live.livePodcastId+".m3u8",{
+          'downloadId': null!==downloadId ? downloadId : undefined,
+          'origin':'octopus',
+          'distributorId':this.$store.state.authentication.organisationId
+        });
+        this.setDownloadId(downloadId);
+      } catch (error) {
+        console.log('ERROR downloadId');
+      }
+      this.hlsReady = true;
+    },
     async initHls(hlsStreamUrl: string): Promise<void> {
       return new Promise<void>(async(resolve, reject) => {
         if(null === Hls){
@@ -65,23 +95,9 @@ export const playerLive = defineComponent({
           );
         } */
         hls.on(Hls.Events.MANIFEST_PARSED, async () => {
-          if(!this.live){ return; }
-          let downloadId = null;
-          try {
-            downloadId = await octopusApi.putDataPublic<string | null>(0, 'podcast/prepare/live/'+this.live.livePodcastId, undefined);
-            await octopusApi.fetchDataPublicWithParams<string | null>(0,'podcast/download/live/' + this.live.livePodcastId+".m3u8",{
-              'downloadId': null!==downloadId ? downloadId : undefined,
-              'origin':'octopus',
-              'distributorId':this.$store.state.authentication.organisationId
-            });
-            this.setDownloadId(downloadId);
-          } catch (error) {
-            console.log('ERROR downloadId');
-          }
-          this.hlsReady = true;
-          const audio: HTMLElement|null = document.getElementById('audio-player');
-          hls.attachMedia((audio as HTMLAudioElement));
-          await (audio as HTMLAudioElement).play();
+          await this.initLiveDownloadId();
+          hls.attachMedia((this.audioElement as HTMLAudioElement));
+          await (this.audioElement as HTMLAudioElement).play();
           this.onPlay();
           resolve();
         });

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

@@ -63,10 +63,12 @@ export const playerLogic = defineComponent({
     },
     live: {
       deep: true,
-      async handler(){
-        this.hlsReady = false;
-        this.reInitPlayer();
-        await this.playLive();
+      handler(){
+        this.$nextTick(async () => {
+          this.hlsReady = false;
+          this.reInitPlayer();
+          await this.playLive();
+        });
       }
     },
     async listenTime(newVal): Promise<void> {
@@ -188,7 +190,15 @@ export const playerLogic = defineComponent({
             mediaTarget.currentTime - this.notListenTime;
         }
       }
-      const streamDuration = mediaTarget.duration;
+      let streamDuration = mediaTarget.duration;
+      if(Infinity===streamDuration){
+        const seekable = mediaTarget.seekable;
+        if(seekable){
+          streamDuration = seekable.end(seekable.length - 1);
+        }else{
+          streamDuration = mediaTarget.currentTime;
+        }
+      }
       if (!streamDuration) return;
       if (!mediaTarget.currentTime) return;
       if (!this.live) {

package/src/locale/de.ts

@@ -306,4 +306,5 @@ export default{
   'Back to home': "Zurück zur Startseite",
   "Warning":"Warnung",
   "Visual":"Bild von {name}",
+  "If the transcript is available, show it":"Wenn die Abschrift vorhanden ist, zeigen Sie sie",
 }

package/src/locale/en.ts

@@ -313,4 +313,5 @@ export default{
   "Go to previous page":"Go to previous page",
   "Warning":"Warning",
   "Visual":"Visual of {name}",
+  "If the transcript is available, show it":"If the transcript is available, show it",
 };

package/src/locale/es.ts

@@ -306,4 +306,5 @@ export default{
   'Back to home': 'Volver a la página de inicio',
   "Warning":"Advertencia",
   "Visual":"Imagen de {name}",
+  "If the transcript is available, show it":"Si la transcripción está disponible, muéstrela",
 }

package/src/locale/fr.ts

@@ -313,4 +313,5 @@ export default{
   "Go to previous page":"Aller à la page précédente",
   "Warning":"Avertissement",
   "Visual":"Visuel de {name}",
+  "If the transcript is available, show it":"Si la transcription est disponible, l'afficher",
 };

package/src/locale/it.ts

@@ -304,4 +304,5 @@ export default{
     'Back to home': "Torna alla schermata 'home'",
     "Warning":"Avvertimento",
     "Visual":"Visiva di {name}",
+    "If the transcript is available, show it":"Se la trascrizione è disponibile, mostrala",
   };

package/src/locale/sl.ts

@@ -306,4 +306,5 @@ export default{
   'Back to home': 'Nazaj domov',
   "Warning":"Opozorilo",
   "Visual":"Slika od {name}",
+  "If the transcript is available, show it":"Če je prepis na voljo, ga pokažite",
 }