@everymatrix/casino-tournaments-controller 0.0.411 → 0.0.412

package/package.json

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

package/src/CasinoTournamentsController.svelte

@@ -30,6 +30,9 @@
   export let sorttype: string = '';
   export let starttimeafter: string = '' // start time after how many days 
 
+  export let clientstyling:string = '';
+  export let clientstylingurl:string = '';
+
   // Variables of topics for communication
   let hasErrors:boolean = false;
   let error:string = '';
@@ -41,6 +44,9 @@
   let filtersLoaded:boolean = false;
   let startingTournamentUpdater:boolean = false;
 
+  let customStylingContainer: HTMLElement;
+  let displayNone:boolean = false;
+
   let filtersArray = 'All,Scheduled,Ongoing,Finished';
   let tournamentsNumber:number = 0;
 
@@ -289,6 +295,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(() => {
     isMounted = true
     window.addEventListener('message', messageHandler, false);
@@ -301,6 +331,8 @@
     }
   });
 
+  $: customStylingContainer && clientstyling && setClientStyling();
+  $: customStylingContainer && clientstylingurl && setClientStylingURL();
   $: session && setSession();
   $: userid && setPlayerID();
   $: lang && setLocale(lang);
@@ -315,7 +347,7 @@
   <p>{$_('tournamentsController.500')}</p>
   <p>{error}</p>
 {:else}
-  <div class="TournamentsWrapper" part="TournamentsWrapper">
+  <div bind:this={customStylingContainer} class="TournamentsWrapper" part="TournamentsWrapper">
     <div class="Tournaments" style="max-width: {containermaxwidth}px;" part="Tournaments">
       <div class="FirstRow" part="FirstRow">
         {#if filtersLoaded}