summaryrefslogtreecommitdiffstats
path: root/client/components
diff options
context:
space:
mode:
Diffstat (limited to 'client/components')
-rw-r--r--client/components/main/layouts.jade37
-rw-r--r--client/components/main/layouts.js27
-rw-r--r--client/components/main/layouts.styl104
3 files changed, 145 insertions, 23 deletions
diff --git a/client/components/main/layouts.jade b/client/components/main/layouts.jade
index 7fd0492e..9543c5c5 100644
--- a/client/components/main/layouts.jade
+++ b/client/components/main/layouts.jade
@@ -13,20 +13,20 @@ head
template(name="userFormsLayout")
section.auth-layout
- h1
- br
- br
section.auth-dialog
- +Template.dynamic(template=content)
- if currentSetting.displayAuthenticationMethod
- +connectionMethod(authenticationMethod=currentSetting.defaultAuthenticationMethod)
- div.at-form-lang
- select.select-lang.js-userform-set-language
- each languages
- if isCurrentLanguage
- option(value="{{tag}}" selected="selected") {{name}}
- else
- option(value="{{tag}}") {{name}}
+ if isLoading
+ +loader
+ else
+ +Template.dynamic(template=content)
+ if currentSetting.displayAuthenticationMethod
+ +connectionMethod(authenticationMethod=currentSetting.defaultAuthenticationMethod)
+ div.at-form-lang
+ select.select-lang.js-userform-set-language
+ each languages
+ if isCurrentLanguage
+ option(value="{{tag}}" selected="selected") {{name}}
+ else
+ option(value="{{tag}}") {{name}}
template(name="defaultLayout")
+header
@@ -59,3 +59,14 @@ template(name="message")
unless currentUser
with(pathFor route='atSignIn')
p {{{_ 'page-maybe-private' this}}}
+
+template(name="loader")
+ h1.loadingText {{_ 'loading'}}
+ .lds-roller
+ div
+ div
+ div
+ div
+ div
+ div
+ div
diff --git a/client/components/main/layouts.js b/client/components/main/layouts.js
index 6f7c914a..9d2e7ae2 100644
--- a/client/components/main/layouts.js
+++ b/client/components/main/layouts.js
@@ -23,6 +23,7 @@ const validator = {
Template.userFormsLayout.onCreated(function() {
const instance = this;
instance.currentSetting = new ReactiveVar();
+ instance.isLoading = new ReactiveVar(false);
Meteor.subscribe('setting', {
onReady() {
@@ -47,6 +48,10 @@ Template.userFormsLayout.helpers({
return Template.instance().currentSetting.get();
},
+ isLoading() {
+ return Template.instance().isLoading.get();
+ },
+
afterBodyStart() {
return currentSetting.customHTMLafterBodyStart;
},
@@ -89,7 +94,11 @@ Template.userFormsLayout.events({
},
'click #at-btn'(event, instance) {
if (FlowRouter.getRouteName() === 'atSignIn') {
- authentication(event, instance);
+ instance.isLoading.set(true);
+ authentication(event, instance)
+ .then(() => {
+ instance.isLoading.set(false);
+ });
}
},
});
@@ -116,19 +125,21 @@ async function authentication(event, instance) {
switch (result) {
case 'ldap':
- Meteor.loginWithLDAP(match, password, function() {
- FlowRouter.go('/');
+ return new Promise((resolve) => {
+ Meteor.loginWithLDAP(match, password, function() {
+ resolve(FlowRouter.go('/'));
+ });
});
- break;
case 'cas':
- Meteor.loginWithCas(function() {
- FlowRouter.go('/');
+ return new Promise((resolve) => {
+ Meteor.loginWithCas(match, password, function() {
+ resolve(FlowRouter.go('/'));
+ });
});
- break;
default:
- break;
+ return;
}
}
diff --git a/client/components/main/layouts.styl b/client/components/main/layouts.styl
index edbf759b..46ee720c 100644
--- a/client/components/main/layouts.styl
+++ b/client/components/main/layouts.styl
@@ -61,7 +61,7 @@ body
display: block
float: right
font-size: 24px
-
+
.modal-content-wide
width: 800px
min-height: 0px
@@ -290,7 +290,7 @@ kbd
// Implement a thiner close icon as suggested in
// https://github.com/FortAwesome/Font-Awesome/issues/1540#issuecomment-68689950
.fa.fa-times-thin:before
- content: '\00d7';
+ content: '\00d7'
.fa.fa-globe.colorful, .fa.fa-bell.colorful
color: #4caf50
@@ -399,3 +399,103 @@ a
height: 37px
margin: 8px 10px 0 0
width: 50px
+
+.select-authentication
+ width: 100%
+
+.auth-layout
+ display: flex
+ flex-direction: column
+ align-items: center
+ justify-content: center
+ height: 100%
+
+ .auth-dialog
+ margin: 0 !important
+
+.loadingText
+ text-align: center
+
+.lds-roller
+ display: block
+ margin: auto
+ position: relative
+ width: 64px
+ height: 64px
+
+ div
+ animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite
+ transform-origin: 32px 32px
+
+ div:after
+ content: " "
+ display: block
+ position: absolute
+ width: 6px
+ height: 6px
+ border-radius: 50%
+ background: #dedede
+ margin: -3px 0 0 -3px
+
+ div:nth-child(1)
+ animation-delay: -0.036s
+
+ div:nth-child(1):after
+ top: 50px
+ left: 50px
+
+ div:nth-child(2)
+ animation-delay: -0.072s
+
+ div:nth-child(2):after
+ top: 54px
+ left: 45px
+
+ div:nth-child(3)
+ animation-delay: -0.108s
+
+ div:nth-child(3):after
+ top: 57px
+ left: 39px
+
+ div:nth-child(4)
+ animation-delay: -0.144s
+
+ div:nth-child(4):after
+ top: 58px
+ left: 32px
+
+ div:nth-child(5)
+ animation-delay: -0.18s
+
+ div:nth-child(5):after
+ top: 57px
+ left: 25px
+
+ div:nth-child(6)
+ animation-delay: -0.216s
+
+ div:nth-child(6):after
+ top: 54px
+ left: 19px
+
+ div:nth-child(7)
+ animation-delay: -0.252s
+
+ div:nth-child(7):after
+ top: 50px
+ left: 14px
+
+ div:nth-child(8)
+ animation-delay: -0.288s
+
+ div:nth-child(8):after
+ top: 45px
+ left: 10px
+
+@keyframes lds-roller
+ 0%
+ transform: rotate(0deg)
+
+ 100%
+ transform: rotate(360deg)