feat: Add plugin settings, improve internal link handling, and apply a default border to menu items.
This commit is contained in:
56
main.js
56
main.js
@@ -29,8 +29,13 @@ __export(main_exports, {
|
|||||||
module.exports = __toCommonJS(main_exports);
|
module.exports = __toCommonJS(main_exports);
|
||||||
var import_obsidian = require("obsidian");
|
var import_obsidian = require("obsidian");
|
||||||
var { shell } = require("electron");
|
var { shell } = require("electron");
|
||||||
|
var DEFAULT_SETTINGS = {
|
||||||
|
mySetting: "default"
|
||||||
|
};
|
||||||
var MenuPlugin = class extends import_obsidian.Plugin {
|
var MenuPlugin = class extends import_obsidian.Plugin {
|
||||||
async onload() {
|
async onload() {
|
||||||
|
await this.loadSettings();
|
||||||
|
this.addSettingTab(new MenuPluginSettingTab(this.app, this));
|
||||||
this.registerMarkdownCodeBlockProcessor("menu", (source, el, ctx) => {
|
this.registerMarkdownCodeBlockProcessor("menu", (source, el, ctx) => {
|
||||||
const lines = source.trim().split("\n");
|
const lines = source.trim().split("\n");
|
||||||
let layoutOrClass = "";
|
let layoutOrClass = "";
|
||||||
@@ -149,10 +154,7 @@ var MenuPlugin = class extends import_obsidian.Plugin {
|
|||||||
a.style.cursor = "pointer";
|
a.style.cursor = "pointer";
|
||||||
a.addEventListener("click", (e) => {
|
a.addEventListener("click", (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
const vaultName = this.app.vault.getName();
|
this.app.workspace.openLinkText(href, ctx.sourcePath, false);
|
||||||
const encodedFile = encodeURIComponent(href);
|
|
||||||
const uri = `obsidian://open?vault=${encodeURIComponent(vaultName)}&file=${encodedFile}`;
|
|
||||||
window.open(uri);
|
|
||||||
});
|
});
|
||||||
} else if (link.match(/^\[.*\]\(.*\)$/)) {
|
} else if (link.match(/^\[.*\]\(.*\)$/)) {
|
||||||
const match = link.match(/^\[(.*)\]\((.*)\)$/);
|
const match = link.match(/^\[(.*)\]\((.*)\)$/);
|
||||||
@@ -197,6 +199,52 @@ var MenuPlugin = class extends import_obsidian.Plugin {
|
|||||||
}
|
}
|
||||||
onunload() {
|
onunload() {
|
||||||
}
|
}
|
||||||
|
async loadSettings() {
|
||||||
|
this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
|
||||||
|
}
|
||||||
|
async saveSettings() {
|
||||||
|
await this.saveData(this.settings);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var MenuPluginSettingTab = class extends import_obsidian.PluginSettingTab {
|
||||||
|
constructor(app, plugin) {
|
||||||
|
super(app, plugin);
|
||||||
|
this.plugin = plugin;
|
||||||
|
}
|
||||||
|
display() {
|
||||||
|
const { containerEl } = this;
|
||||||
|
containerEl.empty();
|
||||||
|
containerEl.createEl("h2", { text: "Menu Plugin Settings" });
|
||||||
|
new import_obsidian.Setting(containerEl).setName("Setting #1").setDesc("It's a secret").addText((text) => text.setPlaceholder("Enter your secret").setValue(this.plugin.settings.mySetting).onChange(async (value) => {
|
||||||
|
this.plugin.settings.mySetting = value;
|
||||||
|
await this.plugin.saveSettings();
|
||||||
|
}));
|
||||||
|
containerEl.createEl("hr");
|
||||||
|
containerEl.createEl("h3", { text: "Usage Guide" });
|
||||||
|
const doc = containerEl.createEl("div");
|
||||||
|
doc.createEl("p", { text: "Create a custom menu using the `menu` code block." });
|
||||||
|
doc.createEl("h4", { text: "Example" });
|
||||||
|
const pre = doc.createEl("pre");
|
||||||
|
pre.createEl("code", {
|
||||||
|
text: `\`\`\`menu
|
||||||
|
layout: slate
|
||||||
|
bg: #333
|
||||||
|
text: white
|
||||||
|
[[Internal Link]]
|
||||||
|
[External Link](https://example.com)
|
||||||
|
\`\`\``
|
||||||
|
});
|
||||||
|
doc.createEl("h4", { text: "Supported Properties" });
|
||||||
|
const ul = doc.createEl("ul");
|
||||||
|
ul.createEl("li", { text: "layout: default, minimal, slate, horizon, aether" });
|
||||||
|
ul.createEl("li", { text: "class: custom CSS classes" });
|
||||||
|
ul.createEl("li", { text: "colors: bg, text, border, font (supports hover- prefix)" });
|
||||||
|
doc.createEl("h4", { text: "Link Types" });
|
||||||
|
const ul2 = doc.createEl("ul");
|
||||||
|
ul2.createEl("li", { text: "[[Internal Link]] - Opens Obsidian note" });
|
||||||
|
ul2.createEl("li", { text: "[External Link](https://...) - Opens in browser" });
|
||||||
|
ul2.createEl("li", { text: "[File Link](file://...) - Opens local file/folder" });
|
||||||
|
}
|
||||||
};
|
};
|
||||||
// Annotate the CommonJS export names for ESM import in node:
|
// Annotate the CommonJS export names for ESM import in node:
|
||||||
0 && (module.exports = {});
|
0 && (module.exports = {});
|
||||||
|
|||||||
448
main.ts
448
main.ts
@@ -1,202 +1,280 @@
|
|||||||
import { Plugin } from 'obsidian';
|
import { App, Plugin, PluginSettingTab, Setting } from 'obsidian';
|
||||||
|
|
||||||
const { shell } = require('electron');
|
const { shell } = require('electron');
|
||||||
|
|
||||||
|
interface MenuPluginSettings {
|
||||||
|
mySetting: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const DEFAULT_SETTINGS: MenuPluginSettings = {
|
||||||
|
mySetting: 'default'
|
||||||
|
}
|
||||||
|
|
||||||
export default class MenuPlugin extends Plugin {
|
export default class MenuPlugin extends Plugin {
|
||||||
async onload() {
|
settings: MenuPluginSettings;
|
||||||
this.registerMarkdownCodeBlockProcessor('menu', (source, el, ctx) => {
|
|
||||||
const lines = source.trim().split('\n');
|
|
||||||
let layoutOrClass = '';
|
|
||||||
let colors: Record<string, string> = {};
|
|
||||||
const links: string[] = [];
|
|
||||||
|
|
||||||
// Parse YAML-like properties and links
|
async onload() {
|
||||||
for (const line of lines) {
|
await this.loadSettings();
|
||||||
const trimmed = line.trim();
|
|
||||||
if (trimmed.startsWith('layout:') || trimmed.startsWith('class:')) {
|
|
||||||
const colonIndex = trimmed.indexOf(':');
|
|
||||||
layoutOrClass = trimmed.substring(colonIndex + 1).trim();
|
|
||||||
} else if (trimmed.includes(':') && !trimmed.startsWith('[') && !trimmed.startsWith('[[')) {
|
|
||||||
// Parse color properties
|
|
||||||
const [key, ...valueParts] = trimmed.split(':');
|
|
||||||
const value = valueParts.join(':').trim();
|
|
||||||
if (key && value && !key.includes('//') && !key.includes('http')) {
|
|
||||||
colors[key.trim()] = value;
|
|
||||||
}
|
|
||||||
} else if (trimmed && !trimmed.includes(':')) {
|
|
||||||
links.push(trimmed);
|
|
||||||
} else if (trimmed.startsWith('[')) {
|
|
||||||
links.push(trimmed);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Determine layout and classes
|
// This adds a settings tab so the user can configure various aspects of the plugin
|
||||||
const builtInLayouts = new Set(['default', 'minimal', 'slate', 'horizon', 'aether']);
|
this.addSettingTab(new MenuPluginSettingTab(this.app, this));
|
||||||
const container = el.createEl('div', { cls: 'menu-container' });
|
|
||||||
|
|
||||||
let selectedLayout = '';
|
this.registerMarkdownCodeBlockProcessor('menu', (source, el, ctx) => {
|
||||||
let extraClasses: string[] = [];
|
const lines = source.trim().split('\n');
|
||||||
|
let layoutOrClass = '';
|
||||||
|
let colors: Record<string, string> = {};
|
||||||
|
const links: string[] = [];
|
||||||
|
|
||||||
if (layoutOrClass) {
|
// Parse YAML-like properties and links
|
||||||
const tokens = layoutOrClass.split(/\s+/).filter(Boolean);
|
for (const line of lines) {
|
||||||
if (tokens.length) {
|
const trimmed = line.trim();
|
||||||
// Allow built-in layout to appear anywhere in the list (e.g., "class: my-class horizon wide")
|
if (trimmed.startsWith('layout:') || trimmed.startsWith('class:')) {
|
||||||
const builtInIndex = tokens.findIndex(t => builtInLayouts.has(t));
|
const colonIndex = trimmed.indexOf(':');
|
||||||
if (builtInIndex !== -1) {
|
layoutOrClass = trimmed.substring(colonIndex + 1).trim();
|
||||||
selectedLayout = tokens[builtInIndex];
|
} else if (trimmed.includes(':') && !trimmed.startsWith('[') && !trimmed.startsWith('[[')) {
|
||||||
extraClasses = tokens.filter((_, i) => i !== builtInIndex);
|
// Parse color properties
|
||||||
} else {
|
const [key, ...valueParts] = trimmed.split(':');
|
||||||
// Custom class mode: do not apply plugin CSS (no data-layout)
|
const value = valueParts.join(':').trim();
|
||||||
extraClasses = tokens;
|
if (key && value && !key.includes('//') && !key.includes('http')) {
|
||||||
}
|
colors[key.trim()] = value;
|
||||||
}
|
}
|
||||||
} else {
|
} else if (trimmed && !trimmed.includes(':')) {
|
||||||
// No layout/class provided: use default built-in template
|
links.push(trimmed);
|
||||||
selectedLayout = 'default';
|
} else if (trimmed.startsWith('[')) {
|
||||||
}
|
links.push(trimmed);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Apply selected built-in template via data attribute (gates plugin CSS)
|
// Determine layout and classes
|
||||||
if (selectedLayout) {
|
const builtInLayouts = new Set(['default', 'minimal', 'slate', 'horizon', 'aether']);
|
||||||
container.setAttr('data-layout', selectedLayout);
|
const container = el.createEl('div', { cls: 'menu-container' });
|
||||||
}
|
|
||||||
|
|
||||||
// Apply any extra classes (e.g., "wide" or user-provided classes)
|
let selectedLayout = '';
|
||||||
for (const cls of extraClasses) {
|
let extraClasses: string[] = [];
|
||||||
container.addClass(cls);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Apply custom properties (whitelist only: bg, text, border, font and their -hover variants,
|
if (layoutOrClass) {
|
||||||
// plus internal-, external-, file- prefixed versions). No raw CSS props allowed.
|
const tokens = layoutOrClass.split(/\s+/).filter(Boolean);
|
||||||
if (Object.keys(colors).length > 0) {
|
if (tokens.length) {
|
||||||
const baseKeys = new Set([
|
// Allow built-in layout to appear anywhere in the list (e.g., "class: my-class horizon wide")
|
||||||
'bg','text','border','font',
|
const builtInIndex = tokens.findIndex(t => builtInLayouts.has(t));
|
||||||
'hover-text','hover-bg','hover-border','hover-font',
|
if (builtInIndex !== -1) {
|
||||||
]);
|
selectedLayout = tokens[builtInIndex];
|
||||||
const normalizeKey = (raw: string) => {
|
extraClasses = tokens.filter((_, i) => i !== builtInIndex);
|
||||||
let s = raw.trim().toLowerCase();
|
} else {
|
||||||
// Normalize synonyms/order for hover variants
|
// Custom class mode: do not apply plugin CSS (no data-layout)
|
||||||
s = s
|
extraClasses = tokens;
|
||||||
// Prefer "hover-*" (matches CSS)
|
}
|
||||||
.replace(/\btext-hover\b/g, 'hover-text')
|
}
|
||||||
.replace(/\bbg-hover\b/g, 'hover-bg')
|
} else {
|
||||||
.replace(/\bborder-hover\b/g, 'hover-border')
|
// No layout/class provided: use default built-in template
|
||||||
// Old naming from earlier versions -> new "hover-*" order
|
selectedLayout = 'default';
|
||||||
.replace(/\binternal-text-hover\b/g, 'internal-hover-text')
|
}
|
||||||
.replace(/\binternal-bg-hover\b/g, 'internal-hover-bg')
|
|
||||||
.replace(/\binternal-border-hover\b/g, 'internal-hover-border')
|
|
||||||
.replace(/\bexternal-text-hover\b/g, 'external-hover-text')
|
|
||||||
.replace(/\bexternal-bg-hover\b/g, 'external-hover-bg')
|
|
||||||
.replace(/\bexternal-border-hover\b/g, 'external-hover-border')
|
|
||||||
.replace(/\bfile-text-hover\b/g, 'file-hover-text')
|
|
||||||
.replace(/\bfile-bg-hover\b/g, 'file-hover-bg')
|
|
||||||
.replace(/\bfile-border-hover\b/g, 'file-hover-border')
|
|
||||||
// Back-compat for "accent" -> "hover-text"
|
|
||||||
.replace(/\baccent\b/g, 'hover-text')
|
|
||||||
.replace(/\binternal-accent\b/g, 'internal-hover-text')
|
|
||||||
.replace(/\bexternal-accent\b/g, 'external-hover-text')
|
|
||||||
.replace(/\bfile-accent\b/g, 'file-hover-text')
|
|
||||||
.replace(/\bbackground\b/g, 'bg');
|
|
||||||
return s;
|
|
||||||
};
|
|
||||||
const isAllowed = (key: string) => {
|
|
||||||
if (baseKeys.has(key)) return true;
|
|
||||||
const m = key.match(/^(internal|external|file)-(.*)$/);
|
|
||||||
return !!(m && baseKeys.has(m[2]));
|
|
||||||
};
|
|
||||||
for (const [rawKey, value] of Object.entries(colors)) {
|
|
||||||
const key = normalizeKey(rawKey);
|
|
||||||
if (!isAllowed(key)) continue;
|
|
||||||
container.style.setProperty(`--${key}`, value);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// In custom class mode (no built-in layout), apply base inline styles to anchors so whitelist vars work without CSS.
|
// Apply selected built-in template via data attribute (gates plugin CSS)
|
||||||
const applyInlineBaseStyles = (a: HTMLElement, variant: 'internal' | 'external' | 'file' | 'generic') => {
|
if (selectedLayout) {
|
||||||
const prefix = variant === 'generic' ? '' : `${variant}-`;
|
container.setAttr('data-layout', selectedLayout);
|
||||||
const get = (k: string) => (colors[`${prefix}${k}`] ?? colors[k]);
|
}
|
||||||
const bgVal = get('bg'); if (bgVal) a.style.background = bgVal as string;
|
|
||||||
const textVal = get('text'); if (textVal) a.style.color = textVal as string;
|
|
||||||
const borderVal = get('border'); if (borderVal) a.style.borderColor = borderVal as string;
|
|
||||||
const fontVal = get('font'); if (fontVal) a.style.fontFamily = fontVal as string;
|
|
||||||
// Expose hover values as CSS variables on the anchor for user CSS to consume if desired
|
|
||||||
const hoverKeys = ['hover-bg','hover-text','hover-border','hover-font'];
|
|
||||||
for (const hk of hoverKeys) {
|
|
||||||
const v = get(hk);
|
|
||||||
if (v) a.style.setProperty(`--${hk}`, v as string);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Process each link
|
// Apply any extra classes (e.g., "wide" or user-provided classes)
|
||||||
for (const link of links) {
|
for (const cls of extraClasses) {
|
||||||
if (link.startsWith('[[') && link.endsWith(']]')) {
|
container.addClass(cls);
|
||||||
// Internal link
|
}
|
||||||
const linkContent = link.slice(2, -2);
|
|
||||||
let href = linkContent;
|
|
||||||
let text = linkContent;
|
|
||||||
if (linkContent.includes('|')) {
|
|
||||||
[href, text] = linkContent.split('|');
|
|
||||||
}
|
|
||||||
const a = container.createEl('a', {
|
|
||||||
text: text,
|
|
||||||
attr: { 'data-href': href }
|
|
||||||
});
|
|
||||||
a.addClass('menu-internal-link');
|
|
||||||
if (!selectedLayout) applyInlineBaseStyles(a, 'internal');
|
|
||||||
a.style.cursor = 'pointer';
|
|
||||||
a.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const vaultName = this.app.vault.getName();
|
|
||||||
const encodedFile = encodeURIComponent(href);
|
|
||||||
const uri = `obsidian://open?vault=${encodeURIComponent(vaultName)}&file=${encodedFile}`;
|
|
||||||
window.open(uri);
|
|
||||||
});
|
|
||||||
} else if (link.match(/^\[.*\]\(.*\)$/)) {
|
|
||||||
// External link
|
|
||||||
const match = link.match(/^\[(.*)\]\((.*)\)$/);
|
|
||||||
if (match) {
|
|
||||||
const text = match[1];
|
|
||||||
const url = match[2];
|
|
||||||
const a = container.createEl('a', {
|
|
||||||
text: text,
|
|
||||||
attr: url.startsWith('file://') ? {} : { href: url, target: '_blank', rel: 'noopener noreferrer' }
|
|
||||||
});
|
|
||||||
a.style.cursor = 'pointer';
|
|
||||||
|
|
||||||
// Add appropriate class based on link type
|
// Apply custom properties (whitelist only: bg, text, border, font and their -hover variants,
|
||||||
if (url.startsWith('file://')) {
|
// plus internal-, external-, file- prefixed versions). No raw CSS props allowed.
|
||||||
a.addClass('menu-file-link');
|
if (Object.keys(colors).length > 0) {
|
||||||
if (!selectedLayout) applyInlineBaseStyles(a, 'file');
|
const baseKeys = new Set([
|
||||||
} else {
|
'bg', 'text', 'border', 'font',
|
||||||
a.addClass('menu-external-link');
|
'hover-text', 'hover-bg', 'hover-border', 'hover-font',
|
||||||
if (!selectedLayout) applyInlineBaseStyles(a, 'external');
|
]);
|
||||||
}
|
const normalizeKey = (raw: string) => {
|
||||||
a.addEventListener('click', (e) => {
|
let s = raw.trim().toLowerCase();
|
||||||
e.preventDefault();
|
// Normalize synonyms/order for hover variants
|
||||||
if (url.startsWith('file://')) {
|
s = s
|
||||||
try {
|
// Prefer "hover-*" (matches CSS)
|
||||||
// Convert file URL to path and handle Windows paths
|
.replace(/\btext-hover\b/g, 'hover-text')
|
||||||
let filePath = decodeURIComponent(url.substring(7)); // Remove 'file://'
|
.replace(/\bbg-hover\b/g, 'hover-bg')
|
||||||
// Handle Windows paths that start with /C:
|
.replace(/\bborder-hover\b/g, 'hover-border')
|
||||||
if (filePath.startsWith('/') && filePath.charAt(2) === ':') {
|
// Old naming from earlier versions -> new "hover-*" order
|
||||||
filePath = filePath.substring(1);
|
.replace(/\binternal-text-hover\b/g, 'internal-hover-text')
|
||||||
}
|
.replace(/\binternal-bg-hover\b/g, 'internal-hover-bg')
|
||||||
console.log('Opening file path:', filePath);
|
.replace(/\binternal-border-hover\b/g, 'internal-hover-border')
|
||||||
shell.openPath(filePath);
|
.replace(/\bexternal-text-hover\b/g, 'external-hover-text')
|
||||||
} catch (error) {
|
.replace(/\bexternal-bg-hover\b/g, 'external-hover-bg')
|
||||||
console.error('Failed to open file:', error);
|
.replace(/\bexternal-border-hover\b/g, 'external-hover-border')
|
||||||
}
|
.replace(/\bfile-text-hover\b/g, 'file-hover-text')
|
||||||
} else {
|
.replace(/\bfile-bg-hover\b/g, 'file-hover-bg')
|
||||||
window.open(url, '_blank', 'noopener,noreferrer');
|
.replace(/\bfile-border-hover\b/g, 'file-hover-border')
|
||||||
}
|
// Back-compat for "accent" -> "hover-text"
|
||||||
});
|
.replace(/\baccent\b/g, 'hover-text')
|
||||||
}
|
.replace(/\binternal-accent\b/g, 'internal-hover-text')
|
||||||
}
|
.replace(/\bexternal-accent\b/g, 'external-hover-text')
|
||||||
}
|
.replace(/\bfile-accent\b/g, 'file-hover-text')
|
||||||
});
|
.replace(/\bbackground\b/g, 'bg');
|
||||||
}
|
return s;
|
||||||
|
};
|
||||||
|
const isAllowed = (key: string) => {
|
||||||
|
if (baseKeys.has(key)) return true;
|
||||||
|
const m = key.match(/^(internal|external|file)-(.*)$/);
|
||||||
|
return !!(m && baseKeys.has(m[2]));
|
||||||
|
};
|
||||||
|
for (const [rawKey, value] of Object.entries(colors)) {
|
||||||
|
const key = normalizeKey(rawKey);
|
||||||
|
if (!isAllowed(key)) continue;
|
||||||
|
container.style.setProperty(`--${key}`, value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
onunload() {
|
// In custom class mode (no built-in layout), apply base inline styles to anchors so whitelist vars work without CSS.
|
||||||
// Cleanup if needed
|
const applyInlineBaseStyles = (a: HTMLElement, variant: 'internal' | 'external' | 'file' | 'generic') => {
|
||||||
}
|
const prefix = variant === 'generic' ? '' : `${variant}-`;
|
||||||
|
const get = (k: string) => (colors[`${prefix}${k}`] ?? colors[k]);
|
||||||
|
const bgVal = get('bg'); if (bgVal) a.style.background = bgVal as string;
|
||||||
|
const textVal = get('text'); if (textVal) a.style.color = textVal as string;
|
||||||
|
const borderVal = get('border'); if (borderVal) a.style.borderColor = borderVal as string;
|
||||||
|
const fontVal = get('font'); if (fontVal) a.style.fontFamily = fontVal as string;
|
||||||
|
// Expose hover values as CSS variables on the anchor for user CSS to consume if desired
|
||||||
|
const hoverKeys = ['hover-bg', 'hover-text', 'hover-border', 'hover-font'];
|
||||||
|
for (const hk of hoverKeys) {
|
||||||
|
const v = get(hk);
|
||||||
|
if (v) a.style.setProperty(`--${hk}`, v as string);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Process each link
|
||||||
|
for (const link of links) {
|
||||||
|
if (link.startsWith('[[') && link.endsWith(']]')) {
|
||||||
|
// Internal link
|
||||||
|
const linkContent = link.slice(2, -2);
|
||||||
|
let href = linkContent;
|
||||||
|
let text = linkContent;
|
||||||
|
if (linkContent.includes('|')) {
|
||||||
|
[href, text] = linkContent.split('|');
|
||||||
|
}
|
||||||
|
const a = container.createEl('a', {
|
||||||
|
text: text,
|
||||||
|
attr: { 'data-href': href }
|
||||||
|
});
|
||||||
|
a.addClass('menu-internal-link');
|
||||||
|
if (!selectedLayout) applyInlineBaseStyles(a, 'internal');
|
||||||
|
a.style.cursor = 'pointer';
|
||||||
|
a.addEventListener('click', (e) => {
|
||||||
|
e.preventDefault();
|
||||||
|
this.app.workspace.openLinkText(href, ctx.sourcePath, false);
|
||||||
|
});
|
||||||
|
} else if (link.match(/^\[.*\]\(.*\)$/)) {
|
||||||
|
// External link
|
||||||
|
const match = link.match(/^\[(.*)\]\((.*)\)$/);
|
||||||
|
if (match) {
|
||||||
|
const text = match[1];
|
||||||
|
const url = match[2];
|
||||||
|
const a = container.createEl('a', {
|
||||||
|
text: text,
|
||||||
|
attr: url.startsWith('file://') ? {} : { href: url, target: '_blank', rel: 'noopener noreferrer' }
|
||||||
|
});
|
||||||
|
a.style.cursor = 'pointer';
|
||||||
|
|
||||||
|
// Add appropriate class based on link type
|
||||||
|
if (url.startsWith('file://')) {
|
||||||
|
a.addClass('menu-file-link');
|
||||||
|
if (!selectedLayout) applyInlineBaseStyles(a, 'file');
|
||||||
|
} else {
|
||||||
|
a.addClass('menu-external-link');
|
||||||
|
if (!selectedLayout) applyInlineBaseStyles(a, 'external');
|
||||||
|
}
|
||||||
|
a.addEventListener('click', (e) => {
|
||||||
|
e.preventDefault();
|
||||||
|
if (url.startsWith('file://')) {
|
||||||
|
try {
|
||||||
|
// Convert file URL to path and handle Windows paths
|
||||||
|
let filePath = decodeURIComponent(url.substring(7)); // Remove 'file://'
|
||||||
|
// Handle Windows paths that start with /C:
|
||||||
|
if (filePath.startsWith('/') && filePath.charAt(2) === ':') {
|
||||||
|
filePath = filePath.substring(1);
|
||||||
|
}
|
||||||
|
console.log('Opening file path:', filePath);
|
||||||
|
shell.openPath(filePath);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to open file:', error);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
window.open(url, '_blank', 'noopener,noreferrer');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
onunload() {
|
||||||
|
// Cleanup if needed
|
||||||
|
}
|
||||||
|
|
||||||
|
async loadSettings() {
|
||||||
|
this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
|
||||||
|
}
|
||||||
|
|
||||||
|
async saveSettings() {
|
||||||
|
await this.saveData(this.settings);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class MenuPluginSettingTab extends PluginSettingTab {
|
||||||
|
plugin: MenuPlugin;
|
||||||
|
|
||||||
|
constructor(app: App, plugin: MenuPlugin) {
|
||||||
|
super(app, plugin);
|
||||||
|
this.plugin = plugin;
|
||||||
|
}
|
||||||
|
|
||||||
|
display(): void {
|
||||||
|
const { containerEl } = this;
|
||||||
|
|
||||||
|
containerEl.empty();
|
||||||
|
|
||||||
|
containerEl.createEl('h2', { text: 'Menu Plugin Settings' });
|
||||||
|
|
||||||
|
new Setting(containerEl)
|
||||||
|
.setName('Setting #1')
|
||||||
|
.setDesc('It\'s a secret')
|
||||||
|
.addText(text => text
|
||||||
|
.setPlaceholder('Enter your secret')
|
||||||
|
.setValue(this.plugin.settings.mySetting)
|
||||||
|
.onChange(async (value) => {
|
||||||
|
this.plugin.settings.mySetting = value;
|
||||||
|
await this.plugin.saveSettings();
|
||||||
|
}));
|
||||||
|
|
||||||
|
// --- Documentation Section ---
|
||||||
|
containerEl.createEl('hr');
|
||||||
|
containerEl.createEl('h3', { text: 'Usage Guide' });
|
||||||
|
|
||||||
|
const doc = containerEl.createEl('div');
|
||||||
|
|
||||||
|
doc.createEl('p', { text: 'Create a custom menu using the `menu` code block.' });
|
||||||
|
|
||||||
|
doc.createEl('h4', { text: 'Example' });
|
||||||
|
const pre = doc.createEl('pre');
|
||||||
|
pre.createEl('code', {
|
||||||
|
text: `\`\`\`menu
|
||||||
|
layout: slate
|
||||||
|
bg: #333
|
||||||
|
text: white
|
||||||
|
[[Internal Link]]
|
||||||
|
[External Link](https://example.com)
|
||||||
|
\`\`\``});
|
||||||
|
|
||||||
|
doc.createEl('h4', { text: 'Supported Properties' });
|
||||||
|
const ul = doc.createEl('ul');
|
||||||
|
ul.createEl('li', { text: 'layout: default, minimal, slate, horizon, aether' });
|
||||||
|
ul.createEl('li', { text: 'class: custom CSS classes' });
|
||||||
|
ul.createEl('li', { text: 'colors: bg, text, border, font (supports hover- prefix)' });
|
||||||
|
|
||||||
|
doc.createEl('h4', { text: 'Link Types' });
|
||||||
|
const ul2 = doc.createEl('ul');
|
||||||
|
ul2.createEl('li', { text: '[[Internal Link]] - Opens Obsidian note' });
|
||||||
|
ul2.createEl('li', { text: '[External Link](https://...) - Opens in browser' });
|
||||||
|
ul2.createEl('li', { text: '[File Link](file://...) - Opens local file/folder' });
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"id": "menu-plugin",
|
"id": "menu-plugin",
|
||||||
"name": "Obsidian Menus",
|
"name": "Obsidian Menus",
|
||||||
"version": "1.0.1",
|
"version": "1.2",
|
||||||
"minAppVersion": "0.15.0",
|
"minAppVersion": "0.15.0",
|
||||||
"description": "Create custom menus using code blocks with links and CSS styling.",
|
"description": "Create custom menus using code blocks with links and CSS styling.",
|
||||||
"author": "Olivier Legendre",
|
"author": "Olivier Legendre",
|
||||||
|
|||||||
@@ -128,6 +128,7 @@
|
|||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
color: var(--text, var(--text-normal));
|
color: var(--text, var(--text-normal));
|
||||||
|
border: 1px solid var(--border, var(--background-modifier-border));
|
||||||
background: var(--bg, transparent);
|
background: var(--bg, transparent);
|
||||||
font-family: var(--font, inherit);
|
font-family: var(--font, inherit);
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user