mirror of
https://github.com/go-gitea/gitea
synced 2024-11-17 15:31:06 +01:00
Remove jQuery .text() (#30506)
Remove and forbid [.text()](https://api.jquery.com/text/). Tested some, but not all functionality, but I think these are pretty safe replacements. --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
silverwind
GitHub
parent
4f7d6feab7
commit
a2304cb163
12 changed files with 161 additions and 169 deletions
|
|
@ -324,7 +324,7 @@ rules:
|
|||
jquery/no-sizzle: [2]
|
||||
jquery/no-slide: [2]
|
||||
jquery/no-submit: [2]
|
||||
jquery/no-text: [0]
|
||||
jquery/no-text: [2]
|
||||
jquery/no-toggle: [2]
|
||||
jquery/no-trigger: [0]
|
||||
jquery/no-trim: [2]
|
||||
|
|
@ -477,7 +477,7 @@ rules:
|
|||
no-jquery/no-slide: [2]
|
||||
no-jquery/no-sub: [2]
|
||||
no-jquery/no-support: [2]
|
||||
no-jquery/no-text: [0]
|
||||
no-jquery/no-text: [2]
|
||||
no-jquery/no-trigger: [0]
|
||||
no-jquery/no-trim: [2]
|
||||
no-jquery/no-type: [2]
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
<div class="quick-pull-choice js-quick-pull-choice">
|
||||
<div class="field">
|
||||
<div class="ui radio checkbox {{if not .CanCommitToBranch.CanCommitToBranch}}disabled{{end}}">
|
||||
<input type="radio" class="js-quick-pull-choice-option" name="commit_choice" value="direct" button_text="{{ctx.Locale.Tr "repo.editor.commit_changes"}}" {{if eq .commit_choice "direct"}}checked{{end}}>
|
||||
<input type="radio" class="js-quick-pull-choice-option" name="commit_choice" value="direct" data-button-text="{{ctx.Locale.Tr "repo.editor.commit_changes"}}" {{if eq .commit_choice "direct"}}checked{{end}}>
|
||||
<label>
|
||||
{{svg "octicon-git-commit"}}
|
||||
{{ctx.Locale.Tr "repo.editor.commit_directly_to_this_branch" .BranchName}}
|
||||
|
|
@ -43,9 +43,9 @@
|
|||
<div class="field">
|
||||
<div class="ui radio checkbox">
|
||||
{{if .CanCreatePullRequest}}
|
||||
<input type="radio" class="js-quick-pull-choice-option" name="commit_choice" value="commit-to-new-branch" button_text="{{ctx.Locale.Tr "repo.editor.propose_file_change"}}" {{if eq .commit_choice "commit-to-new-branch"}}checked{{end}}>
|
||||
<input type="radio" class="js-quick-pull-choice-option" name="commit_choice" value="commit-to-new-branch" data-button-text="{{ctx.Locale.Tr "repo.editor.propose_file_change"}}" {{if eq .commit_choice "commit-to-new-branch"}}checked{{end}}>
|
||||
{{else}}
|
||||
<input type="radio" class="js-quick-pull-choice-option" name="commit_choice" value="commit-to-new-branch" button_text="{{ctx.Locale.Tr "repo.editor.commit_changes"}}" {{if eq .commit_choice "commit-to-new-branch"}}checked{{end}}>
|
||||
<input type="radio" class="js-quick-pull-choice-option" name="commit_choice" value="commit-to-new-branch" data-button-text="{{ctx.Locale.Tr "repo.editor.commit_changes"}}" {{if eq .commit_choice "commit-to-new-branch"}}checked{{end}}>
|
||||
{{end}}
|
||||
<label>
|
||||
{{svg "octicon-git-pull-request"}}
|
||||
|
|
|
|||
|
|
@ -19,13 +19,13 @@
|
|||
<div class="flex-item-trailing">
|
||||
<div class="flex-text-block">
|
||||
{{svg "octicon-shield-lock"}}
|
||||
<div class="ui inline dropdown access-mode" data-url="{{$.Link}}/access_mode" data-uid="{{.ID}}" data-last-value="{{printf "%d" .Collaboration.Mode}}">
|
||||
<div class="ui dropdown custom access-mode" data-url="{{$.Link}}/access_mode" data-uid="{{.ID}}" data-last-value="{{.Collaboration.Mode}}">
|
||||
<div class="text">{{if eq .Collaboration.Mode 1}}{{ctx.Locale.Tr "repo.settings.collaboration.read"}}{{else if eq .Collaboration.Mode 2}}{{ctx.Locale.Tr "repo.settings.collaboration.write"}}{{else if eq .Collaboration.Mode 3}}{{ctx.Locale.Tr "repo.settings.collaboration.admin"}}{{else}}{{ctx.Locale.Tr "repo.settings.collaboration.undefined"}}{{end}}</div>
|
||||
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
|
||||
<div class="menu">
|
||||
<div class="item" data-text="{{ctx.Locale.Tr "repo.settings.collaboration.admin"}}" data-value="3">{{ctx.Locale.Tr "repo.settings.collaboration.admin"}}</div>
|
||||
<div class="item" data-text="{{ctx.Locale.Tr "repo.settings.collaboration.write"}}" data-value="2">{{ctx.Locale.Tr "repo.settings.collaboration.write"}}</div>
|
||||
<div class="item" data-text="{{ctx.Locale.Tr "repo.settings.collaboration.read"}}" data-value="1">{{ctx.Locale.Tr "repo.settings.collaboration.read"}}</div>
|
||||
<div class="item" data-value="3">{{ctx.Locale.Tr "repo.settings.collaboration.admin"}}</div>
|
||||
<div class="item" data-value="2">{{ctx.Locale.Tr "repo.settings.collaboration.write"}}</div>
|
||||
<div class="item" data-value="1">{{ctx.Locale.Tr "repo.settings.collaboration.read"}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -301,52 +301,65 @@ async function linkAction(e) {
|
|||
}
|
||||
}
|
||||
|
||||
export function initGlobalLinkActions() {
|
||||
function showDeletePopup(e) {
|
||||
export function initGlobalDeleteButton() {
|
||||
// ".delete-button" shows a confirmation modal defined by `data-modal-id` attribute.
|
||||
// Some model/form elements will be filled by `data-id` / `data-name` / `data-data-xxx` attributes.
|
||||
// If there is a form defined by `data-form`, then the form will be submitted as-is (without any modification).
|
||||
// If there is no form, then the data will be posted to `data-url`.
|
||||
// TODO: it's not encouraged to use this method. `show-modal` does far better than this.
|
||||
for (const btn of document.querySelectorAll('.delete-button')) {
|
||||
btn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
const $this = $(this);
|
||||
const dataArray = $this.data();
|
||||
let filter = '';
|
||||
if (this.getAttribute('data-modal-id')) {
|
||||
filter += `#${this.getAttribute('data-modal-id')}`;
|
||||
}
|
||||
|
||||
const $dialog = $(`.delete.modal${filter}`);
|
||||
$dialog.find('.name').text($this.data('name'));
|
||||
for (const [key, value] of Object.entries(dataArray)) {
|
||||
if (key && key.startsWith('data')) {
|
||||
$dialog.find(`.${key}`).text(value);
|
||||
// eslint-disable-next-line github/no-dataset -- code depends on the camel-casing
|
||||
const dataObj = btn.dataset;
|
||||
|
||||
const modalId = btn.getAttribute('data-modal-id');
|
||||
const modal = document.querySelector(`.delete.modal${modalId ? `#${modalId}` : ''}`);
|
||||
|
||||
// set the modal "display name" by `data-name`
|
||||
const modalNameEl = modal.querySelector('.name');
|
||||
if (modalNameEl) modalNameEl.textContent = btn.getAttribute('data-name');
|
||||
|
||||
// fill the modal elements with data-xxx attributes: `data-data-organization-name="..."` => `<span class="dataOrganizationName">...</span>`
|
||||
for (const [key, value] of Object.entries(dataObj)) {
|
||||
if (key.startsWith('data')) {
|
||||
const textEl = modal.querySelector(`.${key}`);
|
||||
if (textEl) textEl.textContent = value;
|
||||
}
|
||||
}
|
||||
|
||||
$dialog.modal({
|
||||
$(modal).modal({
|
||||
closable: false,
|
||||
onApprove: async () => {
|
||||
if ($this.data('type') === 'form') {
|
||||
$($this.data('form')).trigger('submit');
|
||||
return;
|
||||
// if `data-type="form"` exists, then submit the form by the selector provided by `data-form="..."`
|
||||
if (btn.getAttribute('data-type') === 'form') {
|
||||
const formSelector = btn.getAttribute('data-form');
|
||||
const form = document.querySelector(formSelector);
|
||||
if (!form) throw new Error(`no form named ${formSelector} found`);
|
||||
form.submit();
|
||||
}
|
||||
|
||||
// prepare an AJAX form by data attributes
|
||||
const postData = new FormData();
|
||||
for (const [key, value] of Object.entries(dataArray)) {
|
||||
if (key && key.startsWith('data')) {
|
||||
for (const [key, value] of Object.entries(dataObj)) {
|
||||
if (key.startsWith('data')) { // for data-data-xxx (HTML) -> dataXxx (form)
|
||||
postData.append(key.slice(4), value);
|
||||
}
|
||||
if (key === 'id') {
|
||||
if (key === 'id') { // for data-id="..."
|
||||
postData.append('id', value);
|
||||
}
|
||||
}
|
||||
|
||||
const response = await POST($this.data('url'), {data: postData});
|
||||
const response = await POST(btn.getAttribute('data-url'), {data: postData});
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
window.location.href = data.redirect;
|
||||
}
|
||||
},
|
||||
}).modal('show');
|
||||
});
|
||||
}
|
||||
|
||||
// Helpers.
|
||||
$('.delete-button').on('click', showDeletePopup);
|
||||
}
|
||||
|
||||
function initGlobalShowModal() {
|
||||
|
|
@ -382,7 +395,7 @@ function initGlobalShowModal() {
|
|||
} else if ($attrTarget[0].matches('input, textarea')) {
|
||||
$attrTarget.val(attrib.value); // FIXME: add more supports like checkbox
|
||||
} else {
|
||||
$attrTarget.text(attrib.value); // FIXME: it should be more strict here, only handle div/span/p
|
||||
$attrTarget[0].textContent = attrib.value; // FIXME: it should be more strict here, only handle div/span/p
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -79,20 +79,20 @@ export function initImageDiff() {
|
|||
path: this.getAttribute('data-path-after'),
|
||||
mime: this.getAttribute('data-mime-after'),
|
||||
$images: $container.find('img.image-after'), // matches 3 <img>
|
||||
$boundsInfo: $container.find('.bounds-info-after'),
|
||||
boundsInfo: this.querySelector('.bounds-info-after'),
|
||||
}, {
|
||||
path: this.getAttribute('data-path-before'),
|
||||
mime: this.getAttribute('data-mime-before'),
|
||||
$images: $container.find('img.image-before'), // matches 3 <img>
|
||||
$boundsInfo: $container.find('.bounds-info-before'),
|
||||
boundsInfo: this.querySelector('.bounds-info-before'),
|
||||
}];
|
||||
|
||||
await Promise.all(imageInfos.map(async (info) => {
|
||||
const [success] = await Promise.all(Array.from(info.$images, (img) => {
|
||||
return loadElem(img, info.path);
|
||||
}));
|
||||
// only the first images is associated with $boundsInfo
|
||||
if (!success) info.$boundsInfo.text('(image error)');
|
||||
// only the first images is associated with boundsInfo
|
||||
if (!success && info.boundsInfo) info.boundsInfo.textContent = '(image error)';
|
||||
if (info.mime === 'image/svg+xml') {
|
||||
const resp = await GET(info.path);
|
||||
const text = await resp.text();
|
||||
|
|
@ -102,7 +102,7 @@ export function initImageDiff() {
|
|||
this.setAttribute('width', bounds.width);
|
||||
this.setAttribute('height', bounds.height);
|
||||
});
|
||||
hideElem(info.$boundsInfo);
|
||||
hideElem(info.boundsInfo);
|
||||
}
|
||||
}
|
||||
}));
|
||||
|
|
|
|||
|
|
@ -47,17 +47,13 @@ async function receiveUpdateCount(event) {
|
|||
}
|
||||
|
||||
export function initNotificationCount() {
|
||||
const $notificationCount = $('.notification_count');
|
||||
|
||||
if (!$notificationCount.length) {
|
||||
return;
|
||||
}
|
||||
if (!document.querySelector('.notification_count')) return;
|
||||
|
||||
let usingPeriodicPoller = false;
|
||||
const startPeriodicPoller = (timeout, lastCount) => {
|
||||
if (timeout <= 0 || !Number.isFinite(timeout)) return;
|
||||
usingPeriodicPoller = true;
|
||||
lastCount = lastCount ?? $notificationCount.text();
|
||||
lastCount = lastCount ?? getCurrentCount();
|
||||
setTimeout(async () => {
|
||||
await updateNotificationCountWithCallback(startPeriodicPoller, timeout, lastCount);
|
||||
}, timeout);
|
||||
|
|
@ -121,8 +117,12 @@ export function initNotificationCount() {
|
|||
startPeriodicPoller(notificationSettings.MinTimeout);
|
||||
}
|
||||
|
||||
function getCurrentCount() {
|
||||
return document.querySelector('.notification_count').textContent;
|
||||
}
|
||||
|
||||
async function updateNotificationCountWithCallback(callback, timeout, lastCount) {
|
||||
const currentCount = $('.notification_count').text();
|
||||
const currentCount = getCurrentCount();
|
||||
if (lastCount !== currentCount) {
|
||||
callback(notificationSettings.MinTimeout, currentCount);
|
||||
return;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import $ from 'jquery';
|
||||
import {htmlEscape} from 'escape-goat';
|
||||
import {createCodeEditor} from './codeeditor.js';
|
||||
import {hideElem, showElem} from '../utils/dom.js';
|
||||
import {hideElem, queryElems, showElem} from '../utils/dom.js';
|
||||
import {initMarkupContent} from '../markup/content.js';
|
||||
import {attachRefIssueContextPopup} from './contextpopup.js';
|
||||
import {POST} from '../modules/fetch.js';
|
||||
|
|
@ -40,98 +40,75 @@ function initEditPreviewTab($form) {
|
|||
}
|
||||
}
|
||||
|
||||
function initEditorForm() {
|
||||
const $form = $('.repository .edit.form');
|
||||
if (!$form) return;
|
||||
initEditPreviewTab($form);
|
||||
}
|
||||
|
||||
function getCursorPosition($e) {
|
||||
const el = $e.get(0);
|
||||
let pos = 0;
|
||||
if ('selectionStart' in el) {
|
||||
pos = el.selectionStart;
|
||||
} else if ('selection' in document) {
|
||||
el.focus();
|
||||
const Sel = document.selection.createRange();
|
||||
const SelLength = document.selection.createRange().text.length;
|
||||
Sel.moveStart('character', -el.value.length);
|
||||
pos = Sel.text.length - SelLength;
|
||||
}
|
||||
return pos;
|
||||
}
|
||||
|
||||
export function initRepoEditor() {
|
||||
initEditorForm();
|
||||
const $editArea = $('.repository.editor textarea#edit_area');
|
||||
if (!$editArea.length) return;
|
||||
|
||||
$('.js-quick-pull-choice-option').on('change', function () {
|
||||
if ($(this).val() === 'commit-to-new-branch') {
|
||||
for (const el of queryElems('.js-quick-pull-choice-option')) {
|
||||
el.addEventListener('input', () => {
|
||||
if (el.value === 'commit-to-new-branch') {
|
||||
showElem('.quick-pull-branch-name');
|
||||
document.querySelector('.quick-pull-branch-name input').required = true;
|
||||
} else {
|
||||
hideElem('.quick-pull-branch-name');
|
||||
document.querySelector('.quick-pull-branch-name input').required = false;
|
||||
}
|
||||
$('#commit-button').text(this.getAttribute('button_text'));
|
||||
document.querySelector('#commit-button').textContent = el.getAttribute('data-button-text');
|
||||
});
|
||||
|
||||
const joinTreePath = ($fileNameEl) => {
|
||||
const parts = [];
|
||||
$('.breadcrumb span.section').each(function () {
|
||||
const $element = $(this);
|
||||
if ($element.find('a').length) {
|
||||
parts.push($element.find('a').text());
|
||||
} else {
|
||||
parts.push($element.text());
|
||||
}
|
||||
});
|
||||
if ($fileNameEl.val()) parts.push($fileNameEl.val());
|
||||
$('#tree_path').val(parts.join('/'));
|
||||
};
|
||||
|
||||
const $editFilename = $('#file-name');
|
||||
$editFilename.on('input', function () {
|
||||
const parts = $(this).val().split('/');
|
||||
|
||||
const filenameInput = document.querySelector('#file-name');
|
||||
function joinTreePath() {
|
||||
const parts = [];
|
||||
for (const el of document.querySelectorAll('.breadcrumb span.section')) {
|
||||
const link = el.querySelector('a');
|
||||
parts.push(link ? link.textContent : el.textContent);
|
||||
}
|
||||
if (filenameInput.value) {
|
||||
parts.push(filenameInput.value);
|
||||
}
|
||||
document.querySelector('#tree_path').value = parts.join('/');
|
||||
}
|
||||
filenameInput.addEventListener('input', function () {
|
||||
const parts = filenameInput.value.split('/');
|
||||
if (parts.length > 1) {
|
||||
for (let i = 0; i < parts.length; ++i) {
|
||||
const value = parts[i];
|
||||
if (i < parts.length - 1) {
|
||||
if (value.length) {
|
||||
$(`<span class="section"><a href="#">${htmlEscape(value)}</a></span>`).insertBefore($(this));
|
||||
$('<div class="breadcrumb-divider">/</div>').insertBefore($(this));
|
||||
$(`<span class="section"><a href="#">${htmlEscape(value)}</a></span>`).insertBefore($(filenameInput));
|
||||
$('<div class="breadcrumb-divider">/</div>').insertBefore($(filenameInput));
|
||||
}
|
||||
} else {
|
||||
$(this).val(value);
|
||||
filenameInput.value = value;
|
||||
}
|
||||
this.setSelectionRange(0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
joinTreePath($(this));
|
||||
joinTreePath();
|
||||
});
|
||||
|
||||
$editFilename.on('keydown', function (e) {
|
||||
const $section = $('.breadcrumb span.section');
|
||||
|
||||
filenameInput.addEventListener('keydown', function (e) {
|
||||
const sections = queryElems('.breadcrumb span.section');
|
||||
const dividers = queryElems('.breadcrumb .breadcrumb-divider');
|
||||
// Jump back to last directory once the filename is empty
|
||||
if (e.code === 'Backspace' && getCursorPosition($(this)) === 0 && $section.length > 0) {
|
||||
if (e.code === 'Backspace' && filenameInput.selectionStart === 0 && sections.length > 0) {
|
||||
e.preventDefault();
|
||||
const $divider = $('.breadcrumb .breadcrumb-divider');
|
||||
const value = $section.last().find('a').text();
|
||||
$(this).val(value + $(this).val());
|
||||
const lastSection = sections[sections.length - 1];
|
||||
const lastDivider = dividers.length ? dividers[dividers.length - 1] : null;
|
||||
const value = lastSection.querySelector('a').textContent;
|
||||
filenameInput.value = value + filenameInput.value;
|
||||
this.setSelectionRange(value.length, value.length);
|
||||
$section.last().remove();
|
||||
$divider.last().remove();
|
||||
joinTreePath($(this));
|
||||
lastDivider?.remove();
|
||||
lastSection.remove();
|
||||
joinTreePath();
|
||||
}
|
||||
});
|
||||
|
||||
const $editArea = $('.repository.editor textarea#edit_area');
|
||||
if (!$editArea.length) return;
|
||||
const $form = $('.repository.editor .edit.form');
|
||||
initEditPreviewTab($form);
|
||||
|
||||
(async () => {
|
||||
const editor = await createCodeEditor($editArea[0], $editFilename[0]);
|
||||
const editor = await createCodeEditor($editArea[0], filenameInput);
|
||||
|
||||
// Using events from https://github.com/codedance/jquery.AreYouSure#advanced-usage
|
||||
// to enable or disable the commit button
|
||||
|
|
|
|||
|
|
@ -189,11 +189,12 @@ export function initRepoIssueCommentEdit() {
|
|||
// Quote reply
|
||||
$(document).on('click', '.quote-reply', async function (event) {
|
||||
event.preventDefault();
|
||||
const target = $(this).data('target');
|
||||
const quote = $(`#${target}`).text().replace(/\n/g, '\n> ');
|
||||
const target = this.getAttribute('data-target');
|
||||
const quote = document.querySelector(`#${target}`).textContent.replace(/\n/g, '\n> ');
|
||||
const content = `> ${quote}\n\n`;
|
||||
|
||||
let editor;
|
||||
if ($(this).hasClass('quote-reply-diff')) {
|
||||
if (this.classList.contains('quote-reply-diff')) {
|
||||
const $replyBtn = $(this).closest('.comment-code-cloud').find('button.comment-form-reply');
|
||||
editor = await handleReply($replyBtn);
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -278,11 +278,12 @@ export function initRepoPullRequestUpdate() {
|
|||
|
||||
$('.update-button > .dropdown').dropdown({
|
||||
onChange(_text, _value, $choice) {
|
||||
const url = $choice[0].getAttribute('data-do');
|
||||
const choiceEl = $choice[0];
|
||||
const url = choiceEl.getAttribute('data-do');
|
||||
if (url) {
|
||||
const buttonText = pullUpdateButton.querySelector('.button-text');
|
||||
if (buttonText) {
|
||||
buttonText.textContent = $choice.text();
|
||||
buttonText.textContent = choiceEl.textContent;
|
||||
}
|
||||
pullUpdateButton.setAttribute('data-do', url);
|
||||
}
|
||||
|
|
@ -567,14 +568,15 @@ export function initRepoPullRequestReview() {
|
|||
export function initRepoIssueReferenceIssue() {
|
||||
// Reference issue
|
||||
$(document).on('click', '.reference-issue', function (event) {
|
||||
const $this = $(this);
|
||||
const content = $(`#${$this.data('target')}`).text();
|
||||
const poster = $this.data('poster-username');
|
||||
const reference = toAbsoluteUrl($this.data('reference'));
|
||||
const $modal = $($this.data('modal'));
|
||||
$modal.find('textarea[name="content"]').val(`${content}\n\n_Originally posted by @${poster} in ${reference}_`);
|
||||
$modal.modal('show');
|
||||
|
||||
const target = this.getAttribute('data-target');
|
||||
const content = document.querySelector(`#${target}`)?.textContent ?? '';
|
||||
const poster = this.getAttribute('data-poster-username');
|
||||
const reference = toAbsoluteUrl(this.getAttribute('data-reference'));
|
||||
const modalSelector = this.getAttribute('data-modal');
|
||||
const modal = document.querySelector(modalSelector);
|
||||
const textarea = modal.querySelector('textarea[name="content"]');
|
||||
textarea.value = `${content}\n\n_Originally posted by @${poster} in ${reference}_`;
|
||||
$(modal).modal('show');
|
||||
event.preventDefault();
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -272,9 +272,9 @@ export function initRepoCommentForm() {
|
|||
}
|
||||
|
||||
$list.find('.selected').html(`
|
||||
<a class="item muted sidebar-item-link" href=${$(this).data('href')}>
|
||||
<a class="item muted sidebar-item-link" href=${htmlEscape(this.getAttribute('href'))}>
|
||||
${icon}
|
||||
${htmlEscape($(this).text())}
|
||||
${htmlEscape(this.textContent)}
|
||||
</a>
|
||||
`);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,47 +1,46 @@
|
|||
import $ from 'jquery';
|
||||
import {minimatch} from 'minimatch';
|
||||
import {createMonaco} from './codeeditor.js';
|
||||
import {onInputDebounce, toggleElem} from '../utils/dom.js';
|
||||
import {onInputDebounce, queryElems, toggleElem} from '../utils/dom.js';
|
||||
import {POST} from '../modules/fetch.js';
|
||||
|
||||
const {appSubUrl, csrfToken} = window.config;
|
||||
|
||||
export function initRepoSettingsCollaboration() {
|
||||
// Change collaborator access mode
|
||||
$('.page-content.repository .ui.dropdown.access-mode').each((_, el) => {
|
||||
const $dropdown = $(el);
|
||||
const $text = $dropdown.find('> .text');
|
||||
$dropdown.dropdown({
|
||||
async action(_text, value) {
|
||||
const lastValue = el.getAttribute('data-last-value');
|
||||
for (const dropdownEl of queryElems('.page-content.repository .ui.dropdown.access-mode')) {
|
||||
const textEl = dropdownEl.querySelector(':scope > .text');
|
||||
$(dropdownEl).dropdown({
|
||||
async action(text, value) {
|
||||
dropdownEl.classList.add('is-loading', 'loading-icon-2px');
|
||||
const lastValue = dropdownEl.getAttribute('data-last-value');
|
||||
$(dropdownEl).dropdown('hide');
|
||||
try {
|
||||
el.setAttribute('data-last-value', value);
|
||||
$dropdown.dropdown('hide');
|
||||
const data = new FormData();
|
||||
data.append('uid', el.getAttribute('data-uid'));
|
||||
data.append('mode', value);
|
||||
await POST(el.getAttribute('data-url'), {data});
|
||||
const uid = dropdownEl.getAttribute('data-uid');
|
||||
await POST(dropdownEl.getAttribute('data-url'), {data: new URLSearchParams({uid, 'mode': value})});
|
||||
textEl.textContent = text;
|
||||
dropdownEl.setAttribute('data-last-value', value);
|
||||
} catch {
|
||||
$text.text('(error)'); // prevent from misleading users when error occurs
|
||||
el.setAttribute('data-last-value', lastValue);
|
||||
textEl.textContent = '(error)'; // prevent from misleading users when error occurs
|
||||
dropdownEl.setAttribute('data-last-value', lastValue);
|
||||
} finally {
|
||||
dropdownEl.classList.remove('is-loading');
|
||||
}
|
||||
},
|
||||
onChange(_value, text, _$choice) {
|
||||
$text.text(text); // update the text when using keyboard navigating
|
||||
},
|
||||
onHide() {
|
||||
// set to the really selected value, defer to next tick to make sure `action` has finished its work because the calling order might be onHide -> action
|
||||
// set to the really selected value, defer to next tick to make sure `action` has finished
|
||||
// its work because the calling order might be onHide -> action
|
||||
setTimeout(() => {
|
||||
const $item = $dropdown.dropdown('get item', el.getAttribute('data-last-value'));
|
||||
const $item = $(dropdownEl).dropdown('get item', dropdownEl.getAttribute('data-last-value'));
|
||||
if ($item) {
|
||||
$dropdown.dropdown('set selected', el.getAttribute('data-last-value'));
|
||||
$(dropdownEl).dropdown('set selected', dropdownEl.getAttribute('data-last-value'));
|
||||
} else {
|
||||
$text.text('(none)'); // prevent from misleading users when the access mode is undefined
|
||||
textEl.textContent = '(none)'; // prevent from misleading users when the access mode is undefined
|
||||
}
|
||||
}, 0);
|
||||
},
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export function initRepoSettingSearchTeamBox() {
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ import {
|
|||
initGlobalDropzone,
|
||||
initGlobalEnterQuickSubmit,
|
||||
initGlobalFormDirtyLeaveConfirm,
|
||||
initGlobalLinkActions,
|
||||
initGlobalDeleteButton,
|
||||
initHeadNavbarContentToggle,
|
||||
} from './features/common-global.js';
|
||||
import {initRepoTopicBar} from './features/repo-home.js';
|
||||
|
|
@ -103,7 +103,7 @@ onDomReady(() => {
|
|||
initGlobalDropzone();
|
||||
initGlobalEnterQuickSubmit();
|
||||
initGlobalFormDirtyLeaveConfirm();
|
||||
initGlobalLinkActions();
|
||||
initGlobalDeleteButton();
|
||||
|
||||
initCommonOrganization();
|
||||
initCommonIssueListQuickGoto();
|
||||
|
|
|
|||
Loading…
Reference in a new issue