diff --git a/srcs/requirements/svelte/api_front/src/ProfileDisplay.svelte b/srcs/requirements/svelte/api_front/src/ProfileDisplay.svelte index a3feb6c8..4561572a 100644 --- a/srcs/requirements/svelte/api_front/src/ProfileDisplay.svelte +++ b/srcs/requirements/svelte/api_front/src/ProfileDisplay.svelte @@ -38,6 +38,30 @@ }) + // Glittery Stars and such for Rank + + let index = 0, interval = 1000; + + const rand = (min, max) => + Math.floor(Math.random() * (max - min + 1)) + min; + + const animate = star => { + star.style.setProperty("--star-left", `${rand(-10, 100)}%`); + star.style.setProperty("--star-top", `${rand(-40, 80)}%`); + + star.style.animation = "none"; + star.offsetHeight; + star.style.animation = ""; + } + + // for(const star of document.getElementsByClassName("glitter-star")) { + // setTimeout(() => { + // animate(star); + + // setInterval(() => animate(star), 1000); + // }, index++ * (interval / 3)) + // } + @@ -54,7 +78,26 @@
{user.image_url}
default user icon
{user.username}
-
Rank: {rank}
+
Rank: + + + + + + + + + + + + + + + + + {rank} + +

Match Statistics

Total: {user.stats.totalGame}

@@ -67,20 +110,6 @@ \ No newline at end of file diff --git a/srcs/requirements/svelte/api_front/src/components/Header.svelte b/srcs/requirements/svelte/api_front/src/components/Header.svelte index 609c1443..08079ff0 100644 --- a/srcs/requirements/svelte/api_front/src/components/Header.svelte +++ b/srcs/requirements/svelte/api_front/src/components/Header.svelte @@ -24,7 +24,7 @@ method: 'POST', }); console.log('clicked logout header') - $loginStatus = false; + // $loginStatus = false; push('/'); }; diff --git a/srcs/requirements/svelte/api_front/src/old_unused/UserPage.svelte b/srcs/requirements/svelte/api_front/src/old_unused/UserPage.svelte index 37c63f06..98c69c2f 100644 --- a/srcs/requirements/svelte/api_front/src/old_unused/UserPage.svelte +++ b/srcs/requirements/svelte/api_front/src/old_unused/UserPage.svelte @@ -35,7 +35,7 @@ let clickedLogout = async() => { console.log('clicked logout'); await fetch('http://transcendance:8080/api/v2/auth/logout',); - $loginStatus = false; + // $loginStatus = false; // maybe use replace() ? push('/'); }; diff --git a/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js b/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js index 581e4d09..6a27cd68 100644 --- a/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js +++ b/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js @@ -2,6 +2,7 @@ import NotFound from "../NotFound.svelte"; import ProfilePage from "../ProfilePage.svelte"; import SplashPage from "../SplashPage.svelte"; import TmpTest from '../TmpTest.svelte'; +import TwoFactorAuthentication from '../TwoFactorAuthentication.svelte'; // "/article/:title": Article, // this is how you would do parameters! @@ -9,6 +10,7 @@ import TmpTest from '../TmpTest.svelte'; export const primaryRoutes = { '/': SplashPage, + '/2fa': TwoFactorAuthentication, '/profile': ProfilePage, '/profile/*': ProfilePage, '*': NotFound diff --git a/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js b/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js index d14af66e..f74d3ed4 100644 --- a/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js +++ b/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js @@ -13,4 +13,108 @@ import { writable } from "svelte/store"; // } // export const loginStatus = createLogin(); -export const loginStatus = writable(false); +// export const loginStatus = writable({ +// 42: false, +// tfa: false, +// }); + +// function createLoginStatus() { + +// //ok it really hated all this + +// // const store = writable({ +// // fortyTwo: false, +// // tfa: false, +// // }); + +// // return { +// // ...store, +// // subscribe, +// // // toggle42: () => update( l => l.fortyTwo = !l.fortyTwo ), +// // toggle42: () => store.update( fortyTwo => !fortyTwo ), +// // // toggleTFA: () => update( l => l.tfa = !l.tfa ), +// // toggleTFA: () => store.update( tfa => !tfa ), +// // isLogged: () => store.fortyTwo && store.tfa, +// // // isLogged: this.fortyTwo && this.tfa, +// // // it really doesn't like "this." +// // // isLogged: () => (this.tfa && this.fortyTwo), +// // // this. ? or (l) => l.tfa ... ? +// // } + + +// // doesn't seem to work... +// const { subscribe, update } = writable({ +// fortyTwo: false, +// tfa: false, +// }); + +// return { +// subscribe, +// // toggle42: () => update( l => l.fortyTwo = !l.fortyTwo ), +// toggle42: () => update( fortyTwo => !fortyTwo ), +// // toggleTFA: () => update( l => l.tfa = !l.tfa ), +// toggleTFA: () => update( tfa => !tfa ), +// // isLogged: () => fortyTwo && tfa, +// // isLogged: this.fortyTwo && this.tfa, +// // it really doesn't like "this." +// // isLogged: () => (this.tfa && this.fortyTwo), +// // this. ? or (l) => l.tfa ... ? +// isLogged() { +// return fortyTwo && tfa; +// }, +// } + +// // possible other way of doing this + +// // const store = writable({ +// // fortyTwo: false, +// // tfa: false, +// // }); + +// // return { +// // ...store, +// // subscribe, +// // // toggle42: () => update( l => l.fortyTwo = !l.fortyTwo ), +// // toggle42: () => store.update( l.fortyTwo => !l.fortyTwo ), +// // toggleTFA: () => store.update( l => l.tfa = !l.tfa ), +// // isLogged: store.fortyTwo && store.tfa, +// // // isLogged: () => (this.tfa && this.fortyTwo), +// // // this. ? or (l) => l.tfa ... ? +// // } + +// } + +function createLoginStatus() { + // const store = writable({ + // fortyTwo: false, + // tfa: false, + // }); + + const { subscribe, update } = writable({ + fortyTwo: false, + tfa: false, + }); + + function toggle42() { + update( (l) => { + l.fortyTwo = !l.fortyTwo; + return l; + }) + }; + + function toggleTFA() { + update( (l) => { + l.tfa = !l.tfa; + return l; + }) + }; + + function isLogged() { + // return (l) => {l.fortyTwo && l.tfa}; + return fortyTwo && tfa; + }; + + return { subscribe, update, toggle42, toggleTFA, isLogged }; +} + +export const loginStatus = createLoginStatus(); \ No newline at end of file