forked from gitea/gitea
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>
This commit is contained in:
parent
4197e28100
commit
c86d033a3e
|
@ -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'));
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -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);
|
||||||
|
|
Loading…
Reference in New Issue