-
-
Notifications
You must be signed in to change notification settings - Fork 20
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #55 from seanmorley15/development
Development
- Loading branch information
Showing
11 changed files
with
681 additions
and
84 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,169 @@ | ||
| <script lang="ts"> | ||
| import { enhance } from "$app/forms"; | ||
| import { visitCount } from "$lib/utils/stores/visitCountStore"; | ||
| import { goto } from "$app/navigation"; | ||
| import type { DatabaseUser } from "$lib/server/auth"; | ||
| export let user: any; | ||
| import UserAvatar from "./UserAvatar.svelte"; | ||
| import { onMount } from "svelte"; | ||
| import InfoModal from "./InfoModal.svelte"; | ||
| import infoIcon from "$lib/assets/info.svg"; | ||
| import type { SubmitFunction } from "@sveltejs/kit"; | ||
| async function goHome() { | ||
| goto("/"); | ||
| } | ||
| async function goToLog() { | ||
| goto("/log"); | ||
| } | ||
| async function goToFeatured() { | ||
| goto("/featured"); | ||
| } | ||
| async function toToLogin() { | ||
| goto("/login"); | ||
| } | ||
| async function goToSignup() { | ||
| goto("/signup"); | ||
| } | ||
| async function goToWorldTravel() { | ||
| goto("/worldtravel"); | ||
| } | ||
| const submitUpdateTheme: SubmitFunction = ({ action }) => { | ||
| const theme = action.searchParams.get("theme"); | ||
| if (theme) { | ||
| document.documentElement.setAttribute("data-theme", theme); | ||
| } | ||
| }; | ||
| let count = 0; | ||
| let infoModalOpen = false; | ||
| function showModal() { | ||
| infoModalOpen = true; | ||
| } | ||
| function closeModal() { | ||
| infoModalOpen = false; | ||
| } | ||
| // get value from fetch /api/visitcount | ||
| $: if (user) { | ||
| onMount(async () => { | ||
| const res = await fetch("/api/visitcount"); | ||
| const data = await res.json(); | ||
| visitCount.set(data.visitCount); | ||
| }); | ||
| } | ||
| visitCount.subscribe((value) => { | ||
| count = value; | ||
| }); | ||
| // Set the visit count to the number of adventures stored in local storage | ||
| const isBrowser = typeof window !== "undefined"; | ||
| if (isBrowser) { | ||
| const storedAdventures = localStorage.getItem("adventures"); | ||
| } | ||
| </script> | ||
|
|
||
| <div class="navbar bg-base-100 flex flex-col md:flex-row"> | ||
| <div class="navbar-start flex justify-around md:justify-start"> | ||
| <button | ||
| class="btn btn-primary my-2 md:my-0 md:mr-4 md:ml-2" | ||
| on:click={goHome}>Home</button | ||
| > | ||
| {#if user} | ||
| <button class="btn btn-primary my-2 md:my-0 md:mr-4" on:click={goToLog} | ||
| >My Log</button | ||
| > | ||
| <button | ||
| class="btn btn-primary my-2 md:my-0 md:mr-4" | ||
| on:click={() => goto("/planner")}>Planner</button | ||
| > | ||
|
|
||
| <!-- <button | ||
| class="btn btn-primary my-2 md:my-0 md:mr-4" | ||
| on:click={() => goto("/planner")}>Planner</button | ||
| > --> | ||
| {/if} | ||
| <button | ||
| class="btn btn-primary my-2 md:my-0 md:mr-4" | ||
| on:click={goToWorldTravel}>World Tavel Log</button | ||
| > | ||
| <button class="btn btn-primary my-2 md:my-0" on:click={goToFeatured} | ||
| >Featured</button | ||
| > | ||
| </div> | ||
| <div class="navbar-center flex justify-center md:justify-center"> | ||
| <a class="btn btn-ghost text-xl" href="/">AdventureLog 🗺️</a> | ||
| </div> | ||
|
|
||
| {#if infoModalOpen} | ||
| <InfoModal on:close={closeModal} /> | ||
| {/if} | ||
| <div class="navbar-end flex justify-around md:justify-end mr-4"> | ||
| {#if !user} | ||
| <button class="btn btn-primary ml-4" on:click={toToLogin}>Login</button> | ||
| <button class="btn btn-primary ml-4" on:click={goToSignup}>Signup</button> | ||
| {/if} | ||
|
|
||
| {#if user} | ||
| <p class="font-bold">Adventures: {count}</p> | ||
| <UserAvatar {user} /> | ||
| {/if} | ||
| <button class="btn btn-neutral ml-4 btn-circle" on:click={showModal} | ||
| ><iconify-icon icon="mdi:information" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| <div class="dropdown dropdown-bottom dropdown-end"> | ||
| <div tabindex="0" role="button" class="btn m-1 ml-4"> | ||
| <iconify-icon icon="mdi:theme-light-dark" class="text-xl" | ||
| ></iconify-icon> | ||
| </div> | ||
| <!-- svelte-ignore a11y-no-noninteractive-tabindex --> | ||
| <ul | ||
| tabindex="0" | ||
| class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-52" | ||
| > | ||
| <form method="POST" use:enhance={submitUpdateTheme}> | ||
| <li> | ||
| <button formaction="/?/setTheme&theme=light" | ||
| >Light<iconify-icon icon="mdi:weather-sunny" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| </li> | ||
| <li> | ||
| <button formaction="/?/setTheme&theme=dark" | ||
| >Dark<iconify-icon icon="mdi:weather-night" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| </li> | ||
| <li> | ||
| <button formaction="/?/setTheme&theme=night" | ||
| >Night<iconify-icon icon="mdi:weather-night" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| </li> | ||
| <!-- <li><button formaction="/?/setTheme&theme=nord">Nord</button></li> --> | ||
| <!-- <li><button formaction="/?/setTheme&theme=retro">Retro</button></li> --> | ||
| <li> | ||
| <button formaction="/?/setTheme&theme=forest" | ||
| >Forest<iconify-icon icon="mdi:forest" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| <button formaction="/?/setTheme&theme=garden" | ||
| >Garden<iconify-icon icon="mdi:flower" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| <button formaction="/?/setTheme&theme=aqua" | ||
| >Aqua<iconify-icon icon="mdi:water" class="text-xl" | ||
| ></iconify-icon></button | ||
| > | ||
| </li> | ||
| </form> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.