@everymatrix/general-registration 1.60.0 → 1.60.2

package/dist/collection/components/general-registration/general-registration.js

@@ -5,6 +5,7 @@ import "../../../../../general-input/dist/types/index";
 import "../../../../../../svelte/player-consents/es2015/player-consents";
 export class GeneralRegistration {
     constructor() {
+        this.isInitialInteraction = true;
         this.listOfInputValues = [];
         this.listOfInputValidity = [];
         this.listOfActions = [];
@@ -32,6 +33,16 @@ export class GeneralRegistration {
                 setTimeout(() => { this.host.shadowRoot.prepend(cssFile); }, 1);
             });
         };
+        // handles sending a custom event for initial interaction with the registration form
+        this.handleInitialClick = (e) => {
+            e.preventDefault();
+            if (!this.isInitialInteraction)
+                return;
+            if (this.isInitialInteraction) {
+                dispatchCustomEvent('register_start', { field: e.target.name });
+                this.isInitialInteraction = false;
+            }
+        };
         this.endpoint = undefined;
         this.language = 'en';
         this.clientStyling = '';
@@ -312,12 +323,36 @@ export class GeneralRegistration {
                     }
                 });
             }
-            if (this.registrationStep === 'Step1')
-                dispatchCustomEvent('register_step1', { eventLabel: this.registrationStep, eventAction: 'nextStep', eventCategory: 'Registration' });
-            else if (this.registrationStep === 'Step2')
-                dispatchCustomEvent('register_step2', { eventLabel: this.registrationStep, eventAction: 'nextStep', eventCategory: 'Registration' });
-            else if (this.registrationStep === 'Step3')
-                dispatchCustomEvent('register_step3', { eventLabel: this.registrationStep, eventAction: 'nextStep', eventCategory: 'Registration' });
+            // handles sending suctom events and the requested data for each registration step
+            if (this.registrationStep === 'Step1') {
+                const eventData = {
+                    // @ts-ignore
+                    IBAN: registerStep.registerUserDto.IBAN,
+                    // @ts-ignore
+                    username: registerStep.registerUserDto.Username,
+                };
+                dispatchCustomEvent('register_step1', { eventLabel: this.registrationStep, eventAction: 'nextStep', eventCategory: 'Registration', eventData: eventData });
+            }
+            else if (this.registrationStep === 'Step2') {
+                const eventData = {
+                    // @ts-ignore
+                    gender: registerStep.registerUserDto.Gender,
+                    // @ts-ignore
+                    fullName: `${registerStep.registerUserDto.FirstnameOnDocument} ${registerStep.registerUserDto.LastNameOnDocument}`,
+                    // @ts-ignore
+                    city: registerStep.registerUserDto.City
+                };
+                dispatchCustomEvent('register_step2', { eventLabel: this.registrationStep, eventAction: 'nextStep', eventCategory: 'Registration', eventData: eventData });
+            }
+            else if (this.registrationStep === 'Step3') {
+                const eventData = {
+                    // @ts-ignore
+                    OIB: registerStep.registerUserDto.PersonalID,
+                    // @ts-ignore
+                    documentType: registerStep.registerUserDto.DocumentType,
+                };
+                dispatchCustomEvent('register_step3', { eventLabel: this.registrationStep, eventAction: 'nextStep', eventCategory: 'Registration', eventData: eventData });
+            }
             return res.json();
         })
             .then((data) => {
@@ -409,7 +444,7 @@ export class GeneralRegistration {
                         type: 'success',
                         message: translate('successMessage', this.language)
                     } }, window.location.href);
-                dispatchCustomEvent('register_success', { userId: data.userId });
+                dispatchCustomEvent('register_closed', { userId: data.userId });
             }
         })
             .catch((err) => {
@@ -583,7 +618,7 @@ export class GeneralRegistration {
     }
     renderForm() {
         return this.forms.map((form, index) => {
-            return h("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index + 1}` ? 'hidden' : ''}`, ref: el => this.form = el }, form[this.registrationStep] && form[this.registrationStep].map(input => h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
+            return h("form", { onClick: this.handleInitialClick, action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index + 1}` ? 'hidden' : ''}`, ref: el => this.form = el }, form[this.registrationStep] && form[this.registrationStep].map(input => h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
                     ? (input.inputType.toLowerCase() == 'checkboxgroup' || input.inputType.toLowerCase() == 'togglecheckbox')
                         ? input.data.subFields
                         : input.data.values