@saooti/octopus-sdk 30.0.4 → 30.0.8

package/src/components/pages/Emission.vue

@@ -1,14 +1,13 @@
 <template>
-  <div>
+  <div class="page-box">
     <div
       v-if="loaded && !error"
-      class="page-box"
     >
       <h1 v-if="!isOuestFrance">
         {{ $t('Emission') }}
       </h1>
       <div class="d-flex">
-        <div class="d-flex flex-column flex-grow">
+        <div class="d-flex flex-column flex-grow-1">
           <EditBox
             v-if="editRight && isEditBox"
             :emission="emission"
@@ -48,7 +47,7 @@
             :emission="emission"
           />
         </div>
-        <div class="d-flex flex-column share-container">
+        <div class="d-flex flex-column flex-grow-mobile">
           <SharePlayer
             v-if="isSharePlayer && (authenticated || notExclusive)"
             :emission="emission"
@@ -90,21 +89,10 @@
         @fetch="fetch"
       />
     </div>
-    <div
-      v-if="!loaded"
-      class="d-flex justify-content-center"
-    >
-      <div class="spinner-border me-3" />
-      <h3 class="mt-2">
-        {{ $t('Loading content ...') }}
-      </h3>
-    </div>
-    <div
-      v-if="error"
-      class="text-center"
-    >
-      <h3>{{ $t("Emission doesn't exist") }}</h3>
-    </div>
+    <ClassicLoading
+      :loading-text="!loaded?$t('Loading content ...'):undefined"
+      :error-text="error?$t(`Emission doesn't exist`):undefined"
+    />
   </div>
 </template>
 
@@ -112,8 +100,8 @@
 import octopusApi from '@saooti/octopus-api';
 import { state } from '../../store/paramStore';
 import { displayMethods } from '../mixins/functions';
-import { Emission } from '@/store/class/emission';
-
+import { Emission } from '@/store/class/general/emission';
+import ClassicLoading from '../form/ClassicLoading.vue';
 import { defineComponent, defineAsyncComponent } from 'vue';
 const PodcastFilterList = defineAsyncComponent(() => import('../display/podcasts/PodcastFilterList.vue'));
 const SharePlayer = defineAsyncComponent(() => import('../display/sharing/SharePlayer.vue'));
@@ -133,6 +121,7 @@ export default defineComponent({
     PodcastList,
     SubscribeButtons,
     LiveHorizontalList,
+    ClassicLoading
   },
   mixins: [displayMethods],
   props: {
@@ -203,8 +192,9 @@ export default defineComponent({
       if (
         (this.authenticated && this.emission && this.organisationId === this.emission.orga.id) ||
         state.generalParameters.isAdmin
-      )
+      ){
         return true;
+      }
       return false;
     },
     countLink(): number {
@@ -272,6 +262,4 @@ export default defineComponent({
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Emissions.vue

@@ -1,10 +1,12 @@
 <template>
   <div class="page-box">
-    <h1 v-if="undefined === titlePage">
-      {{ $t('All emissions') }}
-    </h1>
-    <h1 v-else>
-      {{ titlePage }}
+    <h1>
+      <template v-if="undefined === titlePage">
+        {{ $t('All emissions') }}
+      </template>
+      <template v-else>
+        {{ titlePage }}
+      </template>
     </h1>
     <ProductorSearch
       v-if="isProductorSearch"
@@ -53,9 +55,8 @@
 import EmissionList from '../display/emission/EmissionList.vue';
 import AdvancedSearch from '../display/filter/AdvancedSearch.vue';
 import { state } from '../../store/paramStore';
-
-import { Category } from '@/store/class/category';
-import { RubriquageFilter } from '@/store/class/rubriquageFilter';
+import { Category } from '@/store/class/general/category';
+import { RubriquageFilter } from '@/store/class/rubrique/rubriquageFilter';
 import { defineComponent, defineAsyncComponent } from 'vue';
 const ProductorSearch = defineAsyncComponent(() => import('../display/filter/ProductorSearch.vue'));
 export default defineComponent({
@@ -65,8 +66,6 @@ export default defineComponent({
     AdvancedSearch,
   },
   props: {
-    firstRoute: { default: 0, type: Number},
-    sizeRoute: { default: 12, type: Number},
     productor: { default: undefined, type: String},
     isEducation: { default: false, type: Boolean},
   },
@@ -110,12 +109,6 @@ export default defineComponent({
   },
 
   created() {
-    if (this.firstRoute) {
-      this.first = this.firstRoute;
-    }
-    if (this.sizeRoute) {
-      this.size = this.sizeRoute;
-    }
     if(this.categoryFilter){
       this.iabId = this.categoryFilter.id;
     }
@@ -182,6 +175,4 @@ export default defineComponent({
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Home.vue

@@ -39,11 +39,11 @@
 import PodcastInlineList from '../display/podcasts/PodcastInlineList.vue';
 import { state } from '../../store/paramStore';
 
-import { RubriquageFilter } from '@/store/class/rubriquageFilter';
-import { Rubriquage } from '@/store/class/rubriquage';
-import { Rubrique } from '@/store/class/rubrique';
+import { RubriquageFilter } from '@/store/class/rubrique/rubriquageFilter';
+import { Rubriquage } from '@/store/class/rubrique/rubriquage';
+import { Rubrique } from '@/store/class/rubrique/rubrique';
 import { defineComponent } from 'vue'
-import { Category } from '@/store/class/category';
+import { Category } from '@/store/class/general/category';
 export default defineComponent({
   name: 'Home',
 
@@ -107,6 +107,4 @@ export default defineComponent({
     },
   }
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Lives.vue

@@ -35,9 +35,9 @@
 <script lang="ts">
 import { state } from '../../store/paramStore';
 
-import { Organisation } from '@/store/class/organisation';
+import { Organisation } from '@/store/class/general/organisation';
 import { defineComponent, defineAsyncComponent } from 'vue';
-import { Conference } from '@/store/class/conference';
+import { Conference } from '@/store/class/conference/conference';
 const LiveList = defineAsyncComponent(() => import('../display/live/LiveList.vue'));
 const OrganisationChooser = defineAsyncComponent(() => import('../display/organisation/OrganisationChooser.vue'));
 export default defineComponent({
@@ -99,6 +99,4 @@ export default defineComponent({
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Participant.vue

@@ -1,17 +1,18 @@
 <template>
-  <div>
+  <div class="page-box">
     <div
       v-if="loaded && !error"
-      class="page-box intervenant-page"
     >
-      <h1 v-if="undefined === titlePage ||!lightStyle">
-        {{ $t('Animator') }}
-      </h1>
-      <h1 v-else>
-        {{ titlePage }}
+      <h1>
+        <template v-if="undefined === titlePage ||!lightStyle">
+          {{ $t('Animator') }}
+        </template>
+        <template v-else>
+          {{ titlePage }}
+        </template>
       </h1>
       <div
-        class="d-flex w-100 flex-column align-items-center justify-content-center"
+        class="d-flex flex-column align-items-center"
       >
         <div
           class="img-box-circle mb-3"
@@ -24,7 +25,7 @@
         </h2>
         <!-- eslint-disable vue/no-v-html -->
         <div
-          class="h6 participant-desc html-wysiwyg-content"
+          class="participant-desc html-wysiwyg-content"
           v-html="urlify(description)"
         />
         <!-- eslint-enable -->
@@ -71,21 +72,10 @@
         :reload="reload"
       />
     </div>
-    <div
-      v-if="!loaded"
-      class="d-flex justify-content-center"
-    >
-      <div class="spinner-border me-3" />
-      <h3 class="mt-2">
-        {{ $t('Loading content ...') }}
-      </h3>
-    </div>
-    <div
-      v-if="error"
-      class="text-center"
-    >
-      <h3>{{ $t("Animator doesn't exist") }}</h3>
-    </div>
+    <ClassicLoading
+      :loading-text="!loaded?$t('Loading content ...'):undefined"
+      :error-text="error?$t(`Animator doesn't exist`):undefined"
+    />
   </div>
 </template>
 
@@ -93,8 +83,8 @@
 import octopusApi from '@saooti/octopus-api';
 import { state } from '../../store/paramStore';
 import { displayMethods } from '../mixins/functions';
-import { Participant } from '@/store/class/participant';
-
+import { Participant } from '@/store/class/general/participant';
+import ClassicLoading from '../form/ClassicLoading.vue';
 import { defineComponent, defineAsyncComponent } from 'vue';
 const ShareButtons = defineAsyncComponent(() => import('../display/sharing/ShareButtons.vue'));
 const PodcastFilterList = defineAsyncComponent(() => import('../display/podcasts/PodcastFilterList.vue'));
@@ -106,6 +96,7 @@ export default defineComponent({
     PodcastFilterList,
     EditBox,
     PodcastList,
+    ClassicLoading
   },
   mixins: [displayMethods],
   props: {
@@ -165,8 +156,9 @@ export default defineComponent({
         (this.authenticated &&
           this.organisationId === this.participant.orga.id) ||
         state.generalParameters.isAdmin
-      )
+      ){
         return true;
+      }
       return false;
     },
   },

package/src/components/pages/Participants.vue

@@ -1,10 +1,12 @@
 <template>
   <div class="page-box">
     <h1 v-if="undefined === titlePage">
-      {{ $t('All participants') }}
-    </h1>
-    <h1 v-else>
-      {{ titlePage }}
+      <template v-if="undefined === titlePage">
+        {{ $t('All participants') }}
+      </template>
+      <template v-else>
+        {{ titlePage }}
+      </template>
     </h1>
     <ProductorSearch
       :organisation-id="organisationId"
@@ -34,8 +36,6 @@ export default defineComponent({
     ParticipantList,
   },
   props: {
-    firstRoute: { default: 0, type: Number},
-    sizeRoute: { default: 12, type: Number},
     productor: { default: undefined, type: String},
   },
 
@@ -55,12 +55,6 @@ export default defineComponent({
   },
 
   created() {
-    if (this.firstRoute) {
-      this.first = this.firstRoute;
-    }
-    if (this.sizeRoute) {
-      this.size = this.sizeRoute;
-    }
     if (this.productor) {
       this.organisationId = this.productor;
     } else if (this.$store.state.filter.organisationId) {
@@ -77,6 +71,4 @@ export default defineComponent({
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Playlist.vue

@@ -1,16 +1,15 @@
 <template>
-  <div>
+  <div class="page-box">
     <div
       v-if="loaded && !error"
-      class="page-box"
     >
       <h1>{{ $t('Playlist') }}</h1>
       <div class="d-flex">
-        <div class="d-flex flex-column flex-grow">
+        <div class="d-flex flex-column flex-grow-1">
           <EditBox
             v-if="editRight && isEditBox"
             :playlist="playlist"
-            :is-ready="isReady"
+            :is-ready="true"
           />
           <div class="module-box">
             <h2>{{ name }}</h2>
@@ -29,7 +28,7 @@
             </div>
           </div>
         </div>
-        <div class="d-flex flex-column share-container">
+        <div class="d-flex flex-column flex-grow-mobile">
           <SharePlayer
             v-if="isSharePlayer && authenticated"
             :playlist="playlist"
@@ -41,30 +40,20 @@
       </div>
       <PodcastList :playlist="playlist" />
     </div>
-    <div
-      v-if="!loaded"
-      class="d-flex justify-content-center"
-    >
-      <div class="spinner-border me-3" />
-      <h3 class="mt-2">
-        {{ $t('Loading content ...') }}
-      </h3>
-    </div>
-    <div
-      v-if="error"
-      class="text-center"
-    >
-      <h3>{{ $t("Playlist doesn't exist") }}</h3>
-    </div>
+    <ClassicLoading
+      :loading-text="!loaded?$t('Loading content ...'):undefined"
+      :error-text="error?$t(`Playlist doesn't exist`):undefined"
+    />
   </div>
 </template>
 
 <script lang="ts">
+import ClassicLoading from '../form/ClassicLoading.vue';
 import PodcastList from '../display/playlist/PodcastList.vue';
 import octopusApi from '@saooti/octopus-api';
 import { state } from '../../store/paramStore';
 import { displayMethods } from '../mixins/functions';
-import { Playlist } from '@/store/class/playlist';
+import { Playlist } from '@/store/class/general/playlist';
 import { defineComponent, defineAsyncComponent } from 'vue';
 const ShareButtons = defineAsyncComponent(() => import('../display/sharing/ShareButtons.vue'));
 const EditBox = defineAsyncComponent(() => import('@/components/display/edit/EditBox.vue'));
@@ -75,6 +64,7 @@ export default defineComponent({
     EditBox,
     PodcastList,
     SharePlayer,
+    ClassicLoading
   },
   mixins:[displayMethods],
   props: {
@@ -88,7 +78,6 @@ export default defineComponent({
       loaded: false as boolean,
       playlist: undefined as Playlist | undefined,
       error: false as boolean,
-      isReady: true as boolean,
     };
   },
   
@@ -123,15 +112,14 @@ export default defineComponent({
         (state.generalParameters.isPlaylist && this.playlist &&
           this.organisationId === this.playlist.organisation.id) ||
         state.generalParameters.isAdmin
-      )
+      ){
         return true;
+      }
       return false;
     },
   },
   watch: {
     playlistId() {
-      this.loaded = false;
-      this.error = false;
       this.getPlaylistDetails();
     },
   },
@@ -142,17 +130,16 @@ export default defineComponent({
   methods: {
     async getPlaylistDetails(): Promise<void> {
       try {
+        this.loaded = false;
+        this.error = false;
         const data: Playlist = await octopusApi.fetchPlaylist(this.playlistId ? this.playlistId.toString(): "");
         this.playlist = data;
         this.$emit('playlistTitle', this.playlist.title);
-        this.loaded = true;
       } catch {
         this.error = true;
-        this.loaded = true;
       }
+      this.loaded = true;
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Playlists.vue

@@ -39,8 +39,6 @@ export default defineComponent({
     PlaylistList,
   },
   props: {
-    firstRoute: { default: 0, type: Number},
-    sizeRoute: { default: 12, type: Number},
     productor: { default: undefined, type: String},
   },
 
@@ -67,12 +65,6 @@ export default defineComponent({
   },
 
   created() {
-    if (this.firstRoute) {
-      this.first = this.firstRoute;
-    }
-    if (this.sizeRoute) {
-      this.size = this.sizeRoute;
-    }
     if (this.productor) {
       this.organisationId = this.productor;
     } else if (this.$store.state.filter.organisationId) {
@@ -88,6 +80,4 @@ export default defineComponent({
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>

package/src/components/pages/Podcast.vue

@@ -1,9 +1,6 @@
 <template>
-  <div>
-    <div
-      v-if="loaded && !error"
-      class="page-box"
-    >
+  <div class="page-box">
+    <template v-if="loaded && !error">
       <h1 v-if="!isOuestFrance">
         {{ titlePage }}
       </h1>
@@ -20,7 +17,7 @@
                 !isNotRecorded &&
                 isOctopusAndAnimator
             "
-            class="module-box text-center-mobile flex-no-grow"
+            class="module-box text-center-mobile flex-grow-0"
             :podcast="podcast"
             :live="true"
             :recording="fetchConference"
@@ -30,7 +27,7 @@
           <EditBox
             v-else-if="editRight && isEditBox"
             :podcast="podcast"
-            :is-ready="isReady"
+            :is-ready="true"
             @validatePodcast="updatePodcast"
           />
           <PodcastModuleBox
@@ -44,8 +41,8 @@
           />
         </div>
         <div
-          class="d-flex flex-column share-container"
-          :class="authenticated || notExclusive ? 'flex-grow' : ''"
+          class="d-flex flex-column flex-grow-mobile"
+          :class="authenticated || notExclusive ? 'flex-grow-1' : ''"
         >
           <SharePlayer
             v-if="isSharePlayer && (authenticated || notExclusive)"
@@ -85,39 +82,29 @@
           :button-text="$t('All podcast button', { name: c.name })"
         />
       </template>
-    </div>
-    <div
-      v-if="!loaded"
-      class="d-flex justify-content-center"
-    >
-      <div class="spinner-border me-3" />
-      <h3 class="mt-2">
-        {{ $t('Loading content ...') }}
-      </h3>
-    </div>
-    <div
-      v-if="error"
-      class="text-center"
-    >
-      <h3>{{ $t("Podcast doesn't exist") }}</h3>
-    </div>
+    </template>
+    <ClassicLoading
+      :loading-text="!loaded?$t('Loading content ...'):undefined"
+      :error-text="error?$t(`Podcast doesn't exist`):undefined"
+    />
   </div>
 </template>
 
 <script lang="ts">
 import PodcastInlineList from '../display/podcasts/PodcastInlineList.vue';
 import PodcastModuleBox from '../display/podcasts/PodcastModuleBox.vue';
+import ClassicLoading from '../form/ClassicLoading.vue';
 import octopusApi from '@saooti/octopus-api';
 import studioApi from '@/api/studio';
 import { state } from '../../store/paramStore';
 import moment from 'moment';
-import { Podcast } from '@/store/class/podcast';
-import { Conference } from '@/store/class/conference';
+import { Podcast } from '@/store/class/general/podcast';
+import { Conference } from '@/store/class/conference/conference';
 
 import { defineComponent, defineAsyncComponent } from 'vue';
 import CommentSectionVue from '../display/comments/CommentSection.vue';
-import { CommentPodcast } from '@/store/class/comment';
-import { Category } from '@/store/class/category';
+import { CommentPodcast } from '@/store/class/general/comment';
+import { Category } from '@/store/class/general/category';
 const ShareButtons = defineAsyncComponent(() => import('../display/sharing/ShareButtons.vue'));
 const SharePlayer = defineAsyncComponent(() => import('../display/sharing/SharePlayer.vue'));
 const EditBox = defineAsyncComponent(() => import('@/components/display/edit/EditBox.vue'));
@@ -136,7 +123,8 @@ export default defineComponent({
     RecordingItemButton,
     Countdown,
     CommentSection,
-    PodcastModuleBox
+    PodcastModuleBox,
+    ClassicLoading
   },
 
   props: {
@@ -219,13 +207,11 @@ export default defineComponent({
         (this.authenticated &&
           this.organisationId === this.podcast.organisation.id) ||
         state.generalParameters.isAdmin
-      )
+      ){
         return true;
+      }
       return false;
     },
-    isReady(): boolean {
-      return true;
-    },
     countLink(): number {
       let count = 0;
       if (this.podcast && this.podcast.emission && this.podcast.emission.annotations) {

package/src/components/pages/Podcasts.vue

@@ -6,17 +6,13 @@
         isEmissionChooser ? 'justify-content-between' : 'justify-content-center'
       "
     >
-      <h1
-        v-if="undefined === titlePage"
-        class="flex-shrink"
-      >
-        {{ $t('All podcasts') }}
-      </h1>
-      <h1
-        v-else
-        class="flex-shrink"
-      >
-        {{ titlePage }}
+      <h1 class="flex-shrink-0">
+        <template v-if="undefined === titlePage">
+          {{ $t('All podcasts') }}
+        </template>
+        <template v-else>
+          {{ titlePage }}
+        </template>
       </h1>
       <EmissionChooser
         v-if="isEmissionChooser"
@@ -75,9 +71,9 @@ import PodcastList from '../display/podcasts/PodcastList.vue';
 import { state } from '../../store/paramStore';
 import ProductorSearch from '../display/filter/ProductorSearch.vue';
 import AdvancedSearch from '../display/filter/AdvancedSearch.vue';
-import { Emission } from '@/store/class/emission';
-import { Category } from '@/store/class/category';
-import { RubriquageFilter } from '@/store/class/rubriquageFilter';
+import { Emission } from '@/store/class/general/emission';
+import { Category } from '@/store/class/general/category';
+import { RubriquageFilter } from '@/store/class/rubrique/rubriquageFilter';
 
 import { defineComponent, defineAsyncComponent } from 'vue';
 const EmissionChooser = defineAsyncComponent(() => import('../display/emission/EmissionChooser.vue'));
@@ -92,8 +88,6 @@ export default defineComponent({
   },
 
   props: {
-    firstRoute: { default: 0, type: Number},
-    sizeRoute: { default: 12, type: Number},
     productor: { default: undefined, type: String},
     isEducation: { default: false, type: Boolean},
   },
@@ -101,7 +95,7 @@ export default defineComponent({
   data() {
     return {
       first: 0 as number,
-      size: 49 as number,
+      size: 12 as number,
       searchPattern: '' as string,
       organisationId: undefined as string|undefined,
       monetization: 'UNDEFINED' as string, // UNDEFINED, YES, NO
@@ -160,12 +154,6 @@ export default defineComponent({
   },
 
   created() {
-    if (this.firstRoute) {
-      this.first = this.firstRoute;
-    }
-    if (this.sizeRoute) {
-      this.size = this.sizeRoute;
-    }
     if (this.productor) {
       this.organisationId = this.productor;
     } else if (this.$store.state.filter.organisationId) {
@@ -247,6 +235,4 @@ export default defineComponent({
     },
   },
 })
-</script>
-
-<style lang="scss"></style>
+</script>