mirror of
https://github.com/go-gitea/gitea.git
synced 2026-10-26 06:16:56 +09:00
silverwindandwxiaoguang
e645afbb3f
Replace Fomantic's hard-forked jQuery modal with native `<dialog>` elements, advancing https://github.com/go-gitea/gitea/issues/29849. The UI is visually unchanged. Dialogs open with `show()` over an `inert` page, so tooltips, popups and toasts mounted on `<body>` stay usable above them, unlike with `showModal()` (https://github.com/whatwg/html/issues/9936). - Remove the Fomantic modal and dimmer, add `showModal` and `hideModal` - Declare modals as `<dialog class="modal-dialog">`, shown inside a `.modal-backdrop`, instead of `ui modal` with its unused size classes - Remove two modals that could never be opened - Block the page while a modal is open, close the topmost one on Escape and restore focus to its opener - Allow stacked modals, use a confirm modal instead of `window.confirm` for deleting content history - Hide popups and toasts when a modal opens or closes - Keep the release notes modal open when generating notes fails Fixes: https://github.com/go-gitea/gitea/issues/39643 Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
43 lines
1.9 KiB
TypeScript
43 lines
1.9 KiB
TypeScript
import {toggleElem} from '../utils/dom.ts';
|
|
import {showModal} from '../modules/modal.ts';
|
|
import {trString} from '../modules/i18n.ts';
|
|
import {registerGlobalEventFunc} from '../modules/observer.ts';
|
|
|
|
export function initRepoBranchButton() {
|
|
initRepoCreateBranchButton();
|
|
initRepoRenameBranchButton();
|
|
}
|
|
|
|
function initRepoCreateBranchButton() {
|
|
// 2 pages share this code, one is the branch list page, the other is the commit view page: create branch/tag from current commit (dirty code)
|
|
for (const el of document.querySelectorAll('.show-create-branch-modal')) {
|
|
el.addEventListener('click', () => {
|
|
const modalFormName = el.getAttribute('data-modal-form') || '#create-branch-form';
|
|
const modalForm = document.querySelector<HTMLFormElement>(modalFormName);
|
|
if (!modalForm) return;
|
|
modalForm.action = `${modalForm.getAttribute('data-base-action')}${el.getAttribute('data-branch-from-urlcomponent')}`;
|
|
|
|
const fromSpanName = el.getAttribute('data-modal-from-span') || '#modal-create-branch-from-span';
|
|
document.querySelector(fromSpanName)!.textContent = el.getAttribute('data-branch-from');
|
|
|
|
showModal(document.querySelector(el.getAttribute('data-modal')!)!);
|
|
});
|
|
}
|
|
}
|
|
|
|
function initRepoRenameBranchButton() {
|
|
registerGlobalEventFunc('click', 'showRenameBranchModal', (el) => {
|
|
const target = el.getAttribute('data-modal')!;
|
|
const modal = document.querySelector(target)!;
|
|
const oldBranchName = el.getAttribute('data-old-branch-name')!;
|
|
modal.querySelector<HTMLInputElement>('input[name=from]')!.value = oldBranchName;
|
|
|
|
// display the warning that the branch which is chosen is the default branch
|
|
const warn = modal.querySelector('.default-branch-warning')!;
|
|
toggleElem(warn, el.getAttribute('data-is-default-branch') === 'true');
|
|
|
|
const text = modal.querySelector('[data-rename-branch-to]')!;
|
|
text.textContent = trString(text.getAttribute('data-rename-branch-to')!, oldBranchName);
|
|
});
|
|
}
|