diff --git a/babybuddy/static_src/js/tags_editor.js b/babybuddy/static_src/js/tags_editor.js index 03fc07fe..16489fe2 100644 --- a/babybuddy/static_src/js/tags_editor.js +++ b/babybuddy/static_src/js/tags_editor.js @@ -50,6 +50,30 @@ constructor(widget) { this.prototype = widget.querySelector('.prototype-tag'); this.listeners = []; + + this.modalElement = widget.querySelector('.tag-editor-error-modal'); + this.modalBodyNode = this.modalElement.querySelector('.modal-body'); + + // Clean whitespace text nodes between spans + for (const n of this.modalBodyNode.childNodes) { + if (n.nodeType === Node.TEXT_NODE) { + this.modalBodyNode.removeChild(n); + } + } + } + + showModal(msg) { + const selectedMessage = this.modalBodyNode.querySelector(`span[data-message='${msg}']`); + if (!selectedMessage) { + selectedMessage = this.modalBodyNode.childNodes[0]; + } + + for (const n of this.modalBodyNode.childNodes) { + n.classList.add('d-none'); + } + selectedMessage.classList.remove('d-none'); + + jQuery(this.modalElement).modal('show'); } addTagListUpdatedListener(c) { @@ -130,16 +154,12 @@ const uriTagName = encodeURIComponent(tagName); const fail = (msg) => { - msg = msg || "Error creating tag"; - this.addTagInput.select(); - - // TODO: Replace with modal - alert(msg); + this.taggingBase.showModal(msg || "error-creating-tag"); }; if (!tagName) { - fail('Not a valid tag name'); + fail('invalid-tag-name'); return; } @@ -164,10 +184,10 @@ (text) => { const tagJson = JSON.parse(text); addTag(tagJson.name, tagJson.color); - }, fail + }, () => fail("tag-creation-failed") ); } - }, fail + }, () => fail("tag-checking-failed") ); } }; diff --git a/babybuddy/static_src/scss/global.scss b/babybuddy/static_src/scss/global.scss index 666ab6df..d4e83835 100644 --- a/babybuddy/static_src/scss/global.scss +++ b/babybuddy/static_src/scss/global.scss @@ -52,3 +52,8 @@ .icon-2x { font-size: 1.65em; } + +// All modals +.modal-content { + color: theme-color('dark'); +} \ No newline at end of file diff --git a/core/templates/core/widget_tag_editor.html b/core/templates/core/widget_tag_editor.html index 212ce0d0..21b12e13 100644 --- a/core/templates/core/widget_tag_editor.html +++ b/core/templates/core/widget_tag_editor.html @@ -35,4 +35,27 @@ name="tags" value="{% for t in widget.value %}"{{ t.name }}"{% if not forloop.last %},{% endif %}{% endfor %}" > + +