@everymatrix/player-rglimits 1.29.8 → 1.30.0

package/index.html

@@ -31,12 +31,25 @@
 
   <div class="webcomponent">
     <player-rglimits
-      session="0de7e5bf667d9f8ce767d2aca296887999a8a6f4a256d9e4"
+      session="4fbdd39b70d8b93163dc95f20a111b6cea3e0ad15ce90fb8"
       sessiontype="admin"
       userid="6252873"
       transactionspageurl="https://backoffice-stage.everymatrix.com/2670"
       endpoint="https://betathome-de-stage-api.stage.norway.everymatrix.com"
+      editlimitaction="true"
+      deletelimitaction="true"
+      cancelimitscheduleaction="true"
     ></player-rglimits>
+    <!--<player-rglimits
+      session="1cb29c658e7c0fd4547aac18727fa445bf61f8497522449e"
+      sessiontype="admin"
+      userid="6292957"
+      transactionspageurl="https://backoffice-stage.everymatrix.com/2670"
+      endpoint="https://betathome-de-stage-api.stage.norway.everymatrix.com"
+      editlimitaction="true"
+      deletelimitaction="true"
+      cancelimitscheduleaction="true"
+    ></player-rglimits>-->
   </div>
 
 </body>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/player-rglimits",
-  "version": "1.29.8",
+  "version": "1.30.0",
   "main": "index.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -35,5 +35,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a6ce52ac3c8209814f7d801c927c7d2d9224b2ae"
+  "gitHead": "b9795b320e7d96e10963f25cdea2d9300029d8d7"
 }

package/src/PlayerRglimits.svelte

@@ -13,6 +13,7 @@
   import './images/fa-calendar-times-o.svg.svelte';
   import './images/fa-pencil.svg.svelte';
   import './images/fa-times.svg.svelte';
+  import './images/fa-plus-solid.svg.svelte';
 
   import '@everymatrix/general-animation-loading'
 
@@ -66,6 +67,12 @@
 
   let errorMessage:string = '';
 
+  const timeMap = {
+    daily: 0,
+    weekly: 1,
+    monthly: 2
+  }
+
   type TranslationKeys = keyof typeof TRANSLATIONS;
   Object.keys(TRANSLATIONS).forEach((item: TranslationKeys): void => {
     addNewMessages(item, TRANSLATIONS[item]);
@@ -130,7 +137,9 @@
         return;
       }
 
-      limitPeriodList = [...new Set(limitDefinitionList.map((limit) => limit.period))];
+      limitPeriodList = [...new Set(limitDefinitionList.map((limit) => limit.period))].sort((a, b) => {
+        return timeMap[a] - timeMap[b];
+      });
 
       productList = getProductListByPeriod(limitDefinitionList[0].period);
       if (!productList.includes(selectedProduct)) {
@@ -253,7 +262,6 @@
     selectedProduct = limitBalance.limitProducts[0];
 
     const limitSchedule = formatScheduleData(limit.id, limit.schedules);
-
     displayedLimit = {
       id: limit.id,
       totalAmount: limitBalance.limitAmount,
@@ -477,16 +485,16 @@
    * Get the transactions url.
    */
   const getTransactionsUrl = ():string => {
-    try {
-      const transactionUrl = transactionspageurl;
-      const page = selectedLimitType === 'Deposit' ? 'payment-transactions' : 'gaming-transactions';
-      const substractMap = {
-        'Daily': 1,
-        'Weekly': 7,
-        'Monthly': 30
-      };
-      const filterStartDate = subtractDays(new Date(displayedLimit.to), substractMap[selectedLimitPeriod]);
+    const transactionUrl = transactionspageurl;
+    const page = selectedLimitType === 'Deposit' ? 'payment-transactions' : 'gaming-transactions';
+    const subtractMap = {
+      'Daily': 1,
+      'Weekly': 7,
+      'Monthly': 30
+    };
+    const filterStartDate = subtractDays(new Date(displayedLimit.to), subtractMap[selectedLimitPeriod]);
 
+    try {
       const url = new URL(`${transactionUrl}/gammatrix/gmwi/${page}`);
       url.searchParams.append('transStatuses', '2');
       url.searchParams.append('startTime', filterStartDate.toISOString());
@@ -529,7 +537,8 @@
    */
   const initListeners = ():void => {
     window.addEventListener('message', (e) => {
-      if (e.data.type === "RGW:RefreshLimits") {
+      if (e.data.type === 'RGW:RefreshLimits') {
+        selectedLimitType = '';
         getLimitBalance();
       }
     });
@@ -578,9 +587,19 @@
     }
   }
 
+  /**
+   * Sends DOM event to open add limit modal
+   *
+   */
+  const addLimit = ():void => {
+    window.postMessage({
+      type: 'RGW:AddNewLimit'
+    }, window.location.href)
+  }
+
   $: isMounted && session && userid && setSession();
-  $: isMounted && isLoggedIn && getLimitBalance();
   $: isMounted && isLoggedIn && initListeners();
+  $: isMounted && isLoggedIn && getLimitBalance();
   $: clientstyling && customStylingContainer && setClientStyling();
   $: clientstylingurl && customStylingContainer && setClientStylingURL();
   $: lang && setActiveLanguage();
@@ -592,6 +611,12 @@
     {#if noLimitToDisplay}
       <div class="ContainerCenter">
         <p>{$_('noLimitToDisplay')}</p>
+        {#if editlimitaction === 'true'}
+          <button class="AddLimitControl" title="{$_('addLimitTitle')}" on:click|stopPropagation={() => addLimit()}>
+            <plus-icon class="ActionsSvg" />
+            <span>{$_('addLimitText')}</span>
+          </button>
+        {/if}
       </div>
     {:else if errorMessage}
       <div class="ContainerCenter">
@@ -623,25 +648,25 @@
           </div>
           <div class="DetailsContainer Entries">
             <div class="Row">
-              <div class="Col">{$_('spentAmount')}:</div>
+              <div class="Col">{$_('spentAmount')}</div>
               <div class="Col"><span><caret-right/> {formatWithSeparator(displayedLimit.spentAmount)} {displayedLimit.limitCurrency}</span></div>
             </div>
             <div class="Row">
-              <div class="Col">{$_('remainingAmount')}:</div>
+              <div class="Col">{$_('remainingAmount')}</div>
               <div class="Col"><span><caret-right/> {formatWithSeparator(displayedLimit.remainingAmount)} {displayedLimit.limitCurrency}</span></div>
             </div>
             {#if displayedLimit.formattedSchedule.isUpdated === true}
               <div class="Row">
-                <div class="Col">{$_('futureAmount')}:</div>
+                <div class="Col">{$_('futureAmount')}</div>
                 <div class="Col"><span><caret-right/> {formatWithSeparator(displayedLimit.formattedSchedule.updateAmount)} {displayedLimit.limitCurrency}</span></div>
               </div>
             {/if}
             <div class="Row">
-              <div class="Col">{$_('startLabel')}:</div>
+              <div class="Col">{$_('startLabel')}</div>
               <div class="Col"><span><caret-right/> {dateToReadableString(displayedLimit.from)}</span></div>
             </div>
             <div class="Row">
-              <div class="Col">{$_('resetLabel')}:</div>
+              <div class="Col">{$_('resetLabel')}</div>
               <div class="Col"><span><caret-right/> {dateToReadableString(displayedLimit.to)}</span></div>
             </div>
           </div>
@@ -694,19 +719,24 @@
           {/if}
           {#if limitTypeList.length > 0 && sessiontype === 'admin' && displayedLimit}
             <div class="ControlContainer">
+              {#if editlimitaction === 'true'}
+                <button class="ActionButton" title="{$_('addLimitTitle')}" on:click|stopPropagation={() => addLimit()}>
+                  <plus-icon class="ActionsSvg" />
+                </button>
+              {/if}
               {#if editlimitaction === 'true'}
                 <button class="ActionButton" title="{$_('editLimitTitle')}" on:click|stopPropagation={() => editLimit()}>
-                  <pencil-icon/>
+                  <pencil-icon class="ActionsSvg"/>
                 </button>
               {/if}
               {#if deletelimitaction === 'true'}
                 <button class="ActionButton" title="{$_('deleteLimitTitle')}" on:click|stopPropagation={() => deleteLimit()}>
-                  <cancel-limit-icon/>
+                  <cancel-limit-icon class="ActionsSvg"/>
                 </button>
               {/if}
-              {#if cancelimitscheduleaction === 'true' && displayedLimit.formattedSchedule && displayedLimit.formattedSchedule.isRemoved === true}
+              {#if cancelimitscheduleaction === 'true' && (displayedLimit.formattedSchedule && (displayedLimit.formattedSchedule.isRemoved === true || displayedLimit.formattedSchedule.isUpdated === true))}
                 <button class="ActionButton" title="{$_('cancelScheduleTitle')}" on:click|stopPropagation={() => cancelSchedule()}>
-                  <calendar-times-icon/>
+                  <calendar-times-icon class="ActionsSvg"/>
                 </button>
               {/if}
             </div>
@@ -759,9 +789,11 @@
   .ContainerCenter {
     width: 100%;
     display: flex;
+    flex-direction: column;
     justify-content: center;
     align-items: center;
     min-height: 219px;
+    p { padding: 6px; }
   }
 
   .ErrorMessage {
@@ -815,19 +847,35 @@
     flex-direction: column;
   }
 
-  .ExtraInfoContainer { 
-    padding: 1rem 0; 
+  .ExtraInfoContainer {
+    padding: 1rem 0;
     color: var(--emfe-w-color-red, #ed0909);
   }
 
-  .UsefulLinksSection { 
+  .UsefulLinksSection {
     padding-top: 5px;
-    a { 
+    a {
       color: $primary-color;
       text-decoration: underline;
     }
   }
-  
+
+  .AddLimitControl {
+    border: 0.1rem solid $primary-color;
+    border-radius: 0.3rem;
+    min-height: 1rem;
+    color: var(--emw--color-white, #FFFFFF);
+    background: $primary-color;
+    padding: 0.3rem;
+    cursor: pointer;
+    min-width: 10rem;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    button { padding: 5px; border: 1px solid $primary-contrast-color; border-radius: 4px; cursor: pointer; }
+  }
+
   .WidgetControls {
     display: flex;
     width: 100%;
@@ -835,17 +883,36 @@
     gap: 20px;
   }
 
-  .ControlContainer label {
-    display: block;
-    width: 100%;
-    font-size: 12px;
-    font-weight: bold;
-    margin-bottom: 5px;
+  .ControlContainer {
+    label {
+      display: block;
+      width: 100%;
+      font-size: 12px;
+      font-weight: bold;
+      margin-bottom: 5px;
+    }
+    button {
+      padding: 5px;
+      border: 1px solid $primary-contrast-color;
+      border-radius: 5px;
+      width: 25px;
+      cursor: pointer;
+      display: flex;
+      flex-direction: column;
+      margin-bottom: 4px;
+    }
+    .ActionsSvg  {
+      height: 1em;
+      width: 1em;
+      display: flex;
+      justify-content: center;
+      cursor: pointer;
+    }
   }
 
   .ControlContainer button {
     padding: 5px;
-    border: 1px solid #07072A;
+    border: 1px solid $primary-contrast-color;
     border-radius: 5px;
     width: 25px;
     cursor: pointer;
@@ -854,6 +921,39 @@
     margin-bottom: 4px;
   }
 
+  .ControlContainer .ActionsSvg {
+    height: 1em;
+    width: 1em;
+    display: flex;
+    justify-content: center;
+    cursor: pointer;
+  }
+
+  .AddLimitControl .ActionsSvg {
+    height: 2em;
+    width: 2em;
+    display: flex;
+    justify-content: center;
+    cursor: pointer;
+    padding: 5px;
+    margin-right: 5px;
+    border: 1px solid $primary-contrast-color;
+    border-radius: 4px;
+    background: var(--emw--color-white, #FFFFFF);
+  }
+
+  .AddLimitSvg {
+    height: 2em;
+    width: 2em;
+    padding: 5px;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    background-color: white;
+    border: 1px solid $primary-contrast-color;
+    border-radius: 4px;
+  }
+
   .Gauge {
     width: 100%;
     font-family: 'Roboto', sans-serif;

package/src/images/fa-plus-solid.svg.svelte

@@ -0,0 +1,2 @@
+<svelte:options tag={'plus-icon'} />
+<svg xmlns="http://www.w3.org/2000/svg" class="ControlContainerSvg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z"/></svg>

package/src/translations.js

@@ -23,7 +23,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Reset",
     "infoLabel": "Info",
     "walletLabel": "Wallet",
-    "walletsLabel": "Wallets"
+    "walletsLabel": "Wallets",
+    "addLimitTitle": "Add limit",
+    "editLimitTitle": "Edit Limit",
+    "deleteLimitTitle": "Delete limit",
+    "cancelScheduleTitle": "Cancel schedule",
+    "addLimitText": "Add monetary limit"
   },
   "zh-hk": {
     "noLimitToDisplay": "使用者尚未設定限額...",
@@ -49,7 +54,12 @@ export const TRANSLATIONS = {
     "resetLabel": "重設",
     "infoLabel": "信息",
     "walletLabel": "錢包",
-    "walletsLabel": "錢包"
+    "walletsLabel": "錢包",
+    "addLimitTitle": "新增限制",
+    "editLimitTitle": "編輯限制",
+    "deleteLimitTitle": "刪除限制",
+    "cancelScheduleTitle": "取消行程",
+    "addLimitText": "新增貨幣限額"
   },
   "de": {
     "noLimitToDisplay": "Der Benutzer hat kein Limit festgelegt...",
@@ -75,7 +85,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Zurücksetzen",
     "infoLabel": "Info",
     "walletLabel": "Brieftasche",
-    "walletsLabel": "Brieftaschen"
+    "walletsLabel": "Brieftaschen",
+    "addLimitTitle": "Limit hinzufügen",
+    "editLimitTitle": "Limit bearbeiten",
+    "deleteLimitTitle": "Limit löschen",
+    "cancelScheduleTitle": "Zeitplan abbrechen",
+    "addLimitText": "Geldlimit hinzufügen"
   },
   "it": {
     "noLimitToDisplay": "L'utente non ha impostato un limite...",
@@ -101,7 +116,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Ripristina",
     "infoLabel": "Info",
     "walletLabel": "Portafoglio",
-    "walletsLabel": "Portafogli"
+    "walletsLabel": "Portafogli",
+    "addLimitTitle": "Aggiungi limite",
+    "editLimitTitle": "Modifica limite",
+    "deleteLimitTitle": "Elimina limite",
+    "cancelScheduleTitle": "Annulla pianificazione",
+    "addLimitText": "Aggiungi limite monetario"
   },
   "fr": {
     "noLimitToDisplay": "L'utilisateur n'a pas fixé de limite...",
@@ -127,7 +147,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Réinitialiser",
     "infoLabel": "Info",
     "walletLabel": "Portefeuille",
-    "walletsLabel": "Portefeuilles"
+    "walletsLabel": "Portefeuilles",
+    "addLimitTitle": "Ajouter une limite",
+    "editLimitTitle": "Modifier la limite",
+    "deleteLimitTitle": "Supprimer la limite",
+    "cancelScheduleTitle": "Annuler le planning",
+    "addLimitText": "Ajouter une limite monétaire"
   },
   "es": {
     "noLimitToDisplay": "El usuario no ha establecido un límite...",
@@ -153,7 +178,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Reiniciar",
     "infoLabel": "Información",
     "walletLabel": "Cartera",
-    "walletsLabel": "Carteras"
+    "walletsLabel": "Carteras",
+    "addLimitTitle": "Agregar límite",
+    "editLimitTitle": "Editar límite",
+    "deleteLimitTitle": "Eliminar límite",
+    "cancelScheduleTitle": "Cancelar programación",
+    "addLimitText": "Agregar límite monetario"
   },
   "el": {
     "noLimitToDisplay": "Ο χρήστης δεν έχει ορίσει όριο...",
@@ -179,7 +209,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Επαναφορά",
     "infoLabel": "Πληροφορίες",
     "walletLabel": "Πορτοφόλι",
-    "walletsLabel": "Πορτοφόλια"
+    "walletsLabel": "Πορτοφόλια",
+    "addLimitTitle": "Προσθήκη ορίου",
+    "editLimitTitle": "Επεξεργασία ορίου",
+    "deleteLimitTitle": "Διαγραφή ορίου",
+    "cancelScheduleTitle": "Ακύρωση προγράμματος",
+    "addLimitText": "Προσθήκη νομισματικού ορίου"
   },
   "tr": {
     "noLimitToDisplay": "Kullanıcı bir sınırlama belirlemedi...",
@@ -205,7 +240,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Sıfırla",
     "infoLabel": "Bilgi",
     "walletLabel": "Cüzdan",
-    "walletsLabel": "Cüzdanlar"
+    "walletsLabel": "Cüzdanlar",
+    "addLimitTitle": "Sınır ekle",
+    "editLimitTitle": "Sınırı Düzenle",
+    "deleteLimitTitle": "Sınırı sil",
+    "cancelScheduleTitle": "Programı iptal et",
+    "addLimitText": "Para limiti ekle"
   },
   "ru": {
     "noLimitToDisplay": "Пользователь не установил лимит...",
@@ -231,7 +271,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Сброс",
     "infoLabel": "Информация",
     "walletLabel": "Кошелек",
-    "walletsLabel": "Кошельки"
+    "walletsLabel": "Кошельки",
+    "addLimitTitle": "Добавить лимит",
+    "editLimitTitle": "Изменить лимит",
+    "deleteLimitTitle": "Удалить лимит",
+    "cancelScheduleTitle": "Отменить расписание",
+    "addLimitText": "Добавить денежный лимит"
   },
   "ro": {
     "noLimitToDisplay": "Utilizatorul nu a setat nicio limită...",
@@ -257,7 +302,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Resetare",
     "infoLabel": "Info",
     "walletLabel": "Portofel",
-    "walletsLabel": "Portofele"
+    "walletsLabel": "Portofele",
+    "addLimitTitle": "Adăugați limită",
+    "editLimitTitle": "Editați limita",
+    "deleteLimitTitle": "Ștergeți limita",
+    "cancelScheduleTitle": "Anulați programul",
+    "addLimitText": "Adăugați o limită monetară"
   },
   "hr": {
     "noLimitToDisplay": "Korisnik nije postavio limit...",
@@ -283,7 +333,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Resetiraj",
     "infoLabel": "Informacije",
     "walletLabel": "Novčanik",
-    "walletsLabel": "Novčanici"
+    "walletsLabel": "Novčanici",
+    "addLimitTitle": "Dodaj ograničenje",
+    "editLimitTitle": "Uredi ograničenje",
+    "deleteLimitTitle": "Ograničenje brisanja",
+    "cancelScheduleTitle": "Otkaži raspored",
+    "addLimitText": "Dodaj novčani limit"
   },
   "hu": {
     "noLimitToDisplay": "A felhasználó nem állított be korlátot...",
@@ -309,7 +364,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Visszaállítás",
     "infoLabel": "Információ",
     "walletLabel": "Pénztárca",
-    "walletsLabel": "Pénztárcák"
+    "walletsLabel": "Pénztárcák",
+    "addLimitTitle": "Korlát hozzáadása",
+    "editLimitTitle": "Korlát szerkesztése",
+    "deleteLimitTitle": "Korlát törlése",
+    "cancelScheduleTitle": "Ütemezés törlése",
+    "addLimitText": "Pénzösszeg hozzáadása"
   },
   "pl": {
     "noLimitToDisplay": "Użytkownik nie ustawił limitu...",
@@ -335,7 +395,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Resetuj",
     "infoLabel": "Informacje",
     "walletLabel": "Portfel",
-    "walletsLabel": "Portfele"
+    "walletsLabel": "Portfele",
+    "addLimitTitle": "Dodaj limit",
+    "editLimitTitle": "Limit edycji",
+    "deleteLimitTitle": "Usuń limit",
+    "cancelScheduleTitle": "Anuluj harmonogram",
+    "addLimitText": "Dodaj limit pieniężny"
   },
   "pt": {
     "noLimitToDisplay": "O usuário não definiu um limite...",
@@ -361,7 +426,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Redefinir",
     "infoLabel": "Informação",
     "walletLabel": "Carteira",
-    "walletsLabel": "Carteiras"
+    "walletsLabel": "Carteiras",
+    "addLimitTitle": "Adicionar limite",
+    "editLimitTitle": "Editar Limite",
+    "deleteLimitTitle": "Excluir limite",
+    "cancelScheduleTitle": "Cancelar agendamento",
+    "addLimitText": "Adicionar limite monetário"
   },
   "sl": {
     "noLimitToDisplay": "Uporabnik ni določil omejitve...",
@@ -387,7 +457,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Ponastavi",
     "infoLabel": "Informacije",
     "walletLabel": "Denarnica",
-    "walletsLabel": "Denarnice"
+    "walletsLabel": "Denarnice",
+    "addLimitTitle": "Dodaj omejitev",
+    "editLimitTitle": "Uredi omejitev",
+    "deleteLimitTitle": "Omejitev brisanja",
+    "cancelScheduleTitle": "Prekliči razpored",
+    "addLimitText": "Dodaj denarno omejitev"
   },
   "sr": {
     "noLimitToDisplay": "Korisnik nije postavio limit...",
@@ -413,7 +488,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Resetuj",
     "infoLabel": "Informacije",
     "walletLabel": "Novčanik",
-    "walletsLabel": "Novčanici"
+    "walletsLabel": "Novčanici",
+    "addLimitTitle": "Додај ограничење",
+    "editLimitTitle": "Ограничење уређивања",
+    "deleteLimitTitle": "Избриши ограничење",
+    "cancelScheduleTitle": "Откажи распоред",
+    "addLimitText": "Додај новчано ограничење"
   },
   "es-mx": {
     "noLimitToDisplay": "El usuario no ha establecido un límite...",
@@ -439,7 +519,12 @@ export const TRANSLATIONS = {
     "resetLabel": "Reiniciar",
     "infoLabel": "Información",
     "walletLabel": "Cartera",
-    "walletsLabel": "Carteras"
+    "walletsLabel": "Carteras",
+    "addLimitTitle": "Agregar límite",
+    "editLimitTitle": "Editar límite",
+    "deleteLimitTitle": "Eliminar límite",
+    "cancelScheduleTitle": "Cancelar programación",
+    "addLimitText": "Agregar límite monetario"
   },
   "pt-br": {
     "noLimitToDisplay": "O usuário não definiu um limite...",
@@ -465,6 +550,11 @@ export const TRANSLATIONS = {
     "resetLabel": "Redefinir",
     "infoLabel": "Informação",
     "walletLabel": "Carteira",
-    "walletsLabel": "Carteiras"
+    "walletsLabel": "Carteiras",
+    "addLimitTitle": "Agregar límite",
+    "editLimitTitle": "Editar límite",
+    "deleteLimitTitle": "Eliminar límite",
+    "cancelScheduleTitle": "Cancelar programación",
+    "addLimitText": "Agregar límite monetario"
   }
-}
+};