|
1 |
| -import $ from 'jquery'; |
2 | 1 | import {createTippy} from '../modules/tippy.js';
|
3 | 2 | import {toggleElem} from '../utils/dom.js';
|
4 |
| - |
5 |
| -const {csrfToken} = window.config; |
| 3 | +import {POST} from '../modules/fetch.js'; |
6 | 4 |
|
7 | 5 | export function initRepoEllipsisButton() {
|
8 |
| - $('.js-toggle-commit-body').on('click', function (e) { |
9 |
| - e.preventDefault(); |
10 |
| - const expanded = $(this).attr('aria-expanded') === 'true'; |
11 |
| - toggleElem($(this).parent().find('.commit-body')); |
12 |
| - $(this).attr('aria-expanded', String(!expanded)); |
13 |
| - }); |
| 6 | + for (const button of document.querySelectorAll('.js-toggle-commit-body')) { |
| 7 | + button.addEventListener('click', function (e) { |
| 8 | + e.preventDefault(); |
| 9 | + const expanded = this.getAttribute('aria-expanded') === 'true'; |
| 10 | + toggleElem(this.parentElement.querySelector('.commit-body')); |
| 11 | + this.setAttribute('aria-expanded', String(!expanded)); |
| 12 | + }); |
| 13 | + } |
14 | 14 | }
|
15 | 15 |
|
16 |
| -export function initRepoCommitLastCommitLoader() { |
| 16 | +const parser = new DOMParser(); |
| 17 | + |
| 18 | +export async function initRepoCommitLastCommitLoader() { |
17 | 19 | const entryMap = {};
|
18 | 20 |
|
19 |
| - const entries = $('table#repo-files-table tr.notready') |
20 |
| - .map((_, v) => { |
21 |
| - entryMap[$(v).attr('data-entryname')] = $(v); |
22 |
| - return $(v).attr('data-entryname'); |
23 |
| - }) |
24 |
| - .get(); |
| 21 | + const entries = Array.from(document.querySelectorAll('table#repo-files-table tr.notready'), (v) => { |
| 22 | + entryMap[v.getAttribute('data-entryname')] = v; |
| 23 | + return v.getAttribute('data-entryname'); |
| 24 | + }); |
25 | 25 |
|
26 | 26 | if (entries.length === 0) {
|
27 | 27 | return;
|
28 | 28 | }
|
29 | 29 |
|
30 |
| - const lastCommitLoaderURL = $('table#repo-files-table').data('lastCommitLoaderUrl'); |
| 30 | + const lastCommitLoaderURL = document.querySelector('table#repo-files-table').getAttribute('data-last-commit-loader-url'); |
31 | 31 |
|
32 | 32 | if (entries.length > 200) {
|
33 |
| - $.post(lastCommitLoaderURL, { |
34 |
| - _csrf: csrfToken, |
35 |
| - }, (data) => { |
36 |
| - $('table#repo-files-table').replaceWith(data); |
37 |
| - }); |
| 33 | + // For more than 200 entries, replace the entire table |
| 34 | + const response = await POST(lastCommitLoaderURL); |
| 35 | + const data = await response.text(); |
| 36 | + const table = document.querySelector('table#repo-files-table'); |
| 37 | + const parent = table.parentNode; |
| 38 | + const wrapper = document.createElement('div'); |
| 39 | + wrapper.innerHTML = data; |
| 40 | + const newTable = wrapper.querySelector('table'); |
| 41 | + if (newTable) { |
| 42 | + parent.replaceChild(newTable, table); |
| 43 | + } |
38 | 44 | return;
|
39 | 45 | }
|
40 | 46 |
|
41 |
| - $.post(lastCommitLoaderURL, { |
42 |
| - _csrf: csrfToken, |
43 |
| - 'f': entries, |
44 |
| - }, (data) => { |
45 |
| - $(data).find('tr').each((_, row) => { |
46 |
| - if (row.className === 'commit-list') { |
47 |
| - $('table#repo-files-table .commit-list').replaceWith(row); |
48 |
| - return; |
49 |
| - } |
50 |
| - // there are other <tr> rows in response (eg: <tr class="has-parent">) |
51 |
| - // at the moment only the "data-entryname" rows should be processed |
52 |
| - const entryName = $(row).attr('data-entryname'); |
53 |
| - if (entryName) { |
54 |
| - entryMap[entryName].replaceWith(row); |
55 |
| - } |
56 |
| - }); |
57 |
| - }); |
| 47 | + // For fewer entries, update individual rows |
| 48 | + const response = POST(lastCommitLoaderURL, {data: {'f': entries}}); |
| 49 | + const data = await response.text(); |
| 50 | + const doc = parser.parseFromString(data, 'text/html'); |
| 51 | + for (const row of doc.querySelectorAll('tr')) { |
| 52 | + if (row.className === 'commit-list') { |
| 53 | + document.querySelector('table#repo-files-table .commit-list')?.replaceWith(row); |
| 54 | + return; |
| 55 | + } |
| 56 | + |
| 57 | + const entryName = row.getAttribute('data-entryname'); |
| 58 | + if (entryName) { |
| 59 | + entryMap[entryName].replaceWith(row); |
| 60 | + } |
| 61 | + } |
58 | 62 | }
|
59 | 63 |
|
60 | 64 | export function initCommitStatuses() {
|
61 |
| - $('[data-tippy="commit-statuses"]').each(function () { |
62 |
| - const top = $('.repository.file.list').length > 0 || $('.repository.diff').length > 0; |
| 65 | + for (const element of document.querySelectorAll('[data-tippy="commit-statuses"]')) { |
| 66 | + const top = document.querySelector('.repository.file.list') || document.querySelector('.repository.diff'); |
63 | 67 |
|
64 |
| - createTippy(this, { |
65 |
| - content: this.nextElementSibling, |
| 68 | + createTippy(element, { |
| 69 | + content: element.nextElementSibling, |
66 | 70 | placement: top ? 'top-start' : 'bottom-start',
|
67 | 71 | interactive: true,
|
68 | 72 | role: 'dialog',
|
69 | 73 | theme: 'box-with-header',
|
70 | 74 | });
|
71 |
| - }); |
| 75 | + } |
72 | 76 | }
|
0 commit comments