diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..53d2bdd --- /dev/null +++ b/.dockerignore @@ -0,0 +1,7 @@ +node_modules +.git +.gitignore +data/temp/* +data/renders/* +data/uploads/* +*.log diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..7492f0a --- /dev/null +++ b/Dockerfile @@ -0,0 +1,26 @@ +FROM node:20-bookworm-slim + +# Install FFmpeg and essential tools +RUN apt-get update && apt-get install -y --no-install-recommends \ + ffmpeg \ + fonts-dejavu-core \ + ca-certificates \ + && rm -rf /var/lib/apt/lists/* + +WORKDIR /app + +# Install dependencies +COPY package*.json ./ +RUN npm ci --omit=dev || npm install --omit=dev + +# Copy application files +COPY . . + +# Ensure storage directories exist +RUN mkdir -p data/temp data/uploads data/renders + +EXPOSE 3000 +ENV PORT=3000 +ENV NODE_ENV=production + +CMD ["node", "server.mjs"] diff --git a/README.md b/README.md index ea5b03d..a024818 100644 --- a/README.md +++ b/README.md @@ -1,26 +1,120 @@ -# Orfel Viz +# 🎵 Orfel Viz - Studio Audio Visualizer Suite -Audio-Visualizer mit Unterstützung für transparente Video-Exporte (Alpha-Kanal) und modulare Visualisierungsformen. +High-Performance Audio Visualizer Web-Anwendung mit hardware-beschleunigtem Offline-Render-Engine und echtem Alphakanal-Export für **DaVinci Resolve**, **Adobe Premiere Pro** und **YouTube / Social Media**. -## Features +--- -- **Formen & Topologien**: Kreis (Radial), Linear / Horizont, Hexagon, Diamond (Raute), Dreieck, Achteck, Oszilloskop / Laser-Welle, 3D Tunnel. -- **Modulare Steuerung**: Alle Elemente (Cover-Artwork, Spektrum, Fortschrittsring, 3D Grid, Partikel, Shake, Glitch) sind einzeln aktivier- und deaktivierbar. -- **Farben & Glow**: 2- und 3-Farben-Gradienten, Chroma-Loop, Multi-Pass Neon Glow. -- **FX & Hintergründe**: 3D Synthwave Grid, Partikelsystem (Starfield, Staub, Funken), Bass-Pulse, Shake und RGB-Glitch. -- **Export**: Transparenter WebM-Export (VP9 mit Alpha) und MP4 für 16:9, 9:16 und 1:1. -- **Presets**: Schnellauswahl vorkonfigurierter Stile sowie Speichern/Laden eigener Presets (.json). +## 🌟 Highlights & Features -## Lokaler Start +- **Echter Alphakanal (Transparenz)**: + - **Apple ProRes 4444 (`.mov`)**: Unkomprimierter 10-Bit Broadcast-Master mit makellosem Alphakanal. + - **QuickTime Animation RLE (`.mov`)**: 100 % verlustfreier RGB+Alpha-Export, blitzschnell gerendert und kompakt. + - **WebM VP9 (`.webm`)**: Extrem kompakter transparenter Stream für Web-Overlays. + - **MP4 Video (`.mp4`)**: Broadcast CRF 14 H.264 für direkten YouTube- und Social-Media-Upload. +- **Topologie & Formen**: Kreis, Dreieck, Hexagon, Diamond, Octagon, Oszilloskop, 3D Retro Grid & Tunnel. +- **Spektrum-Modi**: Radial Bars, Solid Waveform, Outline Waves, Concentric Energy Rings, Mirrored Center. +- **Typografie & Customizing**: + - Individuelle Schalter für Titel, Artist, Timecode und Fortschrittsbalken. + - Einstellbare Schriftarten (Outfit, Montserrat, Inter, Orbitron, Russo One, Cinzel, Syncopate), Farben, Größen, Groß-/Kleinschreibung und Neon-Glow. +- **Presets & Paletten**: Über 16 kuratierte Studio-Presets (Trap Nation, NCS Electro, Synthwave, Cyberpunk, Toxic Emerald, etc.) + JSON Import/Export. +- **Format-Umschaltung**: 16:9 (YouTube Standard), 9:16 (TikTok / YouTube Shorts / Instagram Reels) inkl. Safe-Zone Overlay, 1:1 (Quadratisch). +--- + +## 🚀 Schnellstart (Lokal) + +### Voraussetzungen +- [Node.js](https://nodejs.org/) (Version 18 oder höher) +- [FFmpeg](https://ffmpeg.org/) (im System-PATH hinterlegt) + +### Installation & Start ```bash +# Abhängigkeiten installieren npm install + +# Server starten npm start ``` -Die Anwendung läuft unter `http://localhost:849`. +Öffne anschließend **`http://localhost:3000`** in deinem Browser (Chrome / Edge / Firefox). -## Jannik-Cloud Deployment +Unter Windows kannst du auch einfach doppelt auf **`Start-Local.bat`** klicken. -- **URL**: `https://viz.orfel.de` -- **Port**: `849` -- **Volume**: `/mnt/Jannik-Cloud-Volume-01/viz:/data` +--- + +## 🌐 Server Deployment (Linux VPS / Hetzner / DigitalOcean) + +### Option A: Docker (Empfohlen) +Die Anwendung enthält bereits eine produktionsreife `Dockerfile` und `docker-compose.yml` inklusive Node.js und FFmpeg. + +```bash +# 1. Repository auf den Server klonen +git clone orfel-viz +cd orfel-viz + +# 2. Container im Hintergrund starten +docker compose up -d +``` + +Fertig! Die App läuft unter `http://:3000`. + +### Option B: Mit Deployment-Skript +```bash +chmod +x deploy.sh +./deploy.sh +``` + +### Option C: Mit PM2 (Ohne Docker) +```bash +sudo apt update && sudo apt install -y nodejs npm ffmpeg +npm install +npm install -g pm2 +pm2 start server.mjs --name "orfel-viz" +pm2 save +pm2 startup +``` + +--- + +## 🔒 Nginx Reverse Proxy & SSL (Optional) + +Beispiel-Konfiguration für Nginx (`/etc/nginx/sites-available/viz.deinedomain.de`): + +```nginx +server { + server_name viz.deinedomain.de; + + # Maximale Upload-Größe für große Audiodateien und Frame-Batches + client_max_body_size 500M; + + location / { + proxy_pass http://127.0.0.1:3000; + proxy_http_version 1.1; + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection 'upgrade'; + proxy_set_header Host $host; + proxy_cache_bypass $http_upgrade; + proxy_read_timeout 600s; + proxy_send_timeout 600s; + } +} +``` + +SSL-Zertifikat via Let's Encrypt aktivieren: +```bash +sudo certbot --nginx -d viz.deinedomain.de +``` + +--- + +## 🎬 Workflow in DaVinci Resolve + +1. Rendere dein Video in **Orfel Viz** im Format **Apple ProRes 4444** oder **QuickTime Animation RLE**. +2. Ziehe die heruntergeladene `.mov`-Datei in den DaVinci Resolve Media Pool. +3. Lege deinen Video-Hintergrund auf Videospur **V1**. +4. Lege die exportierte `.mov`-Datei auf Videospur **V2**. +5. DaVinci Resolve erkennt den Alphakanal automatisch („Straight“ Alpha). Der Visualizer liegt sofort perfekt freigestellt über deinem Video! + +--- + +## 📄 Lizenz +MIT License. Erstellt für professionelle Audio-Visualisierungen. diff --git a/deploy.sh b/deploy.sh new file mode 100644 index 0000000..8764cb1 --- /dev/null +++ b/deploy.sh @@ -0,0 +1,47 @@ +#!/usr/bin/env bash +# ============================================================================== +# Orfel Viz - Server Deployment Script (Ubuntu / Debian / Linux VPS) +# ============================================================================== +set -e + +echo "🚀 Deploying Orfel Viz..." + +# Check if Docker is available +if command -v docker &> /dev/null && command -v docker compose &> /dev/null; then + echo "🐳 Docker detected. Building and starting container..." + docker compose down || true + docker compose build --no-cache + docker compose up -d + echo "✅ Orfel Viz is running in Docker on port 3000!" + echo "👉 Open http://localhost:3000 or http://:3000" + exit 0 +fi + +# Fallback: Native Node.js & PM2 setup +echo "📦 Docker not found. Checking Node.js and FFmpeg..." + +if ! command -v ffmpeg &> /dev/null; then + echo "Installing FFmpeg..." + sudo apt-get update && sudo apt-get install -y ffmpeg +fi + +if ! command -v node &> /dev/null; then + echo "❌ Node.js is not installed. Please install Node.js 18+ first." + exit 1 +fi + +npm install --omit=dev + +if command -v pm2 &> /dev/null; then + echo "Starting with PM2..." + pm2 delete orfel-viz || true + pm2 start server.mjs --name "orfel-viz" + pm2 save + echo "✅ Running with PM2!" +else + echo "Starting in background..." + nohup node server.mjs > server.log 2>&1 & + echo "✅ Server started in background (PID: $!). Logs in server.log" +fi + +echo "🎉 Deployment complete!" diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..ffa67e3 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,12 @@ +services: + viz: + build: . + container_name: orfel-viz + restart: unless-stopped + ports: + - "3000:3000" + environment: + - NODE_ENV=production + - PORT=3000 + volumes: + - ./data:/app/data