From 50b976990cbe63bafc602b60408289bfd06eeb52 Mon Sep 17 00:00:00 2001 From: zadam Date: Sun, 5 Jul 2020 23:53:55 +0200 Subject: [PATCH] click on inherited attr will also bring up the attribute detail widget --- package-lock.json | 6 +- package.json | 2 +- src/public/app/widgets/attribute_detail.js | 36 ++++++++-- src/public/app/widgets/note_attributes.js | 78 +++++++++++++++------- 4 files changed, 87 insertions(+), 35 deletions(-) diff --git a/package-lock.json b/package-lock.json index a29bc6cb2..9f70d8b4e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8487,9 +8487,9 @@ } }, "ws": { - "version": "7.3.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-7.3.0.tgz", - "integrity": "sha512-iFtXzngZVXPGgpTlP1rBqsUK82p9tKqsWRPg5L56egiljujJT3vGAYnHANvFxBieXrTFavhzhxW52jnaWV+w2w==" + "version": "7.3.1", + "resolved": "https://registry.npmjs.org/ws/-/ws-7.3.1.tgz", + "integrity": "sha512-D3RuNkynyHmEJIpD2qrgVkc9DQ23OrN/moAwZX4L8DfvszsJxpjQuUq3LMx6HoYji9fbIOBY18XWBsAux1ZZUA==" }, "x-xss-protection": { "version": "1.3.0", diff --git a/package.json b/package.json index f33fd258e..6d97d69fb 100644 --- a/package.json +++ b/package.json @@ -70,7 +70,7 @@ "turndown": "6.0.0", "turndown-plugin-gfm": "1.0.2", "unescape": "1.0.1", - "ws": "7.3.0", + "ws": "7.3.1", "yauzl": "^2.10.0", "yazl": "^2.5.1" }, diff --git a/src/public/app/widgets/attribute_detail.js b/src/public/app/widgets/attribute_detail.js index 0210c76ac..2aa6962a2 100644 --- a/src/public/app/widgets/attribute_detail.js +++ b/src/public/app/widgets/attribute_detail.js @@ -50,6 +50,8 @@ const TPL = ` +
+ @@ -64,7 +66,7 @@ const TPL = ` -
Name:
+
@@ -100,7 +102,9 @@ export default class AttributeDetailWidget extends BasicWidget { this.$attrEditName = this.$widget.find('.attr-edit-name'); this.$attrEditValue = this.$widget.find('.attr-edit-value'); this.$attrEditInheritable = this.$widget.find('.attr-edit-inheritable'); + this.$attrEditButtonRow = this.$widget.find('.attr-edit-button-row'); this.$closeAttrDetailButton = this.$widget.find('.close-attr-detail-button'); + this.$attrIsOwnedBy = this.$widget.find('.attr-is-owned-by'); this.$closeAttrDetailButton.on('click', () => this.hide()); @@ -111,8 +115,8 @@ export default class AttributeDetailWidget extends BasicWidget { }); } - async showAttributeDetail(attr, x, y) { - if (!attr) { + async showAttributeDetail({attribute, isOwned, x, y}) { + if (!attribute) { this.hide(); return; @@ -120,7 +124,7 @@ export default class AttributeDetailWidget extends BasicWidget { this.toggleInt(true); - let {results, count} = await server.post('search-related', attr); + let {results, count} = await server.post('search-related', attribute); for (const res of results) { res.noteId = res.notePathArray[res.notePathArray.length - 1]; @@ -132,7 +136,7 @@ export default class AttributeDetailWidget extends BasicWidget { this.$relatedNotesTitle.hide(); } else { - this.$relatedNotesTitle.text(`Other notes with ${attr.type} name "${attr.name}"`); + this.$relatedNotesTitle.text(`Other notes with ${attribute.type} name "${attribute.name}"`); } this.$relatedNotesList.empty(); @@ -156,8 +160,26 @@ export default class AttributeDetailWidget extends BasicWidget { this.$relatedNotesMoreNotes.hide(); } - this.$attrEditName.val(attr.name); - this.$attrEditValue.val(attr.value); + if (isOwned) { + this.$attrIsOwnedBy.hide(); + } + else { + this.$attrIsOwnedBy + .show() + .append(attribute.type === 'label' ? 'Label' : 'Relation') + .append(' is owned by note ') + .append(await linkService.createNoteLink(attribute.noteId)) + } + + this.$attrEditName + .val(attribute.name) + .attr('readonly', () => !isOwned); + + this.$attrEditValue + .val(attribute.value) + .attr('readonly', () => !isOwned); + + this.$attrEditButtonRow.toggle(!!isOwned); this.$widget.css("left", x - this.$widget.width() / 2); this.$widget.css("top", y + 30); diff --git a/src/public/app/widgets/note_attributes.js b/src/public/app/widgets/note_attributes.js index ae0ece941..63b8df30c 100644 --- a/src/public/app/widgets/note_attributes.js +++ b/src/public/app/widgets/note_attributes.js @@ -329,7 +329,12 @@ export default class NoteAttributesWidget extends TabAwareWidget { } } - this.attributeDetailWidget.showAttributeDetail(matchedAttr, e.pageX, e.pageY); + this.attributeDetailWidget.showAttributeDetail({ + attribute: matchedAttr, + isOwned: true, + x: e.pageX, + y: e.pageY + }); } }); @@ -419,7 +424,7 @@ export default class NoteAttributesWidget extends TabAwareWidget { const ownedAttributes = note.getOwnedAttributes(); const $attributesContainer = $("
"); - await this.renderAttributes(ownedAttributes, $attributesContainer); + await this.renderAttributesIntoCKEditor(ownedAttributes, $attributesContainer); await this.spacedUpdate.allowUpdateWithoutChange(() => { this.textEditor.setData($attributesContainer.html()); @@ -440,7 +445,7 @@ export default class NoteAttributesWidget extends TabAwareWidget { this.$inheritedAttributes.empty(); - await this.renderAttributes(inheritedAttributes, this.$inheritedAttributes); + await this.renderAttributesIntoDiv(inheritedAttributes, this.$inheritedAttributes); this.parseAttributes(); } @@ -457,32 +462,57 @@ export default class NoteAttributesWidget extends TabAwareWidget { }); } - async renderAttributes(attributes, $container) { + async renderAttributesIntoCKEditor(attributes, $container) { for (const attribute of attributes) { - if (attribute.type === 'label') { - $container.append(document.createTextNode('#' + attribute.name)); + this.renderAttribute(attribute, $container); + } + } - if (attribute.value) { - $container.append('='); - $container.append(document.createTextNode(this.formatValue(attribute.value))); - } + renderAttributesIntoDiv(attributes, $container) { + for (const attribute of attributes) { + const $span = $("") + .on('click', e => this.attributeDetailWidget.showAttributeDetail({ + attribute: { + noteId: attribute.noteId, + type: attribute.type, + name: attribute.name, + value: attribute.value + }, + isOwned: false, + x: e.pageX, + y: e.pageY + })); - $container.append(' '); - } else if (attribute.type === 'relation') { - if (attribute.isAutoLink) { - continue; - } + $container.append($span); - if (attribute.value) { - $container.append(document.createTextNode('~' + attribute.name + "=")); - $container.append(this.createNoteLink(attribute.value)); - $container.append(" "); - } else { - ws.logError(`Relation ${attribute.attributeId} has empty target`); - } - } else { - ws.logError("Unknown attr type: " + attribute.type); + this.renderAttribute(attribute, $span); + } + } + + renderAttribute(attribute, $container) { + if (attribute.type === 'label') { + $container.append(document.createTextNode('#' + attribute.name)); + + if (attribute.value) { + $container.append('='); + $container.append(document.createTextNode(this.formatValue(attribute.value))); } + + $container.append(' '); + } else if (attribute.type === 'relation') { + if (attribute.isAutoLink) { + return; + } + + if (attribute.value) { + $container.append(document.createTextNode('~' + attribute.name + "=")); + $container.append(this.createNoteLink(attribute.value)); + $container.append(" "); + } else { + ws.logError(`Relation ${attribute.attributeId} has empty target`); + } + } else { + ws.logError("Unknown attr type: " + attribute.type); } }