Refactor popups a little

This commit is contained in:
Magnus Hoff 2017-12-01 16:52:39 +01:00
parent ebef585c9c
commit 259c884045

View file

@ -20,12 +20,22 @@ function isEdited(form) {
return false;
}
function loginDialog(loginUrl) {
const loginDialogHtml = "<div class=popup><div class=message><p>Your changes could not be saved</p><p>Log in and try again</p></div><div class=btn-row><button>Never mind</button> <a href='' target=login>Open login page</a></div></div>";
const dialogTemplate = {
login: "<div class=popup><div class=message><p>Your changes could not be saved</p><p>Log in and try again</p></div><div class=btn-row><button>Never mind</button> <a href='' target=login>Open login page</a></div></div>",
alert: "<div class=popup><div class=message></div><div class=btn-row><button>OK</button></div></div>",
confirm:"<div class=popup><div class=message></div><div class=btn-row><button name=no>No</button> <button name=yes>Yes</button></div></div>"
};
function createPopup(templateId) {
const dialog = document.createElement("div");
dialog.className = "modal-block";
dialog.innerHTML = loginDialogHtml;
dialog.innerHTML = dialogTemplate[templateId];
return dialog;
}
function loginDialog(loginUrl) {
const dialog = createPopup("login");
const remove = () => document.body.removeChild(dialog);
const loginLink = dialog.querySelector("a");
const dismiss = dialog.querySelector("button");
@ -35,10 +45,6 @@ function loginDialog(loginUrl) {
document.body.appendChild(dialog);
loginLink.focus();
function remove() {
document.body.removeChild(dialog);
}
return new Promise((resolve, reject) => {
loginLink.addEventListener("click", () => {
remove();
@ -53,11 +59,8 @@ function loginDialog(loginUrl) {
}
function alertAsync(message) {
const dialogHtml = "<div class=popup><div class=message></div><div class=btn-row><button>OK</button></div></div>";
const dialog = document.createElement("div");
dialog.className = "modal-block";
dialog.innerHTML = dialogHtml;
const dialog = createPopup("alert");
const remove = () => document.body.removeChild(dialog);
const messageNode = dialog.querySelector(".message");
const dismiss = dialog.querySelector("button");
@ -67,10 +70,6 @@ function alertAsync(message) {
document.body.appendChild(dialog);
dismiss.focus();
function remove() {
document.body.removeChild(dialog);
}
return new Promise((resolve, reject) => {
dismiss.addEventListener("click", () => {
remove();
@ -80,11 +79,8 @@ function alertAsync(message) {
}
function confirmAsync(message) {
const dialogHtml = "<div class=popup><div class=message></div><div class=btn-row><button name=no>No</button> <button name=yes>Yes</button></div></div>";
const dialog = document.createElement("div");
dialog.className = "modal-block";
dialog.innerHTML = dialogHtml;
const dialog = createPopup("confirm");
const remove = () => document.body.removeChild(dialog);
const messageNode = dialog.querySelector(".message");
const btnNo = dialog.querySelector('button[name="no"]');
@ -95,10 +91,6 @@ function confirmAsync(message) {
document.body.appendChild(dialog);
btnNo.focus();
function remove() {
document.body.removeChild(dialog);
}
return new Promise((resolve, reject) => {
btnNo.addEventListener("click", () => {
remove();