@everymatrix/general-player-register-form-step2 0.0.293 → 0.0.296

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/general-player-register-form-step2",
-  "version": "0.0.293",
+  "version": "0.0.296",
   "main": "dist/general-player-register-form-step2.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -36,5 +36,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5b7aee827d2cbc67a99e15775c630c6f9ddfbf43"
+  "gitHead": "628a0e30f5160748837a6a7acb4cf44623d87c3d"
 }

package/src/GeneralPlayerRegisterFormStep2.svelte

@@ -9,12 +9,16 @@
   export let endpoint:string = '';
   export let lang:string = '';
   export let licenseyears:string = '';
+  // Possible disabled fields = ['fistName', 'lastName', 'birthDate', 'birthPlace'];
+  export let disabledfields:string = '';
 
   let invalidFirstName:boolean = false;
   let invalidLastName:boolean = false;
   let invalidBirthDate:boolean = false;
   let invalidBirthPlace:boolean = false;
 
+  let disabledFieldsList:Array<string>;
+
   let userTitleSelected:string;
   let userFirstName:string = '';
   let userLastName:string = '';
@@ -26,7 +30,7 @@
   let birthYearSelected:number;
   let birthPlace:string = '';
   let currencies:Array<Object> = [];
-  let currencySelected:string = '';
+  let currencySelected:any = '';
   let currentDate:Date = new Date();
   let minDate:number;
   let maxDate:number;
@@ -81,7 +85,7 @@
     }
   }
 
-  const checkName = (name) => {
+  const checkName = (name:string):boolean => {
     if (name && name.length >=2 && name.length <= 50) {
       return true;
     }
@@ -89,30 +93,33 @@
     return false;
   }
 
-  const validateUserFirstName = () => {
+  const validateUserFirstName = ():void => {
     invalidFirstName = !checkName(userFirstName);
+
     checkIsValid();
   }
 
-  const validateUserLastName = () => {
+  const validateUserLastName = ():void => {
     invalidLastName = !checkName(userLastName);
+
     checkIsValid();
   }
 
-  const checkBirthPlace = () => {
-    if(birthPlace && birthPlace.length <= 120) {
+  const checkBirthPlace = ():boolean => {
+    if (birthPlace && birthPlace.length <= 120) {
       return true;
     }
 
     return false;
   }
 
-  const validateBirthPlace = () => {
+  const validateBirthPlace = ():void => {
     invalidBirthPlace = !checkBirthPlace();
+
     checkIsValid();
   }
 
-  const goNext = () => {
+  const goNext = ():void => {
     let registerStepTwoData = {
       userTitleSelected,
       userFirstName,
@@ -122,12 +129,12 @@
       birthYearSelected,
       birthPlace,
       currencySelected
-    }
+    };
 
     window.postMessage({ type: 'RegisterStepTwo', registerStepTwoData }, window.location.href);
   }
 
-  const goBack = () => {
+  const goBack = ():void => {
     let registerStepTwoData = {
       userTitleSelected,
       userFirstName,
@@ -137,12 +144,12 @@
       birthYearSelected,
       birthPlace,
       currencySelected
-    }
+    };
 
     window.postMessage({ type: 'GoBackStepTwo', registerStepTwoData }, window.location.href);
   }
 
-  const messageHandler = (e:any) => {
+  const messageHandler = (e:any):void => {
     if (e.data) {
       switch(e.data.type) {
         case 'StepTwoDataBackup':
@@ -156,15 +163,34 @@
           currencySelected = e.data.userData.currency;
           checkIsValid();
           break;
-
-        default:
-          // do nothing
-          break;
       }
     }
   }
 
-  const initialLoad = () => {
+  const formatDisabledFields = ():void => {
+    disabledFieldsList = disabledfields.split(',');
+
+    if (disabledFieldsList.indexOf('firstName') >= 0) {
+      userFirstName = 'dummy first name';
+      invalidFirstName = false;
+    } 
+
+    if (disabledFieldsList.indexOf('lastName') >= 0) {
+      userLastName = 'dummy last name';
+      invalidLastName = false;
+    }
+
+    if (disabledFieldsList.indexOf('birthPlace') >= 0) {
+      birthPlace = 'dummy birth place';
+      invalidBirthPlace = false;
+    }
+
+    if (disabledFieldsList.indexOf('birthDate') >= 0) {
+      invalidBirthDate = false;
+    }
+  }
+
+  const setActiveLanguage = ():void => {
     setLocale(lang);
   }
 
@@ -177,8 +203,9 @@
   });
 
   $: endpoint && getCurrencies();
-  $: lang && initialLoad();
+  $: lang && setActiveLanguage();
   $: licenseyears && createYearsArray();
+  $: disabledfields && formatDisabledFields();
 </script>
 
 <div class="RegisterFormHeader" part="RegisterFormHeader">
@@ -197,21 +224,21 @@
       <option value="Ms.">{$_('registerFormStep2.registerUserTitleSelectMs')}</option>
     </select>
   </div>
-  <div class="FirstNameContainer {invalidFirstName ? 'InvalidField' : ''}" part="FirstNameContainer {invalidFirstName ? 'InvalidField' : ''}">
+  <div class="FirstNameContainer {invalidFirstName ? 'InvalidField' : ''}{disabledFieldsList?.indexOf('firstName') >= 0 ? 'Hidden' : ''}" part="FirstNameContainer {invalidFirstName ? 'InvalidField' : ''}">
     <label for="FirstName">{$_('registerFormStep2.registerFirstName')}:<span class="FormRequired" part="FormRequired">*</span></label>
     <input bind:value={userFirstName} on:blur={validateUserFirstName} type="text" id="FirstName" />
     {#if invalidFirstName}
       <p class="InvalidInput" part="InvalidInput">{$_('registerFormStep2.registerFirstNameError')}</p>
     {/if}
   </div>
-  <div class="LastNameContainer {invalidLastName ? 'InvalidField' : ''}" part="LastNameContainer {invalidLastName ? 'InvalidField' : ''}">
+  <div class="LastNameContainer {invalidLastName ? 'InvalidField' : ''}{disabledFieldsList?.indexOf('lastName') >= 0 ? 'Hidden' : ''}" part="LastNameContainer {invalidLastName ? 'InvalidField' : ''}">
     <label for="LastName">{$_('registerFormStep2.registerLastName')}:<span class="FormRequired" part="FormRequired">*</span></label>
     <input bind:value={userLastName} on:blur={validateUserLastName} type="text" id="LastName" />
     {#if invalidLastName}
       <p class="InvalidInput" part="InvalidInput">{$_('registerFormStep2.registerLastNameError')}</p>
     {/if}
   </div>
-  <div class="BirthDateContainer" part="BirthDateContainer">
+  <div class="BirthDateContainer {disabledFieldsList?.indexOf('birthDate') >= 0 ? 'Hidden' : ''}" part="BirthDateContainer">
     <label>{$_('registerFormStep2.registerDateOfBirth')}:<span class="FormRequired" part="FormRequired">*</span></label>
     <div class="BirthDateOptions" part="BirthDateOptions">
       <select bind:value={birthDaySelected} on:change={validateBirthDate} class="BirthDaySelected" part="BirthDaySelected">
@@ -239,7 +266,7 @@
       {/if}
     </div>
   </div>
-  <div class="BirthPlaceContainer {invalidBirthPlace ? 'InvalidField' : ''}" part="BirthPlaceContainer {invalidBirthPlace ? 'InvalidField' : ''}">
+  <div class="BirthPlaceContainer {invalidBirthPlace ? 'InvalidField' : ''}{disabledFieldsList?.indexOf('birthPlace') >= 0 ? 'Hidden' : ''}" part="BirthPlaceContainer {invalidBirthPlace ? 'InvalidField' : ''}">
     <label for="BirthPlace">{$_('registerFormStep2.registerBirthPlace')}:<span class="FormRequired" part="FormRequired">*</span></label>
     <input bind:value={birthPlace} on:keyup={validateBirthPlace} type="text" id="BirthPlace" />
     {#if invalidBirthPlace}
@@ -350,6 +377,10 @@
         color: var(--emfe-w-color-primary, #D0046C);
       }
     }
+
+    &.Hidden {
+      display: none;
+    }
   }
 
   .BirthDateOptions {