diff --git a/main.ts b/main.ts index 392c6d2..b3c593f 100644 --- a/main.ts +++ b/main.ts @@ -225,29 +225,6 @@ export default class AutoEmbedPlugin extends Plugin { return null; } - getLinkText(url: string, options?: string): string { - // Match "url" or "link", ignoring case - const urlRegex = /{{(?:(?:url)|(?:link))}}/i; - const optionsRegex = /{{options?}}/i; - const format = this.settings.markdownLinkTextFormat; - - // If no options, replace {{url}} and cut everything after - // Reason: - // Usually the text after {{url}} is to separate url and options. E.g. "{{url}}|{{options}}" or "{{url}}, {{options}}" - // If want to have different options for seperating those 2 examples ^^^, need different formats which just complicates things for the user - - if (!options) { - console.log("b") - const urlRegexMatch = format.match(urlRegex); - return urlRegexMatch ? - format.substring(0, urlRegexMatch.index) + url : - format; - } - console.log("c") - - return format.replace(urlRegex, url).replace(optionsRegex, options); - } - markToEmbed(selection: Selection, editor: Editor) { // TODO: Consider hiding ae:embed? but then will make viewing in [source mode] messy // editor.replaceRange(`[ae:embed${selection.text}](${selection.text})`, selection.start, selection.end); diff --git a/preview-embed-modal.ts b/preview-embed-modal.ts index e89ee3d..f9d8e72 100644 --- a/preview-embed-modal.ts +++ b/preview-embed-modal.ts @@ -17,10 +17,8 @@ export class PreviewEmbedModal extends Modal { const {contentEl} = this; this.titleEl.textContent = "Preview Embed"; - let linkText = this.plugin.getLinkText(this.url, this.options); + // let linkText = this.plugin.getLinkText(this.url, this.options); - const sourceMode = createEl("p", { text: `[${linkText}](${this.url})` }); - const livePreview = createEl("a", { text: linkText, href: this.url }); let currEmbed: HTMLElement | null = null; // ===== NOTE ===== @@ -34,17 +32,11 @@ export class PreviewEmbedModal extends Modal { .setValue(this.url) .onChange((value) => { this.url = value; - linkText = this.plugin.getLinkText(this.url, this.options); - - sourceMode.setText(`[${linkText}](${this.url})`); - - livePreview.setText(linkText) - livePreview.href = this.url; if (currEmbed) contentEl.removeChild(currEmbed); - const readingViewAnchor = createEl("a", { text: linkText, href: this.url }); + const readingViewAnchor = createEl("a", { text: "", href: this.url }); contentEl.appendChild(readingViewAnchor); this.plugin.handleAnchor(readingViewAnchor); })); @@ -54,14 +46,10 @@ export class PreviewEmbedModal extends Modal { .addText(text => text .setValue(this.options)) - contentEl.appendChild(createEl("h3", { text: "Source Mode:" })); - contentEl.appendChild(sourceMode); - - contentEl.appendChild(createEl("h3", { text: "Live Preview:" })); - contentEl.appendChild(livePreview); - + // TODO: add invalid url + contentEl.appendChild(createEl("h3", { text: "Reading View:" })); - const readingViewAnchor = createEl("a", { text: linkText, href: this.url }); + const readingViewAnchor = createEl("a", { text: "", href: this.url }); contentEl.appendChild(readingViewAnchor); currEmbed = this.plugin.handleAnchor(readingViewAnchor); } diff --git a/settings-tab.ts b/settings-tab.ts index 499ad55..f941bae 100644 --- a/settings-tab.ts +++ b/settings-tab.ts @@ -20,12 +20,6 @@ export interface PluginSettings { // Advanced settings showAdvancedSettings: boolean; debug: boolean; // Shows debug text in console - - // Content inside tags. - // Example: - // linkText = "embed:{{url}}|{{options}}" - // output = "embed:example.com|dark-mode,w=100%,h=300px" - markdownLinkTextFormat: string; } export const DEFAULT_SETTINGS: PluginSettings = { @@ -35,7 +29,6 @@ export const DEFAULT_SETTINGS: PluginSettings = { showAdvancedSettings: false, debug: false, - markdownLinkTextFormat: "embed:{{url}}|{{options}}", } export class AutoEmbedSettingTab extends PluginSettingTab { @@ -63,13 +56,9 @@ export class AutoEmbedSettingTab extends PluginSettingTab { .setButtonText("Preview") .setTooltip(previewTooltip) .onClick(() => { - const modal = new PreviewEmbedModal(plugin, url); + const modal = new PreviewEmbedModal(plugin, "https://www.youtube.com/watch?v=DbsAQSIKQXk&t=468s"); modal.open(); })) - - // For previewing embed - let url = "https://www.youtube.com/watch?v=DbsAQSIKQXk&t=468s"; - let options = "dark-mode"; new Setting(containerEl) .setName("Dark mode") @@ -97,131 +86,6 @@ export class AutoEmbedSettingTab extends PluginSettingTab { await this.plugin.saveSettings(); }) ); - - // ===== Advanced Settings ===== - - // Add all advanced settings here. Excluding "Show advanced settings" - const advancedSettings: Setting[] = []; - // Toggles display value for all advanced settings at the start and when toggled - function updateAdvancedSettingsDisplay() { - const displayValue = settings.showAdvancedSettings ? "" : "none"; - advancedSettings.forEach(setting => { - setting.settingEl.style.display = displayValue; - }); - } - - new Setting(containerEl) - .setName("Show advanced settings") - .setHeading() - .addToggle(toggle => toggle - .setValue(settings.showAdvancedSettings) - .onChange(async (value) => { - settings.showAdvancedSettings = value; - - updateAdvancedSettingsDisplay(); - - await plugin.saveSettings(); - })) - - // ===== Showing link text preview ===== - // #region - - // Shorten standardised way of creating the text pop, - // Referenced from how Obsidian does it from Settings -> Daily notes -> Date format - function createTextPopEl(text: string): HTMLElement { return createEl("b", {cls: "u-pop #text-pop", text: text})} - - const linkTextSample = new DocumentFragment(); - // linkTextSample.textContent = "Markdown: "; - const linkTextSampleText = createTextPopEl(this.plugin.getLinkText(url)); - linkTextSample.appendChild(linkTextSampleText); - - const linkTextOptionsSample = new DocumentFragment(); - // linkTextOptionsSample.textContent = "Markdown: "; - const linkTextOptionsSampleText = createTextPopEl(this.plugin.getLinkText(url, options)); - linkTextOptionsSample.appendChild(linkTextOptionsSampleText); - - // Updates the preview texts - // Use this syntax because using the normal syntax: function updatePreviews(), has a different 'this' and won't work. - const updatePreviews = () => { - linkTextSampleText.textContent = this.plugin.getLinkText(url); - linkTextOptionsSampleText.textContent = this.plugin.getLinkText(url, options); - } - - const linkTextDesc = new DocumentFragment(); - linkTextDesc.appendChild(document.createTextNode("Sets text inside markdown links to be embedded. Choose a unique marker to avoid triggering it accidentally. Only showed when in Live Preview or Source Mode")); - linkTextDesc.appendChild(createEl("br")) - linkTextDesc.appendChild(document.createTextNode("Available variables: {{url}}, {{options}}, e.g. \"embed:{{url}}, {{options}}\"")); - linkTextDesc.appendChild(createEl("br")) - linkTextDesc.appendChild(createEl("a", {text: "More Info", href: "https://github.com/GnoxNahte/obsidian-auto-embed/edit/main/README.md#setting-the-format-for-the-content-in-markdown-link"})) - - advancedSettings.push(new Setting(containerEl) - .setName("Markdown link format") - .setDesc(linkTextDesc) - .addText(text => text - .setValue(settings.markdownLinkTextFormat) - .onChange(async (value) => { - settings.markdownLinkTextFormat = value; - updatePreviews(); - - await this.plugin.saveSettings(); - }) - ) - ); - - advancedSettings.push(new Setting(containerEl) - .setName("Preview url") - .addText(text => text - .setValue(url) - .onChange((value) => { - url = value; - updatePreviews(); - }) - ) - ); - - const previewOption = new DocumentFragment(); - previewOption.textContent = "Overrides other settings. For example, if \"Dark mode\" is disabled, the \"dark-mode\" option will override it. For the "; - previewOption.appendChild(createEl("a", {text:"full list of options", href:"https://github.com/GnoxNahte/obsidian-auto-embed/edit/main/README.md#set-custom-options"})); - - advancedSettings.push(new Setting(containerEl) - .setName("Preview options") - .setDesc(previewOption) - .addText(text => text - .setValue(options) - .onChange(async (value) => { - options = value; - updatePreviews(); - }) - ) - ); - - advancedSettings.push(new Setting(containerEl) - .setName("Preview markdown link text") - .setDesc(linkTextSample) - .addButton(btn => btn - .setButtonText("Preview embed") - .onClick(() => { - const modal = new PreviewEmbedModal(plugin, url); - modal.open(); - }) - ) - ); - - advancedSettings.push(new Setting(containerEl) - .setName("Preview markdown link text with options") - .setDesc(linkTextOptionsSample) - .addButton(btn => btn - .setButtonText("Preview embed") - .onClick(() => { - const modal = new PreviewEmbedModal(plugin, url, options); - modal.open(); - }) - ) - ); - - // #endregion - - updateAdvancedSettingsDisplay(); } // TODO: Reload markdown after closing settings