audio functionality

FNLookup · Jun 14, 2024 · 79ebba8 · 79ebba8
1 parent fdfb7bd
commit 79ebba8
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 11 deletions.
diff --git a/festival/js/featured.js b/festival/js/featured.js
@@ -27,18 +27,42 @@ function getFeaturedJamTracks() {
 
                 //console.log(jamTrack)
 
+                const jamTrackElement = document.createElement('jam-track');
+
+                const jamShit = document.createElement('a');
+
+                jamShit.classList.add("jam-track-item-card", "fortnite-button-border");
+                jamShit.href = 'view/?' + id;
+
+                jamTrackElement.append(jamShit)
+
+                // Add image element
+                const image = document.createElement("img");
+                image.src = album;
+                image.alt = songName;
+                jamShit.appendChild(image);
+
+                // Add description container
+                const description = document.createElement("div");
+                description.classList.add("jam-track-description");
+
+                // Add song name heading
+                const songNameHeading = document.createElement("h2");
+                songNameHeading.classList.add("header-text-bold");
+                songNameHeading.textContent = songName;
+                description.appendChild(songNameHeading);
+
+                // Add artist heading
+                const artistHeading = document.createElement("h3");
+                artistHeading.classList.add("header-text-bold");
+                artistHeading.textContent = artist; // Assuming you have the artist variable defined
+                description.appendChild(artistHeading);
+
+                // Add description container to link
+                jamShit.appendChild(description);          
+
                 if (listFeatured.includes(id)) {
-                    document.getElementById('featured-entries').innerHTML += `
-                    <jam-track>
-                        <a class="jam-track-item-card fortnite-button-border" href="view/?${id}">
-                            <img src="${album}" alt="Give Me Everything">
-            
-                            <div class="jam-track-description">
-                                <h2 class="header-text-bold">${songName}</h2>
-                                <h3 class="header-text-bold">${artist}</h3>
-                            </div>
-                        </a>
-                    </jam-track>`
+                    document.getElementById('featured-entries').append(jamTrackElement)
                 }
 
                 document.getElementById('all-entries').innerHTML += `

diff --git a/festival/view/index.html b/festival/view/index.html
@@ -43,6 +43,13 @@
 
         <hr>
 
+        <div class="flex">
+            <audio id="preview-audio" controls></audio>
+            <audio id="full-audio" controls></audio>
+        </div>
+
+        <hr>
+
         <h1 class="header-text-bold">Leaderboards</h1>
 
         <div class="instrument-buttons" id="instrument-buttons">

diff --git a/festival/view/js/song.js b/festival/view/js/song.js
@@ -6,6 +6,9 @@ function loadViewer() {
     //console.log(firstKey);
     let _placeholder_songID = firstKey
 
+    document.getElementById('preview-audio').src = 'https://raw.githubusercontent.com/FNLookup/festival/main/music/' + _placeholder_songID + '_preview.ogg'
+    document.getElementById('full-audio').src = 'https://raw.githubusercontent.com/FNLookup/festival/main/music/' + _placeholder_songID + '.ogg'
+
     // check params
 
     fetch(_jam_tracks_URL).then(r=>r.json()).then(r=> {