diff --git a/src/embed-manager.js b/src/embed-manager.js index 600510c..f107b42 100644 --- a/src/embed-manager.js +++ b/src/embed-manager.js @@ -277,15 +277,17 @@ class EmbedManager { // For section embeds, setup viewport restriction if (section) { - await this.viewportController.setupSectionViewport(embedData); - - // If there's an alias, show it instead of the actual header + // Check if we should hide the header from viewport + // Hide if: explicitly set to false, OR if there's an alias (alias replaces header) + const hideHeader = customOptions.header === false || alias; + await this.viewportController.setupSectionViewport(embedData, hideHeader); + // If there's an alias, show it as a header if (alias) { - this.setupAliasDisplay(embedData, alias, true); + this.setupAliasDisplay(embedData, alias); } } else if (alias) { // For whole note embeds with alias, show alias as title - this.setupAliasDisplay(embedData, alias, false); + this.setupAliasDisplay(embedData, alias); } // Handle properties collapse @@ -294,8 +296,8 @@ class EmbedManager { } // Handle inline title visibility - const showTitle = customOptions.title !== undefined - ? customOptions.title + const showTitle = customOptions.title !== undefined + ? customOptions.title : this.plugin.settings.showInlineTitle; if (!showTitle || section) { @@ -316,7 +318,7 @@ class EmbedManager { } } - setupAliasDisplay(embedData, displayAlias, isSection) { + setupAliasDisplay(embedData, displayAlias) { const { view } = embedData; requestAnimationFrame(() => { @@ -327,20 +329,6 @@ class EmbedManager { titleEl.style.display = 'none'; } - // For section embeds, also hide the section header - if (isSection) { - const cmContent = view.containerEl.querySelector('.cm-content'); - if (cmContent) { - if (embedData.sectionInfo) { - const headerLineNumber = embedData.sectionInfo.startLine + 1; - const firstLine = cmContent.querySelector(`.cm-line:nth-child(${headerLineNumber})`); - if (firstLine) { - firstLine.style.display = 'none'; - } - } - } - } - // Create and insert alias header with consistent styling const aliasHeader = view.containerEl.createDiv('sync-embed-alias-header'); aliasHeader.textContent = displayAlias; @@ -385,6 +373,35 @@ class EmbedManager { }); } + hideSectionHeader(embedData) { + const { view } = embedData; + requestAnimationFrame(() => { + setTimeout(() => { + // Hide the inline title first + const titleEl = view.containerEl.querySelector('.inline-title'); + if (titleEl) { + titleEl.style.display = 'none'; + } + + // Hide the section header (the actual markdown heading) + const cmContent = view.containerEl.querySelector('.cm-content'); + if (cmContent && embedData.sectionInfo) { + const headerLineNumber = embedData.sectionInfo.startLine + 1; + const firstLine = cmContent.querySelector(`.cm-line:nth-child(${headerLineNumber})`); + if (firstLine) { + firstLine.style.display = 'none'; + firstLine.style.visibility = 'hidden'; + firstLine.style.height = '0'; + firstLine.style.overflow = 'hidden'; + firstLine.style.margin = '0'; + firstLine.style.padding = '0'; + } + } else { + } + }, 100); + }); + } + renderError(container, message, addGap) { const errorDiv = container.createDiv('sync-embed-error'); if (addGap) errorDiv.addClass('sync-embed-gap'); diff --git a/src/settings.js b/src/settings.js index 89eca3b..b21075b 100644 --- a/src/settings.js +++ b/src/settings.js @@ -230,7 +230,8 @@ class SyncEmbedsSettingTab extends PluginSettingTab {

Note: Options go inside curly braces before the closing ]]

diff --git a/src/viewport-controller.js b/src/viewport-controller.js index 87bb02d..faef91d 100644 --- a/src/viewport-controller.js +++ b/src/viewport-controller.js @@ -5,7 +5,7 @@ class ViewportController { this.plugin = plugin; } - async setupSectionViewport(embedData) { + async setupSectionViewport(embedData, hideHeader = false) { const { view, editor, file, section } = embedData; // Wait for editor to be ready @@ -23,6 +23,7 @@ class ViewportController { // Store section metadata embedData.sectionInfo = sectionInfo; embedData.viewportActive = true; + embedData.hideHeader = hideHeader; // Apply the viewport restriction this.applyViewportRestriction(embedData); @@ -64,29 +65,29 @@ class ViewportController { } updateViewportCSS(embedData, style) { - const { sectionInfo, embedId } = embedData; + const { sectionInfo, embedId, hideHeader } = embedData; const { startLine, endLine } = sectionInfo; - + // If hideHeader is true, skip the header line by starting viewport one line later + const viewportStart = hideHeader ? startLine + 1 : startLine; // PERFORMANCE: Use efficient CSS selectors const css = ` - /* Hide all lines before the section */ - [data-embed-id="${embedId}"] .cm-line:nth-child(-n+${startLine}) { - display: none !important; + /* Hide all lines before the section (or before first content line if hiding header) */ + [data-embed-id="${embedId}"] .cm-line:nth-child(-n+${viewportStart}) { + display: none !important; } - /* Hide all lines after the section */ - [data-embed-id="${embedId}"] .cm-line:nth-child(n+${endLine + 1}) { - display: none !important; + [data-embed-id="${embedId}"] .cm-line:nth-child(n+${endLine + 1}) { + display: none !important; } - - /* Style the header line - No background, proper theming */ + /* Style the header line - No background, proper theming (only if not hiding) */ + ${!hideHeader ? ` [data-embed-id="${embedId}"] .cm-line:nth-child(${startLine + 1}) { pointer-events: none !important; user-select: none !important; cursor: default !important; } + ` : ''} `; - style.textContent = css; } @@ -345,15 +346,16 @@ class ViewportController { } scrollToSection(embedData) { - const { view, editor, sectionInfo } = embedData; + const { view, editor, sectionInfo, hideHeader } = embedData; const { startLine } = sectionInfo; - + // If hiding header, start at the line after the header + const firstEditableLine = hideHeader ? startLine + 1 : startLine; setTimeout(() => { - // Scroll to the start of the section - editor.scrollIntoView({ line: startLine, ch: 0 }, true); - - // Set cursor at line after header - editor.setCursor({ line: startLine + 1, ch: 0 }); + // Scroll to the start of the section (or first content line if hiding header) + editor.scrollIntoView({ line: firstEditableLine, ch: 0 }, true); + + // Set cursor at first editable line + editor.setCursor({ line: firstEditableLine, ch: 0 }); }, 150); }