From 124b7bf3e3af3e97971fdc3f1cb5421bea770374 Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 00:58:56 +0200 Subject: [PATCH 1/7] =?UTF-8?q?Release=20v1.1.0:=20Nightly=20->=20main=20g?= =?UTF-8?q?emergt,=20Version=20erh=C3=B6ht;=20Admin-Kategorien/Badges,=20P?= =?UTF-8?q?artymode=20serverseitig=20mit=20SSE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/docker-build.yml | 4 ++-- Dockerfile | 2 +- web/src/App.tsx | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/.github/workflows/docker-build.yml b/.github/workflows/docker-build.yml index 3a3bd10..3a25324 100644 --- a/.github/workflows/docker-build.yml +++ b/.github/workflows/docker-build.yml @@ -29,13 +29,13 @@ jobs: run: | if [[ "${{ github.ref_name }}" == "main" ]]; then echo "tag=main" >> $GITHUB_OUTPUT - echo "version=1.0.0" >> $GITHUB_OUTPUT + echo "version=1.1.0" >> $GITHUB_OUTPUT echo "channel=stable" >> $GITHUB_OUTPUT else # Ersetze Slashes durch Bindestriche für gültige Docker Tags CLEAN_TAG=$(echo "${{ github.ref_name }}" | sed 's/\//-/g') echo "tag=$CLEAN_TAG" >> $GITHUB_OUTPUT - echo "version=1.0.0-nightly" >> $GITHUB_OUTPUT + echo "version=1.1.0-nightly" >> $GITHUB_OUTPUT echo "channel=nightly" >> $GITHUB_OUTPUT fi diff --git a/Dockerfile b/Dockerfile index 7365c69..91f8191 100644 --- a/Dockerfile +++ b/Dockerfile @@ -8,7 +8,7 @@ RUN npm install --no-audit --no-fund COPY web/ . # Umgebungsvariable für React Build verfügbar machen (Vite liest nur VITE_*) ARG VITE_BUILD_CHANNEL=stable -ARG VITE_APP_VERSION=1.0.0 +ARG VITE_APP_VERSION=1.1.0 ENV VITE_BUILD_CHANNEL=$VITE_BUILD_CHANNEL ENV VITE_APP_VERSION=$VITE_APP_VERSION RUN npm run build diff --git a/web/src/App.tsx b/web/src/App.tsx index a7a2f90..d7889ad 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -306,7 +306,7 @@ export default function App() { Jukebox 420 {import.meta.env.VITE_BUILD_CHANNEL === 'nightly' && (
- v{import.meta.env.VITE_APP_VERSION || ''} + v{import.meta.env.VITE_APP_VERSION || '1.1.0'} • Nightly
)} From 47dc9c212fd596f2ffe81f0f718639193f90676a Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 01:27:53 +0200 Subject: [PATCH 2/7] Docs: Rewrote README in English v1.1.0 features, quick start, admin guide, Partymode, Docker --- README.md | 84 +++++++++++++++++-------------------------------------- 1 file changed, 25 insertions(+), 59 deletions(-) diff --git a/README.md b/README.md index 3301e76..fd0f395 100644 --- a/README.md +++ b/README.md @@ -1,93 +1,59 @@ -# 🎵 Jukebox 420 - Discord Soundboard v1.0.0 +# Jukebox 420 – Discord Soundboard (v1.1.0) -Ein modernes, feature-reiches Discord Soundboard mit Web-Frontend, Discord-Bot und Docker-Deployment. Perfekt für Gaming-Communities, Streamer und Discord-Server. +A modern, self‑hosted Discord soundboard with a slick web UI and a Discord bot that plays sounds into your voice channels. Easy to run via Docker, fun to use with friends. -![Version](https://img.shields.io/badge/version-1.0.0-blue) +![Version](https://img.shields.io/badge/version-1.1.0-blue) ![Docker](https://img.shields.io/badge/docker-ready-green) ![Discord](https://img.shields.io/badge/discord-bot-purple) ## ✨ Features -### 🎮 **Kern-Funktionen** -- **Web-Frontend** mit modernem UI und 3 Themes (Dark, Rainbow, 420) -- **Discord-Bot** für Voice-Channel Integration -- **Sound-Management** mit Ordner-Unterstützung -- **Live-Uhrzeit** (Berlin Timezone) -- **Volume Control** pro Server -- **Favoriten-System** mit Cookie-Persistenz +- Web UI (Vite + React + TypeScript), 3 themes (Dark, Rainbow, 420) +- Discord bot (discord.js + @discordjs/voice) +- MP3 & WAV playback, ffmpeg normalization +- Favorites, search, folders view (auto counters) +- Live counters and a clean header/footer +- Admin area: bulk delete, inline rename, categories (CRUD) + bulk assign, remove custom badges +- Partymode: server‑side random playback every 30–90 seconds, globally synced via SSE; Panic stops for everyone +- Persistent state: volumes, plays, totalPlays, categories, badges in `/data/sounds/state.json` -### 🎨 **UI/UX Features** -- **3 Themes**: Dark, Rainbow, 420 (Cannabis/Trippy) -- **Responsive Design** für Desktop & Mobile -- **Glassmorphism-Effekte** mit Backdrop-Blur -- **Animierte Hintergründe** (Rainbow & 420 Theme) -- **Live-Zähler** für Sounds und Abspielungen +## 🚀 Quick start -### 🔧 **Admin-Funktionen** -- **Admin-Login** (Passwort-basiert) -- **Bulk-Delete** für mehrere Sounds -- **Sound-Umbenennen** mit Inline-Editor -- **Checkbox-Auswahl** für Massenoperationen - -### 🎵 **Audio-Features** -- **MP3 & WAV Support** für Uploads und Playback -- **Audio-Normalisierung** (Loudnorm) -- **URL-Download** für MP3/WAV Links -- **Random-Play** für zufällige Sounds -- **Panic-Button** zum sofortigen Stoppen - -### 📁 **Organisation** -- **Ordner-Unterstützung** mit Tab-Navigation -- **Favoriten-Tab** für gespeicherte Sounds -- **Neu-Tab** für die letzten 10 Uploads -- **Most Played** für Top 3 Sounds -- **Suchfunktion** für alle Sounds - -## 🚀 Quick Start - -### 1. Voraussetzungen -- **Docker & Docker Compose** -- **Discord Bot Token** mit folgenden Intents: - - `Guilds` - - `GuildVoiceStates` - - `DirectMessages` - - `MessageContent` +### 1. Requirements +- Docker & Docker Compose +- Discord bot token with intents: `Guilds`, `GuildVoiceStates`, `DirectMessages` ### 2. Setup ```bash -# Repository klonen +# Clone repository git clone https://github.com/flex420/jukebox-vibe.git cd jukebox-vibe -# .env Datei erstellen +# Create .env cp .env.example .env ``` -### 3. Konfiguration +### 3. Configuration ```env -# .env Datei bearbeiten -DISCORD_TOKEN=dein_discord_bot_token_hier +# Edit the .env file +DISCORD_TOKEN=your_discord_bot_token_here +ADMIN_PWD=choose-a-strong-password PORT=8080 SOUNDS_DIR=/data/sounds -# Optional: Bestimmte Server erlauben +# Optionally restrict allowed guilds ALLOWED_GUILD_IDS=GUILD_ID_1,GUILD_ID_2 - -# Optional: Audio-Normalisierung -NORMALIZE_AUDIO=true -NORMALIZE_TARGET=-14 -NORMALIZE_THRESHOLD=-70 ``` ### 4. Deployment ```bash -# Container starten +# Start container docker compose up --build -d -# Logs anzeigen +# Logs docker compose logs -f -# Status prüfen +# Status docker compose ps ``` From ef67c712fe2e58b691f20ea26878b095d26464e3 Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 21:09:37 +0200 Subject: [PATCH 3/7] =?UTF-8?q?fix(ui):=20Lautst=C3=A4rke-Slider=20zentrie?= =?UTF-8?q?rt=20in=20Chrome/Edge/Brave=20(WebKit-Thumb=20margin-top,=20Tra?= =?UTF-8?q?ck-H=C3=B6he=20vereinheitlicht)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/styles.css | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/web/src/styles.css b/web/src/styles.css index 0e61404..6928ae6 100644 --- a/web/src/styles.css +++ b/web/src/styles.css @@ -1,6 +1,6 @@ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap'); -:root { color-scheme: dark; } +:root { color-scheme: dark; --range-track-h: 8px; --range-thumb-d: 20px; } * { box-sizing: border-box; } [data-theme="dark"] body, body { @@ -476,12 +476,13 @@ header p { -webkit-appearance: none; appearance: none; width: 100%; - height: 8px; + height: var(--range-track-h, 8px); border-radius: 5px; outline: none; cursor: pointer; /* Sichtbarer Füllbalken über ein Hintergrund-Gradient, Breite via --_fill gesteuert */ background: linear-gradient(var(--range-accent), var(--range-accent)) 0/var(--_fill, 0%) 100% no-repeat, var(--range-track-bg, #2c2c2c); + vertical-align: middle; } /* Tracks transparent halten, damit der Hintergrund-Gradient sichtbar ist */ @@ -496,8 +497,9 @@ header p { .volume-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; - width: 20px; - height: 20px; + width: var(--range-thumb-d, 20px); + height: var(--range-thumb-d, 20px); + margin-top: calc((var(--range-track-h, 8px) - var(--range-thumb-d, 20px)) / 2); border-radius: 50%; cursor: pointer; border: none; @@ -521,7 +523,7 @@ header p { --range-track-bg: #2c2c2c; accent-color: #0a84ff; border-radius: 5px; - height: 8px; + height: var(--range-track-h, 8px); } [data-theme="dark"] .control.volume input[type="range"]::-webkit-slider-thumb, @@ -543,7 +545,7 @@ header p { --range-track-bg: rgba(44,44,44,.8); accent-color: #23a6d5; border-radius: 5px; - height: 8px; + height: var(--range-track-h, 8px); border: 1px solid #3a3a3c; } From 032c269798c15cd0ed65ff07eb942a583475954a Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 21:15:39 +0200 Subject: [PATCH 4/7] =?UTF-8?q?feat(volume):=20Live-Sync=20der=20Lautst?= =?UTF-8?q?=C3=A4rke=20=C3=BCber=20SSE=20(Broadcast=20bei=20=C3=84nderung?= =?UTF-8?q?=20+=20Snapshot);=20Frontend=20reagiert=20auf=20Updates?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- server/src/index.ts | 6 +++++- web/src/App.tsx | 19 +++++++++++++++++++ 2 files changed, 24 insertions(+), 1 deletion(-) diff --git a/server/src/index.ts b/server/src/index.ts index 90da983..99d67ad 100644 --- a/server/src/index.ts +++ b/server/src/index.ts @@ -941,6 +941,8 @@ app.post('/api/volume', (req: Request, res: Response) => { // Kein aktiver Player: nur persistieren für nächste Wiedergabe persistedState.volumes[guildId] = safeVolume; writePersistedState(persistedState); + // Broadcast neue Lautstärke an alle Clients + sseBroadcast({ type: 'volume', guildId, volume: safeVolume }); return res.json({ ok: true, volume: safeVolume, persistedOnly: true }); } state.currentVolume = safeVolume; @@ -950,6 +952,8 @@ app.post('/api/volume', (req: Request, res: Response) => { } persistedState.volumes[guildId] = safeVolume; writePersistedState(persistedState); + // Broadcast neue Lautstärke an alle Clients + sseBroadcast({ type: 'volume', guildId, volume: safeVolume }); return res.json({ ok: true, volume: safeVolume }); } catch (e: any) { console.error('Volume-Fehler:', e); @@ -1075,7 +1079,7 @@ app.get('/api/events', (req: Request, res: Response) => { // Snapshot senden try { - res.write(`data: ${JSON.stringify({ type: 'snapshot', party: Array.from(partyActive), selected: persistedState.selectedChannels ?? {} })}\n\n`); + res.write(`data: ${JSON.stringify({ type: 'snapshot', party: Array.from(partyActive), selected: persistedState.selectedChannels ?? {}, volumes: persistedState.volumes ?? {} })}\n\n`); } catch {} // Ping, damit Proxies die Verbindung offen halten diff --git a/web/src/App.tsx b/web/src/App.tsx index ca441a9..6b7899c 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -106,6 +106,15 @@ export default function App() { setSelected(newVal); } } catch {} + try { + const vols = msg?.volumes || {}; + const cur = selectedRef.current || ''; + const gid = cur ? cur.split(':')[0] : ''; + if (gid && typeof vols[gid] === 'number') { + const v = vols[gid]; + setVolume(v); + } + } catch {} } else if (msg?.type === 'channel') { try { const gid = msg.guildId; @@ -116,6 +125,16 @@ export default function App() { if (curGid === gid) setSelected(`${gid}:${cid}`); } } catch {} + } else if (msg?.type === 'volume') { + try { + const gid = msg.guildId; + const v = msg.volume; + const cur = selectedRef.current || ''; + const curGid = cur ? cur.split(':')[0] : ''; + if (gid && curGid === gid && typeof v === 'number') { + setVolume(v); + } + } catch {} } }); return () => { try { unsub(); } catch {} }; From 914693df1bd44e77eadff63df1bc5d256541d7ec Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 21:23:13 +0200 Subject: [PATCH 5/7] =?UTF-8?q?docs(changelog):=20add=20CHANGELOG=201.1.1;?= =?UTF-8?q?=20chore(version):=20bump=20to=201.1.1=20and=20update=20badges/?= =?UTF-8?q?env;=20docs(feature):=20FEATURE=5FBRANCH.md=20Hinweise=20erg?= =?UTF-8?q?=C3=A4nzt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- FEATURE_BRANCH.md | 5 +++++ README.md | 4 ++-- docker-compose.feature.yml | 2 +- docker-compose.yml | 2 +- package.json | 2 +- server/package.json | 2 +- web/package.json | 2 +- 7 files changed, 12 insertions(+), 7 deletions(-) diff --git a/FEATURE_BRANCH.md b/FEATURE_BRANCH.md index bb5474f..e4c0d47 100644 --- a/FEATURE_BRANCH.md +++ b/FEATURE_BRANCH.md @@ -35,6 +35,11 @@ git push origin main git branch -d feature/mein-experiment ``` +## Versionierung & Changelog +- Versionen werden in `README.md` (Badge) gepflegt +- Änderungen dokumentieren wir in `CHANGELOG.md` +- Nightly-Entwicklung: Features zuerst im Branch `feature/nightly`, Merge nach `main` für Release + ## Docker Images - `:latest` - Hauptversion (main branch) - `:feature-nightly` - Feature Version diff --git a/README.md b/README.md index fd0f395..d970873 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ -# Jukebox 420 – Discord Soundboard (v1.1.0) +# Jukebox 420 – Discord Soundboard (v1.1.1) A modern, self‑hosted Discord soundboard with a slick web UI and a Discord bot that plays sounds into your voice channels. Easy to run via Docker, fun to use with friends. -![Version](https://img.shields.io/badge/version-1.1.0-blue) +![Version](https://img.shields.io/badge/version-1.1.1-blue) ![Docker](https://img.shields.io/badge/docker-ready-green) ![Discord](https://img.shields.io/badge/discord-bot-purple) diff --git a/docker-compose.feature.yml b/docker-compose.feature.yml index e5a0560..7f242fa 100644 --- a/docker-compose.feature.yml +++ b/docker-compose.feature.yml @@ -13,7 +13,7 @@ services: - GUILD_ID=${GUILD_ID} - ADMIN_PWD=${ADMIN_PWD} - VITE_BUILD_CHANNEL=nightly - - VITE_APP_VERSION=1.0.0-nightly + - VITE_APP_VERSION=1.1.1-nightly volumes: - ./data/sounds:/data/sounds - ./data/uploads:/data/uploads diff --git a/docker-compose.yml b/docker-compose.yml index fceeca2..e412838 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -8,7 +8,7 @@ services: - .env environment: - VITE_BUILD_CHANNEL=stable - - VITE_APP_VERSION=1.0.0 + - VITE_APP_VERSION=1.1.1 volumes: - ./data/sounds:/data/sounds restart: unless-stopped diff --git a/package.json b/package.json index 96fd141..2f01d4b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "jukebox-vibe", - "version": "1.0.0", + "version": "1.1.1", "description": "Discord Soundboard mit Web-Interface", "private": true, "scripts": { diff --git a/server/package.json b/server/package.json index 6fbe126..9066851 100644 --- a/server/package.json +++ b/server/package.json @@ -1,6 +1,6 @@ { "name": "discord-soundboard-server", - "version": "0.1.0", + "version": "1.1.1", "private": true, "type": "module", "main": "dist/index.js", diff --git a/web/package.json b/web/package.json index 6b3a4ef..14fba7c 100644 --- a/web/package.json +++ b/web/package.json @@ -1,7 +1,7 @@ { "name": "discord-soundboard-web", "private": true, - "version": "0.1.0", + "version": "1.1.1", "type": "module", "scripts": { "dev": "vite", From 1e6c5ad4023f50c07ccc4db619b171612615965f Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 21:30:46 +0200 Subject: [PATCH 6/7] =?UTF-8?q?docs:=20Hinweis=20erg=C3=A4nzt=20=E2=80=93?= =?UTF-8?q?=20Frontend=20MUSS=20hinter=20SSL/HTTPS=20laufen=20(sonst=20Dis?= =?UTF-8?q?cord=20Encrypt-Error)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/README.md b/README.md index d970873..bf9376e 100644 --- a/README.md +++ b/README.md @@ -170,6 +170,12 @@ docker pull flex420/jukebox-vibe:latest docker run -d --name jukebox-420 -p 8199:8080 --env-file .env -v $(pwd)/data/sounds:/data/sounds flex420/jukebox-vibe:latest ``` +## 🔒 SSL/HTTPS Hinweis (wichtig für Discord) + +- Das Web-Frontend MUSS hinter HTTPS (SSL) ausgeliefert werden. Empfohlen ist ein Domain‑Mapping (Reverse Proxy) mit gültigem Zertifikat (z. B. Traefik, Nginx, Caddy, Cloudflare). +- Hintergrund: Ohne TLS kann es zu Verschlüsselungs-/Encrypt‑Fehlern kommen, und Audio wird in Discord nicht korrekt wiedergegeben. +- Praxis: Richte eine Domain wie `https://soundboard.deinedomain.tld` auf das Frontend ein und aktiviere SSL (Let’s Encrypt). Danach sollten Uploads/Playback stabil funktionieren. + ## 📁 Projekt-Struktur ``` From 1fb80209f37176ab3b60caba223f6a9b8b8e66ae Mon Sep 17 00:00:00 2001 From: vibe-bot Date: Sun, 10 Aug 2025 21:32:34 +0200 Subject: [PATCH 7/7] =?UTF-8?q?chore(ui):=20Footer-Version=20entfernt;=20z?= =?UTF-8?q?uk=C3=BCnftige=20Builds=20zeigen=20keine=20Version=20im=20UI?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/App.tsx | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/web/src/App.tsx b/web/src/App.tsx index 6b7899c..db5dfa7 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -672,15 +672,7 @@ export default function App() { ); })} - {/* Footer: Version/Channel */} -
- - v{import.meta.env.VITE_APP_VERSION || ''} - {import.meta.env.VITE_BUILD_CHANNEL === 'nightly' && ( - • Nightly - )} - -
+ {/* Footer intentionally left without version display */} {showTop && (