diff --git a/README.md b/README.md index 7023e38..4a012d5 100644 --- a/README.md +++ b/README.md @@ -21,6 +21,16 @@ For automatic numbering use '#'. If a '#' character is meant to be output, escap + **CSS:** Apply custom CSS styling to the image captions.
Captions are indexed from 1 using the 'data-image-caption-index' attribute for styling based on figure number. ++ **Delimeter:** Indicates the caption text.
+A delimeter is a set of characters that identify the caption text to use. + + If blank, the entire text is used. + + A single delimeter can be used.
+ e.g. `"` -> `"My caption"` or `!!` -> `!!My caption!!` + + A start and end delimter can be used by separating them with a comma (,).
+ e.g. `{, }` -> `{My caption}` or `<<, >>` -> `<>` + + **Note:** Whitespace is trimmed from the delimeter character sets. + + **Note:** Only the first and last delimeters are matched, so the delimeter character can be used in the caption without special consideration, such as escaping. + ## FAQ + **My captions aren't showing up:** Captions are only added if the image is rerendered. Try changing the caption (needs to be more than a trialing space) and trying again. If this fixes the issue then change it back, otherwise open an Issue. diff --git a/manifest.json b/manifest.json index e086835..30d4316 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "id": "obsidian-image-caption", "name": "Image Caption", - "version": "0.0.6", + "version": "0.0.7", "minAppVersion": "0.12.19", "description": "Add captions to images.", "author": "bicarlsen", diff --git a/package.json b/package.json index 8cdf6ff..13a9c99 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "obsidian-image-caption", - "version": "0.0.6", + "version": "0.0.7", "description": "Add captions to images in Obsidian.", "main": "main.js", "scripts": { diff --git a/src/main.ts b/src/main.ts index 2bc8917..23b4101 100644 --- a/src/main.ts +++ b/src/main.ts @@ -14,11 +14,13 @@ import { interface ImageCaptionSettings { css: string; label: string; + delimeter: string[]; } const DEFAULT_SETTINGS: ImageCaptionSettings = { css: '', - label: '' + label: '', + delimeter: [] } export default class ImageCaptionPlugin extends Plugin { @@ -119,7 +121,7 @@ class ImageCaptionSettingTab extends PluginSettingTab { .setPlaceholder( 'Label' ) .setValue( this.plugin.settings.label ) .onChange( async ( value ) => { - this.plugin.settings.label = value; + this.plugin.settings.label = value.trim(); await this.plugin.saveSettings(); this.plugin.updateStylesheet(); } ) @@ -137,5 +139,50 @@ class ImageCaptionSettingTab extends PluginSettingTab { this.plugin.updateStylesheet(); } ) ); + + // delimeter + const delimeter = new Setting( containerEl ) + .setName( 'Delimeter' ) + .setDesc( + 'Identify the caption by surrounding it with the delimeter. ' + + 'Start and end delimeters mays be specified by separation with a comma (,).' + ) + .setTooltip( + 'If no delimeter is provided the entire alt text is taken to be the caption. ' + + 'If a single delimeter is specified it must indicate the start and end of the caption. ' + + 'If two delimeters are specified, by separation with a comma, the caption is taken to be ' + + 'the text between the start and end delimeters.' + ); + + delimeter.addText( ( text ) => text + .setPlaceholder( 'Delimeter' ) + .setValue( this.plugin.settings.delimeter.join( ', ' ) ) + .onChange( async ( value ) => { + let delimeters = value.split( ',' ).map( d => d.trim() ); + + // validate setting + if ( delimeters.length > 2 ) { + // too many delimeters + delimeter.controlEl.addClass( 'setting-error' ); + return; + } + + if ( delimeters.length === 2 && delimeters.some( d => !d ) ) { + // empty delimeter + delimeter.controlEl.addClass( 'setting-error' ); + return; + } + + // delimeters valid + if ( delimeters.length === 1 && delimeters[ 0 ] === '' ) { + // no delimeter specified + delimeters = []; + } + + delimeter.controlEl.removeClass( 'setting-error' ); + this.plugin.settings.delimeter = delimeters; + await this.plugin.saveSettings(); + } ) + ); } } diff --git a/src/md_processor.ts b/src/md_processor.ts index 01619dc..b38d09d 100644 --- a/src/md_processor.ts +++ b/src/md_processor.ts @@ -16,7 +16,7 @@ export function captionObserver( plugin: Plugin ) { continue; } - const caption_text = mutation.target.getAttribute( 'alt' ); + let caption_text = mutation.target.getAttribute( 'alt' ); if ( caption_text === mutation.target.getAttribute( 'src' ) ) { // default caption, skip continue; @@ -27,7 +27,10 @@ export function captionObserver( plugin: Plugin ) { continue; } - addCaption( mutation.target, caption_text ); + caption_text = parseCaptionText( caption_text, plugin.settings.delimeter ); + if ( caption_text !== null ) { + addCaption( mutation.target, caption_text ); + } } // end for..of updateFigureIndices(); @@ -36,6 +39,38 @@ export function captionObserver( plugin: Plugin ) { } ); } +function parseCaptionText( text: string, delimeter: string[] ): string | null { + if ( delimeter.length === 0 ) { + return text; + } + + let start, end; + if ( delimeter.length == 1 ) { + // single delimeter character + delimeter = delimeter[ 0 ]; + start = text.indexOf( delimeter ); + end = text.lastIndexOf( delimeter ); + } + else if ( delimeter.length === 2 ) { + // separate start and end delimeter + start = text.indexOf( delimeter[ 0 ] ); + end = text.lastIndexOf( delimeter[ 1 ] ); + } + else { + // error + return null; + } + + if ( start === -1 || end === -1 ) { + return null; + } + if ( start === end ) { + return ''; + } + + const start_offset = delimeter[ 0 ].length; // exclude starting delimeter + return text.slice( start + start_offset, end ); +} function addCaption( target: HTMLElement, diff --git a/styles.css b/styles.css index e69de29..8d9a752 100644 --- a/styles.css +++ b/styles.css @@ -0,0 +1,3 @@ +.setting-item-control.setting-error input { + border-color: #990000; +} \ No newline at end of file diff --git a/versions.json b/versions.json index 8adeafe..415230e 100644 --- a/versions.json +++ b/versions.json @@ -1,4 +1,5 @@ { + "0.0.7": "0.12.19", "0.0.6": "0.12.19", "0.0.5": "0.12.19", "0.0.4": "0.12.19",