From e367d60aeef94c7ce1b72f8527a57c364de15472 Mon Sep 17 00:00:00 2001 From: Ross Keenan Date: Wed, 29 Dec 2021 09:00:15 +0200 Subject: [PATCH] style: :lipstick: Lots of styling changes to settings (Fix #222) --- main.js | 192 +++++++++++++++------------- src/BreadcrumbsSettingTab.ts | 235 +++++++++++++++++++++-------------- 2 files changed, 243 insertions(+), 184 deletions(-) diff --git a/main.js b/main.js index 5aeb71aa..e12cb837 100644 --- a/main.js +++ b/main.js @@ -25018,6 +25018,7 @@ class MatrixView extends require$$0.ItemView { } } +const fragWithHTML = (html) => createFragment((frag) => (frag.createDiv().innerHTML = html)); class BCSettingTab extends require$$0.PluginSettingTab { constructor(app, plugin) { super(app, plugin); @@ -25042,54 +25043,6 @@ class BCSettingTab extends require$$0.PluginSettingTab { target: fieldDetails, props: { plugin }, }); - const hierarchyNoteDetails = containerEl.createEl("details"); - hierarchyNoteDetails.createEl("summary", { text: "Hierarchy Notes" }); - new require$$0.Setting(hierarchyNoteDetails) - .setName("Hierarchy Note(s)") - .setDesc("A list of notes used to create external Breadcrumb structures.") - .addText((text) => { - text - .setPlaceholder("Hierarchy Note(s)") - .setValue(settings.hierarchyNotes.join(", ")); - text.inputEl.onblur = async () => { - const splits = splitAndTrim(text.getValue()); - if (splits[0] === undefined) { - settings.hierarchyNotes = splits; - await plugin.saveSettings(); - } - else if (splits.every((note) => isInVault(this.app, note))) { - settings.hierarchyNotes = splits; - await plugin.saveSettings(); - } - else { - new require$$0.Notice("Atleast one of the notes is not in your vault"); - } - }; - }); - new require$$0.Setting(hierarchyNoteDetails) - .setName("Hierarchy Note Up Field Name") - .setDesc("Using the breadcrumbs generated by the hierarchy note, which ↑ type should they count as? This has to be one of the ↑ types of one of your existing hierarchies. If you want it to be something else, you can make a new hierarchy just for it.") - .addText((text) => { - let finalValue = settings.HNUpField; - text.setPlaceholder("").setValue(settings.HNUpField); - text.inputEl.onblur = async () => { - finalValue = text.getValue(); - if (finalValue === "") { - settings.HNUpField = finalValue; - await plugin.saveSettings(); - } - else { - const upFields = getFields(settings.userHiers, "up"); - if (upFields.includes(finalValue)) { - settings.HNUpField = finalValue; - await plugin.saveSettings(); - } - else { - new require$$0.Notice("The field name must be one of the exisitng ↓ fields in your hierarchies."); - } - } - }; - }); const generalDetails = containerEl.createEl("details"); generalDetails.createEl("summary", { text: "General Options" }); new require$$0.Setting(generalDetails) @@ -25140,14 +25093,14 @@ class BCSettingTab extends require$$0.PluginSettingTab { }); new require$$0.Setting(generalDetails) .setName("Enable Field Suggestor") - .setDesc('Alot of Breadcrumbs features require a metadata (or inline Dataview) field to work. For example, `BC-folder-note`. The Field Suggestor will show an autocomplete menu with all available Breadcrumbs field options when the content you type matches the regex /^BC-.*$/. Basically, just type "BC-" at the start of a line to trigger it.') + .setDesc(fragWithHTML('Alot of Breadcrumbs features require a metadata (or inline Dataview) field to work. For example, `BC-folder-note`.
The Field Suggestor will show an autocomplete menu with all available Breadcrumbs field options when the content you type matches the regex /^BC-.*$/. Basically, just type "BC-" at the start of a line to trigger it.')) .addToggle((toggle) => toggle.setValue(settings.fieldSuggestor).onChange(async (value) => { settings.fieldSuggestor = value; await plugin.saveSettings(); })); new require$$0.Setting(generalDetails) .setName("Refresh Index on Note Change") - .setDesc("Refresh the Breadcrumbs index data everytime you change notes. This is how Breadcrumbs used to work, making it responsive to changes immediately after changing notes. However, this can be very slow on large vaults, so it is off by default.") + .setDesc("Refresh the Breadcrumbs index data everytime you change notes.\nThis is how Breadcrumbs used to work, making it responsive to changes immediately after changing notes. However, this can be very slow on large vaults, so it is off by default.") .addToggle((toggle) => toggle .setValue(settings.refreshOnNoteChange) .onChange(async (value) => { @@ -25156,7 +25109,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { })); new require$$0.Setting(generalDetails) .setName("Fields used for Alternative note names (Aliases)") - .setDesc("A comma-separated list of fields you use to specify note name aliases. These fields will be checked, in order, and be used to display an alternate note title in both the list/matrix view, and trail/grid view. This field will probably be `alias` or `aliases`, but it can be anything, like `title`, for example.") + .setDesc(fragWithHTML("A comma-separated list of fields you use to specify note name aliases. These fields will be checked, in order, and be used to display an alternate note title in both the list/matrix view, and trail/grid view.
This field will probably be alias or aliases, but it can be anything, like title, for example.")) .addText((text) => { text.setValue(settings.altLinkFields.join(", ")); text.inputEl.onblur = async () => { @@ -25166,7 +25119,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { }); new require$$0.Setting(generalDetails) .setName("Use yaml or inline fields for hierarchy data") - .setDesc("If enabled, Breadcrumbs will make it's hierarchy using yaml fields, and inline fields (if you have Dataview enabled). If this is disabled, it will only use Juggl links for it's metadata (See below).") + .setDesc("If enabled, Breadcrumbs will make it's hierarchy using yaml fields, and inline fields (if you have Dataview enabled).\nIf this is disabled, it will only use Juggl links for it's metadata (See below).") .addToggle((toggle) => toggle.setValue(settings.useAllMetadata).onChange(async (value) => { settings.useAllMetadata = value; await plugin.saveSettings(); @@ -25174,7 +25127,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { })); new require$$0.Setting(generalDetails) .setName("Use Juggl link syntax without having Juggl installed.") - .setDesc("Should Breadcrumbs look for [Juggl links](https://juggl.io/Link+Types) even if you don't have Juggl installed? If you do have Juggl installed, it will always look for Juggl links.") + .setDesc(fragWithHTML('Should Breadcrumbs look for Juggl links even if you don\'t have Juggl installed? If you do have Juggl installed, it will always look for Juggl links.')) .addToggle((toggle) => toggle .setValue(settings.parseJugglLinksWithoutJuggl) .onChange(async (value) => { @@ -25195,7 +25148,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { if (this.app.plugins.plugins.dataview !== undefined) { new require$$0.Setting(generalDetails) .setName("Dataview Wait Time") - .setDesc('Enter an integer number of seconds to wait for the Dataview Index to load. The larger your vault, the longer it will take. If you see an error in the console saying "Cannot destructure currGraphs of undefined", try making this time longer. If you don\'t get that error, you can make this time shorter to make the Breadcrumbs load faster. The default is 5 seconds.') + .setDesc('Enter an integer number of seconds to wait for the Dataview Index to load. The larger your vault, the longer it will take.\nIf you see an error in the console saying "Cannot destructure currGraphs of undefined", try making this time longer. If you don\'t get that error, you can make this time shorter to make the Breadcrumbs load faster. The default is 5 seconds.') .addText((text) => text .setPlaceholder("Seconds") .setValue((settings.dvWaitTime / 1000).toString()) @@ -25214,7 +25167,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { MLViewDetails.createEl("summary", { text: "Matrix/List View" }); new require$$0.Setting(MLViewDetails) .setName("Show Matrix or List view by default") - .setDesc("When Obsidian first loads, which view should it show? On = Matrix, Off = List") + .setDesc("When Obsidian first loads, which view should it show? ✅ = Matrix, ❌ = List") .addToggle((toggle) => toggle.setValue(settings.defaultView).onChange(async (value) => { settings.defaultView = value; await plugin.saveSettings(); @@ -25223,7 +25176,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { // new Setting(MLViewDetails) // .setName("Show all field names or just relation types") // .setDesc( - // "This changes the headers in matrix/list view. You can have the headers be the list of metadata fields for each relation type (e.g. `parent, broader, upper`). Or you can have them just be the name of the relation type, i.e. 'Parent', 'Sibling', 'Child'. On = show the full list of names." + // "This changes the headers in matrix/list view. You can have the headers be the list of metadata fields for each relation type (e.g. `parent, broader, upper`). Or you can have them just be the name of the relation type, i.e. 'Parent', 'Sibling', 'Child'. ✅ = show the full list of names." // ) // .addToggle((toggle) => // toggle.setValue(settings.showNameOrType).onChange(async (value) => { @@ -25234,7 +25187,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { // ); new require$$0.Setting(MLViewDetails) .setName("Show Relationship Type") - .setDesc("Show whether a link is real or implied. A real link is one you explicitly put in a note. E.g. parent:: [[Note]]. An implied link is the reverse of a real link. For example, if A is the real parent of B, then B must be the implied child of A.") + .setDesc(fragWithHTML("Show whether a link is real or implied. A real link is one you explicitly put in a note. E.g. parent:: [[Note]]. An implied link is the reverse of a real link. For example, if A is the real parent of B, then B must be the implied child of A.")) .addToggle((toggle) => toggle.setValue(settings.showRelationType).onChange(async (value) => { settings.showRelationType = value; await plugin.saveSettings(); @@ -25251,7 +25204,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { // TODO hide this setting if !enableAlphaSort new require$$0.Setting(MLViewDetails) .setName("Sort Alphabetically Ascending/Descending") - .setDesc("Sort square items alphabetically in Ascending (on) or Descending (off) order.") + .setDesc("Sort square items alphabetically in Ascending (✅) or Descending (❌) order, by default.") .addToggle((toggle) => toggle.setValue(settings.alphaSortAsc).onChange(async (value) => { settings.alphaSortAsc = value; await plugin.saveSettings(); @@ -25269,7 +25222,12 @@ class BCSettingTab extends require$$0.PluginSettingTab { })); new require$$0.Setting(MLViewDetails) .setName("Filter Implied Siblings") - .setDesc("Implied siblings are: 1) notes with the same parent, or 2) notes that are real siblings. This setting only applies to type 1 implied siblings. If enabled, Breadcrumbs will filter type 1 implied siblings so that they not only share the same parent, but the parent relation has the exact same type. For example, the two real relations B --parent-> A, and C --parent-> A create an implied sibling between B and C (they have the same parent, A). The two real relations B --parent-> A, and C --up-> A create an implied sibling between B and C (they also have the same parent, A). But if this setting is turned on, the second implied sibling would not show, because the parent types are differnet (parent versus up).") + .setDesc(fragWithHTML(`Implied siblings are: +
    +
  1. notes with the same parent, or
    2. +
  2. notes that are real siblings.
    3. +
+ This setting only applies to type 1 implied siblings. If enabled, Breadcrumbs will filter type 1 implied siblings so that they not only share the same parent, but the parent relation has the exact same type. For example, the two real relations B -parent-> A, and C -parent-> A create an implied sibling between B and C (they have the same parent, A). The two real relations B -parent-> A, and C -up-> A create an implied sibling between B and C (they also have the same parent, A). But if this setting is turned on, the second implied sibling would not show, because the parent types are differnet (parent versus up).`)) .addToggle((toggle) => toggle .setValue(settings.filterImpliedSiblingsOfDifferentTypes) .onChange(async (value) => { @@ -25279,7 +25237,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { })); new require$$0.Setting(MLViewDetails) .setName("Open View in Right or Left side") - .setDesc("When loading the matrix view, should it open on the left or right side leaf? On = Right, Off = Left.") + .setDesc("When loading the matrix view, should it open on the left or right side leaf? ✅ = Right, ❌ = Left.") .addToggle((toggle) => toggle.setValue(settings.rlLeaf).onChange(async (value) => { var _a; settings.rlLeaf = value; @@ -25321,18 +25279,6 @@ class BCSettingTab extends require$$0.PluginSettingTab { options: getFields(settings.userHiers, "up"), }, }); - // new Setting(trailDetails) - // .setName("Field name to hide trail") - // .setDesc( - // "A note-specific toggle to hide the Trail View. By default, it is `hide-trail`. So, to hide the trail on a specific note, add the field to that note's yaml, like so: `hide-trail: {{anything}}`." - // ) - // .addText((text) => { - // text.setValue(settings.hideTrailField); - // text.inputEl.onblur = async () => { - // settings.hideTrailField = text.getValue(); - // await plugin.saveSettings(); - // }; - // }); new require$$0.Setting(trailDetails) .setName("Views to show") .setDesc("Choose which of the views to show at the top of the note.\nTrail, Grid, and/or the Next-Previous view.") @@ -25408,7 +25354,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { }); new require$$0.Setting(trailDetails) .setName("Index Note(s)") - .setDesc("The note that all of your other notes lead back to. The parent of all your parent notes. Just enter the basename. So if your index note is `000 Home.md`, enter `000 Home`. You can also have multiple index notes (comma-separated list). The breadcrumb trail will show the shortest path back to any one of the index notes listed. You can now leave this field empty, meaning the trail will show a path going as far up the parent-tree as possible.") + .setDesc(fragWithHTML("The note that all of your other notes lead back to. The parent of all your parent notes. Just enter the basename. So if your index note is 000 Home.md, enter 000 Home. You can also have multiple index notes (comma-separated list). The breadcrumb trail will show the shortest path back to any one of the index notes listed. You can now leave this field empty, meaning the trail will show a path going as far up the parent-tree as possible.")) .addText((text) => { text .setPlaceholder("Index Note") @@ -25437,7 +25383,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { })); new require$$0.Setting(trailDetails) .setName("Default: All or Shortest") - .setDesc("If multiple paths are found going up the parent tree, should all of them be shown by default, or only the shortest? On = all, off = shortest") + .setDesc("If multiple paths are found going up the parent tree, should all of them be shown by default, or only the shortest? ✅ = all, ❌ = shortest") .addToggle((toggle) => toggle.setValue(settings.showAll).onChange(async (value) => { settings.showAll = value; await plugin.saveSettings(); @@ -25467,7 +25413,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { })); new require$$0.Setting(trailDetails) .setName("Respect Readable Line Length") - .setDesc("Should the breadcrumbs trail adjust its width to the readable line length, or use as much space as possible? On = use readable line length.") + .setDesc("Should the breadcrumbs trail adjust its width to the readable line length, or use as much space as possible? ✅ = use readable line length.") .addToggle((toggle) => toggle .setValue(settings.respectReadableLineLength) .onChange(async (value) => { @@ -25479,7 +25425,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { downViewDetails.createEl("summary", { text: "Down View" }); new require$$0.Setting(downViewDetails) .setName("Enable line wrapping") - .setDesc("Make the items in the down view line wrap when there isn't enough space (On). Off makes them overflow off the screen.") + .setDesc("Make the items in the down view line wrap when there isn't enough space (✅). ❌ makes them overflow off the screen.") .addToggle((toggle) => toggle.setValue(settings.downViewWrap).onChange(async (value) => { settings.downViewWrap = value; await plugin.saveSettings(); @@ -25488,7 +25434,69 @@ class BCSettingTab extends require$$0.PluginSettingTab { alternativeHierarchyDetails.createEl("summary", { text: "Alternative Hierarchies", }); - new require$$0.Setting(alternativeHierarchyDetails) + const hierarchyNoteDetails = alternativeHierarchyDetails + .createDiv({ + attr: { style: "padding-left: 10px;" }, + }) + .createEl("details"); + hierarchyNoteDetails.createEl("summary", { + text: "Hierarchy Notes", + }); + new require$$0.Setting(hierarchyNoteDetails) + .setName("Hierarchy Note(s)") + .setDesc("A list of notes used to create external Breadcrumb structures.") + .addText((text) => { + text + .setPlaceholder("Hierarchy Note(s)") + .setValue(settings.hierarchyNotes.join(", ")); + text.inputEl.onblur = async () => { + const splits = splitAndTrim(text.getValue()); + if (splits[0] === undefined) { + settings.hierarchyNotes = splits; + await plugin.saveSettings(); + } + else if (splits.every((note) => isInVault(this.app, note))) { + settings.hierarchyNotes = splits; + await plugin.saveSettings(); + } + else { + new require$$0.Notice("Atleast one of the notes is not in your vault"); + } + }; + }); + new require$$0.Setting(hierarchyNoteDetails) + .setName("Hierarchy Note Up Field Name") + .setDesc("Using the breadcrumbs generated by the hierarchy note, which ↑ type should they count as? This has to be one of the ↑ types of one of your existing hierarchies. If you want it to be something else, you can make a new hierarchy just for it.") + .addText((text) => { + let finalValue = settings.HNUpField; + text.setPlaceholder("").setValue(settings.HNUpField); + text.inputEl.onblur = async () => { + finalValue = text.getValue(); + if (finalValue === "") { + settings.HNUpField = finalValue; + await plugin.saveSettings(); + } + else { + const upFields = getFields(settings.userHiers, "up"); + if (upFields.includes(finalValue)) { + settings.HNUpField = finalValue; + await plugin.saveSettings(); + } + else { + new require$$0.Notice("The field name must be one of the exisitng ↓ fields in your hierarchies."); + } + } + }; + }); + const csvDetails = alternativeHierarchyDetails + .createDiv({ + attr: { style: "padding-left: 10px;" }, + }) + .createEl("details"); + csvDetails.createEl("summary", { + text: "CSV Notes", + }); + new require$$0.Setting(csvDetails) .setName("CSV Breadcrumb Paths") .setDesc("The file path of a csv files with breadcrumbs information.") .addText((text) => { @@ -25498,16 +25506,24 @@ class BCSettingTab extends require$$0.PluginSettingTab { await plugin.saveSettings(); }; }); - new require$$0.Setting(alternativeHierarchyDetails) + const dendronDetails = alternativeHierarchyDetails + .createDiv({ + attr: { style: "padding-left: 10px;" }, + }) + .createEl("details"); + dendronDetails.createEl("summary", { + text: "Dendron Notes", + }); + new require$$0.Setting(dendronDetails) .setName("Add Dendron notes to graph") - .setDesc("Dendron notes create a hierarchy using note names.\n`math.algebra` is a note about algebra, whose parent is `math`.\n`math.calculus.limits` is a note about limits whose parent is the note `math.calculus`, whose parent is `math`.") + .setDesc(fragWithHTML("Dendron notes create a hierarchy using note names.
nmath.algebra is a note about algebra, whose parent is math.
nmath.calculus.limits is a note about limits whose parent is the note math.calculus, the parent of which is math.")) .addToggle((toggle) => toggle.setValue(settings.addDendronNotes).onChange(async (value) => { settings.addDendronNotes = value; await plugin.saveSettings(); })); - new require$$0.Setting(alternativeHierarchyDetails) + new require$$0.Setting(dendronDetails) .setName("Dendron note delimiter") - .setDesc("If you choose to use Dendron notes (setting above), which delimiter should Breadcrumbs look for? The default is `.`.") + .setDesc(fragWithHTML("If you choose to use Dendron notes (setting above), which delimiter should Breadcrumbs look for? The default is ..")) .addText((text) => { text .setPlaceholder("Delimiter") @@ -25526,9 +25542,9 @@ class BCSettingTab extends require$$0.PluginSettingTab { } }; }); - new require$$0.Setting(alternativeHierarchyDetails) + new require$$0.Setting(dendronDetails) .setName("Trim Dendron Note Names") - .setDesc("When displaying a dendron note name, should it be trimmed to only show the last item in the chain? e.g. `A.B.C` would be trimmed to only display `C`.") + .setDesc(fragWithHTML("When displaying a dendron note name, should it be trimmed to only show the last item in the chain?
e.g. A.B.C would be trimmed to only display C.")) .addToggle((toggle) => toggle.setValue(settings.trimDendronNotes).onChange(async (value) => { settings.trimDendronNotes = value; await plugin.saveSettings(); @@ -25539,7 +25555,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { settings.dendronNoteField = fields[0]; await plugin.saveSettings(); } - new require$$0.Setting(alternativeHierarchyDetails) + new require$$0.Setting(dendronDetails) .setName("Dendron Note Field") .setDesc("Which field should Breadcrumbs use for Dendron notes?") .addDropdown((cb) => { @@ -25578,7 +25594,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { await plugin.saveSettings(); })); new require$$0.Setting(writeBCsToFileDetails) - .setName("Show the `Write Breadcrumbs to ALL Files` command") + .setName(fragWithHTML("Show the Write Breadcrumbs to ALL Files command")) .setDesc("This command attempts to update ALL files with implied breadcrumbs pointing to them. So, it is not shown by default (even though it has 3 confirmation boxes to ensure you want to run it") .addToggle((toggle) => toggle.setValue(settings.showWriteAllBCsCmd).onChange(async (value) => { settings.showWriteAllBCsCmd = value; @@ -25642,14 +25658,14 @@ class BCSettingTab extends require$$0.PluginSettingTab { createIndexDetails.createEl("summary", { text: "Create Index" }); new require$$0.Setting(createIndexDetails) .setName("Add wiklink brackets") - .setDesc("When creating an index, should it wrap the note name in wikilinks `[[]]` or not. On = yes, off = no.") + .setDesc(fragWithHTML("When creating an index, should it wrap the note name in wikilinks [[]] or not.\n✅ = yes, ❌ = no.")) .addToggle((toggle) => toggle.setValue(settings.wikilinkIndex).onChange(async (value) => { settings.wikilinkIndex = value; await plugin.saveSettings(); })); new require$$0.Setting(createIndexDetails) .setName("Show aliases of notes in index") - .setDesc("Show the aliases of each note in brackets. On = yes, off = no.") + .setDesc("Show the aliases of each note in brackets.\n✅ = yes, ❌ = no.") .addToggle((toggle) => toggle.setValue(settings.aliasesInIndex).onChange(async (value) => { settings.aliasesInIndex = value; await plugin.saveSettings(); @@ -25658,7 +25674,7 @@ class BCSettingTab extends require$$0.PluginSettingTab { debugDetails.createEl("summary", { text: "Debugging" }); new require$$0.Setting(debugDetails) .setName("Debug Mode") - .setDesc("Set the minimum level of debug messages to console log. If you choose `TRACE`, then everything will be logged. If you choose `ERROR`, then only the most necessary issues will be logged. `SILENT` will turn off all logs.") + .setDesc(fragWithHTML("Set the minimum level of debug messages to console log. If you choose TRACE, then everything will be logged. If you choose ERROR, then only the most necessary issues will be logged. SILENT will turn off all logs.")) .addDropdown((dd) => { Object.keys(loglevel.levels).forEach((key) => dd.addOption(key, key)); dd.setValue(settings.debugMode).onChange(async (value) => { diff --git a/src/BreadcrumbsSettingTab.ts b/src/BreadcrumbsSettingTab.ts index f1f5830d..9cee5eb1 100644 --- a/src/BreadcrumbsSettingTab.ts +++ b/src/BreadcrumbsSettingTab.ts @@ -23,6 +23,9 @@ import type BCPlugin from "./main"; import MatrixView from "./MatrixView"; import { getFields, splitAndTrim } from "./sharedFunctions"; +const fragWithHTML = (html: string) => + createFragment((frag) => (frag.createDiv().innerHTML = html)); + export class BCSettingTab extends PluginSettingTab { plugin: BCPlugin; @@ -54,60 +57,6 @@ export class BCSettingTab extends PluginSettingTab { props: { plugin }, }); - const hierarchyNoteDetails: HTMLDetailsElement = - containerEl.createEl("details"); - hierarchyNoteDetails.createEl("summary", { text: "Hierarchy Notes" }); - - new Setting(hierarchyNoteDetails) - .setName("Hierarchy Note(s)") - .setDesc("A list of notes used to create external Breadcrumb structures.") - .addText((text) => { - text - .setPlaceholder("Hierarchy Note(s)") - .setValue(settings.hierarchyNotes.join(", ")); - - text.inputEl.onblur = async () => { - const splits = splitAndTrim(text.getValue()); - if (splits[0] === undefined) { - settings.hierarchyNotes = splits; - await plugin.saveSettings(); - } else if (splits.every((note) => isInVault(this.app, note))) { - settings.hierarchyNotes = splits; - await plugin.saveSettings(); - } else { - new Notice("Atleast one of the notes is not in your vault"); - } - }; - }); - - new Setting(hierarchyNoteDetails) - .setName("Hierarchy Note Up Field Name") - .setDesc( - "Using the breadcrumbs generated by the hierarchy note, which ↑ type should they count as? This has to be one of the ↑ types of one of your existing hierarchies. If you want it to be something else, you can make a new hierarchy just for it." - ) - .addText((text) => { - let finalValue: string = settings.HNUpField; - text.setPlaceholder("").setValue(settings.HNUpField); - - text.inputEl.onblur = async () => { - finalValue = text.getValue(); - if (finalValue === "") { - settings.HNUpField = finalValue; - await plugin.saveSettings(); - } else { - const upFields = getFields(settings.userHiers, "up"); - if (upFields.includes(finalValue)) { - settings.HNUpField = finalValue; - await plugin.saveSettings(); - } else { - new Notice( - "The field name must be one of the exisitng ↓ fields in your hierarchies." - ); - } - } - }; - }); - const generalDetails: HTMLDetailsElement = containerEl.createEl("details"); generalDetails.createEl("summary", { text: "General Options" }); @@ -166,7 +115,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(generalDetails) .setName("Enable Field Suggestor") .setDesc( - 'Alot of Breadcrumbs features require a metadata (or inline Dataview) field to work. For example, `BC-folder-note`. The Field Suggestor will show an autocomplete menu with all available Breadcrumbs field options when the content you type matches the regex /^BC-.*$/. Basically, just type "BC-" at the start of a line to trigger it.' + fragWithHTML( + 'Alot of Breadcrumbs features require a metadata (or inline Dataview) field to work. For example, `BC-folder-note`.
The Field Suggestor will show an autocomplete menu with all available Breadcrumbs field options when the content you type matches the regex /^BC-.*$/. Basically, just type "BC-" at the start of a line to trigger it.' + ) ) .addToggle((toggle) => toggle.setValue(settings.fieldSuggestor).onChange(async (value) => { @@ -178,7 +129,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(generalDetails) .setName("Refresh Index on Note Change") .setDesc( - "Refresh the Breadcrumbs index data everytime you change notes. This is how Breadcrumbs used to work, making it responsive to changes immediately after changing notes. However, this can be very slow on large vaults, so it is off by default." + "Refresh the Breadcrumbs index data everytime you change notes.\nThis is how Breadcrumbs used to work, making it responsive to changes immediately after changing notes. However, this can be very slow on large vaults, so it is off by default." ) .addToggle((toggle) => toggle @@ -192,7 +143,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(generalDetails) .setName("Fields used for Alternative note names (Aliases)") .setDesc( - "A comma-separated list of fields you use to specify note name aliases. These fields will be checked, in order, and be used to display an alternate note title in both the list/matrix view, and trail/grid view. This field will probably be `alias` or `aliases`, but it can be anything, like `title`, for example." + fragWithHTML( + "A comma-separated list of fields you use to specify note name aliases. These fields will be checked, in order, and be used to display an alternate note title in both the list/matrix view, and trail/grid view.
This field will probably be alias or aliases, but it can be anything, like title, for example." + ) ) .addText((text) => { text.setValue(settings.altLinkFields.join(", ")); @@ -205,7 +158,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(generalDetails) .setName("Use yaml or inline fields for hierarchy data") .setDesc( - "If enabled, Breadcrumbs will make it's hierarchy using yaml fields, and inline fields (if you have Dataview enabled). If this is disabled, it will only use Juggl links for it's metadata (See below)." + "If enabled, Breadcrumbs will make it's hierarchy using yaml fields, and inline fields (if you have Dataview enabled).\nIf this is disabled, it will only use Juggl links for it's metadata (See below)." ) .addToggle((toggle) => toggle.setValue(settings.useAllMetadata).onChange(async (value) => { @@ -218,7 +171,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(generalDetails) .setName("Use Juggl link syntax without having Juggl installed.") .setDesc( - "Should Breadcrumbs look for [Juggl links](https://juggl.io/Link+Types) even if you don't have Juggl installed? If you do have Juggl installed, it will always look for Juggl links." + fragWithHTML( + 'Should Breadcrumbs look for Juggl links even if you don\'t have Juggl installed? If you do have Juggl installed, it will always look for Juggl links.' + ) ) .addToggle((toggle) => toggle @@ -229,7 +184,7 @@ export class BCSettingTab extends PluginSettingTab { }) ); - const jumpToFirstFieldsDiv = generalDetails.createDiv().createEl("strong", { + generalDetails.createDiv().createEl("strong", { text: "When running `Jump to first ` command, limit which fields it can use.", }); @@ -246,7 +201,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(generalDetails) .setName("Dataview Wait Time") .setDesc( - 'Enter an integer number of seconds to wait for the Dataview Index to load. The larger your vault, the longer it will take. If you see an error in the console saying "Cannot destructure currGraphs of undefined", try making this time longer. If you don\'t get that error, you can make this time shorter to make the Breadcrumbs load faster. The default is 5 seconds.' + 'Enter an integer number of seconds to wait for the Dataview Index to load. The larger your vault, the longer it will take.\nIf you see an error in the console saying "Cannot destructure currGraphs of undefined", try making this time longer. If you don\'t get that error, you can make this time shorter to make the Breadcrumbs load faster. The default is 5 seconds.' ) .addText((text) => text @@ -271,7 +226,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(MLViewDetails) .setName("Show Matrix or List view by default") .setDesc( - "When Obsidian first loads, which view should it show? On = Matrix, Off = List" + "When Obsidian first loads, which view should it show? ✅ = Matrix, ❌ = List" ) .addToggle((toggle) => toggle.setValue(settings.defaultView).onChange(async (value) => { @@ -284,7 +239,7 @@ export class BCSettingTab extends PluginSettingTab { // new Setting(MLViewDetails) // .setName("Show all field names or just relation types") // .setDesc( - // "This changes the headers in matrix/list view. You can have the headers be the list of metadata fields for each relation type (e.g. `parent, broader, upper`). Or you can have them just be the name of the relation type, i.e. 'Parent', 'Sibling', 'Child'. On = show the full list of names." + // "This changes the headers in matrix/list view. You can have the headers be the list of metadata fields for each relation type (e.g. `parent, broader, upper`). Or you can have them just be the name of the relation type, i.e. 'Parent', 'Sibling', 'Child'. ✅ = show the full list of names." // ) // .addToggle((toggle) => // toggle.setValue(settings.showNameOrType).onChange(async (value) => { @@ -297,7 +252,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(MLViewDetails) .setName("Show Relationship Type") .setDesc( - "Show whether a link is real or implied. A real link is one you explicitly put in a note. E.g. parent:: [[Note]]. An implied link is the reverse of a real link. For example, if A is the real parent of B, then B must be the implied child of A." + fragWithHTML( + "Show whether a link is real or implied. A real link is one you explicitly put in a note. E.g. parent:: [[Note]]. An implied link is the reverse of a real link. For example, if A is the real parent of B, then B must be the implied child of A." + ) ) .addToggle((toggle) => toggle.setValue(settings.showRelationType).onChange(async (value) => { @@ -324,7 +281,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(MLViewDetails) .setName("Sort Alphabetically Ascending/Descending") .setDesc( - "Sort square items alphabetically in Ascending (on) or Descending (off) order." + "Sort square items alphabetically in Ascending (✅) or Descending (❌) order, by default." ) .addToggle((toggle) => toggle.setValue(settings.alphaSortAsc).onChange(async (value) => { @@ -352,7 +309,14 @@ export class BCSettingTab extends PluginSettingTab { new Setting(MLViewDetails) .setName("Filter Implied Siblings") .setDesc( - "Implied siblings are: 1) notes with the same parent, or 2) notes that are real siblings. This setting only applies to type 1 implied siblings. If enabled, Breadcrumbs will filter type 1 implied siblings so that they not only share the same parent, but the parent relation has the exact same type. For example, the two real relations B --parent-> A, and C --parent-> A create an implied sibling between B and C (they have the same parent, A). The two real relations B --parent-> A, and C --up-> A create an implied sibling between B and C (they also have the same parent, A). But if this setting is turned on, the second implied sibling would not show, because the parent types are differnet (parent versus up)." + fragWithHTML( + `Implied siblings are: +
    +
  1. notes with the same parent, or
    2. +
  2. notes that are real siblings.
    3. +
+ This setting only applies to type 1 implied siblings. If enabled, Breadcrumbs will filter type 1 implied siblings so that they not only share the same parent, but the parent relation has the exact same type. For example, the two real relations B -parent-> A, and C -parent-> A create an implied sibling between B and C (they have the same parent, A). The two real relations B -parent-> A, and C -up-> A create an implied sibling between B and C (they also have the same parent, A). But if this setting is turned on, the second implied sibling would not show, because the parent types are differnet (parent versus up).` + ) ) .addToggle((toggle) => toggle @@ -367,7 +331,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(MLViewDetails) .setName("Open View in Right or Left side") .setDesc( - "When loading the matrix view, should it open on the left or right side leaf? On = Right, Off = Left." + "When loading the matrix view, should it open on the left or right side leaf? ✅ = Right, ❌ = Left." ) .addToggle((toggle) => toggle.setValue(settings.rlLeaf).onChange(async (value) => { @@ -428,19 +392,6 @@ export class BCSettingTab extends PluginSettingTab { }, }); - // new Setting(trailDetails) - // .setName("Field name to hide trail") - // .setDesc( - // "A note-specific toggle to hide the Trail View. By default, it is `hide-trail`. So, to hide the trail on a specific note, add the field to that note's yaml, like so: `hide-trail: {{anything}}`." - // ) - // .addText((text) => { - // text.setValue(settings.hideTrailField); - // text.inputEl.onblur = async () => { - // settings.hideTrailField = text.getValue(); - // await plugin.saveSettings(); - // }; - // }); - new Setting(trailDetails) .setName("Views to show") .setDesc( @@ -534,7 +485,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(trailDetails) .setName("Index Note(s)") .setDesc( - "The note that all of your other notes lead back to. The parent of all your parent notes. Just enter the basename. So if your index note is `000 Home.md`, enter `000 Home`. You can also have multiple index notes (comma-separated list). The breadcrumb trail will show the shortest path back to any one of the index notes listed. You can now leave this field empty, meaning the trail will show a path going as far up the parent-tree as possible." + fragWithHTML( + "The note that all of your other notes lead back to. The parent of all your parent notes. Just enter the basename. So if your index note is 000 Home.md, enter 000 Home. You can also have multiple index notes (comma-separated list). The breadcrumb trail will show the shortest path back to any one of the index notes listed. You can now leave this field empty, meaning the trail will show a path going as far up the parent-tree as possible." + ) ) .addText((text) => { text @@ -574,7 +527,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(trailDetails) .setName("Default: All or Shortest") .setDesc( - "If multiple paths are found going up the parent tree, should all of them be shown by default, or only the shortest? On = all, off = shortest" + "If multiple paths are found going up the parent tree, should all of them be shown by default, or only the shortest? ✅ = all, ❌ = shortest" ) .addToggle((toggle) => toggle.setValue(settings.showAll).onChange(async (value) => { @@ -620,7 +573,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(trailDetails) .setName("Respect Readable Line Length") .setDesc( - "Should the breadcrumbs trail adjust its width to the readable line length, or use as much space as possible? On = use readable line length." + "Should the breadcrumbs trail adjust its width to the readable line length, or use as much space as possible? ✅ = use readable line length." ) .addToggle((toggle) => toggle @@ -638,7 +591,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(downViewDetails) .setName("Enable line wrapping") .setDesc( - "Make the items in the down view line wrap when there isn't enough space (On). Off makes them overflow off the screen." + "Make the items in the down view line wrap when there isn't enough space (✅). ❌ makes them overflow off the screen." ) .addToggle((toggle) => toggle.setValue(settings.downViewWrap).onChange(async (value) => { @@ -653,7 +606,74 @@ export class BCSettingTab extends PluginSettingTab { text: "Alternative Hierarchies", }); - new Setting(alternativeHierarchyDetails) + const hierarchyNoteDetails = alternativeHierarchyDetails + .createDiv({ + attr: { style: "padding-left: 10px;" }, + }) + .createEl("details"); + hierarchyNoteDetails.createEl("summary", { + text: "Hierarchy Notes", + }); + + new Setting(hierarchyNoteDetails) + .setName("Hierarchy Note(s)") + .setDesc("A list of notes used to create external Breadcrumb structures.") + .addText((text) => { + text + .setPlaceholder("Hierarchy Note(s)") + .setValue(settings.hierarchyNotes.join(", ")); + + text.inputEl.onblur = async () => { + const splits = splitAndTrim(text.getValue()); + if (splits[0] === undefined) { + settings.hierarchyNotes = splits; + await plugin.saveSettings(); + } else if (splits.every((note) => isInVault(this.app, note))) { + settings.hierarchyNotes = splits; + await plugin.saveSettings(); + } else { + new Notice("Atleast one of the notes is not in your vault"); + } + }; + }); + + new Setting(hierarchyNoteDetails) + .setName("Hierarchy Note Up Field Name") + .setDesc( + "Using the breadcrumbs generated by the hierarchy note, which ↑ type should they count as? This has to be one of the ↑ types of one of your existing hierarchies. If you want it to be something else, you can make a new hierarchy just for it." + ) + .addText((text) => { + let finalValue: string = settings.HNUpField; + text.setPlaceholder("").setValue(settings.HNUpField); + + text.inputEl.onblur = async () => { + finalValue = text.getValue(); + if (finalValue === "") { + settings.HNUpField = finalValue; + await plugin.saveSettings(); + } else { + const upFields = getFields(settings.userHiers, "up"); + if (upFields.includes(finalValue)) { + settings.HNUpField = finalValue; + await plugin.saveSettings(); + } else { + new Notice( + "The field name must be one of the exisitng ↓ fields in your hierarchies." + ); + } + } + }; + }); + + const csvDetails = alternativeHierarchyDetails + .createDiv({ + attr: { style: "padding-left: 10px;" }, + }) + .createEl("details"); + csvDetails.createEl("summary", { + text: "CSV Notes", + }); + new Setting(csvDetails) .setName("CSV Breadcrumb Paths") .setDesc("The file path of a csv files with breadcrumbs information.") .addText((text) => { @@ -664,10 +684,21 @@ export class BCSettingTab extends PluginSettingTab { }; }); - new Setting(alternativeHierarchyDetails) + const dendronDetails = alternativeHierarchyDetails + .createDiv({ + attr: { style: "padding-left: 10px;" }, + }) + .createEl("details"); + dendronDetails.createEl("summary", { + text: "Dendron Notes", + }); + + new Setting(dendronDetails) .setName("Add Dendron notes to graph") .setDesc( - "Dendron notes create a hierarchy using note names.\n`math.algebra` is a note about algebra, whose parent is `math`.\n`math.calculus.limits` is a note about limits whose parent is the note `math.calculus`, whose parent is `math`." + fragWithHTML( + "Dendron notes create a hierarchy using note names.
nmath.algebra is a note about algebra, whose parent is math.
nmath.calculus.limits is a note about limits whose parent is the note math.calculus, the parent of which is math." + ) ) .addToggle((toggle) => toggle.setValue(settings.addDendronNotes).onChange(async (value) => { @@ -675,10 +706,12 @@ export class BCSettingTab extends PluginSettingTab { await plugin.saveSettings(); }) ); - new Setting(alternativeHierarchyDetails) + new Setting(dendronDetails) .setName("Dendron note delimiter") .setDesc( - "If you choose to use Dendron notes (setting above), which delimiter should Breadcrumbs look for? The default is `.`." + fragWithHTML( + "If you choose to use Dendron notes (setting above), which delimiter should Breadcrumbs look for? The default is .." + ) ) .addText((text) => { text @@ -699,10 +732,12 @@ export class BCSettingTab extends PluginSettingTab { }; }); - new Setting(alternativeHierarchyDetails) + new Setting(dendronDetails) .setName("Trim Dendron Note Names") .setDesc( - "When displaying a dendron note name, should it be trimmed to only show the last item in the chain? e.g. `A.B.C` would be trimmed to only display `C`." + fragWithHTML( + "When displaying a dendron note name, should it be trimmed to only show the last item in the chain?
e.g. A.B.C would be trimmed to only display C." + ) ) .addToggle((toggle) => toggle.setValue(settings.trimDendronNotes).onChange(async (value) => { @@ -718,7 +753,7 @@ export class BCSettingTab extends PluginSettingTab { settings.dendronNoteField = fields[0]; await plugin.saveSettings(); } - new Setting(alternativeHierarchyDetails) + new Setting(dendronDetails) .setName("Dendron Note Field") .setDesc("Which field should Breadcrumbs use for Dendron notes?") .addDropdown((cb: DropdownComponent) => { @@ -768,7 +803,11 @@ export class BCSettingTab extends PluginSettingTab { ); new Setting(writeBCsToFileDetails) - .setName("Show the `Write Breadcrumbs to ALL Files` command") + .setName( + fragWithHTML( + "Show the Write Breadcrumbs to ALL Files command" + ) + ) .setDesc( "This command attempts to update ALL files with implied breadcrumbs pointing to them. So, it is not shown by default (even though it has 3 confirmation boxes to ensure you want to run it" ) @@ -846,7 +885,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(createIndexDetails) .setName("Add wiklink brackets") .setDesc( - "When creating an index, should it wrap the note name in wikilinks `[[]]` or not. On = yes, off = no." + fragWithHTML( + "When creating an index, should it wrap the note name in wikilinks [[]] or not.\n✅ = yes, ❌ = no." + ) ) .addToggle((toggle) => toggle.setValue(settings.wikilinkIndex).onChange(async (value) => { @@ -857,7 +898,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(createIndexDetails) .setName("Show aliases of notes in index") - .setDesc("Show the aliases of each note in brackets. On = yes, off = no.") + .setDesc("Show the aliases of each note in brackets.\n✅ = yes, ❌ = no.") .addToggle((toggle) => toggle.setValue(settings.aliasesInIndex).onChange(async (value) => { settings.aliasesInIndex = value; @@ -871,7 +912,9 @@ export class BCSettingTab extends PluginSettingTab { new Setting(debugDetails) .setName("Debug Mode") .setDesc( - "Set the minimum level of debug messages to console log. If you choose `TRACE`, then everything will be logged. If you choose `ERROR`, then only the most necessary issues will be logged. `SILENT` will turn off all logs." + fragWithHTML( + "Set the minimum level of debug messages to console log. If you choose TRACE, then everything will be logged. If you choose ERROR, then only the most necessary issues will be logged. SILENT will turn off all logs." + ) ) .addDropdown((dd) => { Object.keys(log.levels).forEach((key) => dd.addOption(key, key));