Separate Type and Title?

Fixes #99
javalent · Oct 4, 2021 · 1bbda41 · 1bbda41
1 parent 12b92a8
commit 1bbda41
Show file tree

Hide file tree

Showing 6 changed files with 127 additions and 74 deletions.
diff --git a/src/@types/index.ts b/src/@types/index.ts
@@ -3,6 +3,7 @@ import { IconName } from "src/util";
 
 export interface Admonition {
     type: string;
+    title?: string;
     icon: AdmonitionIconDefinition;
     color: string;
     command: boolean;

diff --git a/src/lang/helpers.ts b/src/lang/helpers.ts
@@ -53,9 +53,5 @@ const localeMap: { [k: string]: Partial<typeof en> } = {
 const locale = localeMap[moment.locale()];
 
 export function t(str: keyof typeof en): string {
-  if (!locale) {
-    console.error('Error: kanban locale not found', moment.locale());
-  }
-
   return (locale && locale[str]) || en[str];
 }
diff --git a/src/lang/locale/en.ts b/src/lang/locale/en.ts
@@ -1,39 +1,51 @@
 // English
 
 export default {
-  // setting.ts
-  "Admonition Settings": "Admonition Settings",
-  "Use Obsidian's markdown syntax highlighter in admonition code blocks. This setting is experimental and could cause errors.": "Use Obsidian's markdown syntax highlighter in admonition code blocks. This setting is experimental and could cause errors.",
-  " Markdown Syntax Highlighting": " Markdown Syntax Highlighting",
-  "Try to sync internal links to the metadata cache to display in graph view. This setting could have unintended consequences. Use at your own risk.": "Try to sync internal links to the metadata cache to display in graph view. This setting could have unintended consequences. Use at your own risk.",
-  " Sync Links to Metadata Cache": " Sync Links to Metadata Cache",
-  "Allows admonitions to be created using ": "Allows admonitions to be created using ",
-  " or ": " or ",
-  ", instead of using a code block.": ", instead of using a code block.",
-  " Enable Non-codeblock Admonitions": " Enable Non-codeblock Admonitions",
-  "Collapsible by Default": "Collapsible by Default",
-  "All admonitions will be collapsible by default. Use ": "All admonitions will be collapsible by default. Use ",
-  " to prevent.": " to prevent.",
-  "Default Collapse Type": "Default Collapse Type",
-  "Collapsible admonitions will be either opened or closed.": "Collapsible admonitions will be either opened or closed.",
-  "Add Copy Button": "Add Copy Button",
-  "Add a 'copy content' button to admonitions." : "Add a 'copy content' button to admonitions.",
-  "Add New": "Add New",
-  "Add a new Admonition type.": "Add a new Admonition type.",
-  "Add Additional": "Add Additional",
-  "Register Commands": "Register Commands",
-  "Unregister Commands": "Unregister Commands",
-  "Edit": "Edit",
-  "Delete": "Delete",
-  "Admonition Type": "Admonition Type",
-  "Admonition type cannot be empty.": "Admonition type cannot be empty.",
-  "Admonition type cannot include spaces.": "Admonition type cannot include spaces.",
-  "Types must be a valid CSS selector.": "Types must be a valid CSS selector.",
-  "Invalid icon name.": "Invalid icon name.",
-  "Icon cannot be empty.": "Icon cannot be empty.",
-  "Upload Image": "Upload Image",
-  "There was an error parsing the image.": "There was an error parsing the image.",
-  "Admonition Icon": "Admonition Icon",
-  "Color": "Color",
-  "Save": "Save"
+    // setting.ts
+    "Admonition Settings": "Admonition Settings",
+    "Use Obsidian's markdown syntax highlighter in admonition code blocks. This setting is experimental and could cause errors.":
+        "Use Obsidian's markdown syntax highlighter in admonition code blocks. This setting is experimental and could cause errors.",
+    " Markdown Syntax Highlighting": " Markdown Syntax Highlighting",
+    "Try to sync internal links to the metadata cache to display in graph view. This setting could have unintended consequences. Use at your own risk.":
+        "Try to sync internal links to the metadata cache to display in graph view. This setting could have unintended consequences. Use at your own risk.",
+    " Sync Links to Metadata Cache": " Sync Links to Metadata Cache",
+    "Allows admonitions to be created using ":
+        "Allows admonitions to be created using ",
+    " or ": " or ",
+    ", instead of using a code block.": ", instead of using a code block.",
+    " Enable Non-codeblock Admonitions": " Enable Non-codeblock Admonitions",
+    "Collapsible by Default": "Collapsible by Default",
+    "All admonitions will be collapsible by default. Use ":
+        "All admonitions will be collapsible by default. Use ",
+    " to prevent.": " to prevent.",
+    "Default Collapse Type": "Default Collapse Type",
+    "Collapsible admonitions will be either opened or closed.":
+        "Collapsible admonitions will be either opened or closed.",
+    "Add Copy Button": "Add Copy Button",
+    "Add a 'copy content' button to admonitions.":
+        "Add a 'copy content' button to admonitions.",
+    "Add New": "Add New",
+    "Add a new Admonition type.": "Add a new Admonition type.",
+    "Add Additional": "Add Additional",
+    "Register Commands": "Register Commands",
+    "Unregister Commands": "Unregister Commands",
+    Edit: "Edit",
+    Delete: "Delete",
+    "Admonition Type": "Admonition Type",
+    "Admonition Title": "Admonition Title",
+    "This will be the default title for this admonition type.":
+        "This will be the default title for this admonition type.",
+    "Admonition type cannot be empty.": "Admonition type cannot be empty.",
+    "Admonition type cannot include spaces.":
+        "Admonition type cannot include spaces.",
+    "Types must be a valid CSS selector.":
+        "Types must be a valid CSS selector.",
+    "Invalid icon name.": "Invalid icon name.",
+    "Icon cannot be empty.": "Icon cannot be empty.",
+    "Upload Image": "Upload Image",
+    "There was an error parsing the image.":
+        "There was an error parsing the image.",
+    "Admonition Icon": "Admonition Icon",
+    Color: "Color",
+    Save: "Save"
 };
diff --git a/src/main.ts b/src/main.ts
@@ -684,12 +684,14 @@ title:
         }
         try {
             let {
-                title = type[0].toUpperCase() + type.slice(1).toLowerCase(),
+                title,
                 collapse,
                 content,
                 icon,
                 color = this.admonitions[type].color
-            } = getParametersFromSource(type, src);
+            } = getParametersFromSource(type, src, this.admonitions[type]);
+
+            console.log(title, this.admonitions[type].title);
 
             let match = new RegExp(`^!!! ad-(${this.types.join("|")})$`, "gm");
 

diff --git a/src/settings.ts b/src/settings.ts
@@ -53,7 +53,9 @@ export default class AdmonitionSetting extends PluginSettingTab {
 
         let syntax = new Setting(containerEl)
             .setDesc(
-              t("Use Obsidian's markdown syntax highlighter in admonition code blocks. This setting is experimental and could cause errors.")
+                t(
+                    "Use Obsidian's markdown syntax highlighter in admonition code blocks. This setting is experimental and could cause errors."
+                )
             )
             .addToggle((t) => {
                 t.setValue(this.plugin.data.syntaxHighlight);
@@ -69,11 +71,15 @@ export default class AdmonitionSetting extends PluginSettingTab {
             });
         let name = syntax.nameEl.createDiv();
         name.appendChild(WARNING_ICON.cloneNode(true));
-        name.appendChild(createSpan({ text: t(" Markdown Syntax Highlighting") }));
+        name.appendChild(
+            createSpan({ text: t(" Markdown Syntax Highlighting") })
+        );
 
         let sync = new Setting(containerEl)
             .setDesc(
-              t("Try to sync internal links to the metadata cache to display in graph view. This setting could have unintended consequences. Use at your own risk.")
+                t(
+                    "Try to sync internal links to the metadata cache to display in graph view. This setting could have unintended consequences. Use at your own risk."
+                )
             )
             .addToggle((t) => {
                 t.setValue(this.plugin.data.syncLinks).onChange(async (v) => {
@@ -147,7 +153,9 @@ export default class AdmonitionSetting extends PluginSettingTab {
             new Setting(containerEl)
                 .setName(t("Default Collapse Type"))
                 .setDesc(
-                    t("Collapsible admonitions will be either opened or closed.")
+                    t(
+                        "Collapsible admonitions will be either opened or closed."
+                    )
                 )
                 .addDropdown((d) => {
                     d.addOption("open", "open");
@@ -198,7 +206,8 @@ export default class AdmonitionSetting extends PluginSettingTab {
                                     type: modal.type,
                                     color: modal.color,
                                     icon: modal.icon,
-                                    command: false
+                                    command: false,
+                                    title: modal.title
                                 });
                                 this.display();
                             }
@@ -253,6 +262,10 @@ export default class AdmonitionSetting extends PluginSettingTab {
                         .setTooltip(t("Edit"))
                         .onClick(() => {
                             let modal = new SettingsModal(this.app, admonition);
+                            console.log(
+                                "🚀 ~ file: settings.ts ~ line 265 ~ admonition",
+                                admonition
+                            );
 
                             modal.onClose = async () => {
                                 if (modal.saved) {
@@ -262,7 +275,8 @@ export default class AdmonitionSetting extends PluginSettingTab {
                                         type: modal.type,
                                         color: modal.color,
                                         icon: modal.icon,
-                                        command: hasCommand
+                                        command: hasCommand,
+                                        title: modal.title
                                     });
                                     this.display();
                                 }
@@ -295,15 +309,17 @@ export default class AdmonitionSetting extends PluginSettingTab {
 class SettingsModal extends Modal {
     color: string = "#7d7d7d";
     icon: AdmonitionIconDefinition = {};
-    type: string = "";
+    type: string;
     saved: boolean = false;
     error: boolean = false;
+    title: string;
     constructor(app: App, admonition?: Admonition) {
         super(app);
         if (admonition) {
             this.color = admonition.color;
             this.icon = admonition.icon;
             this.type = admonition.type;
+            this.title = admonition.title;
         }
     }
 
@@ -313,12 +329,11 @@ class SettingsModal extends Modal {
         contentEl.empty();
 
         const settingDiv = contentEl.createDiv();
+        const title = this.title ?? this.type ?? "...";
 
         let admonitionPreview = await getAdmonitionElement(
             this.type,
-            this.type.length
-                ? this.type[0].toUpperCase() + this.type.slice(1).toLowerCase()
-                : "...",
+            title[0].toUpperCase() + title.slice(1).toLowerCase(),
             this.icon,
             this.color
         );
@@ -330,8 +345,6 @@ class SettingsModal extends Modal {
         let typeText: TextComponent;
         const typeSetting = new Setting(settingDiv)
             .setName(t("Admonition Type"))
-            /* .setDesc("This is used to create the admonition (e.g., note or abstract)") */
-
             .addText((text) => {
                 typeText = text;
                 typeText.setValue(this.type).onChange((v) => {
@@ -362,17 +375,8 @@ class SettingsModal extends Modal {
                     SettingsModal.removeValidationError(text);
 
                     this.type = v;
-                    let titleSpan = admonitionPreview.querySelector(
-                        ".admonition-title-content"
-                    );
-
-                    let iconEl = admonitionPreview.querySelector(
-                        ".admonition-title-icon"
-                    );
-                    titleSpan.textContent =
-                        this.type[0].toUpperCase() +
-                        this.type.slice(1).toLowerCase();
-                    titleSpan.prepend(iconEl);
+                    if (!this.title)
+                        this.updateTitle(admonitionPreview, this.type);
                 });
             });
         typeSetting.controlEl.addClass("admonition-type-setting");
@@ -393,6 +397,27 @@ class SettingsModal extends Modal {
             text: ")"
         });
 
+        const titleSetting = new Setting(settingDiv)
+            .setName(t("Admonition Title"))
+            .setDesc(
+                t("This will be the default title for this admonition type.")
+            )
+            .addText((text) => {
+                typeText = text;
+                typeText.setValue(this.title).onChange((v) => {
+                    if (!v.length) {
+                        this.title = null;
+                        this.updateTitle(admonitionPreview, this.type);
+                        return;
+                    }
+
+                    SettingsModal.removeValidationError(text);
+
+                    this.title = v;
+                    this.updateTitle(admonitionPreview, this.title);
+                });
+            });
+
         const input = createEl("input", {
             attr: {
                 type: "file",
@@ -447,7 +472,9 @@ class SettingsModal extends Modal {
                 text.inputEl.onblur = validate;
             })
             .addButton((b) => {
-                b.setButtonText(t("Upload Image")).setTooltip(t("Upload Image"));
+                b.setButtonText(t("Upload Image")).setTooltip(
+                    t("Upload Image")
+                );
                 b.buttonEl.addClass("admonition-file-upload");
                 b.buttonEl.appendChild(input);
                 b.onClick(() => input.click());
@@ -612,6 +639,15 @@ class SettingsModal extends Modal {
             return b;
         });
     }
+    updateTitle(admonitionPreview: HTMLElement, title: string) {
+        let titleSpan = admonitionPreview.querySelector(
+            ".admonition-title-content"
+        );
+        let iconEl = admonitionPreview.querySelector(".admonition-title-icon");
+        titleSpan.textContent =
+            title[0].toUpperCase() + title.slice(1).toLowerCase();
+        titleSpan.prepend(iconEl);
+    }
     onOpen() {
         this.display();
     }

diff --git a/src/util/util.ts b/src/util/util.ts
@@ -3,7 +3,11 @@ import { MarkdownRenderer, Notice } from "obsidian";
 /* import { nanoid } from "nanoid"; */
 
 import { getIconNode } from "./icons";
-import { AdmonitionIconDefinition, INestedAdmonition } from "../@types";
+import {
+    Admonition,
+    AdmonitionIconDefinition,
+    INestedAdmonition
+} from "../@types";
 
 export function getID() {
     return "ID_xyxyxyxyxyxy".replace(/[xy]/g, function (c) {
@@ -49,7 +53,14 @@ function startsWithAny(str: string, needles: string[]) {
     return false;
 }
 
-export function getParametersFromSource(type: string, src: string) {
+export function getParametersFromSource(
+    type: string,
+    src: string,
+    admonition: Admonition
+) {
+    const admonitionTitle =
+        admonition.title ??
+        type[0].toUpperCase() + type.slice(1).toLowerCase();
     const keywordTokens = ["title:", "collapse:", "icon:", "color:"];
 
     const keywords = ["title", "collapse", "icon", "color"];
@@ -79,12 +90,7 @@ export function getParametersFromSource(type: string, src: string) {
         ++skipLines;
     }
 
-    let {
-        title = type[0].toUpperCase() + type.slice(1).toLowerCase(),
-        collapse,
-        icon,
-        color
-    } = params;
+    let { title = admonitionTitle, collapse, icon, color } = params;
 
     let content = lines.slice(skipLines).join("\n");
 
@@ -104,7 +110,7 @@ export function getParametersFromSource(type: string, src: string) {
      * If the admonition should collapse, but title was blanked, set the default title.
      */
     if (title.trim() === "" && collapse !== undefined && collapse !== "none") {
-        title = type[0].toUpperCase() + type.slice(1).toLowerCase();
+        title = admonitionTitle;
         new Notice("An admonition must have a title if it is collapsible.");
     }