@everymatrix/general-player-register-form-step1 1.17.4 → 1.18.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/general-player-register-form-step1",
-  "version": "1.17.4",
+  "version": "1.18.0",
   "main": "dist/general-player-register-form-step1.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -35,5 +35,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9bb18c43ff2bfc607d04dde35cedd5c861f4d483"
+  "gitHead": "6e90294022b2d742320099f1a4681ee431732dd5"
 }

package/src/GeneralPlayerRegisterFormStep1.svelte

@@ -6,7 +6,7 @@
   import { TRANSLATIONS } from './translations';
 
   export let lang:string = '';
-  // Possible disabled fields: ['email', 'username', 'name', 'password', 'confirmPassword', 'securityQuestion', 'securityAnswer']
+  // Possible disabled fields: ['email', 'username', 'name', 'password', 'confirmPassword', 'securityQuestion', 'securityAnswer', 'promoCode']
   export let disabledfields:string = '';
   export let defaultoptions:string = '';
   export let simplepasswordvalidation:string = 'false';
@@ -22,6 +22,7 @@
   let invalidConfirmPassword:boolean = false;
   let invalidSecurityQuestion:boolean = false;
   let invalidSecurityAnswer:boolean = false;
+  let invalidPromoCode:boolean = false;
 
   let emailFocus:boolean = false;
   let usernameFocus:boolean = false;
@@ -29,6 +30,7 @@
   let confirmPasswordFocus:boolean = false;
   let securityQFocus:boolean = false;
   let securityAFocus:boolean = false;
+  let promoCodeFocus:boolean = false;
 
   let disabledFieldsList:Array<string>;
 
@@ -38,6 +40,7 @@
   let confirmUserPassword:string = '';
   let securityQuestion:string = '';
   let securityAnswer:string = '';
+  let promoCode:string = '';
 
   let isPasswordVisible:boolean = false;
   let isConfirmPasswordVisible:boolean = false;
@@ -77,8 +80,9 @@
   });
 
   const checkIsValid = ():void => {
-    isValid =  !(invalidEmail || invalidName || invalidPassword || invalidConfirmPassword || invalidSecurityQuestion || invalidSecurityAnswer);
+    isValid =  !(invalidEmail || invalidName || invalidPassword || invalidConfirmPassword || invalidSecurityQuestion || invalidSecurityAnswer || invalidPromoCode);
 
+    // not adding invalidPromoCode to this check because the business case states that it is an optional field
     if (userValue.length <= 0 || userEmail.length <= 0 || userPassword.length <= 0 || confirmUserPassword.length <= 0 || securityQuestion.length <= 0 || securityAnswer.length <= 0) {
       isValid = false;
     }
@@ -181,6 +185,16 @@
     checkIsValid();
   }
 
+  // as per the current business case, the promo code field is always valid. Still adding the same overall structure as the other fields for easy maintanence in case this ever changes
+  const checkPromoCode = ():boolean => {
+    return true;
+  }
+
+  const validatePromoCode = ():void => {
+    invalidPromoCode = !checkPromoCode();
+    checkIsValid();
+  }
+
   const checkSecurityQuestion = ():boolean => {
     if (securityQuestion)
     switch(custominputtextswitch) {
@@ -237,7 +251,8 @@
       userPassword,
       confirmUserPassword,
       securityQuestion,
-      securityAnswer
+      securityAnswer,
+      promoCode
     };
 
     window.postMessage({ type: 'RegisterStepOne', registerStepOneData }, window.location.href);
@@ -253,6 +268,7 @@
           confirmUserPassword = e.data.userData.password;
           securityQuestion = e.data.userData.securityQuestion;
           securityAnswer = e.data.userData.securityAnswer;
+          promoCode = e.data.userData.promoCode
           checkIsValid();
           break;
       }
@@ -291,6 +307,11 @@
       securityAnswer = 'dummy answer';
       invalidSecurityAnswer = false;
     }
+
+    if (disabledFieldsList.indexOf('promoCode') >= 0) {
+
+      invalidPromoCode = false;
+    }
   }
 
   const setActiveLanguage = ():void => {
@@ -382,6 +403,17 @@
         <p class="InvalidInput">{$_('registerConfirmPasswordError')}</p>
       {/if}
     </div>
+
+
+    <div class="PromoCodeContainer {disabledFieldsList?.indexOf('promoCode') >= 0 ? 'Hidden' : ''}">
+      <label for="PromoCode">{$_('registerPromoCode')}:</label>
+      <input bind:value={promoCode} on:keyup={validatePromoCode} on:focus={() => promoCodeFocus = true} on:blur={() => promoCodeFocus = false} type="text" id="PromoCode" />
+      {#if invalidPromoCode}
+        <p class="InvalidInput">{$_('promoCodeError')}</p>
+      {/if}
+    </div>
+
+
     <div class="SecurityQuestionContainer {invalidSecurityQuestion && !securityQFocus? 'InvalidField' : ''}{disabledFieldsList?.indexOf('securityQuestion') >= 0 ? 'Hidden' : ''}">
       <label for="SecurityQuestion">{custominputtextswitch == 'true' ? $_('registerSecurityQuestion2') : $_('registerSecurityQuestion')}:<span class="FormRequired">*</span></label>
       <input bind:value={securityQuestion} on:keyup={validateSecurityQuestion} on:focus={() => securityQFocus = true} on:blur={() => securityQFocus = false} type="text" id="SecurityQuestion" />
@@ -428,6 +460,7 @@
   .UserContainer,
   .PasswordContainer,
   .ConfirmPasswordContainer,
+  .PromoCodeContainer,
   .SecurityQuestionContainer,
   .SecurityAnswerContainer {
     color: var(--emfe-w-registration-contrast, var(--emfe-w-color-gray-300, #58586B));

package/src/translations.js

@@ -12,6 +12,8 @@ export const TRANSLATIONS = {
       'registerSimplePasswordError': 'Password must be 8-20 characters long.',
       'registerConfirmPassword': 'Confirm Password',
       'registerConfirmPasswordError': 'It doesn\'t match the password.',
+      'registerPromoCode': 'Promotional Code (Facultative)',
+      'promoCodeError': '',
       'registerSecurityQuestion': 'Security Question',
       'registerSecurityQuestion2': 'Document Type (DNI, Foreign ID Card, Passport)',
       'registerSecurityQuestionError': 'Security question must be at least 1 character long and maximum 120 characters.',
@@ -35,6 +37,8 @@ export const TRANSLATIONS = {
       'registerSimplePasswordError': '密码长度必须为 8-20 个字符。',
       'registerConfirmPassword': '確認密碼',
       'registerConfirmPasswordError': '它與密碼不匹配。',
+      'registerPromoCode': '促销代码',
+      'promoCodeError' : '',
       'registerSecurityQuestion': '安全問題',
       'registerSecurityQuestionError': '安全問題的長度必須至少為 1 個字符，最多 120 個字符。',
       'registerSecurityAnswer': '安全答案',
@@ -54,6 +58,8 @@ export const TRANSLATIONS = {
       'registerSimplePasswordError': 'Le mot de passe doit comporter entre 8 et 20 caractères.',
       'registerConfirmPassword': 'Confirmer le mot de passe',
       'registerConfirmPasswordError': 'ça ne correspond pas au mot de passe.',
+      'registerPromoCode': 'Code Promotionnel (Facultatif)',
+      'promoCodeError': '',
       'registerSecurityQuestion': 'Questions de sécurité',
       'registerSecurityQuestionError': 'La question de sécurité doit comporter au moins un caractère et au maximum 120 caractères.',
       'registerSecurityAnswer': 'Réponse de sécurité',