@everymatrix/casino-slider 0.0.238 → 0.0.242

package/index.html

@@ -32,6 +32,6 @@
   <div class="webcomponent">
     <casino-slider></casino-slider>
   </div>
-  
+
 </body>
 </html>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/casino-slider",
-  "version": "0.0.238",
+  "version": "0.0.242",
   "main": "dist/casino-slider.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -36,5 +36,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "907a7c1dc6fa627973d37efccc906630b14f646a"
+  "gitHead": "3cc82c62fb2a642ad091ac207ae95928c21ba69c"
 }

package/src/CasinoSlider.svelte

@@ -4,6 +4,11 @@
   import { onMount } from 'svelte';
   import { getDevice } from 'rvhelper';
 
+  import { _, addNewMessages, setLocale, setupI18n } from './i18n';
+  import { CasinoSlider } from './translations';
+
+  export let sliderdata:Array<any> = [];
+  export let onclickeventname:string = 'defaultEvent';
   export let actionevent:string = 'defaultEvent';
   export let favoritesnumber:string = '0';
   export let location:string = '';
@@ -11,16 +16,52 @@
   export let clientstylingurl:string = '';
   export let identity:string = '';
   export let containermaxwidth:string = '';
+  export let isprimarymenu:boolean = false;
+  export let issecondarymenu:boolean = false;
+  export let lang:string = '';
   export let activeindex:string = '';
 
+  setupI18n({ withLocale: 'en', translations: {}});
+
+  Object.keys(CasinoSlider).forEach((item:any) => {
+    addNewMessages(item, CasinoSlider[item]);
+  });
+
   let userAgent:string = window.navigator.userAgent;
   let isMobile:boolean = (getDevice(userAgent) === 'PC') ? false : true;
-  let sliderdata:string = '';
 
   let carousel:any;
   let activeIndex:number;
   let customStylingContainer:HTMLElement;
 
+  let  fallbackMainMenu = [
+    {
+      "id": 0,
+      "label": $_('fallbackMainMenu.sports'),
+      "path": "/sports",
+    },
+    {
+      "id": 1,
+      "label": $_('fallbackMainMenu.casino'),
+      "path": "/casino",
+    },
+    {
+      "id": 2,
+      "label": $_('fallbackMainMenu.liveCasino'),
+      "path": "/live-casino",
+    },
+    {
+      "id": 3,
+      "label": $_('fallbackMainMenu.virtualSports'),
+      "path": "/virtual-sports",
+    },
+    {
+      "id": 4,
+      "label": $_('fallbackMainMenu.tournaments'),
+      "path": "/tournaments",
+    }
+  ];
+
   // Clicking on the slider item will trigger this method and send a postmessage on window
   // @TODO itemId type fix
   let handleClick = (item:any, index:number):void => {
@@ -68,13 +109,20 @@
     }
   }
 
-  const messageHandler = (e:any) => {
+  const messageHandler = (e:any):void => {
     if (e.data.type == 'SliderData' && e.data.identity == identity) {
       sliderdata = e.data.data;
     }
   }
 
+  const setActiveLanguage = ():void => {
+    setLocale(lang);
+  }
+
   onMount(() => {
+    if( isprimarymenu && !sliderdata.length ) {
+      sliderdata = fallbackMainMenu;
+    }
     window.addEventListener('message', messageHandler, false);
 
     return () => {
@@ -85,6 +133,7 @@
   $: (activeindex || activeindex == 0) && setActiveIndex();
   $: clientstyling && setClientStyling();
   $: clientstylingurl && setClientStylingURL();
+  $: lang && setActiveLanguage();
 </script>
 
 <div class="CarouselWrapper { (location === 'headerMain') ? 'CarouselWrapperHeaderMain' : '' }" bind:this={customStylingContainer}>
@@ -149,7 +198,7 @@
     display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
-    justify-content: center;
+    justify-content: space-between;
     width: 100%;
     color: var(--emfe-w-color-white, #FFFFFF);
     margin: 0 auto;

package/src/i18n.js

@@ -0,0 +1,27 @@
+import {
+  dictionary,
+  locale,
+  addMessages,
+  _
+} from 'svelte-i18n';
+
+function setupI18n({ withLocale: _locale, translations }) {
+  locale.subscribe((data) => {
+    if (data == null) {
+      dictionary.set(translations);
+      locale.set(_locale);
+    }
+  }); // maybe we will need this to make sure that the i18n is set up only once
+  /*dictionary.set(translations);
+  locale.set(_locale);*/
+}
+
+function addNewMessages(lang, dict) {
+  addMessages(lang, dict);
+}
+
+function setLocale(_locale) {
+  locale.set(_locale);
+}
+
+export { _, setupI18n, addNewMessages, setLocale };

package/src/translations.js

@@ -0,0 +1,44 @@
+export const CasinoSlider = {
+  en: {
+    headerItem: {
+      login: 'Login',
+      register: 'Register',
+      deposit: 'Deposit',
+    },
+    fallbackMainMenu: {
+      sports: 'Sports',
+      casino: 'Casino',
+      liveCasino: 'Live Casino',
+      virtualSports: 'Virtual Sports',
+      tournaments: 'Tournaments',
+    }
+  },
+  tr: {
+    headerItem: {
+      login: 'Giriş yapmak',
+      register: 'Kayıt olmak',
+      deposit: 'Depozito',
+    },
+    fallbackMainMenu: {
+      sports: 'Spor Dalları',
+      casino: 'Kumarhane',
+      liveCasino: 'Canlı kumarhane',
+      virtualSports: 'Sanal Sporlar',
+      tournaments: 'Turnuvalar',
+    }
+  },
+  ro: {
+    headerItem: {
+      login: 'Autentificare',
+      register: 'Inregistreaza-te',
+      deposit: 'Depozit',
+    },
+    fallbackMainMenu: {
+      sports: 'Sport',
+      casino: 'Cazino',
+      liveCasino: 'Cazinou live',
+      virtualSports: 'Sport virtual',
+      tournaments: 'Turnee',
+    }
+  }
+};