diff options
Diffstat (limited to 'WebInterface/NodeJSServer/src/modules/ui/modal.js')
-rw-r--r-- | WebInterface/NodeJSServer/src/modules/ui/modal.js | 21 |
1 files changed, 20 insertions, 1 deletions
diff --git a/WebInterface/NodeJSServer/src/modules/ui/modal.js b/WebInterface/NodeJSServer/src/modules/ui/modal.js index 55e38bd..10a1be5 100644 --- a/WebInterface/NodeJSServer/src/modules/ui/modal.js +++ b/WebInterface/NodeJSServer/src/modules/ui/modal.js @@ -1,4 +1,12 @@ +/** + * Parent class to create Modals on the screen + * Contains no content, as that is implemented by child classes + */ export default class Modal { + /** + * Creates a new modal with a title and empty content + * @param {string} titleString Title to show at the top of the modal + */ constructor(titleString) { let modalBackground = document.createElement('div'); let modal = document.createElement('div'); @@ -8,7 +16,7 @@ export default class Modal { modalBackground.className = 'modal-container'; modal.className = 'modal'; title.className = 'modal-title'; - body.className = 'modal-body' + body.className = 'modal-body'; title.textContent = titleString; @@ -25,6 +33,10 @@ export default class Modal { this.registerEvents(); } + /** + * Register event to close if clicked outside of modal + * Clicking on the modal itself should not close it though + */ registerEvents() { this.modal.addEventListener('click', (e) => { e.stopPropagation(); @@ -35,6 +47,9 @@ export default class Modal { }); } + /** + * Fades modal out and removes it from the flow of the document + */ close() { this.bg.classList.add('hidden'); this.bg.addEventListener('transitionend', () => { @@ -42,6 +57,10 @@ export default class Modal { }); } + /** + * Puts text in the body + * @param {string} text Text to put into the body + */ setBodyText(text) { this.body.textContent = text; } |