Remove jQuery from the Unicode escape button (#29369)

- Switched to plain JavaScript
- Tested the Unicode escape button functionality and it works as before

# Demo using JavaScript without jQuery

![action](https://github.com/go-gitea/gitea/assets/20454870/664f0ced-876b-4cb7-a668-bd62169fc843)

---------

Signed-off-by: Yarden Shoham <git@yardenshoham.com>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
(cherry picked from commit c86d033a3ec0514efcd9524d03dce1b6551e487f)
This commit is contained in:
Yarden Shoham 2024-02-24 21:11:51 +02:00 committed by Earl Warren
parent 003a358949
commit 757567d3bd
No known key found for this signature in database
GPG key ID: 0579CB2928A78A00
2 changed files with 25 additions and 25 deletions

View file

@ -1,31 +1,27 @@
import $ from 'jquery'; import {hideElem, queryElemSiblings, showElem, toggleElem} from '../utils/dom.js';
import {hideElem, showElem} from '../utils/dom.js';
export function initUnicodeEscapeButton() { export function initUnicodeEscapeButton() {
$(document).on('click', '.escape-button', (e) => { document.addEventListener('click', (e) => {
const btn = e.target.closest('.escape-button, .unescape-button, .toggle-escape-button');
if (!btn) return;
e.preventDefault(); e.preventDefault();
$(e.target).parents('.file-content, .non-diff-file-content').find('.file-code, .file-view').addClass('unicode-escaped');
hideElem($(e.target)); const fileContent = btn.closest('.file-content, .non-diff-file-content');
showElem($(e.target).siblings('.unescape-button')); const fileView = fileContent?.querySelectorAll('.file-code, .file-view');
}); if (btn.matches('.escape-button')) {
$(document).on('click', '.unescape-button', (e) => { for (const el of fileView) el.classList.add('unicode-escaped');
e.preventDefault(); hideElem(btn);
$(e.target).parents('.file-content, .non-diff-file-content').find('.file-code, .file-view').removeClass('unicode-escaped'); showElem(queryElemSiblings(btn, '.unescape-button'));
hideElem($(e.target)); } else if (btn.matches('.unescape-button')) {
showElem($(e.target).siblings('.escape-button')); for (const el of fileView) el.classList.remove('unicode-escaped');
}); hideElem(btn);
$(document).on('click', '.toggle-escape-button', (e) => { showElem(queryElemSiblings(btn, '.escape-button'));
e.preventDefault(); } else if (btn.matches('.toggle-escape-button')) {
const fileContent = $(e.target).parents('.file-content, .non-diff-file-content'); const isEscaped = fileView[0]?.classList.contains('unicode-escaped');
const fileView = fileContent.find('.file-code, .file-view'); for (const el of fileView) el.classList.toggle('unicode-escaped', !isEscaped);
if (fileView.hasClass('unicode-escaped')) { toggleElem(fileContent.querySelectorAll('.unescape-button'), !isEscaped);
fileView.removeClass('unicode-escaped'); toggleElem(fileContent.querySelectorAll('.escape-button'), isEscaped);
hideElem(fileContent.find('.unescape-button'));
showElem(fileContent.find('.escape-button'));
} else {
fileView.addClass('unicode-escaped');
showElem(fileContent.find('.unescape-button'));
hideElem(fileContent.find('.escape-button'));
} }
}); });
} }

View file

@ -51,6 +51,10 @@ export function isElemHidden(el) {
return res[0]; return res[0];
} }
export function queryElemSiblings(el, selector) {
return Array.from(el.parentNode.children).filter((child) => child !== el && child.matches(selector));
}
export function onDomReady(cb) { export function onDomReady(cb) {
if (document.readyState === 'loading') { if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', cb); document.addEventListener('DOMContentLoaded', cb);