@saooti/octopus-sdk 30.0.47 → 30.0.48

package/README.md

@@ -543,4 +543,5 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
  * 30.0.44 ProgressBar pour le soir
  * 30.0.45 ProgressBar pour le soir
  * 30.0.46 Param pour le soir
- * 30.0.47 Live error
+ * 30.0.47 Live error
+ * 30.0.48 Podcastmaker ScrollOverflow PodcastInlineList

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saooti/octopus-sdk",
-  "version": "30.0.47",
+  "version": "30.0.48",
   "private": false,
   "description": "Javascript SDK for using octopus",
   "author": "Saooti",
@@ -79,7 +79,8 @@
       "no-console": "off",
       "no-debugger": "off",
       "@typescript-eslint/ban-ts-ignore": "off",
-      "@typescript-eslint/ban-ts-comment": "off"
+      "@typescript-eslint/ban-ts-comment": "off",
+      "no-async-promise-executor":"off"
     },
     "parserOptions": {
       "parser": "@typescript-eslint/parser"

package/src/assets/share.scss

@@ -66,6 +66,25 @@
       }
     }
   }
+  .element-list-inline.overflowScroll {
+    display: flex;
+    flex-wrap: wrap;
+    -webkit-overflow-scrolling: touch;
+    scroll-behavior: smooth;
+    padding-bottom: 1rem;
+    width: 100%;
+    height: 80vh;
+    overflow-y: auto;
+    grid-gap: inherit;
+    @media (max-width: 960px) {
+      overflow-x: hidden;
+      flex-direction: column;
+      flex-wrap: nowrap;
+    }
+    .item-phone-margin {
+      margin: 1rem 0.5rem !important;
+    }
+  }
 
   .emission-list {
     align-self: stretch;

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

@@ -55,7 +55,6 @@
       />
     </transition-group>
     <router-link
-      v-if="!overflowScroll"
       :to="href"
       class="btn btn-link align-self-center width-fit-content m-4"
     >
@@ -203,14 +202,14 @@ export default defineComponent({
     },
     handleResize(): void {
       if (!this.$el) return;
-      if (window.innerWidth <= PHONE_WIDTH) {
-        this.size = 10;
-        return;
-      }
       if (this.overflowScroll) {
         this.size = 20;
         return;
       }
+      if (window.innerWidth <= PHONE_WIDTH) {
+        this.size = 10;
+        return;
+      }
       const width = (this.$el as HTMLElement).offsetWidth;
       const sixteen = domHelper.convertRemToPixels(this.itemSize + 0.7);
       this.size = Math.floor(width / sixteen);
@@ -270,24 +269,5 @@ export default defineComponent({
           margin-bottom: 1rem;
       }
   }
-  .element-list-inline.overflowScroll {
-    display: flex;
-    flex-wrap: wrap;
-    -webkit-overflow-scrolling: touch;
-    scroll-behavior: smooth;
-    padding-bottom: 1rem;
-    width: 100%;
-    height: 80vh;
-    overflow-y: auto;
-    grid-gap: inherit;
-    @media (max-width: 960px) {
-      overflow-x: hidden;
-      flex-direction: column;
-      flex-wrap: nowrap;
-    }
-    .item-phone-margin {
-      margin: 1rem 0.5rem !important;
-    }
-  }
 }
 </style>

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

@@ -22,7 +22,7 @@
         </button>
       </div>
       <div
-        v-if="!isArrow"
+        v-if="!isArrow && !overflowScroll"
         class="hide-phone"
       >
         <button
@@ -51,7 +51,10 @@
       :name="transitionName"
       class="element-list-inline"
       tag="ul"
-      :class="[alignLeft ? 'justify-content-start' : '']"
+      :class="[
+        alignLeft ? 'justify-content-start' : '',
+        overflowScroll ? 'overflowScroll' : '',
+      ]"
     >
       <PodcastItem
         v-for="p in podcasts"
@@ -131,6 +134,9 @@ export default defineComponent({
     sizeItem(): number {
       return state.generalParameters.podcastItem ? (state.generalParameters.podcastItem as number): 13;
     },
+    overflowScroll(): boolean {
+      return (state.emissionPage.overflowScroll as boolean);
+    },
     filterOrga(): string {
       return this.$store.state.filter.organisationId;
     },
@@ -249,6 +255,10 @@ export default defineComponent({
     },
     handleResize(): void {
       if (!this.$el) return;
+      if (this.overflowScroll) {
+        this.size = 20;
+        return;
+      }
       if (window.innerWidth <= PHONE_WIDTH) {
         this.size = 10;
         return;

package/src/store/paramStore.ts

@@ -55,7 +55,8 @@ const state:paramStore = {
   emissionPage: {
     ouestFranceStyle: false,
     rssButton: false,
-    isDisplayPodcasts:true
+    isDisplayPodcasts:true,
+    overflowScroll:false
   },
   intervenantPage: {
     lightStyle: false,
@@ -143,7 +144,8 @@ export interface EmissionsPage{
 export interface EmissionPage{
   ouestFranceStyle?: boolean,
   rssButton?: boolean,
-  isDisplayPodcasts?:boolean
+  isDisplayPodcasts?:boolean,
+  overflowScroll?: boolean,
 }
 export interface IntervenantPage{
   lightStyle?: boolean,