Fix MVC design pattern

javascript-practice/src/js/views/registerView.js

@@ -32,13 +32,16 @@ export default class RegisterView extends CommonLoginRegisterView {
   /**
    * Implement register success popup in site
    */
-  initRegisterSuccessPopup() {
+  showRegisterSuccessPopup() {
     const typePopup = TYPE_POPUP.success;
     const title = 'Register Commpleted';
     const content = 'Please login to continue!';
     const btnContent = 'OK';
 
     this.initPopupContent(typePopup, title, content, btnContent);
+
+    // Show popup
+    this.tooglePopupForm();
   }
 
   /**
@@ -51,5 +54,53 @@ export default class RegisterView extends CommonLoginRegisterView {
     const btnContent = 'Got it!';
 
     this.initPopupContent(typePopup, title, content, btnContent);
+
+    // Show popup
+    this.tooglePopupForm();
+  }
+
+  /**
+   * Add event listener for form input
+   * @param {Function} handler The function need to be set event
+   */
+  addHandlerForm(checkExistUser, saveUser) {
+    this.parentElement.addEventListener('submit', (e) => {
+      e.preventDefault();
+      this.clearErrorMessage();
+      this.submitForm(checkExistUser, saveUser);
+    });
+  }
+
+  async submitForm(checkExistUser, saveUser) {
+    try {
+      // Load spinner
+      this.toogleLoaderSpinner();
+
+      // Get data from form
+      const user = this.getDataFromForm();
+
+      // Save user
+      if (user) {
+        // Check user exist
+        const userExist = await checkExistUser(user.email);
+        if (userExist) {
+          throw Error('User is exists! Please try another email!');
+        } else {
+          await saveUser(user);
+          // Show popup success
+          this.showRegisterSuccessPopup();
+        }
+      }
+    } catch (error) {
+      // Show popup error
+      this.initErrorPopup(error);
+    }
+
+    // Close spinner
+    this.toogleLoaderSpinner();
+  }
+
+  checkRegisterFormElExist() {
+    return this.registerForm !== null;
   }
 }