yan/gitea
1
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2026-04-22 02:29:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix and enhance comment editor monospace toggle (#36181)

Browse Source 
Fixes: https://github.com/go-gitea/gitea/issues/36175

1. Correctly apply setting on textareas spawned by comment edit
3. When changing the setting, apply it to all textareas on the current page

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
silverwind
2026-01-26 15:19:47 +01:00
committed by GitHub
parent 4c8f6dfa4e
commit 59f812bc1c
10 changed files with 120 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
web_src/js/features/comp/ComboMarkdownEditor.ts
View File

@@ -24,6 +24,7 @@ import {DropzoneCustomEventReloadFiles, initDropzone} from '../dropzone.ts';
import {createTippy} from '../../modules/tippy.ts';
import {fomanticQuery} from '../../modules/fomantic/base.ts';
import type EasyMDE from 'easymde';
import {localUserSettings} from '../../modules/user-settings.ts';
/**
* validate if the given textarea is non-empty.
@@ -81,6 +82,8 @@ export class ComboMarkdownEditor {
textareaMarkdownToolbar: HTMLElement;
textareaAutosize: any;
buttonMonospace: HTMLButtonElement;
dropzone: HTMLElement | null;
attachedDropzoneInst: any;
@@ -140,19 +143,13 @@ export class ComboMarkdownEditor {
if (el.nodeName === 'BUTTON' && !el.getAttribute('type')) el.setAttribute('type', 'button');
}
const monospaceButton = this.container.querySelector('.markdown-switch-monospace')!;
const monospaceEnabled = localStorage?.getItem('markdown-editor-monospace') === 'true';
const monospaceText = monospaceButton.getAttribute(monospaceEnabled ? 'data-disable-text' : 'data-enable-text')!;
monospaceButton.setAttribute('data-tooltip-content', monospaceText);
monospaceButton.setAttribute('aria-checked', String(monospaceEnabled));
monospaceButton.addEventListener('click', (e) => {
this.buttonMonospace = this.container.querySelector('.markdown-switch-monospace')!;
this.applyMonospace();
this.buttonMonospace.addEventListener('click', (e) => {
e.preventDefault();
const enabled = localStorage?.getItem('markdown-editor-monospace') !== 'true';
localStorage.setItem('markdown-editor-monospace', String(enabled));
this.textarea.classList.toggle('tw-font-mono', enabled);
const text = monospaceButton.getAttribute(enabled ? 'data-disable-text' : 'data-enable-text')!;
monospaceButton.setAttribute('data-tooltip-content', text);
monospaceButton.setAttribute('aria-checked', String(enabled));
const enabled = !localUserSettings.getBoolean('markdown-editor-monospace');
localUserSettings.setBoolean('markdown-editor-monospace', enabled);
applyMonospaceToAllEditors();
});
if (this.supportEasyMDE) {
@@ -403,10 +400,27 @@ export class ComboMarkdownEditor {
}
get userPreferredEditor(): string {
return window.localStorage.getItem(`markdown-editor-${this.previewMode ?? 'default'}`) || '';
return localUserSettings.getString(`markdown-editor-${this.previewMode ?? 'default'}`);
}
set userPreferredEditor(s: string) {
window.localStorage.setItem(`markdown-editor-${this.previewMode ?? 'default'}`, s);
localUserSettings.setString(`markdown-editor-${this.previewMode ?? 'default'}`, s);
}
applyMonospace() {
const enabled = localUserSettings.getBoolean('markdown-editor-monospace');
const text = this.buttonMonospace.getAttribute(enabled ? 'data-disable-text' : 'data-enable-text')!;
this.textarea.classList.toggle('tw-font-mono', enabled);
this.buttonMonospace.setAttribute('data-tooltip-content', text);
this.buttonMonospace.setAttribute('aria-checked', String(enabled));
}
}
function applyMonospaceToAllEditors() {
const editors = document.querySelectorAll<ComboMarkdownEditorContainer>('.combo-markdown-editor');
for (const editorContainer of editors) {
const editor = getComboMarkdownEditor(editorContainer);
if (editor) editor.applyMonospace();
}
}