Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitad204f9

Browse files
Refactor buttons to use new init framework (#33774)
Make buttons to use new init framework* "js-toggle-commit-body"* "show-panel/hide-panel/show-modal"* "copy-content"---------Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
1 parentf0f1737 commitad204f9

File tree

6 files changed

+30
-28
lines changed

6 files changed

+30
-28
lines changed

‎templates/repo/commits_list.tmpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
{{end}}
4949
</span>
5050
{{if IsMultilineCommitMessage .Message}}
51-
<button class="ui buttonjs-toggle-commit-bodyellipsis-button" aria-expanded="false">...</button>
51+
<button class="ui button ellipsis-button" aria-expanded="false" data-global-click="onRepoEllipsisButtonClick">...</button>
5252
{{end}}
5353
{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses}}
5454
{{if IsMultilineCommitMessage .Message}}

‎templates/repo/latest_commit.tmpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
{{$commitLink:= printf "%s/commit/%s" .RepoLink (PathEscape .LatestCommit.ID.String)}}
2424
<span class="grey commit-summary" title="{{.LatestCommit.Summary}}"><span class="message-wrapper">{{ctx.RenderUtils.RenderCommitMessageLinkSubject .LatestCommit.Message $commitLink ($.Repository.ComposeMetas ctx)}}</span>
2525
{{if IsMultilineCommitMessage .LatestCommit.Message}}
26-
<button class="ui buttonjs-toggle-commit-bodyellipsis-button" aria-expanded="false">...</button>
26+
<button class="ui button ellipsis-button" aria-expanded="false" data-global-click="onRepoEllipsisButtonClick">...</button>
2727
<pre class="commit-body tw-hidden">{{ctx.RenderUtils.RenderCommitBody .LatestCommit.Message ($.Repository.ComposeMetas ctx)}}</pre>
2828
{{end}}
2929
</span>

‎templates/repo/view_file.tmpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
{{end}}
5656
</div>
5757
<a download class="btn-octicon" data-tooltip-content="{{ctx.Locale.Tr "repo.download_file"}}" href="{{$.RawFileLink}}">{{svg "octicon-download"}}</a>
58-
<aid="copy-content"class="btn-octicon {{if not .CanCopyContent}} disabled{{end}}"{{if or .IsImageFile (and .HasSourceRenderedToggle (not .IsDisplayingSource))}} data-link="{{$.RawFileLink}}"{{end}} data-tooltip-content="{{if .CanCopyContent}}{{ctx.Locale.Tr "copy_content"}}{{else}}{{ctx.Locale.Tr "copy_type_unsupported"}}{{end}}">{{svg "octicon-copy"}}</a>
58+
<a class="btn-octicon {{if not .CanCopyContent}} disabled{{end}}" data-global-click="onCopyContentButtonClick"{{if or .IsImageFile (and .HasSourceRenderedToggle (not .IsDisplayingSource))}} data-link="{{$.RawFileLink}}"{{end}} data-tooltip-content="{{if .CanCopyContent}}{{ctx.Locale.Tr "copy_content"}}{{else}}{{ctx.Locale.Tr "copy_type_unsupported"}}{{end}}">{{svg "octicon-copy"}}</a>
5959
{{if .EnableFeed}}
6060
<a class="btn-octicon" href="{{$.RepoLink}}/rss/{{$.RefTypeNameSubURL}}/{{PathEscapeSegments .TreePath}}" data-tooltip-content="{{ctx.Locale.Tr "rss_feed"}}">
6161
{{svg "octicon-rss"}}

‎web_src/js/features/common-button.ts‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import{POST}from'../modules/fetch.ts';
2-
import{addDelegatedEventListener,hideElem,queryElems,showElem,toggleElem}from'../utils/dom.ts';
2+
import{addDelegatedEventListener,hideElem,showElem,toggleElem}from'../utils/dom.ts';
33
import{fomanticQuery}from'../modules/fomantic/base.ts';
44
import{camelize}from'vue';
55

@@ -74,10 +74,9 @@ export function initGlobalDeleteButton(): void {
7474
}
7575
}
7676

77-
functiononShowPanelClick(e:MouseEvent){
77+
functiononShowPanelClick(el:HTMLElement,e:MouseEvent){
7878
// a '.show-panel' element can show a panel, by `data-panel="selector"`
7979
// if it has "toggle" class, it toggles the panel
80-
constel=e.currentTargetasHTMLElement;
8180
e.preventDefault();
8281
constsel=el.getAttribute('data-panel');
8382
if(el.classList.contains('toggle')){
@@ -87,9 +86,8 @@ function onShowPanelClick(e: MouseEvent) {
8786
}
8887
}
8988

90-
functiononHidePanelClick(e:MouseEvent){
89+
functiononHidePanelClick(el:HTMLElement,e:MouseEvent){
9190
// a `.hide-panel` element can hide a panel, by `data-panel="selector"` or `data-panel-closest="selector"`
92-
constel=e.currentTargetasHTMLElement;
9391
e.preventDefault();
9492
letsel=el.getAttribute('data-panel');
9593
if(sel){
@@ -104,15 +102,14 @@ function onHidePanelClick(e: MouseEvent) {
104102
thrownewError('no panel to hide');// should never happen, otherwise there is a bug in code
105103
}
106104

107-
functiononShowModalClick(e:MouseEvent){
105+
functiononShowModalClick(el:HTMLElement,e:MouseEvent){
108106
// A ".show-modal" button will show a modal dialog defined by its "data-modal" attribute.
109107
// Each "data-modal-{target}" attribute will be filled to target element's value or text-content.
110108
// * First, try to query '#target'
111109
// * Then, try to query '[name=target]'
112110
// * Then, try to query '.target'
113111
// * Then, try to query 'target' as HTML tag
114112
// If there is a ".{attr}" part like "data-modal-form.action", then the form's "action" attribute will be set.
115-
constel=e.currentTargetasHTMLElement;
116113
e.preventDefault();
117114
constmodalSelector=el.getAttribute('data-modal');
118115
constelModal=document.querySelector(modalSelector);
@@ -160,7 +157,15 @@ export function initGlobalButtons(): void {
160157
// There are a few cancel buttons in non-modal forms, and there are some dynamically created forms (eg: the "Edit Issue Content")
161158
addDelegatedEventListener(document,'click','form button.ui.cancel.button',(_/* el */,e)=>e.preventDefault());
162159

163-
queryElems(document,'.show-panel',(el)=>el.addEventListener('click',onShowPanelClick));
164-
queryElems(document,'.hide-panel',(el)=>el.addEventListener('click',onHidePanelClick));
165-
queryElems(document,'.show-modal',(el)=>el.addEventListener('click',onShowModalClick));
160+
// Ideally these "button" events should be handled by registerGlobalEventFunc
161+
// Refactoring would involve too many changes, so at the moment, just use the global event listener.
162+
addDelegatedEventListener(document,'click','.show-panel, .hide-panel, .show-modal',(el,e:MouseEvent)=>{
163+
if(el.classList.contains('show-panel')){
164+
onShowPanelClick(el,e);
165+
}elseif(el.classList.contains('hide-panel')){
166+
onHidePanelClick(el,e);
167+
}elseif(el.classList.contains('show-modal')){
168+
onShowModalClick(el,e);
169+
}
170+
});
166171
}

‎web_src/js/features/copycontent.ts‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,21 +2,19 @@ import {clippie} from 'clippie';
22
import{showTemporaryTooltip}from'../modules/tippy.ts';
33
import{convertImage}from'../utils.ts';
44
import{GET}from'../modules/fetch.ts';
5+
import{registerGlobalEventFunc}from'../modules/observer.ts';
56

67
const{i18n}=window.config;
78

89
exportfunctioninitCopyContent(){
9-
constbtn=document.querySelector('#copy-content');
10-
if(!btn||btn.classList.contains('disabled'))return;
11-
12-
btn.addEventListener('click',async()=>{
13-
if(btn.classList.contains('is-loading'))return;
10+
registerGlobalEventFunc('click','onCopyContentButtonClick',async(btn:HTMLInputElement)=>{
11+
if(btn.classList.contains('disabled')||btn.classList.contains('is-loading'))return;
1412
letcontent;
1513
letisRasterImage=false;
1614
constlink=btn.getAttribute('data-link');
1715

1816
// when data-link is present, we perform a fetch. this is either because
19-
// the text to copy is not in the DOM or it is an image which should be
17+
// the text to copy is not in the DOM, or it is an image which should be
2018
// fetched to copy in full resolution
2119
if(link){
2220
btn.classList.add('is-loading','loading-icon-2px');
@@ -40,7 +38,7 @@ export function initCopyContent() {
4038
content=Array.from(lineEls,(el)=>el.textContent).join('');
4139
}
4240

43-
// try copy original first, if that fails and it's an image, convert it to png
41+
// try copy original first, if that fails, and it's an image, convert it to png
4442
constsuccess=awaitclippie(content);
4543
if(success){
4644
showTemporaryTooltip(btn,i18n.copy_success);

‎web_src/js/features/repo-commit.ts‎

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
import{createTippy}from'../modules/tippy.ts';
22
import{toggleElem}from'../utils/dom.ts';
3+
import{registerGlobalEventFunc}from'../modules/observer.ts';
34

45
exportfunctioninitRepoEllipsisButton(){
5-
for(constbuttonofdocument.querySelectorAll<HTMLButtonElement>('.js-toggle-commit-body')){
6-
button.addEventListener('click',function(e){
7-
e.preventDefault();
8-
constexpanded=this.getAttribute('aria-expanded')==='true';
9-
toggleElem(this.parentElement.querySelector('.commit-body'));
10-
this.setAttribute('aria-expanded',String(!expanded));
11-
});
12-
}
6+
registerGlobalEventFunc('click','onRepoEllipsisButtonClick',async(el:HTMLInputElement,e:Event)=>{
7+
e.preventDefault();
8+
constexpanded=el.getAttribute('aria-expanded')==='true';
9+
toggleElem(el.parentElement.querySelector('.commit-body'));
10+
el.setAttribute('aria-expanded',String(!expanded));
11+
});
1312
}
1413

1514
exportfunctioninitCommitStatuses(){

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp