linden123/githaven-fork
1
1
Fork 0
forked from Shiloh/githaven
Code Pull Requests Activity

Remove jQuery from the issue "go to" button (#30028)

Browse Source 
- Switched to plain JavaScript
- Tested the "go to" button functionality and it works as before

# Demo using JavaScript without jQuery

![demo](https://github.com/go-gitea/gitea/assets/20454870/76add18f-3294-4117-98b7-a97f576370e2)

Signed-off-by: Yarden Shoham <git@yardenshoham.com>
This commit is contained in:
Yarden Shoham 2024-03-23 20:18:45 +02:00 committed by GitHub
parent b9c57fb78e
commit d9e33959b3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 14 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
web_src/js/features/common-issue-list.js
View File

@ -1,4 +1,3 @@
import $ from 'jquery';
import {isElemHidden, onInputDebounce, submitEventSubmitter, toggleElem} from '../utils/dom.js'; import {isElemHidden, onInputDebounce, submitEventSubmitter, toggleElem} from '../utils/dom.js';
import {GET} from '../modules/fetch.js'; import {GET} from '../modules/fetch.js';
@ -30,42 +29,40 @@ export function parseIssueListQuickGotoLink(repoLink, searchText) {
} }
export function initCommonIssueListQuickGoto() { export function initCommonIssueListQuickGoto() {
const $goto = $('#issue-list-quick-goto'); const goto = document.getElementById('issue-list-quick-goto');
if (!$goto.length) return; if (!goto) return;
const $form = $goto.closest('form'); const form = goto.closest('form');
const $input = $form.find('input[name=q]'); const input = form.querySelector('input[name=q]');
const repoLink = $goto.attr('data-repo-link'); const repoLink = goto.getAttribute('data-repo-link');
$form.on('submit', (e) => { form.addEventListener('submit', (e) => {
// if there is no goto button, or the form is submitted by non-quick-goto elements, submit the form directly // if there is no goto button, or the form is submitted by non-quick-goto elements, submit the form directly
let doQuickGoto = !isElemHidden($goto); let doQuickGoto = !isElemHidden(goto);
const submitter = submitEventSubmitter(e); const submitter = submitEventSubmitter(e);
if (submitter !== $form[0] && submitter !== $input[0] && submitter !== $goto[0]) doQuickGoto = false; if (submitter !== form && submitter !== input && submitter !== goto) doQuickGoto = false;
if (!doQuickGoto) return; if (!doQuickGoto) return;
// if there is a goto button, use its link // if there is a goto button, use its link
e.preventDefault(); e.preventDefault();
window.location.href = $goto.attr('data-issue-goto-link'); window.location.href = goto.getAttribute('data-issue-goto-link');
}); });
const onInput = async () => { const onInput = async () => {
const searchText = $input.val(); const searchText = input.value;
// try to check whether the parsed goto link is valid // try to check whether the parsed goto link is valid
let targetUrl = parseIssueListQuickGotoLink(repoLink, searchText); let targetUrl = parseIssueListQuickGotoLink(repoLink, searchText);
if (targetUrl) { if (targetUrl) {
const res = await GET(`${targetUrl}/info`); const res = await GET(`${targetUrl}/info`);
if (res.status !== 200) targetUrl = ''; if (res.status !== 200) targetUrl = '';
} }
// if the input value has changed, then ignore the result // if the input value has changed, then ignore the result
if ($input.val() !== searchText) return; if (input.value !== searchText) return;
toggleElem($goto, Boolean(targetUrl)); toggleElem(goto, Boolean(targetUrl));
$goto.attr('data-issue-goto-link', targetUrl); goto.setAttribute('data-issue-goto-link', targetUrl);
}; };
$input.on('input', onInputDebounce(onInput)); input.addEventListener('input', onInputDebounce(onInput));
onInput(); onInput();
} }