phew..... hw9 done.

hw9/script.js

@@ -68,20 +68,8 @@ function Password(parent, open=false) {
     wrapper.append(input, btn)
     parent.append(wrapper)
 }
-
 let pass = new Password(document.body, true)
 
-// check if Password constructor works
-// pass.setValue('hello world')
-// pass.setOpen(false)
-// console.log(pass.getOpen())
-// console.log(pass.getValue())
-// window.setTimeout(()=> {
-//     console.log('old value:', pass.getValue())
-//     pass.setValue('YOU CAN SEE ME!')
-//     pass.setOpen(true)
-// }, 5000)
-
 // login form
 function Login (parent) {
     let _value = ''
@@ -177,19 +165,8 @@ function loginForm(parent, heading='loginForm Constructor') {
 
     parent.append(form)
 }
-
 let login_form = new loginForm(document.body)
 
-// login_form.setLogin('default_user')
-// login_form.setPass('pass example', true)
-// window.setTimeout(()=> {
-//     console.log(login_form.getPassword())
-//     console.log('before open', login_form.isPasswordOpened())
-//     login_form.setPasswordOpened(true)
-//     console.log('after open', login_form.isPasswordOpened())
-//     console.log(login_form.getLogin())
-// }, 5000)
-
 // Password Verify
 class PasswordVerify extends Password {
     constructor(parent, open=false) {
@@ -255,18 +232,12 @@ class PasswordVerify extends Password {
         })
     }
 }
-
 document.body.insertAdjacentHTML('beforeend', `
     <div id=verif></div>
 `)
 let verif = document.getElementById('verif')
 let passverif = new PasswordVerify(verif, true)
 
-// window.setTimeout(()=> {
-//     console.log('bang')
-//     passverif.setOpen(false)
-// }, 5000)
-
 // login form 
 function Form(el, data, okCallback, cancelCallback){
     let formBody = document.createElement('div')
@@ -282,52 +253,40 @@ function Form(el, data, okCallback, cancelCallback){
         formBody.appendChild(okButton);
         okButton.onclick = (e) => {
             console.log(this)
-            this.okCallback(e)
+            this.okCallback(this.data)
         }
     }
 
     if (typeof cancelCallback === 'function'){
         formBody.appendChild(cancelButton);
-        cancelButton.onclick = cancelCallback
+        cancelButton.onclick = () => {
+            this.cancelCallback(data)
+            okButton.disabled = true
+        }
     }
 
     el.appendChild(formBody)
-
-
-<<<<<<< HEAD
-    let checkInfo = (value, key, data, input, err) => {
-        console.log(this.initalData)
-        console.log(this.data)
-        for(let key in this.validators) {
-            if(key === 'isValid') continue;
-            this.validators.isValid[key] = false
-        }
-        console.dir(this.validators)
-=======
+    
     this.checkInfo = (value, key, data, input, err) => {
->>>>>>> 4a6ddce12df7d82608b2ab2f1082894f85ada9c2
         let validCheck
         let keyFormated = key
         okButton.disabled = true
         
         try {
-            console.log('valid', this.validators.isValid, data)
             if(key[0] === "*") {
                 keyFormated = key.substring(1)
                 if(this.validators.mandatoryErr(value, key) === true) {
                     validCheck = this.validators[keyFormated]? this.validators[keyFormated](value, keyFormated) : true
                     input.style.backgroundColor = 'transparent'
                     input.style.color = 'black'
-                    console.log(input)
                     err.innerText = ''
-
                 } else {
                     err.innerText = this.validators.mandatoryErr(value, keyFormated)
                     this.validators.isValid[key] = false
                 }
 
             } else {
-                validCheck = this.validators[keyFormated]? this.validators[keyFormated](value, keyFormated) : true
+                validCheck = this.validators[keyFormated]? this.validators[keyFormated](value, keyFormated) : false
             }
 
             if(typeof validCheck === 'string') {
@@ -343,16 +302,20 @@ function Form(el, data, okCallback, cancelCallback){
                 this.validators.isValid[key] = validCheck
             }
 
-            console.log('valid', this.validators.isValid)
-        } catch(e){/*sample text*/}
-
-        try {
             if(Object.values(this.validators.isValid).every((item) => item === true)) {
                 okButton.disabled = false
             } else {
                 okButton.disabled = true
             }
-        } catch(e) {}
+        } catch(e){/*sample text*/}
+
+        // try {
+        //     if(Object.values(this.validators.isValid).every((item) => item === true)) {
+        //         okButton.disabled = false
+        //     } else {
+        //         okButton.disabled = true
+        //     }
+        // } catch(e) {}
     }
 
     let inputCreators = {
@@ -363,18 +326,18 @@ function Form(el, data, okCallback, cancelCallback){
             small.style.color = 'red'
             small.innerText = ''
 
-            if(/^[*]+$/.test(data[key])) {
+            if(/^[*]+$/.test(this.data[key])) {
                 let div = document.createElement('div')
                 input = new Password(div, true)
                 input.getHTMLElements().Password_input.value = ''
-                console.log('iz valid', this.validators.isValid)
-                this.validators.isValid[key] = false
                 wrap.append(input.getHTMLElements().Password_wrapper, small)
+                this.validators.isValid[key] = false
 
                 input.getHTMLElements().Password_input.oninput = (e) => {
                     func(input.getHTMLElements().Password_input.value)
                     this.checkInfo(input.getHTMLElements().Password_input.value, key, {}, input.getHTMLElements().Password_input, small)
                 }
+                
             } else {
                 input = document.createElement('input')
                 input.type = 'text'
@@ -437,34 +400,39 @@ function Form(el, data, okCallback, cancelCallback){
 
     let formTable = document.createElement('table')
     formTable.border = 1
-    for(let key in data) {
-        let tr = document.createElement('tr')
-        let tdKey = document.createElement('td')
-        let tdInput = document.createElement('td')
-        let input = inputCreators[(data[key].constructor.name).toLowerCase()](key, data[key],(value) => {
-            data[key] = value 
-        })
-
-        tdKey.innerHTML = key[0] ==='*'? `<span><span style="color: red;">*&nbsp</span>${key.substring(1)}</span>`:`<span>${key}</span>`
-
-        tdInput.append(input)
-        tr.append(tdKey, tdInput)
-        formTable.append(tr)
+    this.insertInTable = (data) => {
+        for(let i = formTable.children.length-1; i >= 0; i--) {
+            formTable.removeChild(formTable.children[i])
+        }
+        this.validators.isValid = {}
+        this.initialData = Object.assign({}, this.initialData)
+        this.data = data
+        for(let key in data) {
+            let tr = document.createElement('tr')
+            let tdKey = document.createElement('td')
+            let tdInput = document.createElement('td')
+            let input = inputCreators[(data[key].constructor.name).toLowerCase()](key, data[key],(value) => {
+                data[key] = value 
+            })
+            this.checkInfo(data[key], key)
+            tdKey.innerHTML = key[0] ==='*'? `<span><span style="color: red;">*&nbsp</span>${key.substring(1)}</span>`:`<span>${key}</span>`
+    
+            tdInput.append(input)
+            tr.append(tdKey, tdInput)
+            formTable.append(tr)
+        }
+        okButton.before(formTable)
     }
-    okButton.before(formTable)
+    this.insertInTable(data)
+
+    
 
     this.okCallback     = okCallback
     this.cancelCallback = cancelCallback
 
+    this.initialData    = Object.assign({}, data)
     this.data           = data
-<<<<<<< HEAD
-    this.initalData = this.data    
-    this.validators     = {isValid:{}}
-=======
->>>>>>> 4a6ddce12df7d82608b2ab2f1082894f85ada9c2
 }
-
-
 let formContainer = document.createElement('div')
 formContainer.id = 'formContainer'
 document.body.append(formContainer)
@@ -476,7 +444,8 @@ let form = new Form(formContainer, {
     birthday: new Date((new Date).getTime() - 86400000 * 30*365),
     "*password": '**'
 }, () => console.log('ok'),() => console.log('cancel') )
-form.okCallback = () => console.log('ok2')
+form.okCallback = (obj) => console.log('your data:', obj)
+form.cancelCallback = () => form.insertInTable(form.initialData)
 
 form.validators.surname = (value, key, data, input) => value !== '' && value.length > 2 && 
                                                     value[0].toUpperCase() == value[0] && 
@@ -488,7 +457,7 @@ form.validators.mandatoryErr = (value, key, data, input) => {
     if(typeof value === 'boolean') {
         return value === true? value : `${key} is mandatory`
     } else {
-        return value.length > 0 && value !== ''? true : `${key} is mandatory`
+        return value === ''? `${key} is mandatory`:  value.length > 0 && value !== '' && /^([^\W\s]+)$/.test(value)? true : `invalid ${key} format`
     }
 }
 
@@ -509,7 +478,6 @@ form.validators.birthday = (value, key, data, input) => {
 }
 
 for(let key in form) {
-    //проверка изначальных данных
     form.checkInfo(form[key], key,)
 }