mirror of
https://github.com/go-gitea/gitea.git
synced 2026-08-04 11:57:35 +00:00
refactor: introduce ActivePageTimer to help to do partial page refresh (#38372)
Before, the logic is already there for "pull merge box". After, the logic is extracted into a general class ActivePageTimer and will help more pages (including #38329)
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import {createApp} from 'vue';
|
||||
import {GET} from '../modules/fetch.ts';
|
||||
import {fomanticQuery} from '../modules/fomantic/base.ts';
|
||||
import {createElementFromHTML} from '../utils/dom.ts';
|
||||
import {createElementFromHTML, activePageTimerRefresh} from '../utils/dom.ts';
|
||||
import {registerGlobalEventFunc} from '../modules/observer.ts';
|
||||
|
||||
export function initRepoPullRequestUpdate(el: HTMLElement) {
|
||||
@@ -35,46 +35,22 @@ async function initRepoPullRequestMergeForm(box: HTMLElement) {
|
||||
view.mount(el); // TODO: can unmount when reloaded?
|
||||
}
|
||||
|
||||
function initRepoPullMergeBoxRefresh(el: Element) {
|
||||
activePageTimerRefresh({
|
||||
once: true, // on successful refresh, the data-global-init will re-initialize the element
|
||||
interval: () => Number(el.getAttribute('data-pull-merge-box-reloading-interval')),
|
||||
async callback() {
|
||||
const pullLink = el.getAttribute('data-pull-link')!;
|
||||
const resp = await GET(`${pullLink}/merge_box`);
|
||||
if (!resp.ok) return;
|
||||
const newEl = createElementFromHTML(await resp.text());
|
||||
el.replaceWith(newEl); // don't morph, do full replacement to make sure data-global-init and Vue components are re-initialized
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
export function initRepoPullMergeBox(el: HTMLElement) {
|
||||
registerGlobalEventFunc('click', 'onCommitStatusChecksToggle', onCommitStatusChecksToggle);
|
||||
initRepoPullRequestMergeForm(el);
|
||||
|
||||
const reloadingIntervalValue = el.getAttribute('data-pull-merge-box-reloading-interval');
|
||||
if (!reloadingIntervalValue) return;
|
||||
|
||||
const reloadingInterval = parseInt(reloadingIntervalValue);
|
||||
const pullLink = el.getAttribute('data-pull-link');
|
||||
let timerId: number | null;
|
||||
|
||||
let reloadMergeBox: () => Promise<void>;
|
||||
const stopReloading = () => {
|
||||
if (!timerId) return;
|
||||
clearTimeout(timerId);
|
||||
timerId = null;
|
||||
};
|
||||
const startReloading = () => {
|
||||
if (timerId) return;
|
||||
setTimeout(reloadMergeBox, reloadingInterval);
|
||||
};
|
||||
const onVisibilityChange = () => {
|
||||
if (document.hidden) {
|
||||
stopReloading();
|
||||
} else {
|
||||
startReloading();
|
||||
}
|
||||
};
|
||||
reloadMergeBox = async () => {
|
||||
const resp = await GET(`${pullLink}/merge_box`);
|
||||
stopReloading();
|
||||
if (!resp.ok) {
|
||||
startReloading();
|
||||
return;
|
||||
}
|
||||
document.removeEventListener('visibilitychange', onVisibilityChange);
|
||||
const newElem = createElementFromHTML(await resp.text());
|
||||
el.replaceWith(newElem);
|
||||
};
|
||||
|
||||
document.addEventListener('visibilitychange', onVisibilityChange);
|
||||
startReloading();
|
||||
initRepoPullMergeBoxRefresh(el);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user