Modal Dialog

Output

function hideModal(vib) {
    modal.hidden = true
    if (vib) navigator.vibrate(vib)
}
function mailDialog(button='OK', callback=report) {
  function checkInput() {
    const RE = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+$/i
    if (!RE.test(dMail.value))
        dError.innerText = 'invalid mail address'
    else if (dPass.value.length < 6)
        dError.innerText = 'password too short'
    else dError.innerText = ''
    dAccept.disabled = (dError.innerText != '')
  }
  function getResult() {
    return 'Login '+dMail.value
  }
    dialog.innerHTML = 
     `Mail <BR><input id=dMail type=email><BR>
      <span id=dError></span><BR>
      Password <BR><input id=dPass type=password><BR><BR>
      <button id=dAccept disabled>${button}</button>
      <button id=dClose>x</button>`
    dialog.style.background = '#cfc'
    dMail.oninput = checkInput
    dPass.oninput = checkInput
    dAccept.onclick = () => {
        callback(getResult())
        hideModal(300) //vibrate
    }
    dClose.onclick = hideModal
    modal.hidden = false
    dMail.focus()
}