@everymatrix/casino-tournaments-list-controller 0.0.411 → 0.0.413

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/casino-tournaments-list-controller",
-  "version": "0.0.411",
+  "version": "0.0.413",
   "main": "dist/casino-tournaments-list-controller.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -36,5 +36,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "0a732da40cdcdccc1f26ebb3fabac6e0b6e8976b"
+  "gitHead": "71de9fe1d6241d0c48edc9cd294c49f263edb504"
 }

package/src/CasinoTournamentsListController.svelte

@@ -19,6 +19,11 @@
   export let currency:String = '';
   export let lang:String = 'en';
   export let keepbrowsercontext:string = 'false';
+  export let clientstyling:string = '';
+  export let clientstylingurl:string = '';
+
+  let customStylingContainer: HTMLElement;
+  let displayNone:boolean = false;
 
   let isLoading:Boolean = false;
   let currentDate:any = moment(); // current day
@@ -86,6 +91,30 @@
     playerID = userid;
   }
 
+  const setClientStyling = ():void => {
+    let sheet = document.createElement('style');
+    sheet.innerHTML = clientstyling;
+    customStylingContainer.appendChild(sheet);
+  }
+
+  const setClientStylingURL = ():void => {
+    displayNone = true;
+
+    let url:URL = new URL(clientstylingurl);
+    let cssFile:HTMLElement = document.createElement('style');
+
+    fetch(url.href)
+      .then((res:any) => res.text())
+      .then((data:any) => {
+        cssFile.innerHTML = data
+
+        if (customStylingContainer) {
+          setTimeout(() => { customStylingContainer.appendChild(cssFile) }, 1);
+          setTimeout(() => { displayNone = false; }, 500);
+        }
+      });
+}
+
   onMount(() => {
     window.addEventListener('message', messageHandler, true);
 
@@ -94,12 +123,14 @@
     }
   });
 
+  $: customStylingContainer && clientstyling && setClientStyling();
+  $: customStylingContainer && clientstylingurl && setClientStylingURL();
   $: session && setSession();
   $: userid && setPlayerID();
 </script>
 
 
-<div class="TournamentList" part="TournamentList">
+<div bind:this={customStylingContainer} class="TournamentList" part="TournamentList">
   {#if !isLoading}
     {#each tournamentList as tournament, i}
       <casino-tournaments-thumbnail-controller