snxraven/ravenscott-rocks
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

moving to soundcloud.ts

Browse Source
This commit is contained in:
snxraven
2025-06-22 02:13:47 -04:00
parent 3292de107a
commit 2f55294c3d
5 changed files with 292 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
views/genre.ejs Normal file
View File

@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= genre.charAt(0).toUpperCase() + genre.slice(1) %> Tracks - Raven Scott Music</title>
<style>
body { font-family: Arial, sans-serif; margin: 0; padding: 20px; background: #f4f4f4; }
h1 { text-align: center; }
.track { margin: 10px 0; }
.track-player { width: 100%; max-width: 600px; }
.track-player img { width: 100%; height: 166px; object-fit: cover; }
.back-link { display: block; text-align: center; margin: 10px 0; color: #007bff; }
</style>
</head>
<body>
<h1><%= genre.charAt(0).toUpperCase() + genre.slice(1) %> Tracks</h1>
<% tracks.forEach(track => { %>
<div class="track">
<h3><%= track.title %></h3>
<div class="track-player" data-url="<%= track.url %>">
<img src="/placeholder.jpg" alt="<%= track.title %>">
</div>
</div>
<% }); %>
<a class="back-link" href="/">Back to Home</a>
<script>
const observer = new IntersectionObserver((entries, observer) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const container = entry.target;
const url = container.dataset.url;
container.innerHTML = `<iframe width="100%" height="166" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=${encodeURIComponent(url)}&show_comments=false&show_teaser=false&visual=false"></iframe>`;
observer.unobserve(container);
}
});
}, { rootMargin: '100px' });
document.querySelectorAll('.track-player').forEach(player => observer.observe(player));
</script>
</body>
</html>

2
views/index.ejs
View File

@ -127,7 +127,7 @@
<body>
<nav class="navbar navbar-expand-lg navbar-dark fixed-top">
<a class="navbar-brand" href="https://raven-scott.fyi">Raven Scott Music</a>
<a class="navbar-brand" href="https://raven-scott.rocks">Raven Scott Music</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>