From 1d813c82e4e445076ad6449b259cfbf4f624ac63 Mon Sep 17 00:00:00 2001 From: zadam Date: Sun, 23 Aug 2020 23:38:05 +0200 Subject: [PATCH] display attribute help on the attr detail during editing --- src/public/app/widgets/attribute_detail.js | 93 +++++++++++++++++++--- 1 file changed, 81 insertions(+), 12 deletions(-) diff --git a/src/public/app/widgets/attribute_detail.js b/src/public/app/widgets/attribute_detail.js index 6feb9b9fd..dbaf8cb8e 100644 --- a/src/public/app/widgets/attribute_detail.js +++ b/src/public/app/widgets/attribute_detail.js @@ -25,6 +25,11 @@ const TPL = ` box-shadow: 10px 10px 93px -25px var(--main-text-color); } + .attr-help td { + color: var(--muted-text-color); + padding: 5px; + } + .related-notes-list { padding-left: 20px; margin-top: 10px; @@ -73,24 +78,26 @@ const TPL = ` Name: + Value: - Target note: + Target note:
- + Promoted: - Multiplicity: + Multiplicity: @@ -111,7 +118,7 @@ const TPL = ` - Precision: + Precision:
@@ -122,14 +129,14 @@ const TPL = ` - Inverse relation: + Inverse relation:
- + Inheritable: @@ -166,6 +173,45 @@ const ATTR_TITLES = { const ATTR_NAME_MATCHER = new RegExp("^[\\p{L}\\p{N}_:]+$", "u"); +const ATTR_HELP = { + "label": { + "disableVersioning": "disables auto-versioning. Useful for e.g. large, but unimportant notes - e.g. large JS libraries used for scripting", + "calendarRoot": "marks note which should be used as root for day notes. Only one should be marked as such.", + "archived": "notes with this label won't be visible by default in search results (also in Jump To, Add Link dialogs etc).", + "excludeFromExport": "notes (with their sub-tree) won't be included in any note export", + "run": `defines on which events script should run. Possible values are: + `, + "disableInclusion": "scripts with this label won't be included into parent script execution.", + "sorted": "keeps child notes sorted by title alphabetically", + "hidePromotedAttributes": "Hide promoted attributes on this note", + "readOnly": "editor is in read only mode. Works only for text notes.", + "autoReadOnlyDisabled": "text/code notes can be set automatically into read mode when they are too large. You can disable this behavior on per-note basis by adding this label to the note", + "appCss": "marks CSS notes which are loaded into the Trilium application and can thus be used to modify Trilium's looks.", + "appTheme": "marks CSS notes which are full Trilium themes and are thus available in Trilium options.", + "cssClass": "value of this label is then added as CSS class to the node representing given note in the tree. This can be useful for advanced theming. Can be used in template notes.", + "iconClass": "value of this label is added as a CSS class to the icon on the tree which can help visually distinguish the notes in the tree. Example might be bx bx-home - icons are taken from boxicons. Can be used in template notes.", + "bookZoomLevel": 'applies only to book note and sets the "zoom level" (how many notes fit on 1 row)', + "customRequestHandler": 'see Custom request handler', + "customResourceProvider": 'see Custom request handler' + }, + "relation": { + "runOnNoteCreation": "executes when note is created on backend", + "runOnNoteTitleChange": "executes when note title is changed (includes note creation as well)", + "runOnNoteChange": "executes when note is changed (includes note creation as well)", + "runOnChildNoteCreation": "executes when new note is created under this note", + "runOnAttributeCreation": "executes when new attribute is created under this note", + "runOnAttributeChange": "executes when attribute is changed under this note", + "template": "attached note's attributes will be inherited even without parent-child relationship. See template for details.", + "renderNote": 'notes of type "render HTML note" will be rendered using a code note (HTML or script) and it is necessary to point using this relation to which note should be rendered', + "widget": "target of this relation will be executed and rendered as a widget in the sidebar" + } +}; + export default class AttributeDetailWidget extends TabAwareWidget { async refresh() { // this widget is not activated in a standard way @@ -179,11 +225,6 @@ export default class AttributeDetailWidget extends TabAwareWidget { this.$title = this.$widget.find('.attr-detail-title'); - this.$relatedNotesContainer = this.$widget.find('.related-notes-container'); - this.$relatedNotesTitle = this.$relatedNotesContainer.find('.related-notes-tile'); - this.$relatedNotesList = this.$relatedNotesContainer.find('.related-notes-list'); - this.$relatedNotesMoreNotes = this.$relatedNotesContainer.find('.related-notes-more-notes'); - this.$inputName = this.$widget.find('.attr-input-name'); this.$inputName.on('keyup', () => this.userEditedAttribute()); @@ -267,6 +308,13 @@ export default class AttributeDetailWidget extends TabAwareWidget { this.hide(); }); + this.$attrHelp = this.$widget.find('.attr-help'); + + this.$relatedNotesContainer = this.$widget.find('.related-notes-container'); + this.$relatedNotesTitle = this.$relatedNotesContainer.find('.related-notes-tile'); + this.$relatedNotesList = this.$relatedNotesContainer.find('.related-notes-list'); + this.$relatedNotesMoreNotes = this.$relatedNotesContainer.find('.related-notes-more-notes'); + this.$closeAttrDetailButton.on('click', () => this.hide()); $(window).on('mouseup', e => { @@ -280,9 +328,28 @@ export default class AttributeDetailWidget extends TabAwareWidget { userEditedAttribute() { this.updateAttributeInEditor(); + this.updateHelp(); this.relatedNotesSpacedUpdate.scheduleUpdate(); } + updateHelp() { + const attrName = this.$inputName.val(); + + if (this.attrType in ATTR_HELP && attrName in ATTR_HELP[this.attrType]) { + this.$attrHelp + .empty() + .append($("") + .append($("").text(attrName)) + .append(" - ") + .append(ATTR_HELP[this.attrType][attrName]) + ) + .show(); + } + else { + this.$attrHelp.empty().hide(); + } + } + async showAttributeDetail({allAttributes, attribute, isOwned, x, y}) { if (!attribute) { this.hide(); @@ -372,6 +439,8 @@ export default class AttributeDetailWidget extends TabAwareWidget { .prop("checked", !!attribute.isInheritable) .attr('disabled', () => !isOwned); + this.updateHelp(); + this.toggleInt(true); const offset = this.parent.$widget.offset();