From 2e1ead8054ae0dfbff44d6d7e0de56c72cbdfcf1 Mon Sep 17 00:00:00 2001 From: BetaCat <outman99@hotmail.com> Date: Sun, 31 Mar 2019 19:58:53 +0800 Subject: [PATCH] fix: avoid multi-clicks when perform oauth2 login (#6467) --- public/js/index.js | 14 ++++++++++++++ templates/user/auth/signin_inner.tmpl | 19 +++++++++++++++---- 2 files changed, 29 insertions(+), 4 deletions(-) diff --git a/public/js/index.js b/public/js/index.js index 77b2f23370f..b5604ed82f1 100644 --- a/public/js/index.js +++ b/public/js/index.js @@ -2980,3 +2980,17 @@ function cancelCodeComment(btn) { form.closest('.comment-code-cloud').remove() } } +function onOAuthLoginClick() { + var oauthLoader = $('#oauth2-login-loader'); + var oauthNav = $('#oauth2-login-navigator'); + + oauthNav.hide(); + oauthLoader.removeClass('disabled'); + + setTimeout(function(){ + // recover previous content to let user try again + // usually redirection will be performed before this action + oauthLoader.addClass('disabled'); + oauthNav.show(); + },5000); +} diff --git a/templates/user/auth/signin_inner.tmpl b/templates/user/auth/signin_inner.tmpl index bf1cc055f45..3e67aa7b321 100644 --- a/templates/user/auth/signin_inner.tmpl +++ b/templates/user/auth/signin_inner.tmpl @@ -51,11 +51,22 @@ {{if and .OrderedOAuth2Names .OAuth2Providers}} <div class="ui attached segment"> <div class="oauth2 center"> + <div id="oauth2-login-loader" class="ui disabled centered loader"></div> <div> - <p>{{.i18n.Tr "sign_in_with"}}</p>{{range $key := .OrderedOAuth2Names}} - {{$provider := index $.OAuth2Providers $key}} - <a href="{{AppSubUrl}}/user/oauth2/{{$key}}"><img alt="{{$provider.DisplayName}}{{if eq $provider.Name "openidConnect"}} ({{$key}}){{end}}" title="{{$provider.DisplayName}}{{if eq $provider.Name "openidConnect"}} ({{$key}}){{end}}" class="{{$provider.Name}}" src="{{AppSubUrl}}{{$provider.Image}}"></a> - {{end}} + <div id="oauth2-login-navigator"> + <p>{{.i18n.Tr "sign_in_with"}}</p> + {{range $key := .OrderedOAuth2Names}} + {{$provider := index $.OAuth2Providers $key}} + <a href="{{AppSubUrl}}/user/oauth2/{{$key}}"> + <img + alt="{{$provider.DisplayName}}{{if eq $provider.Name "openidConnect"}} ({{$key}}){{end}}" + title="{{$provider.DisplayName}}{{if eq $provider.Name "openidConnect"}} ({{$key}}){{end}}" + class="{{$provider.Name}}" + src="{{AppSubUrl}}{{$provider.Image}}" + onclick="onOAuthLoginClick()" + ></a> + {{end}} + </div> </div> </div> </div>