6.2.5

- better codemirror import - icon chooser now prefers font-awesome first - added icon module source to chooser - explicitly selecting an icon will now select that exact icon if duplicate names exist (closes #77)
javalent · Aug 19, 2021 · b68061e · b68061e
1 parent ad2f0c5
commit b68061e
Show file tree

Hide file tree

Showing 7 changed files with 48 additions and 24 deletions.
diff --git a/package.json b/package.json
@@ -20,6 +20,7 @@
         "@rollup/plugin-typescript": "^6.0.0",
         "@types/node": "^14.14.2",
         "@types/object.fromentries": "^2.0.0",
+        "codemirror": "^5.62.2",
         "object.fromentries": "^2.0.4",
         "obsidian": "https://github.com/obsidianmd/obsidian-api/tarball/master",
         "rollup": "^2.32.1",

diff --git a/src/codemirror/codemirror.js b/src/codemirror/codemirror.js
diff --git a/src/main.ts b/src/main.ts
@@ -32,7 +32,14 @@ import {
     REMOVE_COMMAND_NAME
 } from "./util";
 
-import * as CodeMirror from "./codemirror/codemirror";
+/* import * as CodeMirror from "./codemirror/codemirror"; */
+import type codemirror from "codemirror";
+
+declare global {
+    interface Window {
+        CodeMirror: typeof codemirror;
+    }
+}
 
 //add commands to app interface
 declare module "obsidian" {
@@ -81,7 +88,7 @@ Object.fromEntries =
 
 import "./assets/main.css";
 import AdmonitionSetting from "./settings";
-import { IconName, COPY_BUTTON_ICON, iconNames } from "./util/icons";
+import { IconName, COPY_BUTTON_ICON, iconDefinitions } from "./util/icons";
 import { InsertAdmonitionModal } from "./modal";
 
 const DEFAULT_APP_SETTINGS: ISettingsData = {
@@ -623,9 +630,12 @@ title:
         types.forEach((type) => {
             if (this.data.syntaxHighlight) {
                 /** Process from @deathau's syntax highlight plugin */
-                CodeMirror.defineMode(`ad-${type}`, (config, options) => {
-                    return CodeMirror.getMode(config, "hypermd");
-                });
+                window.CodeMirror.defineMode(
+                    `ad-${type}`,
+                    (config, options) => {
+                        return window.CodeMirror.getMode({}, "hypermd");
+                    }
+                );
             }
         });
 
@@ -639,8 +649,8 @@ title:
 
     turnOffSyntaxHighlighting(types: string[] = Object.keys(this.admonitions)) {
         types.forEach((type) => {
-            if (CodeMirror.modes.hasOwnProperty(`ad-${type}`)) {
-                delete CodeMirror.modes[`ad-${type}`];
+            if (window.CodeMirror.modes.hasOwnProperty(`ad-${type}`)) {
+                delete window.CodeMirror.modes[`ad-${type}`];
             }
         });
         this.app.workspace.layoutReady
@@ -721,7 +731,7 @@ title:
             let admonitionElement = getAdmonitionElement(
                 type,
                 title,
-                iconNames.get(icon as RPGIconName | IconName) ??
+                iconDefinitions.find(({ name }) => icon === name) ??
                     this.admonitions[type].icon,
                 color ?? this.admonitions[type].color,
                 collapse,

diff --git a/src/modal/index.ts b/src/modal/index.ts
@@ -12,7 +12,12 @@ import {
 } from "obsidian";
 import { createPopper, Instance as PopperInstance } from "@popperjs/core";
 
-import { getAdmonitionElement, getIconNode, iconNames } from "../util";
+import {
+    getAdmonitionElement,
+    getIconModuleName,
+    getIconNode,
+    iconDefinitions
+} from "../util";
 import {
     Admonition,
     AdmonitionIconDefinition,
@@ -238,9 +243,9 @@ export class IconSuggestionModal extends SuggestionModal<AdmonitionIconDefinitio
     icons: AdmonitionIconDefinition[];
     icon: AdmonitionIconDefinition;
     text: TextComponent;
-    constructor(app: App, input: TextComponent, items: typeof iconNames) {
-        super(app, input.inputEl, [...items.values()]);
-        this.icons = [...items.values()];
+    constructor(app: App, input: TextComponent) {
+        super(app, input.inputEl, iconDefinitions);
+        this.icons = iconDefinitions;
         this.text = input;
 
         this.createPrompts();
@@ -264,6 +269,7 @@ export class IconSuggestionModal extends SuggestionModal<AdmonitionIconDefinitio
     }
     selectSuggestion({ item }: FuzzyMatch<AdmonitionIconDefinition>) {
         this.text.setValue(item.name);
+        this.icon = item;
         this.onClose();
 
         this.close();
@@ -301,6 +307,10 @@ export class IconSuggestionModal extends SuggestionModal<AdmonitionIconDefinitio
 
         const iconDiv = createDiv("suggestion-flair admonition-suggester-icon");
         iconDiv.appendChild(getIconNode(item));
+        content.createDiv({
+            cls: "suggestion-note",
+            text: getIconModuleName(item)
+        });
 
         content.prepend(iconDiv);
     }

diff --git a/src/settings.ts b/src/settings.ts
@@ -21,7 +21,7 @@ import {
     getIconType,
     WARNING_ICON
 } from "./util";
-import { iconNames } from "./util";
+
 import { ADD_COMMAND_NAME, REMOVE_COMMAND_NAME } from "./util";
 
 import { IconSuggestionModal } from "./modal";
@@ -46,7 +46,7 @@ export default class AdmonitionSetting extends PluginSettingTab {
         let { containerEl } = this;
 
         containerEl.empty();
-        containerEl.addClass("admonition-settings")
+        containerEl.addClass("admonition-settings");
         containerEl.createEl("h2", { text: "Admonition Settings" });
 
         let syntax = new Setting(containerEl)
@@ -418,7 +418,7 @@ class SettingsModal extends Modal {
 
                     SettingsModal.removeValidationError(text);
 
-                    this.icon = {
+                    this.icon = modal.icon ?? {
                         name: v as AdmonitionIconName,
                         type: ic as AdmonitionIconType
                     };
@@ -430,11 +430,7 @@ class SettingsModal extends Modal {
                     iconEl.innerHTML = getIconNode(this.icon).outerHTML;
                 };
 
-                const modal = new IconSuggestionModal(
-                    this.app,
-                    text,
-                    iconNames
-                );
+                const modal = new IconSuggestionModal(this.app, text);
 
                 modal.onClose = validate;
 

diff --git a/src/util/icons.ts b/src/util/icons.ts
@@ -50,12 +50,20 @@ const FontAwesomeIconNames: Map<IconName, AdmonitionIconDefinition> = new Map(
     })
 );
 
-export const iconNames = new Map([...RPGIconNames, ...FontAwesomeIconNames]);
+export const iconDefinitions = [
+    ...FontAwesomeIconNames.values(),
+    ...RPGIconNames.values()
+];
 
 export function getIconType(str: string): "rpg" | "font-awesome" {
-    if (RPG[str as RPGIconName]) return "rpg";
     if (findIconDefinition({ iconName: str as IconName, prefix: "fas" }))
         return "font-awesome";
+    if (RPG[str as RPGIconName]) return "rpg";
+}
+
+export function getIconModuleName(icon: AdmonitionIconDefinition) {
+    if (icon.type === "rpg") return "RPG Awesome";
+    if (icon.type === "font-awesome") return "Font Awesome";
 }
 
 export function getIconNode(item: AdmonitionIconDefinition): Element {

diff --git a/tsconfig.json b/tsconfig.json
@@ -12,5 +12,5 @@
         "importHelpers": true,
         "lib": ["dom", "es5", "scripthost", "es2019"]
     },
-    "include": ["**/*.ts", "src/codemirror/codemirror.js"]
+    "include": ["**/*.ts"]
 }