@everymatrix/general-player-login-form 1.2.1 → 1.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/general-player-login-form",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "main": "dist/general-player-login-form.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -36,5 +36,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "de8b2a024255bd2ed76c13501c5a6dc858263dcb"
+  "gitHead": "02dbae5b4d167acdb57c72905b756343a318870a"
 }

package/src/GeneralPlayerLoginForm.svelte

@@ -20,12 +20,11 @@
   export let simplepasswordvalidation:string = 'false';
   export let clientstyling:string = '';
   export let clientstylingurl:string = '';
-  export let translationUrl:string = '';
+  export let translationurl:string = '';
 
   let playerId;
   let smsTokenId;
-  let startSmsValidation = false;
-  let smsTemplate: string = 'Please use this code {0} to activate your accout';
+  let smsTemplate: string = 'Please use this code {0} to activate your account';
   let smsSendApiFailed = false;
   let number;
   let mobileView:boolean = false;
@@ -55,6 +54,9 @@
 
   let customStylingContainer:HTMLElement;
   let displayNone:boolean = false;
+  let setTimer = +localStorage.getItem('smsTimer') || 0;
+  let currentTimer = Date.now() / 1000 - setTimer;
+  let startSmsValidation = localStorage.getItem('smsValidation') == 'true' && currentTimer < 60 ? true : false;
 
   let regexValidators = {
     user: /^(?!(?:.*\d){9})(?=(?:.*[a-zA-Z]){4})^[a-zA-Z\d]*$/,
@@ -65,7 +67,7 @@
   setupI18n({ withLocale: 'en', translations: {}});
 
   const setTranslationUrl = ():void => {
-    let url:string = translationUrl;
+    let url:string = translationurl;
 
     fetch(url).then((res:any) => res.json())
     .then((res) => {
@@ -124,7 +126,7 @@
   }
 
   const submitLoginForm = (e):void => {
-    e.preventDefault();
+    e?.preventDefault();
     doRecaptcha()
       .then((token:string) => {
         if (checkUserIdentifier(userValue) && checkUserPassword(userPassword)) {
@@ -134,7 +136,6 @@
             token: token
           };
           isLoading = true;
-
           window.postMessage({ type: "SubmitLoginForm", loginData: loginFormData }, window.location.href);
         }
       });
@@ -187,7 +188,10 @@
           number = e.data.number;
           startSmsValidation = e.data.startSmsValidation;
           sendSmsToken(number, playerId);
+          localStorage.setItem('smsValidation', 'true');
+          localStorage.setItem('playerData', JSON.stringify({playerid: playerId, number: number}));
           break;
+
         case 'SmsHasBeenValidated':
           submitLoginForm();
           break;
@@ -196,6 +200,7 @@
   }
 
   const sendSmsToken = async (number, playerId) => {
+    localStorage.setItem('smsTimer', JSON.stringify(Math.floor(Date.now() / 1000)));
     try {
       const res = await fetch(`${endpoint}/player/sms/token`,{
         method: 'POST',
@@ -214,7 +219,7 @@
 
       const data = await res.json();
 
-      if(res.ok) {
+      if (res.ok ) {
         smsTokenId = data.id;
         let smsMaxValidations = data.maxValidationAttempts;
         smsSendApiFailed = false;
@@ -254,10 +259,9 @@
       });
   }
 
-  onMount(async () => {
+  onMount(() => {
     window.addEventListener("message", messageHandler, false);
     window.postMessage({ type: "LoginRegisterModalActive" }, window.location.href);
-
     isOnNative = !!isNative(userAgent);
     waitingForCredentials = isOnNative;
 
@@ -298,7 +302,7 @@
   $: simplepasswordvalidation && verifyTypeOfPassword();
   $: clientstyling && customStylingContainer && setClientStyling();
   $: clientstylingurl && customStylingContainer && setClientStylingURL();
-  $: translationUrl && setTranslationUrl();
+  $: translationurl && setTranslationUrl();
 </script>
 
 <svelte:head>
@@ -309,7 +313,7 @@
 
 <div class="g-recaptcha" data-sitekey="{captchakey}" />
 
-<div bind:this={customStylingContainer}>
+<div class="PlayerLoginFormWrapper" bind:this={customStylingContainer}>
   {#if isLoading}
     <div class="ModalLoaderWrapper" part="ModalLoaderWrapper">
       <div class="ModalLoader" part="ModalLoader"></div>
@@ -382,6 +386,11 @@
   }
 
   .grecaptcha-badge { opacity:0;}
+
+  .PlayerLoginFormWrapper {
+    height: 100%;
+  }
+
   .FormContainer {
     display: inline-flex;
     width: 100%;
@@ -522,7 +531,7 @@
   .FormMobileContainer {
     height:100%;
     .FormLeftSide {
-      padding: 40px 20px;
+      padding: 40px 20px 100%;
     }
     .SignInButton,
     .UserContainer input,

package/src/translations.js

@@ -10,7 +10,7 @@ export const LoginForm = {
       loginPasswordError: 'Password must be 8-20 characters long and contain at least 1 uppercase letter, 1 number and 1 special character.',
       loginSimplePasswordError: 'Password must be 8-20 characters long.',
       loginButton: 'Login',
-      loginForgotPassword: 'I forgot my password'
+      loginForgotPassword: 'I forgot my password',
     }
   },
   zh: {
@@ -24,7 +24,7 @@ export const LoginForm = {
       loginPasswordError: '密碼長度必須為 8-20 個字符，並且至少包含 1 個大寫字母、1 個數字和 1 個特殊字符。',
       loginSimplePasswordError: '密码长度必须为 8-20 个字符。',
       loginButton: '登入',
-      loginForgotPassword: '我忘記了我的密碼'
+      loginForgotPassword: '我忘記了我的密碼',
     }
   },
   fr: {
@@ -38,7 +38,7 @@ export const LoginForm = {
       loginPasswordError: 'Le mot de passe doit comporter de 8 à 20 charactères et contenir au moins une lettre majuscule, un chiffre et un caractère spécial.',
       loginSimplePasswordError: 'Le mot de passe doit comporter entre 8 et 20 caractères.',
       loginButton: 'Se connecter ',
-      loginForgotPassword: 'J\'ai oublié mon mot de passe'
+      loginForgotPassword: 'J\'ai oublié mon mot de passe',
     }
   },
   tr: {
@@ -52,7 +52,7 @@ export const LoginForm = {
       loginPasswordError: 'Şifre 8-20 karakter uzunluğunda olmalı ve en az 1 büyük harf, 1 rakam ve 1 özel karakter içermelidir.',
       loginSimplePasswordError: 'Şifre 8-20 karakter uzunluğunda olmalıdır.',
       loginButton: 'Giriş yapmak',
-      loginForgotPassword: 'I forgot my password'
+      loginForgotPassword: 'I forgot my password',
     }
   },
   ro: {
@@ -66,7 +66,7 @@ export const LoginForm = {
       loginPasswordError: 'Parola trebuie sa aiba o lungime de 8-20 de caractere, sa contina cel putin o litera mare, o cifra si un caracter special.',
       loginSimplePasswordError: 'Parola trebuie să aibă 8-20 de caractere.',
       loginButton: 'Autentificare',
-      loginForgotPassword: 'Mi-am uitat parola'
+      loginForgotPassword: 'Mi-am uitat parola',
     }
   },
   es: {
@@ -80,7 +80,7 @@ export const LoginForm = {
       loginPasswordError: 'La contraseña debe tener de 8 a 20 caracteres y contener al menos 1 letra mayúscula, 1 número y 1 carácter especial.',
       loginSimplePasswordError: 'La contraseña debe tener entre 8 y 20 caracteres.',
       loginButton: 'Iniciar sesión',
-      loginForgotPassword: 'Olvidé mi contraseña'
+      loginForgotPassword: 'Olvidé mi contraseña',
     }
   },
   pt: {
@@ -94,7 +94,7 @@ export const LoginForm = {
       loginPasswordError: 'A senha deve ter de 8 a 20 caracteres e conter pelo menos 1 letra maiúscula, 1 número e 1 caractere especial.',
       loginSimplePasswordError: 'A senha deve ter de 8 a 20 caracteres.',
       loginButton: 'Entrar',
-      loginForgotPassword: 'Esqueci a minha senha'
+      loginForgotPassword: 'Esqueci a minha senha',
     }
   },
 };