diff --git a/src/public/javascripts/dialogs/attributes.js b/src/public/javascripts/dialogs/attributes.js index 0fafa1333..efb335103 100644 --- a/src/public/javascripts/dialogs/attributes.js +++ b/src/public/javascripts/dialogs/attributes.js @@ -236,7 +236,7 @@ async function showDialog() { $dialog.on('focus', '.attribute-name', function (e) { attributeAutocompleteService.initAttributeNameAutocomplete({ $el: $(this), - attrTypeFunc: () => { + attributeType: () => { const attribute = attributesModel.getTargetAttribute(this); return (attribute().type === 'relation' || attribute().type === 'relation-definition') ? 'relation' : 'label'; }, diff --git a/src/public/javascripts/dialogs/prompt.js b/src/public/javascripts/dialogs/prompt.js index 93c9b323f..0425dee60 100644 --- a/src/public/javascripts/dialogs/prompt.js +++ b/src/public/javascripts/dialogs/prompt.js @@ -4,19 +4,28 @@ const $answer = $("#prompt-dialog-answer"); const $form = $("#prompt-dialog-form"); let resolve; +let shownCb; -function ask(message, defaultValue = '') { +function ask({ message, defaultValue, shown }) { glob.activeDialog = $dialog; + shownCb = shown; + $question.text(message); - $answer.val(defaultValue); + $answer.val(defaultValue || ""); $dialog.modal(); return new Promise((res, rej) => { resolve = res; }); } -$dialog.on('shown.bs.modal', () => $answer.focus().select()); +$dialog.on('shown.bs.modal', () => { + if (shownCb) { + shownCb({ $dialog, $question, $answer, $form }); + } + + $answer.focus().select(); +}); $dialog.on("hidden.bs.modal", () => { if (resolve) { diff --git a/src/public/javascripts/services/attribute_autocomplete.js b/src/public/javascripts/services/attribute_autocomplete.js index 9bea5dd2e..c7d7aa5eb 100644 --- a/src/public/javascripts/services/attribute_autocomplete.js +++ b/src/public/javascripts/services/attribute_autocomplete.js @@ -2,10 +2,10 @@ import server from "./server.js"; /** * @param $el - element on which to init autocomplete - * @param attrTypeFunc - callback providing "relation" or "label" as a type of autocompleted attributes + * @param attributeType - "relation" or "label" or callback providing one of those values as a type of autocompleted attributes * @param open - should the autocomplete be opened after init? */ -function initAttributeNameAutocomplete({ $el, attrTypeFunc, open }) { +function initAttributeNameAutocomplete({ $el, attributeType, open }) { if (!$el.hasClass("aa-input")) { $el.autocomplete({ appendTo: document.querySelector('body'), @@ -16,7 +16,9 @@ function initAttributeNameAutocomplete({ $el, attrTypeFunc, open }) { }, [{ displayKey: 'name', source: async (term, cb) => { - const names = await server.get('attributes/names/?type=' + attrTypeFunc() + '&query=' + encodeURIComponent(term)); + const type = typeof attributeType === "function" ? attributeType() : attributeType; + + const names = await server.get(`attributes/names/?type=${type}&query=${encodeURIComponent(term)}`); const result = names.map(name => { return {name}; }); diff --git a/src/public/javascripts/services/note_detail_relation_map.js b/src/public/javascripts/services/note_detail_relation_map.js index 0d5cdcda9..76a506d98 100644 --- a/src/public/javascripts/services/note_detail_relation_map.js +++ b/src/public/javascripts/services/note_detail_relation_map.js @@ -5,6 +5,7 @@ import libraryLoader from "./library_loader.js"; import treeService from "./tree.js"; import contextMenuWidget from "./context_menu.js"; import infoService from "./info.js"; +import attributeAutocompleteService from "./attribute_autocomplete.js"; import promptDialog from "../dialogs/prompt.js"; import infoDialog from "../dialogs/info.js"; @@ -260,7 +261,15 @@ async function connectionCreatedHandler(info, originalEvent) { return; } - const name = await promptDialog.ask("Specify new relation name:"); + const name = await promptDialog.ask({ + message: "Specify new relation name:", + shown: ({ $answer }) => + attributeAutocompleteService.initAttributeNameAutocomplete({ + $el: $answer, + attributeType: "relation", + open: true + }) + }); if (!name || !name.trim()) { jsPlumbInstance.deleteConnection(connection);