[scss.global] updated BUTTONs to be more readable | [webpack.login] now works with API for CAS login
This commit is contained in:
parent
0a8a8dc802
commit
b1c6ab5a0d
|
@ -1,3 +1,12 @@
|
||||||
gstore.add('popup_click', function(){
|
gstore.add('popup_click', function(){
|
||||||
|
|
||||||
|
/* (1) Open popup */
|
||||||
window.pop = window.open('https://sso.univ-pau.fr/cas/login?service=http://ptut.com:8080/api/v/1.0/cas', '_blank', 'location=no,height=1024,width=1024,scrollbars=yes,status=no');
|
window.pop = window.open('https://sso.univ-pau.fr/cas/login?service=http://ptut.com:8080/api/v/1.0/cas', '_blank', 'location=no,height=1024,width=1024,scrollbars=yes,status=no');
|
||||||
|
|
||||||
|
/* (2) If popup closed -> abort */
|
||||||
|
window.popint = setInterval(function(){ window.pop.closed && window.cas_callback(null); }, 500);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
gstore.add('login_class', 'neutral');
|
||||||
|
gstore.add('login_error_text', '');
|
|
@ -28,14 +28,28 @@ window.pop = { closed: false };
|
||||||
|
|
||||||
window.cas_callback = function(cas_login){
|
window.cas_callback = function(cas_login){
|
||||||
|
|
||||||
|
/* (1) Wait 1ms for popup to really be closed */
|
||||||
setTimeout( function(){ if( window.pop.closed ){
|
setTimeout( function(){ if( window.pop.closed ){
|
||||||
|
|
||||||
|
/* (2) Stop interval that checks if window closed */
|
||||||
|
clearInterval(window.popint);
|
||||||
|
|
||||||
|
|
||||||
|
/* (3) If no login -> error */
|
||||||
if( cas_login === null ){
|
if( cas_login === null ){
|
||||||
|
gstore.get.login_error_text = 'Erreur de connexion. Veuillez réessayer.';
|
||||||
|
gstore.get.login_class = 'invalid';
|
||||||
|
|
||||||
// TODO: notify FAILURE
|
setTimeout(function(){ gstore.get.login_class = 'neutral'; }, 1500);
|
||||||
|
|
||||||
}else
|
/* (4) If login -> reload page */
|
||||||
document.location = '/';
|
}else{
|
||||||
|
|
||||||
|
gstore.get.login_error_text = 'Vous êtes connectés. Vous allez être redirigé.';
|
||||||
|
gstore.get.login_class = 'valid';
|
||||||
|
setTimeout(function(){ document.location = '/'; }, 1500);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
} }, 1);
|
} }, 1);
|
||||||
|
|
|
@ -115,21 +115,21 @@ input[type=submit].neutral{
|
||||||
padding: .5em 1em;
|
padding: .5em 1em;
|
||||||
|
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px dashed $form-neutral-color;
|
border: 1px solid $form-neutral-color;
|
||||||
|
|
||||||
background: $bg-color center center no-repeat;
|
background: $bg-color center center no-repeat;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
|
|
||||||
color: $form-neutral-color;
|
color: darken($form-neutral-color, 15%);
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
transition: color .2s ease-in-out,
|
transition: color .2s ease-in-out,
|
||||||
border-color .2s ease-in-out,
|
border-color .1s ease-in-out,
|
||||||
background .2s ease-in-out;
|
background .2s ease-in-out;
|
||||||
|
|
||||||
&:hover, &:focus{
|
&:hover, &:focus{
|
||||||
color: darken($form-neutral-color, 10%);
|
color: darken($form-neutral-color, 35%);
|
||||||
border-color: $primary-color;
|
border-color: $primary-color;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
|
@ -32,6 +32,42 @@ body{
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#WRAPPER.login{
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
|
||||||
|
#LOGIN_REDIRECT{
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
span{
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
margin: 1em;
|
||||||
|
|
||||||
|
color: $form-invalid-color;
|
||||||
|
|
||||||
|
&.valid{ color: $form-valid-color; }
|
||||||
|
|
||||||
|
opacity: 0;
|
||||||
|
|
||||||
|
transition: opacity .2s ease-in-out;
|
||||||
|
|
||||||
|
&.invalid, &.valid{
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
#cont404{
|
#cont404{
|
||||||
display: flex;
|
display: flex;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -72,3 +108,6 @@ body{
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,8 @@
|
||||||
|
|
||||||
|
|
||||||
<div id='LOGIN_REDIRECT'>
|
<div id='LOGIN_REDIRECT'>
|
||||||
<button class='valid' @click='gstore.popup_click'>Login button</button>
|
<button :class='gstore.login_class' @click='gstore.popup_click'>Me connecter</button>
|
||||||
|
<span :class='gstore.login_class'>{{ gstore.login_error_text }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue