diff options
| -rw-r--r-- | templates/admin/user/edit.tmpl | 2 | ||||
| -rw-r--r-- | templates/base/head_script.tmpl | 12 | ||||
| -rw-r--r-- | templates/org/settings/options.tmpl | 2 | ||||
| -rw-r--r-- | templates/org/team/members.tmpl | 10 | ||||
| -rw-r--r-- | templates/org/team/repositories.tmpl | 52 | ||||
| -rw-r--r-- | templates/repo/branch/list.tmpl | 2 | ||||
| -rw-r--r-- | templates/repo/settings/options.tmpl | 2 | ||||
| -rw-r--r-- | templates/user/settings/profile.tmpl | 2 | ||||
| -rw-r--r-- | tests/integration/branches_test.go | 2 | ||||
| -rw-r--r-- | web_src/css/org.css | 23 | ||||
| -rw-r--r-- | web_src/js/features/common-global.js | 134 |
11 files changed, 86 insertions, 157 deletions
diff --git a/templates/admin/user/edit.tmpl b/templates/admin/user/edit.tmpl index 4e982234de..63703d7837 100644 --- a/templates/admin/user/edit.tmpl +++ b/templates/admin/user/edit.tmpl @@ -186,7 +186,7 @@ <div class="field"> <button class="ui green button">{{$.locale.Tr "settings.update_avatar"}}</button> - <a class="ui red button delete-post" data-request-url="{{.Link}}/avatar/delete" data-done-url="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</a>{{/* TODO: Convert links without href to buttons for a11y */}} + <button class="ui red button link-action" data-url="{{.Link}}/avatar/delete" data-redirect="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</button> </div> </form> </div> diff --git a/templates/base/head_script.tmpl b/templates/base/head_script.tmpl index 4e1dffa474..b6475a83cd 100644 --- a/templates/base/head_script.tmpl +++ b/templates/base/head_script.tmpl @@ -32,11 +32,13 @@ If you introduce mistakes in it, Gitea JavaScript code wouldn't run correctly. mermaidMaxSourceCharacters: {{MermaidMaxSourceCharacters}}, {{/* this global i18n object should only contain general texts. for specialized texts, it should be provided inside the related modules by: (1) API response (2) HTML data-attribute (3) PageData */}} i18n: { - copy_success: '{{.locale.Tr "copy_success"}}', - copy_error: '{{.locale.Tr "copy_error"}}', - error_occurred: '{{.locale.Tr "error.occurred"}}', - network_error: '{{.locale.Tr "error.network_error"}}', - remove_label_str: '{{.locale.Tr "remove_label_str"}}', + copy_success: {{.locale.Tr "copy_success"}}, + copy_error: {{.locale.Tr "copy_error"}}, + error_occurred: {{.locale.Tr "error.occurred"}}, + network_error: {{.locale.Tr "error.network_error"}}, + remove_label_str: {{.locale.Tr "remove_label_str"}}, + modal_confirm: {{.locale.Tr "modal.confirm"}}, + modal_cancel: {{.locale.Tr "modal.cancel"}}, }, }; {{/* in case some pages don't render the pageData, we make sure it is an object to prevent null access */}} diff --git a/templates/org/settings/options.tmpl b/templates/org/settings/options.tmpl index 21b14200ff..12a24bff08 100644 --- a/templates/org/settings/options.tmpl +++ b/templates/org/settings/options.tmpl @@ -90,7 +90,7 @@ <div class="field"> <button class="ui green button">{{$.locale.Tr "settings.update_avatar"}}</button> - <a class="ui red button delete-post" data-request-url="{{.Link}}/avatar/delete" data-done-url="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</a> + <button class="ui red button link-action" data-url="{{.Link}}/avatar/delete" data-redirect="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</button> </div> </form> </div> diff --git a/templates/org/team/members.tmpl b/templates/org/team/members.tmpl index f1ccbc0124..6bd258955d 100644 --- a/templates/org/team/members.tmpl +++ b/templates/org/team/members.tmpl @@ -9,14 +9,12 @@ {{template "org/team/navbar" .}} {{if .IsOrganizationOwner}} <div class="ui attached segment"> - <form class="ui form ignore-dirty" id="add-member-form" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/add" method="post"> + <form class="ui form ignore-dirty gt-df gt-fw gt-gap-3" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/add" method="post"> {{.CsrfTokenHtml}} <input type="hidden" name="uid" value="{{.SignedUser.ID}}"> - <div class="inline field ui left"> - <div id="search-user-box" class="ui search"{{if .IsEmailInviteEnabled}} data-allow-email="true" data-allow-email-description="{{.locale.Tr "org.teams.invite_team_member" $.Team.Name}}"{{end}}> - <div class="ui input"> - <input class="prompt" name="uname" placeholder="{{.locale.Tr "repo.settings.search_user_placeholder"}}" autocomplete="off" required> - </div> + <div id="search-user-box" class="ui search gt-mr-3"{{if .IsEmailInviteEnabled}} data-allow-email="true" data-allow-email-description="{{.locale.Tr "org.teams.invite_team_member" $.Team.Name}}"{{end}}> + <div class="ui input"> + <input class="prompt" name="uname" placeholder="{{.locale.Tr "repo.settings.search_user_placeholder"}}" autocomplete="off" required> </div> </div> <button class="ui green button">{{.locale.Tr "org.teams.add_team_member"}}</button> diff --git a/templates/org/team/repositories.tmpl b/templates/org/team/repositories.tmpl index 9263caf48c..83e238016a 100644 --- a/templates/org/team/repositories.tmpl +++ b/templates/org/team/repositories.tmpl @@ -9,25 +9,19 @@ {{template "org/team/navbar" .}} {{$canAddRemove := and $.IsOrganizationOwner (not $.Team.IncludesAllRepositories)}} {{if $canAddRemove}} - <div class="ui attached segment" id="repo-top-segment"> - <div class="inline ui field left"> - <form class="ui form ignore-dirty" id="add-repo-form" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/add" method="post"> - {{.CsrfTokenHtml}} - <div class="inline field ui left"> - <div id="search-repo-box" data-uid="{{.Org.ID}}" class="ui search"> - <div class="ui input"> - <input class="prompt" name="repo_name" placeholder="{{.locale.Tr "org.teams.search_repo_placeholder"}}" autocomplete="off" required> - </div> - </div> + <div class="ui attached segment gt-df gt-fw gt-gap-3"> + <form class="ui form ignore-dirty gt-f1 gt-dif" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/add" method="post"> + {{.CsrfTokenHtml}} + <div id="search-repo-box" data-uid="{{.Org.ID}}" class="ui search"> + <div class="ui input"> + <input class="prompt" name="repo_name" placeholder="{{.locale.Tr "org.teams.search_repo_placeholder"}}" autocomplete="off" required> </div> - <button class="ui green button">{{.locale.Tr "add"}}</button> - </form> - </div> - <div class="inline ui field right"> - <form class="ui form" id="repo-multiple-form" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/repositories" method="post"> - <button class="ui green button add-all-button" data-modal-id="org-team-add-all-repo" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/addall">{{.locale.Tr "add_all"}}</button> - <button class="ui red button delete-button" data-modal-id="org-team-remove-all-repo" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/removeall">{{.locale.Tr "remove_all"}}</button> - </form> + </div> + <button class="ui green button gt-ml-3">{{.locale.Tr "add"}}</button> + </form> + <div class="gt-dib"> + <button class="ui green button link-action" data-modal-confirm="{{.locale.Tr "org.teams.add_all_repos_desc"}}" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/addall">{{.locale.Tr "add_all"}}</button> + <button class="ui red button link-action" data-modal-confirm="{{.locale.Tr "org.teams.remove_all_repos_desc"}}" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/removeall">{{.locale.Tr "remove_all"}}</button> </div> </div> {{end}} @@ -64,26 +58,4 @@ </div> </div> -<div class="ui g-modal-confirm delete modal" id="org-team-remove-all-repo"> - <div class="header"> - {{svg "octicon-trash"}} - {{.locale.Tr "org.teams.remove_all_repos_title"}} - </div> - <div class="content"> - <p>{{.locale.Tr "org.teams.remove_all_repos_desc"}}</p> - </div> - {{template "base/modal_actions_confirm" .}} -</div> - -<div class="ui g-modal-confirm addall modal" id="org-team-add-all-repo"> - <div class="header"> - {{svg "octicon-globe"}} - {{.locale.Tr "org.teams.add_all_repos_title"}} - </div> - <div class="content"> - <p>{{.locale.Tr "org.teams.add_all_repos_desc"}}</p> - </div> - {{template "base/modal_actions_confirm" .}} -</div> - {{template "base/footer" .}} diff --git a/templates/repo/branch/list.tmpl b/templates/repo/branch/list.tmpl index 8617bcafaf..d68feb43b7 100644 --- a/templates/repo/branch/list.tmpl +++ b/templates/repo/branch/list.tmpl @@ -165,7 +165,7 @@ {{end}} {{if and $.IsWriter (not $.IsMirror) (not $.Repository.IsArchived) (not .IsProtected)}} {{if .IsDeleted}} - <button class="btn interact-bg gt-p-3 undo-button" data-url="{{$.Link}}/restore?branch_id={{.DeletedBranch.ID}}&name={{.DeletedBranch.Name}}&page={{$.Page.Paginater.Current}}" data-tooltip-content="{{$.locale.Tr "repo.branch.restore" (.Name)}}"> + <button class="btn interact-bg gt-p-3 link-action restore-branch-button" data-url="{{$.Link}}/restore?branch_id={{.DeletedBranch.ID}}&name={{.DeletedBranch.Name}}&page={{$.Page.Paginater.Current}}" data-tooltip-content="{{$.locale.Tr "repo.branch.restore" (.Name)}}"> <span class="text blue"> {{svg "octicon-reply"}} </span> diff --git a/templates/repo/settings/options.tmpl b/templates/repo/settings/options.tmpl index 1e940c581b..a1fe1ad5af 100644 --- a/templates/repo/settings/options.tmpl +++ b/templates/repo/settings/options.tmpl @@ -61,7 +61,7 @@ <div class="field"> <button class="ui green button">{{$.locale.Tr "settings.update_avatar"}}</button> - <a class="ui red button delete-post" data-request-url="{{.Link}}/avatar/delete" data-done-url="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</a> + <button class="ui red button link-action" data-url="{{.Link}}/avatar/delete" data-redirect="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</button> </div> </form> diff --git a/templates/user/settings/profile.tmpl b/templates/user/settings/profile.tmpl index a581b13bd5..350f8a0275 100644 --- a/templates/user/settings/profile.tmpl +++ b/templates/user/settings/profile.tmpl @@ -125,7 +125,7 @@ <div class="field"> <button class="ui green button">{{$.locale.Tr "settings.update_avatar"}}</button> - <button class="ui red button delete-post" data-request-url="{{.Link}}/avatar/delete" data-done-url="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</button> + <button class="ui red button link-action" data-url="{{.Link}}/avatar/delete" data-redirect="{{.Link}}">{{$.locale.Tr "settings.delete_current_avatar"}}</button> </div> </form> </div> diff --git a/tests/integration/branches_test.go b/tests/integration/branches_test.go index efb3798bd7..99d7eef706 100644 --- a/tests/integration/branches_test.go +++ b/tests/integration/branches_test.go @@ -34,7 +34,7 @@ func TestDeleteBranch(t *testing.T) { func TestUndoDeleteBranch(t *testing.T) { onGiteaRun(t, func(t *testing.T, u *url.URL) { deleteBranch(t) - htmlDoc, name := branchAction(t, ".undo-button") + htmlDoc, name := branchAction(t, ".restore-branch-button") assert.Contains(t, htmlDoc.doc.Find(".ui.positive.message").Text(), translation.NewLocale("en-US").Tr("repo.branch.restore_success", name), diff --git a/web_src/css/org.css b/web_src/css/org.css index 7b73d8e572..400f4fbbd9 100644 --- a/web_src/css/org.css +++ b/web_src/css/org.css @@ -205,29 +205,6 @@ margin: 0; } -.organization.teams #add-repo-form input, -.organization.teams #repo-multiple-form input, -.organization.teams #add-member-form input { - margin-left: 0; -} - -.organization.teams #add-repo-form .ui.button, -.organization.teams #repo-multiple-form .ui.button, -.organization.teams #add-member-form .ui.button { - margin-left: 5px; - margin-top: -3px; -} - -.organization.teams #repo-top-segment { - height: 60px; -} - -@media (max-width: 767.98px) { - .organization.teams #repo-top-segment { - height: 100px; - } -} - .org-team-navbar .active.item { background: var(--color-box-body) !important; } diff --git a/web_src/js/features/common-global.js b/web_src/js/features/common-global.js index 46a80beb51..b1d3fa22d8 100644 --- a/web_src/js/features/common-global.js +++ b/web_src/js/features/common-global.js @@ -8,7 +8,7 @@ import {svg} from '../svg.js'; import {hideElem, showElem, toggleElem} from '../utils/dom.js'; import {htmlEscape} from 'escape-goat'; -const {appUrl, csrfToken} = window.config; +const {appUrl, csrfToken, i18n} = window.config; export function initGlobalFormDirtyLeaveConfirm() { // Warn users that try to leave a page after entering data into a form. @@ -172,6 +172,62 @@ export function initGlobalDropzone() { } } +function linkAction(e) { + e.preventDefault(); + + // A "link-action" can post AJAX request to its "data-url" + // Then the browser is redirect to: the "redirect" in response, or "data-redirect" attribute, or current URL by reloading. + // If the "link-action" has "data-modal-confirm(-html)" attribute, a confirm modal dialog will be shown before taking action. + + const $this = $(e.target); + const redirect = $this.attr('data-redirect'); + + const request = () => { + $this.prop('disabled', true); + $.post($this.attr('data-url'), { + _csrf: csrfToken + }).done((data) => { + if (data && data.redirect) { + window.location.href = data.redirect; + } else if (redirect) { + window.location.href = redirect; + } else { + window.location.reload(); + } + }).always(() => { + $this.prop('disabled', false); + }); + }; + + const modalConfirmHtml = htmlEscape($this.attr('data-modal-confirm') || ''); + if (!modalConfirmHtml) { + request(); + return; + } + + const okButtonColor = $this.hasClass('red') || $this.hasClass('yellow') || $this.hasClass('orange') || $this.hasClass('negative') ? 'orange' : 'green'; + + const $modal = $(` +<div class="ui g-modal-confirm modal"> + <div class="content">${modalConfirmHtml}</div> + <div class="actions"> + <button class="ui basic cancel button">${svg('octicon-x')} ${i18n.modal_cancel}</button> + <button class="ui ${okButtonColor} ok button">${svg('octicon-check')} ${i18n.modal_confirm}</button> + </div> +</div> +`); + + $modal.appendTo(document.body); + $modal.modal({ + onApprove() { + request(); + }, + onHidden() { + $modal.remove(); + }, + }).modal('show'); +} + export function initGlobalLinkActions() { function showDeletePopup(e) { e.preventDefault(); @@ -217,75 +273,9 @@ export function initGlobalLinkActions() { }).modal('show'); } - function showAddAllPopup(e) { - e.preventDefault(); - const $this = $(this); - let filter = ''; - if ($this.attr('data-modal-id')) { - filter += `#${$this.attr('data-modal-id')}`; - } - - const dialog = $(`.addall.modal${filter}`); - dialog.find('.name').text($this.data('name')); - - dialog.modal({ - closable: false, - onApprove() { - if ($this.data('type') === 'form') { - $($this.data('form')).trigger('submit'); - return; - } - - $.post($this.data('url'), { - _csrf: csrfToken, - id: $this.data('id') - }).done((data) => { - window.location.href = data.redirect; - }); - } - }).modal('show'); - } - - function linkAction(e) { - e.preventDefault(); - const $this = $(this); - const redirect = $this.data('redirect'); - $this.prop('disabled', true); - $.post($this.data('url'), { - _csrf: csrfToken - }).done((data) => { - if (data.redirect) { - window.location.href = data.redirect; - } else if (redirect) { - window.location.href = redirect; - } else { - window.location.reload(); - } - }).always(() => { - $this.prop('disabled', false); - }); - } - // Helpers. $('.delete-button').on('click', showDeletePopup); $('.link-action').on('click', linkAction); - - // FIXME: this function is only used once, and not common, not well designed. should be refactored later - $('.add-all-button').on('click', showAddAllPopup); - - // FIXME: this is only used once, and should be replace with `link-action` instead - $('.undo-button').on('click', function () { - const $this = $(this); - $this.prop('disabled', true); - $.post($this.data('url'), { - _csrf: csrfToken, - id: $this.data('id') - }).done((data) => { - window.location.href = data.redirect; - }).always(() => { - $this.prop('disabled', false); - }); - }); } export function initGlobalButtons() { @@ -346,16 +336,6 @@ export function initGlobalButtons() { initCompColorPicker(); } }); - - $('.delete-post.button').on('click', function (e) { - e.preventDefault(); - const $this = $(this); - $.post($this.attr('data-request-url'), { - _csrf: csrfToken - }).done(() => { - window.location.href = $this.attr('data-done-url'); - }); - }); } /** |