diff --git a/webpack/data/login.js b/webpack/data/login.js index 7fd98d3..e54a387 100644 --- a/webpack/data/login.js +++ b/webpack/data/login.js @@ -1,3 +1,12 @@ 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'); + + /* (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', ''); \ No newline at end of file diff --git a/webpack/page/login.js b/webpack/page/login.js index 5544c00..c7833de 100644 --- a/webpack/page/login.js +++ b/webpack/page/login.js @@ -28,16 +28,30 @@ window.pop = { closed: false }; window.cas_callback = function(cas_login){ - setTimeout( function(){ if( window.pop.closed ){ + /* (1) Wait 1ms for popup to really be closed */ + setTimeout( function(){ if( window.pop.closed ){ - if( cas_login === null ){ - - // TODO: notify FAILURE - - }else - document.location = '/'; + /* (2) Stop interval that checks if window closed */ + clearInterval(window.popint); - } }, 1); + /* (3) If no login -> error */ + if( cas_login === null ){ + gstore.get.login_error_text = 'Erreur de connexion. Veuillez réessayer.'; + gstore.get.login_class = 'invalid'; + + setTimeout(function(){ gstore.get.login_class = 'neutral'; }, 1500); + + /* (4) If login -> reload page */ + }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); }; diff --git a/webpack/scss/global.scss b/webpack/scss/global.scss index c8243f3..c043dce 100644 --- a/webpack/scss/global.scss +++ b/webpack/scss/global.scss @@ -115,21 +115,21 @@ input[type=submit].neutral{ padding: .5em 1em; border-radius: 3px; - border: 1px dashed $form-neutral-color; + border: 1px solid $form-neutral-color; background: $bg-color center center no-repeat; text-transform: uppercase; - color: $form-neutral-color; + color: darken($form-neutral-color, 15%); cursor: pointer; transition: color .2s ease-in-out, - border-color .2s ease-in-out, + border-color .1s ease-in-out, background .2s ease-in-out; &:hover, &:focus{ - color: darken($form-neutral-color, 10%); + color: darken($form-neutral-color, 35%); border-color: $primary-color; background-color: #fff; } diff --git a/webpack/scss/layout.scss b/webpack/scss/layout.scss index e9a3938..a450118 100644 --- a/webpack/scss/layout.scss +++ b/webpack/scss/layout.scss @@ -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{ display: flex; position: fixed; @@ -72,3 +108,6 @@ body{ } } } + + + diff --git a/webpack/vue/login_wrapper.vue b/webpack/vue/login_wrapper.vue index 8649491..fdb149b 100644 --- a/webpack/vue/login_wrapper.vue +++ b/webpack/vue/login_wrapper.vue @@ -3,7 +3,8 @@