| 1 |
function __tagembed__confirmDialog(option, action) { |
| 2 |
let title = (option.title) ? option.title : 'Action'; |
| 3 |
let message = (option.message) ? option.message : 'Are you sure? ' |
| 4 |
let cancelButtonText = (option.cancelButtonText) ? option.cancelButtonText : 'Cancel'; |
| 5 |
let cancelButtonClass = (option.cancelButtonClass) ? option.cancelButtonClass : ''; |
| 6 |
let buttonText = (option.buttonText) ? option.buttonText : 'Delete'; |
| 7 |
let buttonClass = (option.buttonClass) ? option.buttonClass : ''; |
| 8 |
let typeClass = ''; |
| 9 |
let icon = ''; |
| 10 |
let type = (option.type) ? option.type : 'info'; |
| 11 |
if (type == 'info') { |
| 12 |
typeClass = '__tagembed__bg-info'; |
| 13 |
icon = "fa-info"; |
| 14 |
} else if (type == 'warning') { |
| 15 |
typeClass = '__tagembed__bg-warning'; |
| 16 |
icon = "fa-exclamation"; |
| 17 |
} else if (type == 'success') { |
| 18 |
typeClass = '__tagembed__bg-success'; |
| 19 |
icon = "fa-check"; |
| 20 |
} else if (type == 'danger') { |
| 21 |
typeClass = '__tagembed__bg-danger'; |
| 22 |
icon = "fa-times"; |
| 23 |
} |
| 24 |
|
| 25 |
/* The dialog is built with DOM methods. The title and the message are assigned through |
| 26 |
textContent, so no markup can be produced from them. */ |
| 27 |
let elemId = 'tagembedConfirmDialog'; |
| 28 |
let overlay = document.createElement('div'); |
| 29 |
overlay.setAttribute('id', elemId); |
| 30 |
overlay.className = '__tagembed__overlay'; |
| 31 |
|
| 32 |
let popupWrap = document.createElement('div'); |
| 33 |
popupWrap.className = '__tagembed__popupwrap'; |
| 34 |
overlay.appendChild(popupWrap); |
| 35 |
|
| 36 |
let iconArea = document.createElement('div'); |
| 37 |
iconArea.className = '__tagembed__iconarea ' + typeClass; |
| 38 |
let iconEl = document.createElement('i'); |
| 39 |
iconEl.className = 'fa ' + icon; |
| 40 |
iconEl.setAttribute('aria-hidden', 'true'); |
| 41 |
iconArea.appendChild(iconEl); |
| 42 |
popupWrap.appendChild(iconArea); |
| 43 |
|
| 44 |
let horizontalBorder = document.createElement('hr'); |
| 45 |
horizontalBorder.className = '__tagembed__horizontaborder'; |
| 46 |
popupWrap.appendChild(horizontalBorder); |
| 47 |
|
| 48 |
let titleWrap = document.createElement('div'); |
| 49 |
titleWrap.className = '__tagembed__title'; |
| 50 |
let titleEl = document.createElement('h2'); |
| 51 |
titleEl.textContent = title; |
| 52 |
titleWrap.appendChild(titleEl); |
| 53 |
popupWrap.appendChild(titleWrap); |
| 54 |
|
| 55 |
let descWrap = document.createElement('div'); |
| 56 |
descWrap.className = '__tagembed__desc'; |
| 57 |
let descEl = document.createElement('p'); |
| 58 |
descEl.textContent = message; |
| 59 |
descWrap.appendChild(descEl); |
| 60 |
popupWrap.appendChild(descWrap); |
| 61 |
|
| 62 |
let btnWrap = document.createElement('div'); |
| 63 |
btnWrap.className = '__tagembed__btnwrap'; |
| 64 |
popupWrap.appendChild(btnWrap); |
| 65 |
|
| 66 |
let okayButton = document.createElement('button'); |
| 67 |
okayButton.className = '__tagembed__okaybtn ' + buttonClass + ' ' + typeClass; |
| 68 |
okayButton.setAttribute('id', elemId + 'OkayButton'); |
| 69 |
okayButton.textContent = buttonText; |
| 70 |
btnWrap.appendChild(okayButton); |
| 71 |
|
| 72 |
let cancelButton = document.createElement('button'); |
| 73 |
cancelButton.className = '__tagembed__cancelbtn ' + buttonClass; |
| 74 |
cancelButton.setAttribute('id', elemId + 'CancelButton'); |
| 75 |
cancelButton.textContent = 'Cancel'; |
| 76 |
btnWrap.appendChild(cancelButton); |
| 77 |
|
| 78 |
cancelButton.onclick = function () { |
| 79 |
document.querySelector('#' + elemId).remove(); |
| 80 |
}; |
| 81 |
okayButton.onclick = function () { |
| 82 |
document.querySelector('#' + elemId).remove(); |
| 83 |
(action)(); |
| 84 |
}; |
| 85 |
document.body.appendChild(overlay); |
| 86 |
} |
| 87 |
|
