diff --git a/src/includes/components/widgets.pug b/src/includes/components/widgets.pug index e88baddf9bacf9dc2b6e6a154f5d30904b9d4481..31655c23b6251f5d69fc426ac64bbff3e8ba89cd 100644 --- a/src/includes/components/widgets.pug +++ b/src/includes/components/widgets.pug @@ -42,8 +42,8 @@ sib-widget(name='cs-display-title') //Do we need generalize this widget ? sib-widget(name='cs-display-checkbox') template - label(for="instance_database_only") Search in Coopstarter database only input(type='checkbox' name="instance_database_only") + label(for="instance_database_only") Search in Coopstarter database only sib-widget(name='cs-display-related-property') template diff --git a/src/index.pug b/src/index.pug index 6bfcd89d4a39e3899d6e5a0f55f654d776d728fc..f80ce7881cce4bbd0dbfac0d0c363a322bed2dd9 100644 --- a/src/index.pug +++ b/src/index.pug @@ -27,6 +27,8 @@ html #public-dashboard(hidden).no-sidebar include includes/public/dashboard.pug + #main-loader(hidden) Loading… + sib-auth sib-auth-provider( class="sib-auth-provider" @@ -45,20 +47,25 @@ script(type='module'). } async triggerLogin() { + let loader = document.getElementById('main-loader'); + loader.removeAttribute('hidden'); await sibAuth.login(); } async update() { + let loader = document.getElementById('main-loader'); + loader.removeAttribute('hidden'); let user = await sibAuth.getUser(); let idToken = await sibAuth.getUserIdToken(); if ( !user ) { + loader.setAttribute("hidden", true); window.dispatchEvent( new CustomEvent('requestNavigation', { detail: { route: 'splash' } }) ); } user = await store.get(user); - console.log("Current user", user); + if (user && user.mentor_profile) { window.dispatchEvent( new CustomEvent('requestNavigation', { detail: { route: 'mentor-dashboard' } }) diff --git a/src/styles/index.scss b/src/styles/index.scss index 2a87cb5416e60a2dbc5ca9565f60eec8db59a218..8e478dc9e47a9ed60c8d15d81af5c1753a4550af 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -2071,6 +2071,133 @@ b, strong { } } +/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX +XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX +XXXXXXXXXXXXXXXXXXXXXXXX LOADER XXXXXXXXXXXXXXXXXXXXXXXXXXXX +XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/ + +#main-loader { + //display: none; + position: fixed; + z-index: 999; + height: 2em; + width: 2em; + overflow: show; + margin: auto; + top: 0; + left: 0; + bottom: 0; + right: 0; + } + + /* Transparent Overlay */ + #main-loader:before { + content: ''; + display: block; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0, .8)); + + background: -webkit-radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0,.8)); + } + + /* :not(:required) hides these rules from IE9 and below */ + #main-loader:not(:required) { + /* hide "loading..." text */ + font: 0/0 a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0; + } + + #main-loader:not(:required):after { + content: ''; + display: block; + font-size: 10px; + width: 1em; + height: 1em; + margin-top: -0.5em; + -webkit-animation: spinner 150ms infinite linear; + -moz-animation: spinner 150ms infinite linear; + -ms-animation: spinner 150ms infinite linear; + -o-animation: spinner 150ms infinite linear; + animation: spinner 150ms infinite linear; + border-radius: 0.5em; + -webkit-box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0; + box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0; + } + + /* Animation */ + + @-webkit-keyframes spinner { + 0% { + -webkit-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -ms-transform: rotate(0deg); + -o-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -ms-transform: rotate(360deg); + -o-transform: rotate(360deg); + transform: rotate(360deg); + } + } + @-moz-keyframes spinner { + 0% { + -webkit-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -ms-transform: rotate(0deg); + -o-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -ms-transform: rotate(360deg); + -o-transform: rotate(360deg); + transform: rotate(360deg); + } + } + @-o-keyframes spinner { + 0% { + -webkit-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -ms-transform: rotate(0deg); + -o-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -ms-transform: rotate(360deg); + -o-transform: rotate(360deg); + transform: rotate(360deg); + } + } + @keyframes spinner { + 0% { + -webkit-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -ms-transform: rotate(0deg); + -o-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -ms-transform: rotate(360deg); + -o-transform: rotate(360deg); + transform: rotate(360deg); + } + } + [hidden] { display: none !important; } \ No newline at end of file