admin/37956-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Lili Records V1.0.0

Browse Source
This commit is contained in:
Flatlogic Bot 2026-01-29 21:45:14 +00:00
parent bb3cf89ba7
commit 6effb120da
3 changed files with 117 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
core/templates/core/index.html
View File

@ -26,6 +26,14 @@
<p class="text-secondary mb-0" id="current-track-info">Virtual Broadcast</p>
</div>
</div>
<!-- Visualizer Waves -->
<div class="visualizer-container my-4 d-flex align-items-end justify-content-center gap-1" id="visualizer">
<div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div>
<div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div>
<div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div>
<div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div><div class="v-bar"></div>
</div>
<div class="audio-controls mb-4 p-3 rounded-3 bg-dark bg-opacity-50 border border-secondary">
<audio id="audio-player"></audio>
@ -123,6 +131,7 @@ document.addEventListener('DOMContentLoaded', function() {
const vinyl = document.getElementById('vinyl');
const vinylLabel = document.getElementById('vinyl-label');
const tonearm = document.getElementById('tonearm');
const visualizer = document.getElementById('visualizer');
const stationItems = document.querySelectorAll('.station-item');
const stationNameDisplay = document.getElementById('current-station-name');
const volumeControl = document.getElementById('volume-control');
@ -136,6 +145,7 @@ document.addEventListener('DOMContentLoaded', function() {
playBtn.innerHTML = '<i class="fas fa-play fs-4"></i>';
vinyl.classList.remove('spinning');
tonearm.classList.remove('active');
visualizer.classList.remove('playing');
} else {
if (audio.src && audio.src !== window.location.href) {
audio.play().catch(e => {
@ -145,6 +155,7 @@ document.addEventListener('DOMContentLoaded', function() {
playBtn.innerHTML = '<i class="fas fa-pause fs-4"></i>';
vinyl.classList.add('spinning');
tonearm.classList.add('active');
visualizer.classList.add('playing');
} else {
alert('Please select a station first!');
return;

53
static/css/custom.css
View File

@ -177,6 +177,59 @@ body {
text-shadow: 0 0 10px rgba(37, 211, 102, 0.5);
}
/* Visualizer Waves */
.visualizer-container {
height: 60px;
width: 100%;
}
.v-bar {
width: 6px;
height: 4px;
background: linear-gradient(to top, var(--secondary-neon), var(--primary-neon));
border-radius: 3px;
opacity: 0.5;
transition: all 0.3s ease;
}
.visualizer-container.playing .v-bar {
opacity: 1;
animation: wave 1.2s ease-in-out infinite;
}
.v-bar:nth-child(1) { animation-delay: 0.0s; }
.v-bar:nth-child(2) { animation-delay: 0.1s; }
.v-bar:nth-child(3) { animation-delay: 0.2s; }
.v-bar:nth-child(4) { animation-delay: 0.3s; }
.v-bar:nth-child(5) { animation-delay: 0.4s; }
.v-bar:nth-child(6) { animation-delay: 0.5s; }
.v-bar:nth-child(7) { animation-delay: 0.6s; }
.v-bar:nth-child(8) { animation-delay: 0.7s; }
.v-bar:nth-child(9) { animation-delay: 0.8s; }
.v-bar:nth-child(10) { animation-delay: 0.9s; }
.v-bar:nth-child(11) { animation-delay: 0.1s; }
.v-bar:nth-child(12) { animation-delay: 0.2s; }
.v-bar:nth-child(13) { animation-delay: 0.3s; }
.v-bar:nth-child(14) { animation-delay: 0.4s; }
.v-bar:nth-child(15) { animation-delay: 0.5s; }
.v-bar:nth-child(16) { animation-delay: 0.6s; }
.v-bar:nth-child(17) { animation-delay: 0.7s; }
.v-bar:nth-child(18) { animation-delay: 0.8s; }
.v-bar:nth-child(19) { animation-delay: 0.9s; }
.v-bar:nth-child(20) { animation-delay: 0.0s; }
@keyframes wave {
0%, 100% {
height: 4px;
filter: brightness(1);
}
50% {
height: 50px;
filter: brightness(1.5);
box-shadow: 0 0 15px var(--primary-neon);
}
}
/* Responsive adjustments */
@media (max-width: 992px) {
.player-container {

53
staticfiles/css/custom.css
View File

@ -177,6 +177,59 @@ body {
text-shadow: 0 0 10px rgba(37, 211, 102, 0.5);
}
/* Visualizer Waves */
.visualizer-container {
height: 60px;
width: 100%;
}
.v-bar {
width: 6px;
height: 4px;
background: linear-gradient(to top, var(--secondary-neon), var(--primary-neon));
border-radius: 3px;
opacity: 0.5;
transition: all 0.3s ease;
}
.visualizer-container.playing .v-bar {
opacity: 1;
animation: wave 1.2s ease-in-out infinite;
}
.v-bar:nth-child(1) { animation-delay: 0.0s; }
.v-bar:nth-child(2) { animation-delay: 0.1s; }
.v-bar:nth-child(3) { animation-delay: 0.2s; }
.v-bar:nth-child(4) { animation-delay: 0.3s; }
.v-bar:nth-child(5) { animation-delay: 0.4s; }
.v-bar:nth-child(6) { animation-delay: 0.5s; }
.v-bar:nth-child(7) { animation-delay: 0.6s; }
.v-bar:nth-child(8) { animation-delay: 0.7s; }
.v-bar:nth-child(9) { animation-delay: 0.8s; }
.v-bar:nth-child(10) { animation-delay: 0.9s; }
.v-bar:nth-child(11) { animation-delay: 0.1s; }
.v-bar:nth-child(12) { animation-delay: 0.2s; }
.v-bar:nth-child(13) { animation-delay: 0.3s; }
.v-bar:nth-child(14) { animation-delay: 0.4s; }
.v-bar:nth-child(15) { animation-delay: 0.5s; }
.v-bar:nth-child(16) { animation-delay: 0.6s; }
.v-bar:nth-child(17) { animation-delay: 0.7s; }
.v-bar:nth-child(18) { animation-delay: 0.8s; }
.v-bar:nth-child(19) { animation-delay: 0.9s; }
.v-bar:nth-child(20) { animation-delay: 0.0s; }
@keyframes wave {
0%, 100% {
height: 4px;
filter: brightness(1);
}
50% {
height: 50px;
filter: brightness(1.5);
box-shadow: 0 0 15px var(--primary-neon);
}
}
/* Responsive adjustments */
@media (max-width: 992px) {
.player-container {