limepotato/nelle-observer
1
1
Fork 0
Code Pull requests Activity

sound and header

Browse source
This commit is contained in:
nelle 2024-08-12 01:15:48 -06:00
parent 91869d153a
commit b38380c8a7
4 changed files with 82 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
astro/public/scripts/sound.js Normal file
View file

@ -0,0 +1,28 @@
// Sound effects
function PlaySound(soundobj) {
var thissound = document.getElementById(soundobj);
thissound.play();
}
function StopSound(soundobj) {
var thissound = document.getElementById(soundobj);
thissound.pause();
thissound.currentTime = 0;
}
const audio = new Audio("/assets/sounds/ui/zapsplat_multimedia_button_click_004_68776.mp3");
const buttons = document.querySelectorAll("button");
const links = document.querySelectorAll("a");
// biome-ignore lint/complexity/noForEach: <explanation>
links.forEach(a => {
a.addEventListener("click", () => {
audio.play();
})
})
// biome-ignore lint/complexity/noForEach: <explanation>
buttons.forEach(button => {
button.addEventListener("click", () => {
audio.play();
});})

36
astro/src/components/Header.astro Normal file
View file

@ -0,0 +1,36 @@
---
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
const { title } = Astro.props;
---
<!--
onmouseover="PlaySound('hoverSound')"
onmouseout="StopSound('hoverSound')" -->
<section class="content">
<nav class="menu">
<button
class="custom-btn btn-1"
type="button"
onclick="location.href='/'"
>
<span>Home</span>
</button>
<button
class="custom-btn btn-1"
type="button"
onclick="location.href='/projects'"
>
<span>Projects</span>
</button>
<button
class="custom-btn btn-1"
type="button"
onclick="location.href='/blog'"
>
<span>Blog</span>
</button>
</nav>
</section>

16
astro/src/layouts/Layout.astro
View file

@ -1,6 +1,13 @@
--- ---
import Head from "../components/Head.astro"; import Head from "../components/Head.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro"; import Footer from "../components/Footer.astro";
interface Props {
title: string;
}
const { title } = Astro.props;
--- ---
<!doctype html> <!doctype html>
@ -9,9 +16,18 @@ import Footer from "../components/Footer.astro";
<Head /> <Head />
</head> </head>
<body onload="onload()" id="body"> <body onload="onload()" id="body">
<Header />
<section class="content">
<h1 class="title">{title}</h1>
</section>
<slot /> <slot />
<Footer /> <Footer />
<script type="text/javascript" src="/scripts/sga.js"></script> <script type="text/javascript" src="/scripts/sga.js"></script>
<script type="text/javascript" src="/scripts/lastfm.js"></script> <script type="text/javascript" src="/scripts/lastfm.js"></script>
<script type="text/javascript" src="/scripts/sound.js"></script>
<audio
id="clickSound"
src="/assets/sounds/ui/zapsplat_multimedia_button_click_004_68776.mp3">
</audio>
</body> </body>
</html> </html>

7
astro/src/pages/index.astro
View file

@ -2,12 +2,9 @@
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
--- ---
<Layout> <Layout title="Welcome to Astro.">
<main class=> <main>
<!-- Title Area --> <!-- Title Area -->
<section class="content">
<h1 class="title">nelle.observer</h1>
</section>
<section class="content"> <section class="content">
<p>hello, what brings you here?</p> <p>hello, what brings you here?</p>
<p> <p>