Begin audio test

app/page.tsx

@@ -8,7 +8,7 @@ export default function Home() {
       </div>
 
       <div className={styles.description}>
-        <p>Noise - An audio-visual pitch for a game about sound</p>
+        <p>The Myrtle Tree - A game about sound and reliving memories.</p>
         <p>By Rory Healy</p>
       </div>
     </main>

components/audio/audio.module.css

@@ -0,0 +1,39 @@
+.all {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.button {
+    border: 1px;
+    border-radius: 10px;
+    border-color: rgb(60, 60, 60);
+    background-color: rgb(50, 50, 50);
+    color: white;
+    padding: 10px;
+    width: 50%;
+}
+
+.button:hover {
+    background-color: rgb(60, 60, 60);
+}
+
+.text {
+    color: white;
+}
+
+.text p {
+    display: inline;
+    padding: 10px 0;
+}
+
+.text a {
+    display: inline;
+    padding: 0 3px;
+    cursor: pointer;
+    text-decoration: underline;
+}
+
+.text a:hover {
+    color: rgb(110, 150, 240);
+}

components/audio/audio.tsx

@@ -0,0 +1,38 @@
+'use client';
+
+import React from 'react';
+import styles from './audio.module.css';
+
+type Display = 'text' | 'button';
+
+export default function AudioButton({ file, text, type }: { file: string, text: string, type: Display }) {
+  const audio: HTMLAudioElement = new Audio('/public/audio/1.ogg')
+  if (audio === null) {
+    console.log('uhoh')
+  }
+  const id = `audio-${new Date().getTime()}`
+
+  function makeAudio() {
+    if (type == 'text') {
+      return (
+        <div className={styles.all}>
+          <div className={styles.text}>
+            <a onClick={audio.play}>{text}</a>
+            {/* <audio src={`/audio/${file}`} id={id} /> */}
+          </div>
+        </div>
+      );
+    } else if (type == 'button') {
+      return (
+        <div className={styles.all}>
+          <button onClick={audio.play} className={styles.button}>{text}</button>
+          {/* <audio src={`/audio/${file}`} id={id} /> */}
+        </div>
+      );
+    }
+  
+    return null;
+  }
+
+  return makeAudio();
+}