@saooti/octopus-sdk 31.0.23 → 31.0.26

package/README.md

@@ -573,7 +573,14 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
  * 30.0.74 Error locales en allemand (je sens que ça va être fun cette histoire)
  * 30.0.75 Parlement
  * 30.0.76 Space
-
+ * 30.0.77 V-Calendar bloque version
+ * 30.0.78 a -> word-break
+ * 30.0.79 DownloadId player
+ * 30.0.80 DownloadId player
+ * 30.0.81 DownloadId player
+ * 30.0.82 Cherry pick Color Qr code
+ * 30.0.83 Locales parlement
+ * 30.0.84 Une émission non visible n'apparaît pas dans la page émission
 
  * 31.0.0 Passage en 31
  * 31.0.1 Ajout pocket casts
@@ -599,3 +606,7 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
  * 31.0.21 Player mobile
  * 31.0.22 Merge 30
  * 31.0.23 Qr Code option noir
+ * 31.0.24 Amélioration accessibilité
+ * 31.0.25 Erreur audioUrl
+ * 31.0.26 Erreur 403 page expose 
+

package/index.ts

@@ -12,6 +12,7 @@ import Search from "./src/components/pages/Search.vue";
 import Home from "./src/components/pages/Home.vue";
 import Category from "./src/components/pages/Category.vue";
 import Rubrique from "./src/components/pages/Rubrique.vue";
+import Error403Page from "./src/components/pages/Error403Page.vue";
 //Misc
 import Footer from "./src/components/misc/Footer.vue";
 import LeftMenu from "./src/components/misc/LeftMenu.vue";
@@ -116,7 +117,8 @@ const components = {
     ClassicLoading,
     AdvancedSearch,
     PodcastPlaylistInlineList,
-    ClassicSelect
+    ClassicSelect,
+    Error403Page
 }
 
 export default components;
@@ -171,5 +173,6 @@ export {
     ClassicLoading,
     AdvancedSearch,
     PodcastPlaylistInlineList,
-    ClassicSelect
+    ClassicSelect,
+    Error403Page
 };

package/package.json

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

package/src/assets/live.scss

@@ -1,39 +1,39 @@
   .planned-bg {
-    background: #f09653;
+    background: rgb(188, 88, 16);
   }
   .pending-bg {
-    background: #f1643e;
+    background: rgb(216, 58, 14);
   }
   .recording-bg {
-    background: #f34a4a;
+    background: rgb(233, 12, 12);
   }
   .error-bg {
-    background: #ff0000;
+    background: rgb(173, 0, 0);
   }
   .debriefing-bg {
-    background: #6ec66e;
+    background: rgb(54, 134, 54);
   }
   .done-bg {
-    background: #679fe9;
+    background: rgb(42, 117, 218);
   }
   .publishing-bg {
-    background: #7d7d7d;
+    background: rgb(112, 112, 112);
   }
   .planned-shadow {
-    box-shadow: 0px 12px 48px 6px rgba(240, 151, 83, 0.2);
+    box-shadow: 0px 12px 48px 6px rgba(188, 88, 16, 0.2);
   }
   .pending-shadow {
-    box-shadow: 0px 12px 48px 6px rgba(241, 101, 62, 0.2);
+    box-shadow: 0px 12px 48px 6px rgba(216, 58, 14, 0.2);
   }
   .recording-shadow {
-    box-shadow: 0px 12px 48px 6px rgba(243, 74, 74, 0.2);
+    box-shadow: 0px 12px 48px 6px rgba(233, 12, 12, 0.2);
   }
   .debriefing-shadow {
-    box-shadow: 0px 12px 48px 6px rgba(110, 198, 110, 0.2);
+    box-shadow: 0px 12px 48px 6px rgba(54, 134, 54, 0.2);
   }
   .publishing-shadow {
-    box-shadow: 0px 12px 48px 6px rgba(125, 125, 125, 0.2);
+    box-shadow: 0px 12px 48px 6px rgba(112, 112, 112, 0.2);
   }
   .error-shadow {
-    box-shadow: 0px 12px 48px 6px rgba(255, 0, 0, 0.2);
+    box-shadow: 0px 12px 48px 6px rgba(173, 0, 0, 0.2);
   }

package/src/assets/multiselect.scss

@@ -315,7 +315,7 @@
     }
 
     .multiselect__placeholder {
-        color: #adadad;
+        color: #757575;
         display: inline-block;
         margin-bottom: 10px;
         padding-top: 2px;

package/src/components/display/categories/CategoryChooser.vue

@@ -15,6 +15,7 @@
       :disabled="isDisabled"
       label="name"
       track-by="id"
+      :aria-expanded="false"
       :placeholder="$t('Type string to filter by categories')"
       :options="categories"
       :multiple="multiple"

package/src/components/display/categories/CategoryList.vue

@@ -4,12 +4,12 @@
     class="d-inline-flex w-100 mb-3 ps-3 pe-3 hide-phone category-list"
   >
     <div
-      id="category-list-container"
+      ref="categoryListContainer"
       class="category-list-container"
     >
       <button
         v-for="category in categories"
-        :id="'category' + category.id"
+        :ref="'category' + category.id"
         :key="category.id"
         class="category-item text-dark bg-white"
         @click="checkIfFilter(category)"
@@ -144,14 +144,14 @@ export default defineComponent({
       this.$store.commit('filterIab',category);
     },
     resizeWindow(): void {
-      const categoryList = document.getElementById('category-list-container');
-      if(null === categoryList){
+      const categoryList = (this.$refs.categoryListContainer as HTMLElement);
+      if(null === categoryList ||!categoryList){
         return;
       }
       categoryList.style.justifyContent = 'flex-start';
       this.hidenCategories.length = 0;
       this.categories.forEach((element: Category) => {
-        const el = document.getElementById('category' + element.id);
+        const el = (this.$refs['category' + element.id] as Array<HTMLElement>)[0];
         if (!el) return;
         const parent = el.parentElement;
         if (parent && el.offsetLeft + el.clientWidth <= parent.clientWidth - 20) {

package/src/components/display/comments/CommentBasicView.vue

@@ -7,6 +7,7 @@
       >{{ $t('Live') }}</b>
       <b
         :id="'popover-comment' + comment.comId"
+        role="button"
         tabindex="-1"
         :class="editRight || isValid? '':'text-danger'"
         class="me-2"

package/src/components/display/emission/EmissionChooser.vue

@@ -14,6 +14,7 @@
       v-model="emission"
       label="name"
       track-by="emissionId"
+      :aria-expanded="false"
       :placeholder="$t('Type string to filter by emission')"
       :options="emissions"
       :multiple="false"

package/src/components/display/emission/EmissionItem.vue

@@ -14,6 +14,7 @@
       <img
         v-lazy="emission.imageUrl"
         class="img-box"
+        :title="$t('Emission name image', {name:emission.name})"
       >
       <div class="emission-item-text">
         <div
@@ -27,12 +28,12 @@
           >{{ emission.name }}
         </div>
         <div
-          :id="'description-emission-container-' + emission.emissionId"
+          ref="descriptionEmissionContainer"
           class="emission-description htms-wysiwyg-content"
         >
           <!-- eslint-disable vue/no-v-html -->
           <div
-            :id="'description-emission-' + emission.emissionId"
+            ref="descriptionEmission"
             v-html="urlify(emission.description|| '')"
           />
         <!-- eslint-enable -->
@@ -107,12 +108,8 @@ export default defineComponent({
     this.hasPodcast();
   },
   mounted() {
-    const emissionDesc = document.getElementById(
-      'description-emission-' + this.emission.emissionId
-    );
-    const emissionDescContainer = document.getElementById(
-      'description-emission-container-' + this.emission.emissionId
-    );
+    const emissionDesc = (this.$refs.descriptionEmission as HTMLElement);
+    const emissionDescContainer = (this.$refs.descriptionEmissionContainer as HTMLElement);
     if (
       null !== emissionDesc && null !== emissionDescContainer && 
       emissionDesc.clientHeight > emissionDescContainer.clientHeight

package/src/components/display/emission/EmissionPlayerItem.vue

@@ -21,6 +21,7 @@
       >
         <img
           v-lazy="emission.imageUrl"
+          :title="$t('Emission name image', {name:emission.name})"
           class="img-box rounded-0"
         >
         <div
@@ -35,12 +36,12 @@
           {{ emission.name }}
         </div>
         <div
-          :id="'description-emission-container-' + emission.emissionId"
+          ref="descriptionEmissionContainer"
           class="emission-description html-wysiwyg-content"
         >
           <!-- eslint-disable vue/no-v-html -->
           <div
-            :id="'description-emission-' + emission.emissionId"
+            ref="descriptionEmission"
             v-html="urlify(emission.description)"
           />
           <!-- eslint-enable -->
@@ -78,12 +79,12 @@
               {{ p.title }}
             </div>
             <div
-              :id="'description-podcast-container-' + p.podcastId"
+              :ref="'descriptionPodcastContainer'+ p.podcastId"
               class="emission-description html-wysiwyg-content"
             >
               <!-- eslint-disable vue/no-v-html -->
               <div
-                :id="'description-podcast-' + p.podcastId"
+                :ref="'descriptionPodcast'+ p.podcastId"
                 v-html="urlify(p.description)"
               />
               <!-- eslint-enable -->
@@ -194,12 +195,8 @@ export default defineComponent({
     this.loadPodcasts();
   },
   mounted() {
-    const emissionDesc = document.getElementById(
-      'description-emission-' + this.emission.emissionId
-    );
-    const emissionDescContainer = document.getElementById(
-      'description-emission-container-' + this.emission.emissionId
-    );
+    const emissionDesc = (this.$refs.descriptionEmission as HTMLElement);
+    const emissionDescContainer = (this.$refs.descriptionEmissionContainer as HTMLElement);
     if (
       null !== emissionDesc && null !== emissionDescContainer &&
       emissionDesc.clientHeight > emissionDescContainer.clientHeight
@@ -220,12 +217,8 @@ export default defineComponent({
       this.podcasts = data.result;
       this.$nextTick(() => {
       for (let index = 0, len = this.podcasts.length; index < len; index++) {
-        const podcastDesc = document.getElementById(
-          'description-podcast-' + this.podcasts[index].podcastId
-        );
-        const podcastDescContainer = document.getElementById(
-          'description-podcast-container-' + this.podcasts[index].podcastId
-        );
+        const podcastDesc = (this.$refs['descriptionPodcast'+this.podcasts[index].podcastId] as Array<HTMLElement>)[0];
+        const podcastDescContainer = (this.$refs['descriptionPodcastContainer'+this.podcasts[index].podcastId] as Array<HTMLElement>)[0];
         if (
           null !== podcastDesc && null !== podcastDescContainer &&
           podcastDesc.clientHeight > podcastDescContainer.clientHeight

package/src/components/display/filter/AdvancedSearch.vue

@@ -172,10 +172,10 @@ export default defineComponent({
       isTo: false as boolean,
       fromDate: moment().subtract(10, 'days').toISOString() as string,
       toDate: moment().toISOString() as string,
-      isNotVisible: false as boolean,
+      isNotVisible: this.includeHidden as boolean,
       isNotValidate: false as boolean,
       showFilters: false as boolean,
-      sort: '' as string,
+      sort: this.sortCriteria as string,
     };
   },
 
@@ -268,16 +268,6 @@ export default defineComponent({
       this.sort = this.sortCriteria;
     },
   },
-
-  created() {
-    if (!this.isEmission) {
-      this.isNotVisible = this.includeHidden;
-    }
-  },
-
-  mounted() {
-    this.sort = this.sortCriteria;
-  },
   methods: {
     updateFromDate(): void {
       if (

package/src/components/display/filter/ProductorSearch.vue

@@ -13,6 +13,8 @@
         v-if="!!organisationId"
         v-model:textInit="keepOrganisation"
         class="m-3"
+        :label="$t('check this box if you want to keep this filter for the rest of your visit')"
+        :display-label="false"
         id-checkbox="organisation-checkbox"
         @clickAction="onKeepOrganisation"
       />
@@ -136,9 +138,6 @@ export default defineComponent({
     async onKeepOrganisation(): Promise<void> {
       if(!this.organisationId){return}
       if (!this.keepOrganisation) {
-        if (this.$route.query.productor !== this.organisationId) {
-          this.$router.push({ query: { productor: this.organisationId } });
-        }
         await this.selectOrganisation(this.organisationId);
         return;
       }

package/src/components/display/live/LiveItem.vue

@@ -66,12 +66,12 @@
         {{ live.emission.name }}
       </router-link>
       <div
-        :id="'description-live-container-' + live.podcastId"
+        ref="descriptionLiveContainer"
         class="live-description-container html-wysiwyg-content"
       >
         <!-- eslint-disable vue/no-v-html -->
         <div
-          :id="'description-live-' + live.podcastId"
+          ref="descriptionLive"
           v-html="urlify(description)"
         />
         <!-- eslint-enable -->
@@ -251,12 +251,8 @@ export default defineComponent({
         if(!this.live){
           return;
         }
-        const liveDesc = document.getElementById(
-          'description-live-' + this.live.podcastId
-        );
-        const liveDescContainer = document.getElementById(
-          'description-live-container-' + this.live.podcastId
-        );
+        const liveDesc = (this.$refs.descriptionLive as HTMLElement);
+        const liveDescContainer = (this.$refs.descriptionLiveContainer as HTMLElement);
         if (
           null !== liveDesc && null !== liveDescContainer && 
           liveDesc.clientHeight > liveDescContainer.clientHeight

package/src/components/display/organisation/OrganisationChooser.vue

@@ -15,6 +15,7 @@
       v-model="organisation"
       label="name"
       track-by="id"
+      :aria-expanded="false"
       :placeholder="$t('Type string to filter by organisation')"
       :options="organisations"
       :multiple="false"

package/src/components/display/organisation/OrganisationChooserLight.vue

@@ -4,29 +4,24 @@
     class="default-multiselect-width organisation-chooser-light"
     :style="{ width: width }"
   >
-    <template v-if="!privateOrganisation">
-      <select
-        :id="'organisation_chooser_light' + page"
-        v-model="actual"
-        class="mb-0 c-hand border-0"
-        @change="onOrganisationSelected"
-      >
-        <option :value="organisation.id">
-          {{ organisation.name }}
-        </option>
-        <option :value="-1">
-          {{ $t('No organisation filter') }}
-        </option>
-      </select>
-      <label
-        :for="'organisation_chooser_light' + page"
-        class="d-inline"
-        :title="$t('select productor')"
-      />
-    </template>
-    <template v-else>
-      {{ organisation.name }}
-    </template>
+    <select
+      :id="'organisation_chooser_light' + page"
+      v-model="actual"
+      class="mb-0 c-hand border-0"
+      @change="onOrganisationSelected"
+    >
+      <option :value="organisation.id">
+        {{ organisation.name }}
+      </option>
+      <option :value="-1">
+        {{ $t('No organisation filter') }}
+      </option>
+    </select>
+    <label
+      :for="'organisation_chooser_light' + page"
+      class="d-inline"
+      :title="$t('select productor')"
+    />
   </div>
 </template>
 
@@ -48,7 +43,6 @@ export default defineComponent({
       actual: -1 as number|string,
       organisation: undefined as Organisation|undefined,
       init: false as boolean,
-      privateOrganisation: false as boolean
     };
   },
 
@@ -82,7 +76,6 @@ export default defineComponent({
       const data = await octopusApi.fetchOrganisation(this.value);
       this.organisation = data;
       this.actual = data.id;
-      this.privateOrganisation = "PUBLIC"!==data.privacy;
       this.init = true;
     },
   },

package/src/components/display/participant/ParticipantItem.vue

@@ -14,6 +14,7 @@
     >
       <img
         v-lazy="participant.imageUrl"
+        :title="$t('Animator image')"
         class="img-box-circle"
       >
       <div class="participant-name">
@@ -25,12 +26,12 @@
         >{{ name }}
       </div>
       <div
-        :id="'description-participant-container-' + participant.participantId"
+        ref="descriptionParticipantContainer"
         class="participant-description html-wysiwyg-content"
       >
         <!-- eslint-disable vue/no-v-html -->
         <div
-          :id="'description-participant-' + participant.participantId"
+          ref="descriptionParticipant"
           v-html="urlify(participant.description|| '')"
         />
         <!-- eslint-enable -->
@@ -106,12 +107,8 @@ export default defineComponent({
     this.hasPodcast();
   },
   mounted() {
-    const participantDesc = document.getElementById(
-      'description-participant-' + this.participant.participantId
-    );
-    const participantDescContainer = document.getElementById(
-      'description-participant-container-' + this.participant.participantId
-    );
+    const participantDesc = (this.$refs.descriptionParticipant as HTMLElement);
+    const participantDescContainer = (this.$refs.descriptionParticipantContainer as HTMLElement);
     if (
       null !== participantDesc && null !==participantDescContainer && 
       participantDesc.clientHeight > participantDescContainer.clientHeight

package/src/components/display/playlist/PlaylistItem.vue

@@ -14,6 +14,7 @@
     >
       <img
         v-lazy="playlist.imageUrl"
+        :title="$t('Playlist name image', {name:name})"
         class="img-box"
       >
     </router-link>
@@ -35,12 +36,12 @@
           >{{ name }}
         </div>
         <div
-          :id="'description-playlist-container-' + playlist.playlistId"
+          ref="descriptionPlaylistContainer"
           class="emission-description html-wysiwyg-content"
         >
           <!-- eslint-disable vue/no-v-html -->
           <div
-            :id="'description-playlist-' + playlist.playlistId"
+            ref="descriptionPlaylist"
             v-html="urlify(description)"
           />
           <!-- eslint-enable -->
@@ -119,12 +120,8 @@ export default defineComponent({
 
 
   mounted() {
-    const playlistDesc = document.getElementById(
-      'description-playlist-' + this.playlist.playlistId
-    );
-    const playlistDescContainer = document.getElementById(
-      'description-playlist-container-' + this.playlist.playlistId
-    );
+    const playlistDesc = (this.$refs.descriptionPlaylist as HTMLElement);
+    const playlistDescContainer = (this.$refs.descriptionPlaylistContainer as HTMLElement);
     if (
       null !== playlistDesc && null !== playlistDescContainer &&
       playlistDesc.clientHeight > playlistDescContainer.clientHeight

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

@@ -6,6 +6,7 @@
     {{ title }}
     <span
       :id="idPopover"
+      role="button"
       tabindex="-1"
       class="saooti-help m-0"
       :title="title"

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

@@ -6,6 +6,7 @@
     <img
       v-lazy="podcast.imageUrl"
       class="img-box"
+      :alt="$t('Episode name image', {name:podcast.title})"
     >
     <template v-if="isPodcastmaker">
       <div

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

@@ -17,7 +17,7 @@
       @showDescription="showDescription"
     />
     <div
-      :id="'description-podcast-container-' + podcast.podcastId"
+      ref="descriptionPodcastContainer"
       class="description-podcast-item html-wysiwyg-content"
       :class="[
         hover && ''!==description ? 'visible' : 'invisible',
@@ -26,7 +26,7 @@
     >
       <!-- eslint-disable vue/no-v-html -->
       <div
-        :id="'description-podcast-' + podcast.podcastId"
+        ref="descriptionPodcast"
         v-html="description"
       />
     <!-- eslint-enable -->
@@ -89,13 +89,9 @@ export default defineComponent({
     },
   },
 
-  created() {
-    const podcastDesc = document.getElementById(
-      'description-podcast-' + this.podcast.podcastId
-    );
-    const podcastDescContainer = document.getElementById(
-      'description-podcast-container-' + this.podcast.podcastId
-    );
+  mounted() {
+    const podcastDesc = (this.$refs.descriptionPodcast as HTMLElement);
+    const podcastDescContainer = (this.$refs.descriptionPodcastContainer as HTMLElement);
     if (
       null !== podcastDesc && null !== podcastDescContainer &&
       podcastDesc.clientHeight > podcastDescContainer.clientHeight

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

@@ -13,10 +13,12 @@
     >
       <div
         :id="'tag-list-from-podcast-page'+index"
+        role="button"
       >
         <img
           v-if="isOuestFranceTag(tag)"
           class="ouest-france-logo"
+          alt="Logo Ouest France"
           src="/img/ouest_france_logo.svg"
         >
         {{ formateOfTag(tag) }}

package/src/components/display/rubriques/RubriqueChooser.vue

@@ -16,6 +16,7 @@
       class="rubriqueChooser"
       label="name"
       track-by="rubriqueId"
+      :aria-expanded="false"
       :placeholder="$t('Type string to filter by rubrics')"
       :options="rubriques"
       :multiple="multiple"

package/src/components/display/rubriques/RubriqueList.vue

@@ -1,7 +1,8 @@
 <template>
   <div class="d-inline-flex w-100 mb-3 px-3 hide-phone">
     <div
-      id="rubrique-list-container"
+      ref="rubriqueListContainer"
+      class="rubrique-list-container"
     >
       <select
         v-model="rubriquage"
@@ -18,7 +19,7 @@
       </select>
       <button
         v-for="rubrique in rubriqueDisplay"
-        :id="'rubrique' + rubrique.rubriqueId"
+        :ref="'rubrique' + rubrique.rubriqueId"
         :key="rubrique.rubriqueId"
         class="rubrique-item bg-white"
         @click="addFilter(rubrique)"
@@ -150,12 +151,12 @@ export default defineComponent({
       this.initRubriques();
     },
     resizeWindow(): void {
-      const rubriqueList = document.getElementById('rubrique-list-container');
+      const rubriqueList = (this.$refs.rubriqueListContainer as HTMLElement);
       if(null === rubriqueList){return}
       rubriqueList.style.justifyContent = 'flex-start';
       this.hidenRubriques.length = 0;
       this.rubriqueDisplay.forEach((element: Rubrique) => {
-        const el = document.getElementById('rubrique' + element.rubriqueId);
+        const el = (this.$refs['rubrique' + element.rubriqueId] as Array<HTMLElement>)[0];
         if (!el) return;
         const parent = el.parentElement;
         if (null !== parent && el.offsetLeft + el.clientWidth <= parent.clientWidth - 20) {
@@ -180,7 +181,7 @@ export default defineComponent({
 
 <style lang="scss">
 .octopus-app{
-#rubrique-list-container {
+.rubrique-list-container {
   display: flex;
   justify-content: flex-start;
   align-items: center;

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

@@ -13,6 +13,7 @@
       <span
         v-if="authenticated"
         id="popover-share-help"
+        role="button"
         tabindex="-1"
         class="saooti-help ms-2"
         :title="$t('Help')"

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

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div class="module-box text-center-mobile">
+    <div class="module-box text-center-mobile overflow-visible">
       <h3>{{ $t('Embed') }}</h3>
       <template v-if="!exclusive && (authenticated || notExclusive)">
         <div class="d-flex flex-column align-items-center">

package/src/components/form/ClassicCheckbox.vue

@@ -9,10 +9,13 @@
       type="checkbox"
       class="form-check-input"
       :disabled="isDisabled"
+      :title="displayLabel?'':label"
+      :data-selenium="selenium"
       @click="emitClickAction"
     >
     <label
       class="form-check-label"
+      :class="displayLabel? '': 'd-none'"
       :for="idCheckbox"
     >{{ label }}</label>
   </div>
@@ -28,7 +31,9 @@ export default defineComponent({
     label: { default: '', type: String },
     isDisabled: { default: false, type: Boolean },
     textInit: { default: false, type: Boolean },
-    isSwitch:{default:false, type:Boolean}
+    isSwitch:{default:false, type:Boolean},
+    displayLabel: {default:true, type: Boolean},
+    selenium: { default: '', type: String },
   },
   emits: ['update:textInit', 'clickAction'],
 

package/src/components/form/ClassicLoading.vue

@@ -4,9 +4,9 @@
     class="d-flex justify-content-center"
   >
     <div class="spinner-border me-3" />
-    <h3 class="mt-2">
+    <div class="h3 mt-2">
       {{ loadingText }}
-    </h3>
+    </div>
   </div>
   <div
     v-else-if="errorText"

package/src/components/form/ClassicRadio.vue

@@ -1,9 +1,13 @@
 <template>
-  <div class="d-flex flex-column">
+  <div
+    class="d-flex"
+    :class="isColumn? 'flex-column':''"
+  >
     <div
       v-for="option in options"
       :key="option.title"
       class="form-check"
+      :class="isColumn? '':'me-2'"
     >
       <input
         :id="idRadio + option.value"
@@ -34,6 +38,7 @@ export default defineComponent({
     isDisabled: { default: false, type: Boolean },
     options: { default: ()=>[], type: Array as () => Array<{title: string, value: string|undefined}> },
     textInit: { default: undefined, type: String },
+    isColumn: {default:true, type:Boolean}
   },
   emits: ['update:textInit'],
 

package/src/components/misc/ErrorMessage.vue

@@ -8,6 +8,7 @@
     >
       <img
         src="/img/caution.png"
+        alt="Caution"
         class="icon-caution"
       >
       <div class="alert-text">

package/src/components/misc/Footer.vue

@@ -2,6 +2,7 @@
   <div class="bg-dark">
     <div
       id="footer"
+      ref="footer"
       class="d-flex-column p-3 secondary-bg border-top"
     >
       <div class="d-flex flex-column flex-grow-1 align-items-end">
@@ -191,7 +192,7 @@ export default defineComponent({
 
   methods: {
     showBlackBorder(hide: boolean): void {
-      const footerElement = document.getElementById('footer');
+      const footerElement = (this.$refs.footer as HTMLElement);
       if(null===footerElement){return}
       if (hide) {
         footerElement.classList.remove('border-round');

package/src/components/misc/LeftMenu.vue

@@ -177,14 +177,11 @@ export default defineComponent({
       this.$emit('update:displayMenu', false);
     },
     async onOrganisationSelected(organisation: Organisation|undefined) {
-      const queries = this.$route.query;
       if (organisation && organisation.id) {
-        if (queries.productor !== organisation.id) {
-          this.$router.push({ query: {...queries, ...{productor: organisation.id} } });
-        }
         await this.selectOrganisation(organisation.id);
       } else {
         if (this.$route.query.productor) {
+          const queries = this.$route.query;
           this.$router.push({ query: {...queries, ...{productor: undefined} } });
         }
         this.$store.commit('filterOrga', { orgaId: undefined });

package/src/components/misc/TopBar.vue

@@ -238,15 +238,12 @@ export default defineComponent({
       }
     },
     async onOrganisationSelected(organisation: Organisation | undefined): Promise<void> {
-      const queries = this.$route.query;
       if (organisation && organisation.id) {
-        if (this.$route.query.productor !== organisation.id) {
-          this.$router.push({ query: {...queries, ...{productor: organisation.id} } });
-        }
         await this.selectOrganisation(organisation.id);
       } else {
         this.organisationId = undefined;
         if (this.$route.query.productor) {
+          const queries = this.$route.query;
           this.$router.push({ query: { ...queries, ...{productor: undefined} } });
         }
         this.$store.commit('filterOrga', { orgaId: undefined });

package/src/components/mixins/organisationFilter.ts

@@ -23,6 +23,8 @@ export const orgaFilter = defineComponent({
           }),
           isLive: isLive
         });
+        const queries = this.$route.query;
+        this.$router.replace({ query: {...queries, ...{productor: organisationId} } });
       } catch (error) {
         this.handle403((error as AxiosError));
       }

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

@@ -51,7 +51,7 @@ export const playerLogic = defineComponent({
         this.audioUrlToPlay = this.audioUrl;
       }
       if(!this.podcast){return;}
-      const response = await octopusApi.fetchPodcastDownloadUrl("podcast/download/register/"+this.podcast.podcastId+".mp3"+ this.audioUrl);
+      const response = await octopusApi.fetchPodcastDownloadUrl("podcast/download/register/"+ this.audioUrl);
       this.setDownloadId(response.downloadId.toString());
       this.audioUrlToPlay = response.location;
     },

package/src/components/pages/Emissions.vue

@@ -23,6 +23,7 @@
       :is-search-bar="isProductorSearch"
       :sort-criteria="sortEmission"
       :organisation-id="organisationId"
+      :includeHidden="includeHidden"
       @updateCategory="updateCategory"
       @updateRubriquageFilter="updateRubriquageFilter"
       @updateMonetization="updateMonetization"
@@ -43,7 +44,6 @@
       :sort="sortEmission"
       :include-hidden="includeHidden"
       :iab-id="iabId"
-
       :rubrique-id="rubriqueId"
       :rubriquage-id="rubriquageId"
       :no-rubriquage-id="noRubriquageId"
@@ -106,6 +106,28 @@ export default defineComponent({
     titlePage(): string|undefined {
       return state.emissionsPage.titlePage;
     },
+    authenticated(): boolean {
+      return (state.generalParameters.authenticated as boolean);
+    },
+    myOrganisationId(): string|undefined {
+      return state.generalParameters.organisationId;
+    },
+    organisationRight(): boolean {
+      if (
+        (this.authenticated && this.myOrganisationId === this.organisationId) ||
+        state.generalParameters.isAdmin
+      )
+        return true;
+      return false;
+    },
+    filterOrga(): string|undefined {
+      return this.$store.state.filter.organisationId;
+    },
+    organisation(): string|undefined {
+      if (this.organisationId) return this.organisationId;
+      if (this.filterOrga) return this.filterOrga;
+      return undefined;
+    },
   },
 
   created() {
@@ -117,6 +139,9 @@ export default defineComponent({
     } else if (this.$store.state.filter.organisationId) {
       this.organisationId = this.$store.state.filter.organisationId;
     }
+    if (this.organisation && this.organisationRight) {
+      this.includeHidden = true;
+    }
     if(this.rubriqueFilter.length){
       this.updateRubriquageFilter(this.rubriqueFilter);
     }

package/src/components/pages/Participant.vue

@@ -16,6 +16,7 @@
       >
         <img
           v-lazy="participant.imageUrl"
+          :title="$t('Animator image')"
           class="img-box-circle mb-3"
         >
         <h2 class="text-capitalize">

package/src/components/pages/Podcasts.vue

@@ -35,6 +35,7 @@
       :reset-rubriquage="resetRubriquage"
       :is-search-bar="isProductorSearch"
       :sort-criteria="sortCriteria"
+      :includeHidden="includeHidden"
       :organisation-id="organisationId"
       @updateCategory="updateCategory"
       @updateRubriquageFilter="updateRubriquageFilter"

package/src/locale/en.ts

@@ -70,7 +70,7 @@ export default{
   'Episode name image': "Episode {name} image",
   'More episodes of this emission': "More episodes from this series",
   'More episodes of this category : {name}': "More episodes from this category : {name}",
-  'All podcast emission button': "All podcast from this series",
+  'All podcast emission button': "All podcasts from this series",
   Duration: 'Duration : {duration}',
   Animator: 'Host',
   'No category filter': 'No category filter',

package/src/sass/_variables.scss

@@ -6,6 +6,8 @@ $font-family-sans-serif: 'Roboto', sans-serif;
 $font-size-base: 0.9rem;
 $line-height-base: 1.6;
 $primary: #32815C;
+$secondary: #636C73;
+$danger: #E22C27;
 
 // Colors
 $blue: #3490dc;