diff --git a/src/Firebase.js b/src/Firebase.js index 0f46104..ee0900e 100644 --- a/src/Firebase.js +++ b/src/Firebase.js @@ -39,6 +39,7 @@ async function loginWithGoogle() { const newUserRef = collection(db, "userInfo"); await setDoc(doc(newUserRef, uid_str), { "uid": uid_str, + "name": user.displayName, "coins": 0, "rooms": ["Gray"], "decorations": [] @@ -56,6 +57,8 @@ async function loginWithGoogle() { // @ts-ignore uid: doc.data().uid, // @ts-ignore + name: doc.data().name, // Add the user's name to the UserInfoStore + // @ts-ignore coins: doc.data().coins, // @ts-ignore rooms: doc.data().rooms, @@ -168,10 +171,23 @@ async function buyRoom(room, price) { } } -export { - loginWithGoogle, - logoutFromGoogle, - addActivity, - getActivities, - buyRoom -} \ No newline at end of file + +export const getGoogleUserDisplayName = () => { + const user = auth.currentUser; + if (user && user.providerData && user.providerData.length > 0) { + const providerData = user.providerData[0]; + if (providerData.providerId === "google.com") { + return providerData.displayName; + } + } + return null; + }; + + export { + loginWithGoogle, + logoutFromGoogle, + addActivity, + getActivities, + buyRoom, + auth + }; \ No newline at end of file diff --git a/src/routes/Homepage.svelte b/src/routes/Homepage.svelte index 46ee6b8..569212e 100644 --- a/src/routes/Homepage.svelte +++ b/src/routes/Homepage.svelte @@ -3,10 +3,12 @@ import SessionStore from '../SessionStore'; import InSession from './components/InSession.svelte'; import ModalManager from './ModalManager.svelte'; - import { logoutFromGoogle } from '../Firebase'; + import { logoutFromGoogle, getGoogleUserDisplayName } from '../Firebase'; import UserInfoStore from '../UserInfoStore'; import { onMount } from 'svelte'; + + /** * @type {string} */ @@ -45,6 +47,7 @@ sessionActivity: "" }); }; + const displayName = getGoogleUserDisplayName(); const logout = () => { SessionStore.set({ @@ -78,6 +81,17 @@ } } } + + const profileModal = () => { + SessionStore.set({ + inSession: $SessionStore.inSession, + sessionLength: $SessionStore.sessionLength, + modalType: "profile", + counter: $SessionStore.counter+1, + sessionActivity: $SessionStore.sessionActivity + }); + }; + -logout +logout {#if $SessionStore.inSession} {:else}
+
@@ -199,7 +214,8 @@ coin-icon
{ $UserInfoStore.coins }
- + +
diff --git a/src/routes/ModalManager.svelte b/src/routes/ModalManager.svelte index 84a7632..e2350f7 100644 --- a/src/routes/ModalManager.svelte +++ b/src/routes/ModalManager.svelte @@ -6,6 +6,8 @@ import CustomizationModal from './components/CustomizationModal.svelte'; import { writable } from 'svelte/store'; import Modal from 'svelte-simple-modal'; + import ProfileModal from './components/ProfileModal.svelte'; + const modal = writable(null); let currModal = ""; @@ -32,6 +34,11 @@ // @ts-ignore modal.set(CustomizationModal); } + if ($SessionStore.modalType == "profile") { + // @ts-ignore + modal.set(ProfileModal); + } + currModal = $SessionStore.modalType; counter = $SessionStore.counter; } diff --git a/src/routes/components/AboutModal.svelte b/src/routes/components/AboutModal.svelte new file mode 100644 index 0000000..e69de29 diff --git a/src/routes/components/ProfileModal.svelte b/src/routes/components/ProfileModal.svelte new file mode 100644 index 0000000..f9d5764 --- /dev/null +++ b/src/routes/components/ProfileModal.svelte @@ -0,0 +1,48 @@ + + + + + + \ No newline at end of file