@saooti/octopus-sdk 37.0.5 → 37.0.7

package/src/App.vue

@@ -1,50 +1,45 @@
 <template>
-  <div
-    v-if="isInit"
-    :key="reload"
-    class="d-flex flex-column h-100 octopus-app"
-  >
-    <TopBar
-      v-model:displayMenu="displayMenu"
-      :is-education="false"
-    />
+  <div v-if="isInit" :key="reload" class="d-flex flex-column h-100 octopus-app">
+    <TopBar v-model:displayMenu="displayMenu" :is-education="false" />
     <LeftMenu
       v-if="displayMenu"
       :is-education="false"
-      @close="displayMenu=false"
+      @close="displayMenu = false"
     />
     <CategoryFilter />
     <router-view />
     <FooterOctopus />
-    <Player />
+    <PlayerComponent />
   </div>
 </template>
 
 <script lang="ts">
-import TopBar from '@/components/misc/TopBar.vue';
-import FooterOctopus from '@/components/misc/Footer.vue';
-import Player from '@/components/misc/player/Player.vue';
-import CategoryFilter from '@/components/display/categories/CategoryFilter.vue';
-import { state } from './stores/ParamSdkStore';
-import { Rubriquage } from './stores/class/rubrique/rubriquage';
-import { RubriquageFilter } from './stores/class/rubrique/rubriquageFilter';
-import { Rubrique } from './stores/class/rubrique/rubrique';
-import initSDK from './components/mixins/init';
-import { useFilterStore } from '@/stores/FilterStore';
-import { useGeneralStore } from '@/stores/GeneralStore';
-import { mapState, mapActions } from 'pinia';
-import { defineAsyncComponent, defineComponent } from 'vue';
-import { Category } from './stores/class/general/category';
-const LeftMenu = defineAsyncComponent(() => import('@/components/misc/LeftMenu.vue'));
+import TopBar from "@/components/misc/TopBar.vue";
+import FooterOctopus from "@/components/misc/FooterSection.vue";
+import PlayerComponent from "@/components/misc/player/PlayerComponent.vue";
+import CategoryFilter from "@/components/display/categories/CategoryFilter.vue";
+import { state } from "./stores/ParamSdkStore";
+import { Rubriquage } from "./stores/class/rubrique/rubriquage";
+import { RubriquageFilter } from "./stores/class/rubrique/rubriquageFilter";
+import { Rubrique } from "./stores/class/rubrique/rubrique";
+import initSDK from "./components/mixins/init";
+import { useFilterStore } from "@/stores/FilterStore";
+import { useGeneralStore } from "@/stores/GeneralStore";
+import { mapState, mapActions } from "pinia";
+import { defineAsyncComponent, defineComponent } from "vue";
+import { Category } from "./stores/class/general/category";
+const LeftMenu = defineAsyncComponent(
+  () => import("@/components/misc/LeftMenu.vue"),
+);
 export default defineComponent({
-  name: 'App',
-  
+  name: "App",
+
   components: {
     TopBar,
     LeftMenu,
     CategoryFilter,
     FooterOctopus,
-    Player
+    PlayerComponent,
   },
 
   mixins: [initSDK],
@@ -57,82 +52,96 @@ export default defineComponent({
     };
   },
 
-  computed:{
-    ...mapState(useFilterStore, ['filterRubriquage', 'filterOrgaId']),
-    ...mapState(useGeneralStore, ['storedCategories']),
+  computed: {
+    ...mapState(useFilterStore, ["filterRubriquage", "filterOrgaId"]),
+    ...mapState(useGeneralStore, ["storedCategories"]),
   },
 
   watch: {
-    '$i18n.locale'(){
+    "$i18n.locale"() {
       this.$forceUpdate();
       this.reload = !this.reload;
-    }
+    },
   },
-  async created(){
+  async created() {
     await this.initApp();
   },
-  methods:{
-    ...mapActions(useFilterStore, ['filterUpdateIab', 'filterUpdateRubrique']),
-    async initApp(){
+  methods: {
+    ...mapActions(useFilterStore, ["filterUpdateIab", "filterUpdateRubrique"]),
+    async initApp() {
       await this.initSdk();
       await this.handleOrganisationFilter();
       this.handleIabIdFilter();
       this.handleRubriquesFilter();
-      this.isInit =true;
+      this.isInit = true;
     },
-    async handleOrganisationFilter(){
-      let orgaId = '';
-      if (this.$route.query.productor && 'string'===typeof this.$route.query.productor) {
+    async handleOrganisationFilter() {
+      let orgaId = "";
+      if (
+        this.$route.query.productor &&
+        "string" === typeof this.$route.query.productor
+      ) {
         orgaId = this.$route.query.productor;
-      } else if(state.generalParameters.organisationId){
+      } else if (state.generalParameters.organisationId) {
         orgaId = state.generalParameters.organisationId;
       }
-      if(''===orgaId){
+      if ("" === orgaId) {
         return;
       }
       await this.selectOrganisation(orgaId);
     },
-    handleIabIdFilter(){
-      if(this.filterOrgaId){
+    handleIabIdFilter() {
+      if (this.filterOrgaId) {
         return;
       }
-      if (this.$route.query.iabId && 'string'===typeof this.$route.query.iabId) {
+      if (
+        this.$route.query.iabId &&
+        "string" === typeof this.$route.query.iabId
+      ) {
         const iabId = parseInt(this.$route.query.iabId, 10);
         const category = this.storedCategories.filter((c: Category) => {
           return c.id === iabId;
         });
-        if(category.length){
+        if (category.length) {
           this.filterUpdateIab(category[0]);
         }
       }
     },
-    handleRubriquesFilter(){
-      if(0===this.filterRubriquage.length){
+    handleRubriquesFilter() {
+      if (0 === this.filterRubriquage.length) {
         return;
       }
-      if (this.$route.query.rubriquesId && 'string'===typeof this.$route.query.rubriquesId) {
-        const arrayFilter = this.$route.query.rubriquesId.split(',');
-        const rubriquesFilter: Array<RubriquageFilter>=[];
+      if (
+        this.$route.query.rubriquesId &&
+        "string" === typeof this.$route.query.rubriquesId
+      ) {
+        const arrayFilter = this.$route.query.rubriquesId.split(",");
+        const rubriquesFilter: Array<RubriquageFilter> = [];
         const filterLength = arrayFilter.length;
         for (let index = 0; index < filterLength; index++) {
-          const rubriqueFilter = arrayFilter[index].split(':');
+          const rubriqueFilter = arrayFilter[index].split(":");
           const rubriquage = this.filterRubriquage.find((x: Rubriquage) => {
             return x.rubriquageId === parseInt(rubriqueFilter[0]);
           });
-          if(rubriquage){
+          if (rubriquage) {
             const rubrique = rubriquage.rubriques.find((x: Rubrique) => {
               return x.rubriqueId === parseInt(rubriqueFilter[1]);
             });
-            rubriquesFilter.push({rubriquageId: rubriquage.rubriquageId, rubriqueId:rubrique.rubriqueId, nameRubriquage: rubriquage.title, nameRubrique :rubrique.name});
+            rubriquesFilter.push({
+              rubriquageId: rubriquage.rubriquageId,
+              rubriqueId: rubrique.rubriqueId,
+              nameRubriquage: rubriquage.title,
+              nameRubrique: rubrique.name,
+            });
           }
         }
-        if(rubriquesFilter.length){
+        if (rubriquesFilter.length) {
           this.filterUpdateRubrique(rubriquesFilter);
         }
       }
-    }
-  }
-})
+    },
+  },
+});
 </script>
 
 <style lang="scss" src="@/assets/octopus-library.scss"></style>

package/src/api/classicCrud.ts

@@ -1,16 +1,16 @@
 import axios from "axios";
 enum ModuleApi {
-    DEFAULT = 0,
-    MEDIA = 1,
-    COMMENT = 2,
-    KEYCLOAK = 3,
-    FRONTOFFICE = 4,
-    PLAYER = 6,
-    STORAGE = 8,
-    STUDIO = 9,
-    PROCESSOR= 10,
-    SPEECHTOTEXT=11
-  }
+  DEFAULT = 0,
+  MEDIA = 1,
+  COMMENT = 2,
+  KEYCLOAK = 3,
+  FRONTOFFICE = 4,
+  PLAYER = 6,
+  STORAGE = 8,
+  STUDIO = 9,
+  PROCESSOR = 10,
+  SPEECHTOTEXT = 11,
+}
 /* eslint-disable */
 export default {
     async fetchData<Type>(moduleName: ModuleApi,wsPath:string, forceRefresh?:boolean): Promise<Type>{
@@ -30,4 +30,4 @@ export default {
         await axios.delete('/mock');
     },
 };
-/* eslint-enable */ 
+/* eslint-enable */

package/src/api/initialize.ts

@@ -5,4 +5,4 @@ export default{
     return true;
   },
 };
-/* eslint-enable */
+/* eslint-enable */

package/src/assets/bootstrap.scss

@@ -105,6 +105,15 @@ input:not([class^="vs__"]), button:not([class^="vs__"]), select:not([class^="vs_
 				@media (max-width: 600px) {
 					margin: 0 1rem 1rem 0;
 				}
+				@media (max-width: 500px) {
+					margin: 0 0.6rem 1rem 0;
+					font-size: 0.8rem;
+				}
+				@media (max-width: 380px) {
+					margin: 0 0.4rem 0.7rem 0;
+					font-size: 0.7rem;
+				}
+				
 				position: relative;
 				&:after {    
 						bottom: 0;

package/src/assets/general.scss

@@ -6,7 +6,7 @@ html{
 body{
   margin: 0;
   color: #353535;
-  font-family: Montserrat,sans-serif,Helvetica Neue;
+  font-family: "Montserrat",sans-serif,Helvetica Neue;
   font-size: 0.8rem;
   overflow-x: hidden;
   background: #ebebeb;

package/src/assets/share.scss

@@ -286,7 +286,7 @@
         background: #00000030;
       }
       .saooti-play {
-        font-size: 1.2rem;
+        font-size: 1.4rem;
         position: relative;
         color: white;
       }

package/src/components/display/aggregator/RssSection.vue

@@ -3,6 +3,6 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-export default defineComponent({})
-</script>
+import { defineComponent } from "vue";
+export default defineComponent({});
+</script>

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

@@ -13,56 +13,65 @@
     :width="width"
     :is-disabled="isDisabled"
     :no-deselect="noDeselect"
-    @onSearch="onSearchCategory"
+    @on-search="onSearchCategory"
     @selected="onCategorySelected"
   />
 </template>
 
 <script lang="ts">
-import { useGeneralStore } from '@/stores/GeneralStore';
-import { mapState } from 'pinia';
-import ClassicMultiselect from '../../form/ClassicMultiselect.vue';
-import { Category } from '@/stores/class/general/category';
-import { defineComponent } from 'vue'
+import { useGeneralStore } from "@/stores/GeneralStore";
+import { mapState } from "pinia";
+import ClassicMultiselect from "../../form/ClassicMultiselect.vue";
+import { Category } from "@/stores/class/general/category";
+import { defineComponent } from "vue";
 export default defineComponent({
   components: {
-    ClassicMultiselect
+    ClassicMultiselect,
   },
   props: {
-    defaultanswer: { default: '', type: String },
-    width: { default: '100%', type: String },
+    defaultanswer: { default: "", type: String },
+    width: { default: "100%", type: String },
     multiple: { default: false, type: Boolean },
     isDisabled: { default: false, type: Boolean },
-    initCategories: { default: undefined, type: Array as ()=>Array<Category> },
+    initCategories: {
+      default: undefined,
+      type: Array as () => Array<Category>,
+    },
     displayAllCategories: { default: false, type: Boolean },
     categorySelected: { default: undefined, type: Number },
-    categorySelectedArray: { default: undefined, type: Array as ()=>Array<number> },
-    inModal:{default: false, type: Boolean},
-    noDeselect: {default: true, type: Boolean},
+    categorySelectedArray: {
+      default: undefined,
+      type: Array as () => Array<number>,
+    },
+    inModal: { default: false, type: Boolean },
+    noDeselect: { default: true, type: Boolean },
   },
-  emits: ['update:categorySelected','update:categorySelectedArray','selected'],
+  emits: [
+    "update:categorySelected",
+    "update:categorySelectedArray",
+    "selected",
+  ],
   data() {
     return {
       maxElement: 50 as number,
-      category: undefined as Category|undefined,
-      categoryForArray: [] as Array<Category>|undefined,
+      category: undefined as Category | undefined,
+      categoryForArray: [] as Array<Category> | undefined,
     };
   },
 
-
   computed: {
-    ...mapState(useGeneralStore, ['storedCategories']),
-    categoriesChosen(): Array<Category>{
-      if(this.initCategories){
+    ...mapState(useGeneralStore, ["storedCategories"]),
+    categoriesChosen(): Array<Category> {
+      if (this.initCategories) {
         return this.initCategories;
       }
       return this.storedCategories;
     },
     categoriesOrdered(): Array<Category> {
-      let allCategoriesOrdered = [...this.categoriesChosen].sort((a: Category, b: Category) =>
-        a.name > b.name ? 1 : -1
-      )
-      if(!this.displayAllCategories){
+      let allCategoriesOrdered = [...this.categoriesChosen].sort(
+        (a: Category, b: Category) => (a.name > b.name ? 1 : -1),
+      );
+      if (!this.displayAllCategories) {
         allCategoriesOrdered = allCategoriesOrdered.filter((c: Category) => {
           return c.podcastCount;
         });
@@ -72,87 +81,91 @@ export default defineComponent({
       }
       return allCategoriesOrdered;
     },
-    getDefaultCategory(): Category|undefined{
-      if(''===this.defaultanswer){
+    getDefaultCategory(): Category | undefined {
+      if ("" === this.defaultanswer) {
         return undefined;
       }
-      return {id: 0, name: this.defaultanswer};
+      return { id: 0, name: this.defaultanswer };
     },
     idClassicMultiselect(): string {
-      if (this.multiple) return 'categoryChooser' + this.multiple;
-      return 'categoryChooser';
+      if (this.multiple) return "categoryChooser" + this.multiple;
+      return "categoryChooser";
     },
-   
+
     model: {
-      get(): Category| Array<Category>|undefined{
-        return this.multiple ? this.categoryForArray:this.category; 
+      get(): Category | Array<Category> | undefined {
+        return this.multiple ? this.categoryForArray : this.category;
       },
-      set(value: Category| Array<Category>|undefined): void{
-        if(!this.multiple){
-          this.category = (value as Category|undefined);
+      set(value: Category | Array<Category> | undefined): void {
+        if (!this.multiple) {
+          this.category = value as Category | undefined;
           return;
         }
-        this.categoryForArray = (value as Array<Category>|undefined);
-      }
-
-    }
+        this.categoryForArray = value as Array<Category> | undefined;
+      },
+    },
   },
   watch: {
     categorySelected: {
-      immediate:true,
-      handler(){
-        if(this.categorySelected){
+      immediate: true,
+      handler() {
+        if (this.categorySelected) {
           this.initCategorySelected();
-        }else{
+        } else {
           this.category = this.getDefaultCategory;
         }
-      }
-    }
+      },
+    },
   },
- 
+
   mounted() {
     this.initCategoryArray();
   },
   methods: {
     async onSearchCategory(query?: string): Promise<void> {
       let categories = this.categoriesOrdered;
-      if(query){
+      if (query) {
         categories = categories.filter((item: Category) => {
           return item.name.toUpperCase().includes(query.toUpperCase());
         });
       }
-      (this.$refs.selectCategory as InstanceType<typeof ClassicMultiselect>).afterSearch(categories,categories.length);
+      (
+        this.$refs.selectCategory as InstanceType<typeof ClassicMultiselect>
+      ).afterSearch(categories, categories.length);
     },
-    onCategorySelected(category: Category| Array<Category>): void {
+    onCategorySelected(category: Category | Array<Category>): void {
       if (undefined !== this.categorySelected) {
-        this.$emit('update:categorySelected', (category as Category).id);
+        this.$emit("update:categorySelected", (category as Category).id);
       } else if (undefined !== this.categorySelectedArray) {
         const idsArray: Array<number> = [];
         (category as Array<Category>).forEach((el: Category) => {
           idsArray.push(el.id);
         });
-        this.$emit('update:categorySelectedArray', idsArray);
-      }else{
-        this.$emit('selected', category);
+        this.$emit("update:categorySelectedArray", idsArray);
+      } else {
+        this.$emit("selected", category);
       }
     },
     initCategorySelected(): void {
-      this.category = this.categoriesChosen.find((el: Category) => {
-        return el.id === this.categorySelected;
-      }) ?? this.getDefaultCategory;
+      this.category =
+        this.categoriesChosen.find((el: Category) => {
+          return el.id === this.categorySelected;
+        }) ?? this.getDefaultCategory;
     },
     initCategoryArray(): void {
-      if(!this.categoryForArray || !this.categorySelectedArray){return; }
+      if (!this.categoryForArray || !this.categorySelectedArray) {
+        return;
+      }
       this.categoryForArray.length = 0;
       this.categorySelectedArray.forEach((element: number) => {
         const item = this.categoriesChosen.find((el: Category) => {
           return el.id === element;
         });
-        if(this.categoryForArray && item){
+        if (this.categoryForArray && item) {
           this.categoryForArray.push(item);
         }
       });
     },
   },
-})
-</script>
+});
+</script>