diff --git a/README.md b/README.md index 378e8e4..093f7fb 100644 --- a/README.md +++ b/README.md @@ -10,13 +10,24 @@ Parameters can be set using commands inside the dialogue. All available paramete ### Available parameters -| Parameter | Description | Default Value | -| ------------------ | ----------------------------------------------------------------------------- | ------------- | -| `left:` or `l:` | Name of the dialogue participant on the left side. | none | -| `right:` or `r:` | Name of the dialogue participant on the right side. | none | -| `titleMode:` | Defines if and when to render titles. See available modes in the table below. | `first` | -| `messageMaxWidth:` | Defines the max message width in the dialogue. | `60%` | -| `commentMaxWidth:` | Defines the max comment width in the dialogue. | `60%` | +| Parameter | Description | Default Value | +|--------------------------|----------------------------------------------------------------------------------------|---------------| +| `left:` or `l:` | Name of the dialogue participant on the left side. | none | +| `right:` or `r:` | Name of the dialogue participant on the right side. | none | +| `center:` or `c:` | Name of the dialogue participant in the middle. | none | +| `leftFooter:` or `lf:` | Default footer content for the dialogue on the left side. | none | +| `rightFooter:` or `rf:` | Default footer content for the dialogue on the right side. | none | +| `centerFooter:` or `cf:` | Default footer content for the dialogue on the middle. | none | +| `titleMode:` | Defines if and when to render titles. See available modes in the table below. | `first` | +| `footerMode:` | Defines if and when to render default footers. See available modes in the table below. | `all` | +| `messageMaxWidth:` | Defines the max message width in the dialogue. | `60%` | +| `commentMaxWidth:` | Defines the max comment width in the dialogue. | `60%` | +| `clean:` | Hide unparsable text. | `true` | +| `renderMarkdownTitle:` | Render markdown in the title. | `true` | +| `renderMarkdownContent:` | Render markdown in the content. | `true` | +| `renderMarkdownFooter:` | Render markdown in the footer. | `true` | +| `renderMarkdownComment:` | Render markdown in the comment. | `true` | + ### Title Modes @@ -26,6 +37,13 @@ Parameters can be set using commands inside the dialogue. All available paramete | `first` | Render each title only on the first occurence. | | `all` | Always render title. | +### Footer Modes + +| Mode | Description | +|------------|--------------------------------------------------------| +| `disabled` | Disable all default footers. | +| `all` | Always render default footer. | + ## Usage ### Simple usage @@ -34,9 +52,27 @@ The message in the dialogue must be prefixed with - either `<` (message on the left side) - or `>` (message on the right side). +- or `=` (message in the middle). The message must be exactly one paragraph. +To add a footer to a dialogue, use the prefix `::` after the dialogue. + +```` +```dialogue +< Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec tristique nunc, et pharetra sem. +:: footer content for left side + +> Lorem ipsum dolor sit amet +:: footer content for right side +> Ut nec efficitur mauris, a lacinia purus. Fusce nisi arcu, sollicitudin eget sodales sit amet, consectetur a lorem. + +footerMode: all +leftFooter: default footer content for left side +< Nam egestas tristique felis, sed suscipit nunc commodo nec. +``` +```` + #### Example code ```` diff --git a/manifest-beta.json b/manifest-beta.json new file mode 100644 index 0000000..2601db7 --- /dev/null +++ b/manifest-beta.json @@ -0,0 +1,10 @@ +{ + "id": "obsidian-dialogue-plugin", + "name": "Dialogue", + "version": "1.1.0", + "minAppVersion": "0.12.0", + "description": "Create dialogues in Markdown.", + "author": "Twiddly", + "authorUrl": "https://github.com/twiddli/obsidian-dialogue-plugin", + "isDesktopOnly": false +} diff --git a/manifest.json b/manifest.json index cdec1ca..2601db7 100644 --- a/manifest.json +++ b/manifest.json @@ -1,10 +1,10 @@ { "id": "obsidian-dialogue-plugin", "name": "Dialogue", - "version": "1.0.2", + "version": "1.1.0", "minAppVersion": "0.12.0", "description": "Create dialogues in Markdown.", - "author": "Jakub Holub", - "authorUrl": "https://github.com/holubj", + "author": "Twiddly", + "authorUrl": "https://github.com/twiddli/obsidian-dialogue-plugin", "isDesktopOnly": false } diff --git a/package.json b/package.json index 0094397..755f940 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "obsidian-dialogue-plugin", - "version": "0.12.0", + "version": "0.13.0", "description": "Create dialogues in Markdown.", "main": "main.js", "scripts": { diff --git a/src/components/comment.ts b/src/components/comment.ts index 6b74c13..77f639b 100644 --- a/src/components/comment.ts +++ b/src/components/comment.ts @@ -3,25 +3,20 @@ import { DialogueSettings } from '../dialogue'; export class Comment { - content: string; - dialogueSettings: DialogueSettings; - constructor(content: string, dialogueSettings: DialogueSettings) { - this.content = content; + constructor(dialogueSettings: DialogueSettings) { this.dialogueSettings = dialogueSettings; - - this.renderComment(); } - renderComment() { + renderComment(content?: string) { const commentEl = this.dialogueSettings.parent.createDiv({ cls: `${CLASSES.BLOCK_WRAPPER} ${CLASSES.COMMENT_WRAPPER}` }); return commentEl.createDiv({ cls: CLASSES.COMMENT, - text: this.content, + text: content, attr: { style: `max-width: ${this.dialogueSettings.commentMaxWidth};` } diff --git a/src/components/message.ts b/src/components/message.ts index eeafa78..8719ef9 100644 --- a/src/components/message.ts +++ b/src/components/message.ts @@ -1,46 +1,79 @@ -import { CLASSES } from '../constants/classes'; -import { DialogueSettings, Participant } from '../dialogue'; +import { DialogueFooterMode } from 'src/types/dialogueFooterMode'; import { DialogueTitleMode } from '../types/dialogueTitleMode'; +import { CLASSES } from '../constants/classes'; +import { DialogueSettings, FooterContent, Participant } from '../dialogue'; export abstract class SIDES { static readonly LEFT = 'left'; static readonly RIGHT = 'right'; + static readonly CENTER = 'center'; } -export type MessageSide = typeof SIDES.LEFT | typeof SIDES.RIGHT; +export type MessageSide = typeof SIDES.LEFT | typeof SIDES.RIGHT | typeof SIDES.CENTER; export class Message { - content: string; - side: MessageSide; participant: Participant; + footerContent: FooterContent + + element?: HTMLDivElement; + dialogueSettings: DialogueSettings; - constructor(content: string, side: MessageSide, dialogueSettings: DialogueSettings) { - this.content = content; + constructor(side: MessageSide, dialogueSettings: DialogueSettings) { this.side = side; this.dialogueSettings = dialogueSettings; - this.participant = this.side == SIDES.LEFT ? this.dialogueSettings.leftParticipant : this.dialogueSettings.rightParticipant; - - this.renderMessage(); + switch(this.side) { + case SIDES.LEFT: { + this.participant = this.dialogueSettings.leftParticipant; + this.footerContent = this.dialogueSettings.leftFooter; + break; + } + case SIDES.RIGHT: { + this.participant = this.dialogueSettings.rightParticipant; + this.footerContent = this.dialogueSettings.rightFooter; + break; + } + case SIDES.CENTER: { + this.participant = this.dialogueSettings.centerParticipant; + this.footerContent = this.dialogueSettings.centerFooter; + break; + } + } + } renderMessage() { - const messageEl = this.createMessageEl(); + this.element = this.createMessageEl(); + return this.element; + } - if (this.titleShouldRender()) { - messageEl.createDiv({ cls: CLASSES.MESSAGE_TITLE, text: this.participant.title }); - } + renderContent(content?: string) { + return this.element.createDiv({ cls: CLASSES.MESSAGE_CONTENT, text: content }); + } + + renderTitle(title?: string) { + return this.element.createDiv({ cls: CLASSES.MESSAGE_TITLE, text: title }); + } - messageEl.createDiv({ cls: CLASSES.MESSAGE_CONTENT, text: this.content }); + renderFooter(content?: string): HTMLDivElement { + return this.element.createDiv({ cls: CLASSES.MESSAGE_FOOTER, text: content}); } createMessageEl(): HTMLDivElement { - const sideClass = this.side == SIDES.LEFT ? CLASSES.MESSAGE_WRAPPER_LEFT : CLASSES.MESSAGE_WRAPPER_RIGHT; + + let sideClass = CLASSES.MESSAGE_WRAPPER_LEFT; + + switch (this.side) { + case SIDES.LEFT: sideClass = CLASSES.MESSAGE_WRAPPER_LEFT; break; + case SIDES.RIGHT: sideClass = CLASSES.MESSAGE_WRAPPER_RIGHT; break; + case SIDES.CENTER: sideClass = CLASSES.MESSAGE_WRAPPER_CENTER; break; + } + const messageWrapperEl = this.dialogueSettings.parent.createDiv({ cls: `${CLASSES.BLOCK_WRAPPER} ${sideClass}` }); @@ -70,4 +103,14 @@ export class Message { default: return false; } } + + defaultFooterShouldRender(): boolean { + if (this.footerContent.content.length < 1) return false; + + switch (this.dialogueSettings.footerMode) { + case DialogueFooterMode.Disabled: return false; + case DialogueFooterMode.All: return true; + default: return false; + } + } } diff --git a/src/constants/classes.ts b/src/constants/classes.ts index 321934f..536281d 100644 --- a/src/constants/classes.ts +++ b/src/constants/classes.ts @@ -2,14 +2,18 @@ export abstract class CLASSES { static readonly DIALOGUE_WRAPPER = 'dialogue-plugin-wrapper'; static readonly BLOCK_WRAPPER = 'dialogue-plugin-block-wrapper'; + static readonly MESSAGE_WRAPPER_CENTER = 'dialogue-plugin-message-wrapper-center'; static readonly MESSAGE_WRAPPER_LEFT = 'dialogue-plugin-message-wrapper-left'; static readonly MESSAGE_WRAPPER_RIGHT = 'dialogue-plugin-message-wrapper-right'; static readonly MESSAGE = 'dialogue-plugin-message'; static readonly MESSAGE_TITLE = 'dialogue-plugin-message-title'; static readonly MESSAGE_CONTENT = 'dialogue-plugin-message-content'; + static readonly MESSAGE_FOOTER = 'dialogue-plugin-message-footer'; static readonly DELIMITER_WRAPPER = 'dialogue-plugin-delimiter-wrapper'; static readonly DELIMITER = 'dialogue-plugin-delimiter'; static readonly DELIMITER_DOT = 'dialogue-plugin-delimiter-dot'; static readonly COMMENT_WRAPPER = 'dialogue-plugin-comment-wrapper'; static readonly COMMENT = 'dialogue-plugin-comment'; + static readonly RENDER = 'dialogue-plugin-render'; + static readonly UNPARSED = 'dialogue-plugin-unparsed'; } diff --git a/src/dialogue.ts b/src/dialogue.ts index 154f932..dc7eac4 100644 --- a/src/dialogue.ts +++ b/src/dialogue.ts @@ -1,20 +1,34 @@ import { DialoguePluginSettings } from './settings'; import { DialogueTitleMode } from './types/dialogueTitleMode'; +import { DialogueFooterMode } from './types/dialogueFooterMode'; import { CLASSES } from './constants/classes'; import { Message, SIDES } from './components/message'; import { Delimiter } from './components/delimiter'; import { Comment } from './components/comment'; +import { Component, MarkdownPreviewView } from 'obsidian'; abstract class KEYWORDS { static readonly LEFT_PATTERN = /^l(?:eft)?(?:-(\d+))?:/i; static readonly RIGHT_PATTERN = /^r(?:ight)?(?:-(\d+))?:/i; + static readonly CENTER_PATTERN = /^c(?:enter)?(?:-(\d+))?:/i; + static readonly LEFT_FOOTER_PATTERN = /^(lf|leftFooter):/i; + static readonly RIGHT_FOOTER_PATTERN = /^(rf|rightFooter):/i; + static readonly CENTER_FOOTER_PATTERN = /^(cf|centerFooter):/i; static readonly TITLE_MODE = 'titleMode:'; + static readonly FOOTER_MODE = 'footerMode:'; static readonly MESSAGE_MAX_WIDTH = 'messageMaxWidth:'; static readonly COMMENT_MAX_WIDTH = 'commentMaxWidth:'; + static readonly CLEAN = 'clean:'; + static readonly RENDER_MARKDOWN_TITLE = 'renderMarkdownTitle:'; + static readonly RENDER_MARKDOWN_CONTENT = 'renderMarkdownContent:'; + static readonly RENDER_MARKDOWN_FOOTER = 'renderMarkdownFooter:'; + static readonly RENDER_MARKDOWN_COMMENT = 'renderMarkdownComment:'; static readonly DELIMITER = /^-|delimiter/; static readonly COMMENT = '#'; + static readonly FOOTER = '::'; static readonly MESSAGE_LEFT = '<'; static readonly MESSAGE_RIGHT = '>'; + static readonly MESSAGE_CENTER = '='; } export interface Participant { @@ -23,11 +37,25 @@ export interface Participant { enforcedId: string; } +export interface FooterContent { + content: string; +} + export interface DialogueSettings { parent: HTMLElement; leftParticipant: Participant; rightParticipant: Participant; + centerParticipant: Participant; + leftFooter: FooterContent; + rightFooter: FooterContent; + centerFooter: FooterContent; titleMode: DialogueTitleMode; + footerMode: DialogueFooterMode; + clean: boolean; + renderMarkdownTitle: boolean; + renderMarkdownContent: boolean; + renderMarkdownFooter: boolean; + renderMarkdownComment: boolean; messageMaxWidth: string; commentMaxWidth: string; participants: Map; @@ -35,13 +63,17 @@ export interface DialogueSettings { export class DialogueRenderer { + component: Component; + src: string; dialogueWrapperEl: HTMLElement; dialogueSettings: DialogueSettings; - constructor(src: string, parent: HTMLElement, settings: DialoguePluginSettings) { + constructor(component: Component, src: string, parent: HTMLElement, settings: DialoguePluginSettings) { + this.component = component; + this.src = src; this.dialogueWrapperEl = parent.createDiv({ cls: CLASSES.DIALOGUE_WRAPPER }); @@ -58,7 +90,27 @@ export class DialogueRenderer { renderedOnce: false, enforcedId: null, }, + centerParticipant: { + title: settings.defaultCenterTitle, + renderedOnce: false, + enforcedId: null, + }, + leftFooter: { + content: settings.defaultLeftFooter, + }, + rightFooter: { + content: settings.defaultRightFooter, + }, + centerFooter: { + content: settings.defaultCenterFooter, + }, + clean: settings.defaultClean, + renderMarkdownTitle: settings.defaultRenderMarkdownTitle, + renderMarkdownContent: settings.defaultRenderMarkdownContent, + renderMarkdownFooter: settings.defaultRenderMarkdownFooter, + renderMarkdownComment: settings.defaultRenderMarkdownComment, titleMode: settings.defaultTitleMode, + footerMode: settings.defaultFooterMode, messageMaxWidth: settings.defaultMessageMaxWidth, commentMaxWidth: settings.defaultCommentMaxWidth, participants: new Map(), @@ -73,11 +125,11 @@ export class DialogueRenderer { } } - getEnforcedId(pattern: RegExp, line: string): string { + getEnforcedId(pattern: RegExp, line: string, group = 1): string { let enforcedId = null; const result = pattern.exec(line); if (result != null && result.length > 1) { - enforcedId = result[1]; + enforcedId = result[group]; } return enforcedId; @@ -89,7 +141,18 @@ export class DialogueRenderer { .map(line => line.trim()) .filter(line => line.length > 0); - for (const line of lines) { + let prevMessage: Message | null = null; + + for (let i = 0; i < lines.length; i++) { + const line = lines[i]; + + let message: Message | null = null; + + let comment: Comment | null = null; + + let customFooter = false; + + let content: string = ''; if (KEYWORDS.LEFT_PATTERN.test(line)) { this.dialogueSettings.leftParticipant.title = line.split(':').splice(1).join(':').trim(); @@ -101,12 +164,47 @@ export class DialogueRenderer { this.dialogueSettings.rightParticipant.renderedOnce = false; // reset this flag when a new title is set this.dialogueSettings.rightParticipant.enforcedId = this.getEnforcedId(KEYWORDS.RIGHT_PATTERN, line); } + else if (KEYWORDS.CENTER_PATTERN.test(line)) { + this.dialogueSettings.centerParticipant.title = line.split(':').splice(1).join(':').trim(); + this.dialogueSettings.centerParticipant.renderedOnce = false; // reset this flag when a new title is set + this.dialogueSettings.centerParticipant.enforcedId = this.getEnforcedId(KEYWORDS.CENTER_PATTERN, line); + } + else if (KEYWORDS.LEFT_FOOTER_PATTERN.test(line)) { + this.dialogueSettings.leftFooter.content = line.split(':').splice(1).join(':').trim(); + } + else if (KEYWORDS.RIGHT_FOOTER_PATTERN.test(line)) { + this.dialogueSettings.rightFooter.content = line.split(':').splice(1).join(':').trim(); + } + else if (KEYWORDS.CENTER_FOOTER_PATTERN.test(line)) { + this.dialogueSettings.centerFooter.content = line.split(':').splice(1).join(':').trim(); + } else if (line.startsWith(KEYWORDS.TITLE_MODE)) { const modeName = line.substr(KEYWORDS.TITLE_MODE.length).trim().toLowerCase(); - if (Object.values(DialogueTitleMode).some(mode => mode == modeName)) { + if (Object.values(DialogueTitleMode).some(mode => mode === modeName)) { this.dialogueSettings.titleMode = modeName as DialogueTitleMode; } } + else if (line.startsWith(KEYWORDS.FOOTER_MODE)) { + const modeName = line.substr(KEYWORDS.FOOTER_MODE.length).trim().toLowerCase(); + if (Object.values(DialogueFooterMode).some(mode => mode === modeName)) { + this.dialogueSettings.footerMode = modeName as DialogueFooterMode; + } + } + else if (line.startsWith(KEYWORDS.CLEAN)) { + this.dialogueSettings.clean = line.substr(KEYWORDS.CLEAN.length).trim().toLowerCase() === 'true'; + } + else if (line.startsWith(KEYWORDS.RENDER_MARKDOWN_TITLE)) { + this.dialogueSettings.renderMarkdownTitle = line.substr(KEYWORDS.RENDER_MARKDOWN_TITLE.length).trim().toLowerCase() === 'true'; + } + else if (line.startsWith(KEYWORDS.RENDER_MARKDOWN_CONTENT)) { + this.dialogueSettings.renderMarkdownContent = line.substr(KEYWORDS.RENDER_MARKDOWN_CONTENT.length).trim().toLowerCase() === 'true'; + } + else if (line.startsWith(KEYWORDS.RENDER_MARKDOWN_FOOTER)) { + this.dialogueSettings.renderMarkdownFooter = line.substr(KEYWORDS.RENDER_MARKDOWN_FOOTER.length).trim().toLowerCase() === 'true'; + } + else if (line.startsWith(KEYWORDS.RENDER_MARKDOWN_COMMENT)) { + this.dialogueSettings.renderMarkdownComment = line.substr(KEYWORDS.RENDER_MARKDOWN_COMMENT.length).trim().toLowerCase() === 'true'; + } else if (line.startsWith(KEYWORDS.MESSAGE_MAX_WIDTH)) { this.dialogueSettings.messageMaxWidth = line.substr(KEYWORDS.MESSAGE_MAX_WIDTH.length).trim(); } @@ -117,23 +215,107 @@ export class DialogueRenderer { new Delimiter(this.dialogueSettings); } else if (line.startsWith(KEYWORDS.COMMENT)) { - const content = line.substr(KEYWORDS.COMMENT.length); + content = line.substr(KEYWORDS.COMMENT.length); - new Comment(content, this.dialogueSettings); + comment = new Comment(this.dialogueSettings); } else if (line.startsWith(KEYWORDS.MESSAGE_LEFT)) { - const content = line.substr(KEYWORDS.MESSAGE_LEFT.length); + content = line.substr(KEYWORDS.MESSAGE_LEFT.length).trim(); this.registerParticipant(this.dialogueSettings.leftParticipant.title); - new Message(content, SIDES.LEFT, this.dialogueSettings); + message = new Message(SIDES.LEFT, this.dialogueSettings); } else if (line.startsWith(KEYWORDS.MESSAGE_RIGHT)) { - const content = line.substr(KEYWORDS.MESSAGE_RIGHT.length); + content = line.substr(KEYWORDS.MESSAGE_RIGHT.length).trim(); this.registerParticipant(this.dialogueSettings.rightParticipant.title); - new Message(content, SIDES.RIGHT, this.dialogueSettings); + message = new Message(SIDES.RIGHT, this.dialogueSettings); + } + else if (line.startsWith(KEYWORDS.MESSAGE_CENTER)) { + content = line.substr(KEYWORDS.MESSAGE_CENTER.length).trim(); + this.registerParticipant(this.dialogueSettings.centerParticipant.title); + + message = new Message(SIDES.CENTER, this.dialogueSettings); } + else if (line.startsWith(KEYWORDS.FOOTER)) { + customFooter = true; + content = line.substr(KEYWORDS.FOOTER.length); + } else if (!this.dialogueSettings.clean) { + const unparsedEl = this.dialogueWrapperEl.createDiv({ cls: CLASSES.UNPARSED }); + this.renderMarkdown(line, unparsedEl, false) + } + + // MESSAGE + + if (message != null) { + message.renderMessage(); + + if (message.titleShouldRender()) { + const titleEl = message.renderTitle( + this.dialogueSettings.renderMarkdownTitle ? undefined : message.participant.title + ); + + if (this.dialogueSettings.renderMarkdownTitle) { + this.renderMarkdown(message.participant.title, titleEl) + } + } + + const contentEl = message.renderContent( + this.dialogueSettings.renderMarkdownContent ? undefined : content + ); + + if (this.dialogueSettings.renderMarkdownContent) { + this.renderMarkdown(content, contentEl) + } + } + + // COMMENT + + if (comment != null) { + const cmtEl = comment.renderComment( + this.dialogueSettings.renderMarkdownComment ? undefined : content + ); + + if (this.dialogueSettings.renderMarkdownComment) { + this.renderMarkdown(content, cmtEl) + } + } + + // FOOTER + + if (prevMessage !== null) { + this.renderMessageFooter(prevMessage, customFooter ? content : undefined); + } + + // resets prev message + prevMessage = message; + } + + // Set footer for last message + if (prevMessage !== null) { + this.renderMessageFooter(prevMessage); + } + } + + renderMessageFooter(message: Message, content?: string ) { + let footerContent = content; + if (footerContent === undefined && this.dialogueSettings.footerMode === DialogueFooterMode.All && message.defaultFooterShouldRender()) { + footerContent = message.footerContent.content; } + + if (footerContent) { + const footerEl = message.renderFooter(this.dialogueSettings.renderMarkdownFooter ? undefined : footerContent); + + if (this.dialogueSettings.renderMarkdownFooter) { + this.renderMarkdown(footerContent, footerEl) + } + } + } + + renderMarkdown(content: string, el: HTMLElement, wrapper: boolean = true) { + const renderEl = wrapper ? el.createDiv({ cls: CLASSES.RENDER }) : el; + + MarkdownPreviewView.renderMarkdown(content, renderEl, this.src, this.component) } } diff --git a/src/main.ts b/src/main.ts index 7c73cf8..7cf8fd3 100644 --- a/src/main.ts +++ b/src/main.ts @@ -13,7 +13,7 @@ export default class DialoguePlugin extends Plugin { this.registerMarkdownCodeBlockProcessor( `dialogue`, (src, el, ctx) => { - new DialogueRenderer(src, el, this.settings); + new DialogueRenderer(this, src, el, this.settings); } ); diff --git a/src/settings.ts b/src/settings.ts index ed1d447..3bbc53c 100644 --- a/src/settings.ts +++ b/src/settings.ts @@ -1,11 +1,22 @@ import { App, Setting, PluginSettingTab } from 'obsidian'; import DialoguePlugin from './main'; import { DialogueTitleMode } from './types/dialogueTitleMode'; +import { DialogueFooterMode } from './types/dialogueFooterMode'; export interface DialoguePluginSettings { defaultLeftTitle: string; defaultRightTitle: string; + defaultCenterTitle: string; + defaultLeftFooter: string; + defaultRightFooter: string; + defaultCenterFooter: string; + defaultClean: boolean; + defaultRenderMarkdownTitle: boolean; + defaultRenderMarkdownContent: boolean; + defaultRenderMarkdownFooter: boolean; + defaultRenderMarkdownComment: boolean; defaultTitleMode: DialogueTitleMode; + defaultFooterMode: DialogueFooterMode; defaultMessageMaxWidth: string; defaultCommentMaxWidth: string; } @@ -13,7 +24,17 @@ export interface DialoguePluginSettings { export const DEFAULT_SETTINGS: DialoguePluginSettings = { defaultLeftTitle: '', defaultRightTitle: '', + defaultCenterTitle: '', + defaultLeftFooter: '', + defaultRightFooter: '', + defaultCenterFooter: '', + defaultClean: true, + defaultRenderMarkdownTitle: true, + defaultRenderMarkdownContent: true, + defaultRenderMarkdownFooter: true, + defaultRenderMarkdownComment: true, defaultTitleMode: DialogueTitleMode.First, + defaultFooterMode: DialogueFooterMode.All, defaultMessageMaxWidth: '60%', defaultCommentMaxWidth: '60%', } @@ -70,6 +91,17 @@ export class DialogueSettingTab extends PluginSettingTab { await this.plugin.saveSettings(); })); + new Setting(containerEl) + .setName('Default center title') + .setDesc('Default value for center title in all dialogues.') + .addText(text => + text.setPlaceholder('Enter default center title') + .setValue(this.plugin.settings.defaultCenterTitle) + .onChange(async (value) => { + this.plugin.settings.defaultCenterTitle = value; + await this.plugin.saveSettings(); + })); + new Setting(containerEl) .setName('Default title mode') .setDesc('Default title mode in all dialogues.') @@ -85,6 +117,55 @@ export class DialogueSettingTab extends PluginSettingTab { await this.plugin.saveSettings(); }); }); + + new Setting(containerEl) + .setName('Default left footer') + .setDesc('Default value for left footer in all dialogues.') + .addText(text => + text.setPlaceholder('Enter default left footer') + .setValue(this.plugin.settings.defaultLeftFooter) + .onChange(async (value) => { + this.plugin.settings.defaultLeftFooter = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default right footer') + .setDesc('Default value for right footer in all dialogues.') + .addText(text => + text.setPlaceholder('Enter default right footer') + .setValue(this.plugin.settings.defaultRightFooter) + .onChange(async (value) => { + this.plugin.settings.defaultRightFooter = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default center footer') + .setDesc('Default value for center footer in all dialogues.') + .addText(text => + text.setPlaceholder('Enter default center footer') + .setValue(this.plugin.settings.defaultCenterFooter) + .onChange(async (value) => { + this.plugin.settings.defaultCenterFooter = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default footer mode') + .setDesc('Default footer mode in all dialogues.') + .addDropdown(cb => { + Object.values(DialogueFooterMode).forEach(footerMode => { + const mode = footerMode.toString(); + cb.addOption(mode, mode.charAt(0).toUpperCase() + mode.slice(1)); + }); + + cb.setValue(this.plugin.settings.defaultFooterMode) + .onChange(async (value) => { + this.plugin.settings.defaultFooterMode = value as DialogueFooterMode; + await this.plugin.saveSettings(); + }); + }); new Setting(containerEl) .setName('Default max message width') @@ -107,5 +188,55 @@ export class DialogueSettingTab extends PluginSettingTab { this.plugin.settings.defaultCommentMaxWidth = value; await this.plugin.saveSettings(); })); + + new Setting(containerEl) + .setName('Default clean') + .setDesc('Default value for hiding unparsable text.') + .addToggle(toggle => + toggle.setValue(this.plugin.settings.defaultClean) + .onChange(async (value) => { + this.plugin.settings.defaultClean = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default render markdown title') + .setDesc('Default value for rendering markdown in title.') + .addToggle(toggle => + toggle.setValue(this.plugin.settings.defaultRenderMarkdownTitle) + .onChange(async (value) => { + this.plugin.settings.defaultRenderMarkdownTitle = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default render markdown content') + .setDesc('Default value for rendering markdown in content.') + .addToggle(toggle => + toggle.setValue(this.plugin.settings.defaultRenderMarkdownContent) + .onChange(async (value) => { + this.plugin.settings.defaultRenderMarkdownContent = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default render markdown footer') + .setDesc('Default value for rendering markdown in footer.') + .addToggle(toggle => + toggle.setValue(this.plugin.settings.defaultRenderMarkdownFooter) + .onChange(async (value) => { + this.plugin.settings.defaultRenderMarkdownFooter = value; + await this.plugin.saveSettings(); + })); + + new Setting(containerEl) + .setName('Default render markdown comment') + .setDesc('Default value for rendering markdown in comment.') + .addToggle(toggle => + toggle.setValue(this.plugin.settings.defaultRenderMarkdownComment) + .onChange(async (value) => { + this.plugin.settings.defaultRenderMarkdownComment = value; + await this.plugin.saveSettings(); + })); } } diff --git a/src/types/dialogueFooterMode.ts b/src/types/dialogueFooterMode.ts new file mode 100644 index 0000000..99ce72d --- /dev/null +++ b/src/types/dialogueFooterMode.ts @@ -0,0 +1,4 @@ +export enum DialogueFooterMode { + Disabled = 'disabled', + All = 'all', +} diff --git a/styles.css b/styles.css index 174c393..cbcc049 100644 --- a/styles.css +++ b/styles.css @@ -15,6 +15,10 @@ justify-content: flex-end; } +.dialogue-plugin-message-wrapper-center { + justify-content: center; +} + .dialogue-plugin-message { overflow: hidden; max-width: 60%; @@ -31,6 +35,13 @@ padding: 5px 10px; } +.dialogue-plugin-message-footer { + padding: 5px 10px; + font-weight: lighter; + font-size: smaller; + background-color: rgba(0, 0, 0, 0.1); +} + .dialogue-plugin-delimiter-wrapper { justify-content: center; } @@ -56,3 +67,8 @@ margin: 20px 0; text-align: center; } + +.dialogue-plugin-render > *:first-child { + margin-top: 0; + margin-bottom: 0; +} \ No newline at end of file diff --git a/versions.json b/versions.json index cfaa536..f67607b 100644 --- a/versions.json +++ b/versions.json @@ -1,4 +1,5 @@ { + "1.1.0": "0.12.3", "1.0.2": "0.12.3", "1.0.1": "0.12.3", "1.0.0": "0.12.3"