Improve async/await usage, and sort init calls in index.js
(#17386)
* clean up async/await, and sort init calls in `index.js * use `const _promise` to indicate that we do not need await an async function
This commit is contained in:
parent
3a693bd18c
commit
bb71ceeeb2
21 changed files with 223 additions and 211 deletions
133
web_src/js/features/repo-graph.js
Normal file
133
web_src/js/features/repo-graph.js
Normal file
|
@ -0,0 +1,133 @@
|
|||
export default function initRepoGraphGit() {
|
||||
const graphContainer = document.getElementById('git-graph-container');
|
||||
if (!graphContainer) return;
|
||||
|
||||
$('#flow-color-monochrome').on('click', () => {
|
||||
$('#flow-color-monochrome').addClass('active');
|
||||
$('#flow-color-colored').removeClass('active');
|
||||
$('#git-graph-container').removeClass('colored').addClass('monochrome');
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
params.set('mode', 'monochrome');
|
||||
const queryString = params.toString();
|
||||
if (queryString) {
|
||||
window.history.replaceState({}, '', `?${queryString}`);
|
||||
} else {
|
||||
window.history.replaceState({}, '', window.location.pathname);
|
||||
}
|
||||
$('.pagination a').each((_, that) => {
|
||||
const href = $(that).attr('href');
|
||||
if (!href) return;
|
||||
const url = new URL(href, window.location);
|
||||
const params = url.searchParams;
|
||||
params.set('mode', 'monochrome');
|
||||
url.search = `?${params.toString()}`;
|
||||
$(that).attr('href', url.href);
|
||||
});
|
||||
});
|
||||
$('#flow-color-colored').on('click', () => {
|
||||
$('#flow-color-colored').addClass('active');
|
||||
$('#flow-color-monochrome').removeClass('active');
|
||||
$('#git-graph-container').addClass('colored').removeClass('monochrome');
|
||||
$('.pagination a').each((_, that) => {
|
||||
const href = $(that).attr('href');
|
||||
if (!href) return;
|
||||
const url = new URL(href, window.location);
|
||||
const params = url.searchParams;
|
||||
params.delete('mode');
|
||||
url.search = `?${params.toString()}`;
|
||||
$(that).attr('href', url.href);
|
||||
});
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
params.delete('mode');
|
||||
const queryString = params.toString();
|
||||
if (queryString) {
|
||||
window.history.replaceState({}, '', `?${queryString}`);
|
||||
} else {
|
||||
window.history.replaceState({}, '', window.location.pathname);
|
||||
}
|
||||
});
|
||||
const url = new URL(window.location);
|
||||
const params = url.searchParams;
|
||||
const updateGraph = async () => {
|
||||
const queryString = params.toString();
|
||||
const ajaxUrl = new URL(url);
|
||||
ajaxUrl.searchParams.set('div-only', 'true');
|
||||
window.history.replaceState({}, '', queryString ? `?${queryString}` : window.location.pathname);
|
||||
$('#pagination').empty();
|
||||
$('#rel-container').addClass('hide');
|
||||
$('#rev-container').addClass('hide');
|
||||
$('#loading-indicator').removeClass('hide');
|
||||
|
||||
const div = $(await $.ajax(String(ajaxUrl)));
|
||||
$('#pagination').html(div.find('#pagination').html());
|
||||
$('#rel-container').html(div.find('#rel-container').html());
|
||||
$('#rev-container').html(div.find('#rev-container').html());
|
||||
$('#loading-indicator').addClass('hide');
|
||||
$('#rel-container').removeClass('hide');
|
||||
$('#rev-container').removeClass('hide');
|
||||
};
|
||||
const dropdownSelected = params.getAll('branch');
|
||||
if (params.has('hide-pr-refs') && params.get('hide-pr-refs') === 'true') {
|
||||
dropdownSelected.splice(0, 0, '...flow-hide-pr-refs');
|
||||
}
|
||||
|
||||
$('#flow-select-refs-dropdown').dropdown('set selected', dropdownSelected);
|
||||
$('#flow-select-refs-dropdown').dropdown({
|
||||
clearable: true,
|
||||
fullTextSeach: 'exact',
|
||||
onRemove(toRemove) {
|
||||
if (toRemove === '...flow-hide-pr-refs') {
|
||||
params.delete('hide-pr-refs');
|
||||
} else {
|
||||
const branches = params.getAll('branch');
|
||||
params.delete('branch');
|
||||
for (const branch of branches) {
|
||||
if (branch !== toRemove) {
|
||||
params.append('branch', branch);
|
||||
}
|
||||
}
|
||||
}
|
||||
updateGraph();
|
||||
},
|
||||
onAdd(toAdd) {
|
||||
if (toAdd === '...flow-hide-pr-refs') {
|
||||
params.set('hide-pr-refs', true);
|
||||
} else {
|
||||
params.append('branch', toAdd);
|
||||
}
|
||||
updateGraph();
|
||||
},
|
||||
});
|
||||
$('#git-graph-container').on('mouseenter', '#rev-list li', (e) => {
|
||||
const flow = $(e.currentTarget).data('flow');
|
||||
if (flow === 0) return;
|
||||
$(`#flow-${flow}`).addClass('highlight');
|
||||
$(e.currentTarget).addClass('hover');
|
||||
$(`#rev-list li[data-flow='${flow}']`).addClass('highlight');
|
||||
});
|
||||
$('#git-graph-container').on('mouseleave', '#rev-list li', (e) => {
|
||||
const flow = $(e.currentTarget).data('flow');
|
||||
if (flow === 0) return;
|
||||
$(`#flow-${flow}`).removeClass('highlight');
|
||||
$(e.currentTarget).removeClass('hover');
|
||||
$(`#rev-list li[data-flow='${flow}']`).removeClass('highlight');
|
||||
});
|
||||
$('#git-graph-container').on('mouseenter', '#rel-container .flow-group', (e) => {
|
||||
$(e.currentTarget).addClass('highlight');
|
||||
const flow = $(e.currentTarget).data('flow');
|
||||
$(`#rev-list li[data-flow='${flow}']`).addClass('highlight');
|
||||
});
|
||||
$('#git-graph-container').on('mouseleave', '#rel-container .flow-group', (e) => {
|
||||
$(e.currentTarget).removeClass('highlight');
|
||||
const flow = $(e.currentTarget).data('flow');
|
||||
$(`#rev-list li[data-flow='${flow}']`).removeClass('highlight');
|
||||
});
|
||||
$('#git-graph-container').on('mouseenter', '#rel-container .flow-commit', (e) => {
|
||||
const rev = $(e.currentTarget).data('rev');
|
||||
$(`#rev-list li#commit-${rev}`).addClass('hover');
|
||||
});
|
||||
$('#git-graph-container').on('mouseleave', '#rel-container .flow-commit', (e) => {
|
||||
const rev = $(e.currentTarget).data('rev');
|
||||
$(`#rev-list li#commit-${rev}`).removeClass('hover');
|
||||
});
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue