From 9507d1151bc90675afaa9d588606a2c776a0d05f Mon Sep 17 00:00:00 2001
From: jailsonsb2 <jailson.sb2@gmail.com>
Date: Sun, 2 Aug 2026 15:29:10 -0300
Subject: [PATCH 1/6] feat: configuracao em runtime via config.js

Extrai RADIO_NAME e URL_STREAMING do js/script.js para um config.js
carregado antes dele. O script.js mantem os valores atuais como fallback,
entao o player continua funcionando identico se o config.js nao existir.

Prepara o terreno para o Docker, onde o config.js e gerado na subida do
container a partir de variaveis de ambiente (issue #16).

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 config.js    | 23 +++++++++++++++++++++++
 index.html   |  1 +
 js/script.js | 17 +++++++++++++----
 3 files changed, 37 insertions(+), 4 deletions(-)
 create mode 100644 config.js

diff --git a/config.js b/config.js
new file mode 100644
index 0000000..454dbc5
--- /dev/null
+++ b/config.js
@@ -0,0 +1,23 @@
+// Configuração do player — edite este arquivo para apontar para a sua rádio.
+//
+// Se você estiver rodando via Docker, NÃO edite aqui: este arquivo é gerado
+// automaticamente na subida do container a partir das variáveis de ambiente
+// (RADIO_NAME, URL_STREAMING, ...). Veja a seção Docker do README.
+//
+// Se este arquivo não existir, o js/script.js cai nos valores padrão dele.
+window.RADIO_CONFIG = {
+    // Nome da rádio, exibido no topo e no título da página
+    RADIO_NAME: 'Jailson Web Rádio',
+
+    // URL do stream. Suporta ICECAST, ZENO, SHOUTCAST, RADIOJAR e outros.
+    URL_STREAMING: 'https://stream.zeno.fm/yn65fsaurfhvv',
+
+    // Opcionais: por padrão as URLs da API de metadados são derivadas do
+    // URL_STREAMING. Só preencha se você usa a sua própria API.
+    // API_URL: '',
+    // FALLBACK_API_URL: '',
+
+    // Opcionais: sobrescrevem as variáveis de tema do css/style.css
+    // ACCENT_COLOR: '#00e1e7',
+    // BG_COLOR: '#0b0e13',
+};
diff --git a/index.html b/index.html
index 21a964a..6c46c0d 100644
--- a/index.html
+++ b/index.html
@@ -132,6 +132,7 @@ <h3 id="lyricsSong">Letra</h3>
         </div>
     </div>
 
+    <script type="text/javascript" src="config.js"></script>
     <script type="text/javascript" src="js/script.js"></script>
     <script>
         // Modal de letra (o script sinaliza que há letra disponível
diff --git a/js/script.js b/js/script.js
index c127a22..b06af0e 100644
--- a/js/script.js
+++ b/js/script.js
@@ -1,11 +1,20 @@
-const RADIO_NAME = 'Jailson Web Rádio';
+// A configuração vem do config.js (que o Docker gera a partir das variáveis de
+// ambiente). Os valores abaixo são o fallback usado quando não há config.js.
+const CONFIG = window.RADIO_CONFIG || {};
+
+// RADIO NAME
+const RADIO_NAME = CONFIG.RADIO_NAME || 'Jailson Web Rádio';
 
 // Change Stream URL Here, Supports, ICECAST, ZENO, SHOUTCAST, RADIOJAR and any other stream service.
-const URL_STREAMING = 'https://stream.zeno.fm/yn65fsaurfhvv';
+const URL_STREAMING = CONFIG.URL_STREAMING || 'https://stream.zeno.fm/yn65fsaurfhvv';
 
 //API URL /
-const API_URL = 'https://api.twj.es/?url='+URL_STREAMING;
-const FALLBACK_API_URL = 'https://api.twj.es/metadata/?url=' + URL_STREAMING;
+const API_URL = CONFIG.API_URL || 'https://api.twj.es/?url='+URL_STREAMING;
+const FALLBACK_API_URL = CONFIG.FALLBACK_API_URL || 'https://api.twj.es/metadata/?url=' + URL_STREAMING;
+
+// Tema opcional (usado pelas variáveis de ambiente do Docker)
+if (CONFIG.ACCENT_COLOR) document.documentElement.style.setProperty('--accent', CONFIG.ACCENT_COLOR);
+if (CONFIG.BG_COLOR) document.documentElement.style.setProperty('--bg', CONFIG.BG_COLOR);
 
 let userInteracted = true;
 

From cc48d931f50b1a1daba349fc93d01f686ff567da Mon Sep 17 00:00:00 2001
From: jailsonsb2 <jailson.sb2@gmail.com>
Date: Sun, 2 Aug 2026 15:31:49 -0300
Subject: [PATCH 2/6] feat: suporte a Docker (nginx + config por variavel de
 ambiente)

Dockerfile baseado em nginx:alpine servindo os estaticos. Um script em
/docker-entrypoint.d/ gera config.js e manifest.json a partir das variaveis
de ambiente na subida do container, entao trocar de radio nao exige
rebuildar a imagem.

- docker/nginx.conf: no-store nos arquivos gerados e no-cache no
  service-worker/index.html, senao mudar a env var nao surte efeito
- .gitattributes: eol=lf nos arquivos do container (CRLF quebra o shebang)
- LICENSE embarcada na imagem (obrigacao da AGPL para quem hospeda)

Closes #16

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 .dockerignore                   | 12 ++++++++
 .gitattributes                  |  6 ++++
 Dockerfile                      | 38 ++++++++++++++++++++++++
 docker-compose.yml              | 19 ++++++++++++
 docker/40-radioplayer-config.sh | 51 +++++++++++++++++++++++++++++++++
 docker/nginx.conf               | 47 ++++++++++++++++++++++++++++++
 6 files changed, 173 insertions(+)
 create mode 100644 .dockerignore
 create mode 100644 Dockerfile
 create mode 100644 docker-compose.yml
 create mode 100644 docker/40-radioplayer-config.sh
 create mode 100644 docker/nginx.conf

diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 0000000..e3c1a03
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,12 @@
+.git
+.github
+.claude
+.gitattributes
+Dockerfile
+.dockerignore
+docker-compose.yml
+*.md
+
+# Gerado dentro do container a partir das variáveis de ambiente.
+config.js
+manifest.json
diff --git a/.gitattributes b/.gitattributes
index dfe0770..9b99870 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -1,2 +1,8 @@
 # Auto detect text files and perform LF normalization
 * text=auto
+
+# Arquivos consumidos dentro do container Linux: CRLF quebra o shebang do
+# entrypoint e a configuração do nginx.
+*.sh text eol=lf
+Dockerfile text eol=lf
+docker/* text eol=lf
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..a40b43d
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,38 @@
+FROM nginx:1.27-alpine
+
+LABEL org.opencontainers.image.title="RadioPlayer" \
+      org.opencontainers.image.description="Player de rádio HTML5 com now playing, capa do álbum, letra e PWA" \
+      org.opencontainers.image.source="https://github.com/jailsonsb2/RadioPlayer" \
+      org.opencontainers.image.licenses="AGPL-3.0-or-later"
+
+# Configuração padrão: sem nenhuma variável de ambiente o container sobe
+# funcionando, tocando a rádio da demo.
+ENV RADIO_NAME="Jailson Web Rádio" \
+    URL_STREAMING="https://stream.zeno.fm/yn65fsaurfhvv" \
+    API_URL="" \
+    FALLBACK_API_URL="" \
+    ACCENT_COLOR="" \
+    BG_COLOR="" \
+    THEME_COLOR="#0b0e13"
+
+COPY css/ /usr/share/nginx/html/css/
+COPY fonts/ /usr/share/nginx/html/fonts/
+COPY img/ /usr/share/nginx/html/img/
+COPY js/ /usr/share/nginx/html/js/
+COPY index.html service-worker.js llms.txt /usr/share/nginx/html/
+
+# A AGPL-3.0 acompanha o binário: quem redistribui ou hospeda esta imagem
+# precisa dela junto.
+COPY LICENSE /usr/share/nginx/html/LICENSE
+
+COPY docker/nginx.conf /etc/nginx/conf.d/default.conf
+
+# A imagem oficial do nginx executa tudo em /docker-entrypoint.d/ antes de
+# subir o servidor — é onde geramos config.js e manifest.json.
+COPY docker/40-radioplayer-config.sh /docker-entrypoint.d/40-radioplayer-config.sh
+RUN chmod +x /docker-entrypoint.d/40-radioplayer-config.sh
+
+EXPOSE 80
+
+HEALTHCHECK --interval=30s --timeout=5s --start-period=5s --retries=3 \
+    CMD wget -q --spider http://localhost/index.html || exit 1
diff --git a/docker-compose.yml b/docker-compose.yml
new file mode 100644
index 0000000..9a845b0
--- /dev/null
+++ b/docker-compose.yml
@@ -0,0 +1,19 @@
+services:
+  radioplayer:
+    # Para usar a imagem pronta, troque o build por:
+    # image: ghcr.io/jailsonsb2/radioplayer:latest
+    build: .
+    image: ghcr.io/jailsonsb2/radioplayer:latest
+    container_name: radioplayer
+    ports:
+      - "8080:80"
+    environment:
+      RADIO_NAME: "Jailson Web Rádio"
+      URL_STREAMING: "https://stream.zeno.fm/yn65fsaurfhvv"
+      # ACCENT_COLOR: "#00e1e7"
+      # BG_COLOR: "#0b0e13"
+      # THEME_COLOR: "#0b0e13"
+    # Logo da sua rádio (192x192 ou maior, quadrado)
+    # volumes:
+    #   - ./cover.png:/usr/share/nginx/html/img/cover.png:ro
+    restart: unless-stopped
diff --git a/docker/40-radioplayer-config.sh b/docker/40-radioplayer-config.sh
new file mode 100644
index 0000000..645cc01
--- /dev/null
+++ b/docker/40-radioplayer-config.sh
@@ -0,0 +1,51 @@
+#!/bin/sh
+# Gera config.js e manifest.json a partir das variáveis de ambiente.
+# Executado pelo entrypoint da imagem oficial do nginx, antes do servidor subir.
+set -e
+
+HTML_DIR="${HTML_DIR:-/usr/share/nginx/html}"
+
+# Escapa para uso dentro de uma string JSON/JS entre aspas duplas.
+esc() {
+    printf '%s' "$1" | sed -e 's/\\/\\\\/g' -e 's/"/\\"/g'
+}
+
+# --- config.js -------------------------------------------------------------
+{
+    echo '// Gerado automaticamente pelo container a partir das variáveis de'
+    echo '// ambiente. Não edite: qualquer alteração some no próximo restart.'
+    echo 'window.RADIO_CONFIG = {'
+    echo "    RADIO_NAME: \"$(esc "$RADIO_NAME")\","
+    echo "    URL_STREAMING: \"$(esc "$URL_STREAMING")\","
+    if [ -n "$API_URL" ]; then echo "    API_URL: \"$(esc "$API_URL")\","; fi
+    if [ -n "$FALLBACK_API_URL" ]; then echo "    FALLBACK_API_URL: \"$(esc "$FALLBACK_API_URL")\","; fi
+    if [ -n "$ACCENT_COLOR" ]; then echo "    ACCENT_COLOR: \"$(esc "$ACCENT_COLOR")\","; fi
+    if [ -n "$BG_COLOR" ]; then echo "    BG_COLOR: \"$(esc "$BG_COLOR")\","; fi
+    echo '};'
+} > "$HTML_DIR/config.js"
+
+# --- manifest.json ---------------------------------------------------------
+# PWA_NAME/PWA_SHORT_NAME são opcionais; por padrão seguem o nome da rádio.
+PWA_NAME="${PWA_NAME:-$RADIO_NAME}"
+PWA_SHORT_NAME="${PWA_SHORT_NAME:-$PWA_NAME}"
+BG="${BG_COLOR:-#0b0e13}"
+
+cat > "$HTML_DIR/manifest.json" <<EOF
+{
+  "name": "$(esc "$PWA_NAME")",
+  "short_name": "$(esc "$PWA_SHORT_NAME")",
+  "start_url": "./index.html",
+  "display": "standalone",
+  "background_color": "$(esc "$BG")",
+  "theme_color": "$(esc "$THEME_COLOR")",
+  "icons": [
+    {
+      "src": "img/cover.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    }
+  ]
+}
+EOF
+
+echo "radioplayer: configurado para \"$RADIO_NAME\" ($URL_STREAMING)"
diff --git a/docker/nginx.conf b/docker/nginx.conf
new file mode 100644
index 0000000..ad57af9
--- /dev/null
+++ b/docker/nginx.conf
@@ -0,0 +1,47 @@
+server {
+    listen 80;
+    server_name _;
+
+    root /usr/share/nginx/html;
+    index index.html;
+
+    gzip on;
+    gzip_min_length 256;
+    gzip_types text/plain text/css application/javascript application/json image/svg+xml;
+
+    # Arquivos gerados a partir das variáveis de ambiente: se o browser cachear,
+    # trocar a env var não surte efeito. Nunca cachear.
+    location = /config.js {
+        add_header Cache-Control "no-store" always;
+    }
+    location = /manifest.json {
+        add_header Cache-Control "no-store" always;
+    }
+
+    # O service worker precisa ser revalidado sempre, senão uma versão antiga
+    # continua servindo o app do cache dela para sempre.
+    location = /service-worker.js {
+        add_header Cache-Control "no-cache" always;
+    }
+
+    location = /index.html {
+        add_header Cache-Control "no-cache" always;
+    }
+
+    # Imagens e fontes praticamente não mudam.
+    location ~* \.(png|jpe?g|gif|svg|ico|woff2?|ttf|eot)$ {
+        expires 7d;
+        add_header Cache-Control "public, max-age=604800" always;
+    }
+
+    # CSS e JS mudam a cada atualização da imagem — cache curto para que um
+    # `docker pull` novo apareça rápido.
+    location ~* \.(css|js)$ {
+        expires 1h;
+        add_header Cache-Control "public, max-age=3600" always;
+    }
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}

From a4e7578d255348b0056688c8fe08d1a4893b8585 Mon Sep 17 00:00:00 2001
From: jailsonsb2 <jailson.sb2@gmail.com>
Date: Sun, 2 Aug 2026 15:33:16 -0300
Subject: [PATCH 3/6] fix: service worker com caminhos relativos e
 rede-primeiro no config

Os caminhos absolutos ('/index.html', '/js/script.js') davam 404 quando o
site fica em subdiretorio, como o /RadioPlayer/ do GitHub Pages: o
cache.addAll rejeitava e a instalacao do service worker falhava inteira,
entao o PWA nunca funcionou na demo. Agora sao relativos ao proprio worker,
o que serve tanto a raiz (Docker) quanto o subdiretorio.

Outras correcoes na mesma linha:
- cache.add individual: um arquivo ausente nao derruba mais a instalacao
- config.js e manifest.json em rede-primeiro, senao trocar a variavel de
  ambiente no Docker nao surtiria efeito para quem ja visitou a pagina
- requisicoes cross-origin passam direto: interceptar o stream de audio, a
  API de metadados e as capas nao traz beneficio e pode atrapalhar o player
- clients.claim() para o worker novo assumir na hora

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 service-worker.js | 92 +++++++++++++++++++++++++++++++++++++----------
 1 file changed, 74 insertions(+), 18 deletions(-)

diff --git a/service-worker.js b/service-worker.js
index 103e94a..976c351 100644
--- a/service-worker.js
+++ b/service-worker.js
@@ -1,24 +1,40 @@
 // Define o nome do cache (bump da versão invalida o layout antigo em cache)
-const CACHE_NAME = 'web-radio-v3';
+const CACHE_NAME = 'web-radio-v4';
 
-// Lista de arquivos a serem cacheados
+// Lista de arquivos a serem cacheados.
+// Os caminhos são relativos ao service worker de propósito: assim o app
+// funciona tanto na raiz do domínio (Docker, domínio próprio) quanto em um
+// subdiretório, como o /RadioPlayer/ do GitHub Pages.
 const urlsToCache = [
-  '/',
-  '/index.html',
-  '/css/style.css',
-  '/js/script.js',
-  '/img/cover.png',
-  '/img/radiosnet.png',
+  './',
+  './index.html',
+  './config.js',
+  './css/style.css',
+  './js/script.js',
+  './img/cover.png',
+  './img/radiosnet.png',
   // Adicione outros recursos que deseja cache aqui
 ];
 
+// Arquivos que mudam com a configuração do site (o Docker gera os dois na
+// subida do container): sempre buscar da rede antes de usar o cache, senão
+// trocar a rádio não surte efeito para quem já visitou a página.
+const networkFirst = ['./config.js', './manifest.json'];
+
 // Instala o Service Worker e adiciona os arquivos ao cache
 self.addEventListener('install', function(event) {
   event.waitUntil(
     caches.open(CACHE_NAME)
       .then(function(cache) {
         console.log('Cache aberto');
-        return cache.addAll(urlsToCache);
+        // Cada arquivo é adicionado individualmente: com cache.addAll um único
+        // arquivo ausente faz a instalação inteira falhar e o app fica sem
+        // service worker nenhum.
+        return Promise.all(urlsToCache.map(function(url) {
+          return cache.add(url).catch(function(error) {
+            console.warn('Não foi possível cachear ' + url, error);
+          });
+        }));
       })
   );
   self.skipWaiting();
@@ -32,22 +48,62 @@ self.addEventListener('activate', function(event) {
         keys.filter(function(key) { return key !== CACHE_NAME; })
             .map(function(key) { return caches.delete(key); })
       );
+    }).then(function() {
+      return self.clients.claim();
     })
   );
 });
 
+// Busca na rede e, dando certo, atualiza o cache.
+function fetchAndCache(request) {
+  return fetch(request).then(function(response) {
+    if (response && response.ok && response.type === 'basic') {
+      const copy = response.clone();
+      caches.open(CACHE_NAME).then(function(cache) {
+        cache.put(request, copy);
+      });
+    }
+    return response;
+  });
+}
+
 // Intercepta as solicitações e serve os arquivos em cache se disponíveis
 self.addEventListener('fetch', function(event) {
+  const request = event.request;
+
+  // Só cuidamos dos arquivos do próprio app. O stream de áudio, a API de
+  // metadados e as capas vêm de outros domínios e devem passar direto para o
+  // browser — interceptar o stream pode atrapalhar a reprodução.
+  if (request.method !== 'GET') return;
+  if (new URL(request.url).origin !== self.location.origin) return;
+
+  const path = new URL(request.url).pathname;
+  const isNetworkFirst = request.mode === 'navigate' || networkFirst.some(function(file) {
+    return path.endsWith(file.replace('./', '/'));
+  });
+
+  if (isNetworkFirst) {
+    // Rede primeiro, cache como plano B quando estiver offline.
+    event.respondWith(
+      fetchAndCache(request).catch(function() {
+        return caches.match(request).then(function(cached) {
+          return cached || caches.match('./index.html');
+        });
+      })
+    );
+    return;
+  }
+
+  // Demais arquivos: cache primeiro (rápido), atualizando em segundo plano.
   event.respondWith(
-    caches.match(event.request)
-      .then(function(response) {
-        // Cache hit - retorna a resposta do cache
-        if (response) {
-          return response;
-        }
-        // Não encontrado no cache - busca na rede
-        return fetch(event.request);
+    caches.match(request).then(function(response) {
+      if (response) {
+        // Cache hit - retorna a resposta do cache e revalida por trás
+        event.waitUntil(fetchAndCache(request).catch(function() {}));
+        return response;
       }
-    )
+      // Não encontrado no cache - busca na rede
+      return fetchAndCache(request);
+    })
   );
 });

From 455cbef1980aca6c3cc21e5b5d5e0167f75d77b8 Mon Sep 17 00:00:00 2001
From: jailsonsb2 <jailson.sb2@gmail.com>
Date: Sun, 2 Aug 2026 15:34:33 -0300
Subject: [PATCH 4/6] docs: documenta Docker e publica a imagem no GHCR

Workflow multi-arch (amd64 + arm64, cobrindo Raspberry Pi e NAS ARM) que
builda em pull request e publica na main e em tags. O nome da imagem e
passado para minusculas porque o GHCR nao aceita maiuscula e o repositorio
se chama RadioPlayer.

README: secao Docker com a tabela de variaveis de ambiente, e a secao de
configuracao agora aponta para o config.js em vez do js/script.js.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 .github/workflows/docker.yml | 64 ++++++++++++++++++++++++++++++++++++
 README.md                    | 64 ++++++++++++++++++++++++++++++++----
 2 files changed, 121 insertions(+), 7 deletions(-)
 create mode 100644 .github/workflows/docker.yml

diff --git a/.github/workflows/docker.yml b/.github/workflows/docker.yml
new file mode 100644
index 0000000..20eff15
--- /dev/null
+++ b/.github/workflows/docker.yml
@@ -0,0 +1,64 @@
+name: Docker
+
+on:
+  push:
+    branches: [main]
+    tags: ['v*']
+  pull_request:
+    branches: [main]
+
+env:
+  REGISTRY: ghcr.io
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+
+    steps:
+      - uses: actions/checkout@v4
+
+      # O GHCR só aceita nome de imagem em minúsculas e este repositório tem
+      # maiúscula no nome (RadioPlayer).
+      - name: Nome da imagem em minúsculas
+        id: image
+        run: echo "name=${GITHUB_REPOSITORY,,}" >> "$GITHUB_OUTPUT"
+
+      - uses: docker/setup-qemu-action@v3
+
+      - uses: docker/setup-buildx-action@v3
+
+      # Em pull request só buildamos para validar; publicar é só na main/tag.
+      - name: Login no GHCR
+        if: github.event_name != 'pull_request'
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Metadados (tags e labels)
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ${{ env.REGISTRY }}/${{ steps.image.outputs.name }}
+          tags: |
+            type=raw,value=latest,enable={{is_default_branch}}
+            type=ref,event=branch
+            type=semver,pattern={{version}}
+            type=semver,pattern={{major}}.{{minor}}
+            type=sha,format=short
+
+      - name: Build e push
+        uses: docker/build-push-action@v6
+        with:
+          context: .
+          # arm64 cobre Raspberry Pi e NAS ARM, público comum de self-hosting.
+          platforms: linux/amd64,linux/arm64
+          push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
diff --git a/README.md b/README.md
index d711c74..d46af32 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,7 @@
 [![License: AGPL-3.0](https://img.shields.io/badge/License-AGPL--3.0-blue.svg)](LICENSE)
 [![No API Key](https://img.shields.io/badge/API_key-not_required-orange)](#data-sources)
 [![PWA Ready](https://img.shields.io/badge/PWA-installable-5A0FC8)](#progressive-web-app-pwa)
+[![Docker](https://img.shields.io/badge/Docker-ghcr.io-2496ED?logo=docker&logoColor=white)](#-docker)
 
 **[▶ Try the live demo](https://jailsonsb2.github.io/RadioPlayer/)** — a modern, dependency-free **HTML5 radio player** for any stream (**Icecast, Shoutcast, Zeno.FM, RadioJar, Azuracast** and more): the album art of the current song becomes a blurred full-page backdrop, with glass-style circular controls on top. Now playing metadata, album art, song lyrics, recently played history, **YouTube clip mode** and installable **PWA** — no Bootstrap, no jQuery, no API key. Just HTML, CSS and vanilla JavaScript.
 
@@ -49,17 +50,19 @@
 
 ## How do I add this radio player to my website?
 
-Open [js/script.js](js/script.js) and edit the lines below:
+Open [config.js](config.js) and edit the lines below:
 
 ```javascript
-// RADIO NAME
-const RADIO_NAME = 'Your Radio Name';
+window.RADIO_CONFIG = {
+    // RADIO NAME
+    RADIO_NAME: 'Your Radio Name',
 
-// Change Stream URL Here. Supports ICECAST, ZENO, SHOUTCAST, RADIOJAR and any other stream service.
-const URL_STREAMING = 'https://stream.zeno.fm/yn65fsaurfhvv';
+    // Change Stream URL Here. Supports ICECAST, ZENO, SHOUTCAST, RADIOJAR and any other stream service.
+    URL_STREAMING: 'https://stream.zeno.fm/yn65fsaurfhvv',
+};
 ```
 
-The metadata API URLs are derived from `URL_STREAMING` automatically.
+The metadata API URLs are derived from `URL_STREAMING` automatically. If `config.js` is missing, the player falls back to the defaults in [js/script.js](js/script.js).
 
 ### Change Logo
 
@@ -86,11 +89,58 @@ Just put the files in your server or use Free Hosting:
 [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/jailsonsb2/RadioPlayer)
 [![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/jailsonsb2/RadioPlayer)
 
+### 🐳 Docker
+
+Self-hosting? Run it in one line — no need to clone the repo or edit any file:
+
+```bash
+docker run -d -p 8080:80 \
+  -e RADIO_NAME="My Radio" \
+  -e URL_STREAMING="https://stream.zeno.fm/yn65fsaurfhvv" \
+  --name radioplayer ghcr.io/jailsonsb2/radioplayer:latest
+```
+
+The player is at `http://localhost:8080`. Or with Docker Compose — see [docker-compose.yml](docker-compose.yml):
+
+```bash
+docker compose up -d
+```
+
+**Environment variables**
+
+| Variable | Default | Description |
+|---|---|---|
+| `RADIO_NAME` | `Jailson Web Rádio` | Radio name (header, page title, PWA) |
+| `URL_STREAMING` | Zeno.FM demo stream | Stream URL (Icecast, Shoutcast, Zeno.FM, Azuracast...) |
+| `API_URL` | derived from the stream | Only if you run your own metadata API |
+| `FALLBACK_API_URL` | derived from the stream | Fallback metadata endpoint |
+| `ACCENT_COLOR` | `#00e1e7` | Accent color (`--accent`) |
+| `BG_COLOR` | `#0b0e13` | Page background (`--bg`) |
+| `THEME_COLOR` | `#0b0e13` | PWA theme color |
+| `PWA_NAME` | same as `RADIO_NAME` | App name on install |
+| `PWA_SHORT_NAME` | same as `PWA_NAME` | Short name (home screen icon) |
+
+The container generates `config.js` and `manifest.json` from these on startup, so changing a variable and restarting is enough — **no rebuild required**.
+
+**Your own logo** — mount it over the default cover:
+
+```bash
+-v ./my-logo.png:/usr/share/nginx/html/img/cover.png:ro
+```
+
+**Building locally** instead of pulling the image:
+
+```bash
+docker build -t radioplayer .
+```
+
+The image is built for `linux/amd64` and `linux/arm64` (Raspberry Pi, ARM NAS).
+
 ### Progressive Web App (PWA)
 
 When the browser signals that installation is available, an "Install app" button appears (top-right on desktop, bottom of the screen on mobile).
 
-**Note:** after deploying an update, bump the service worker cache version in `service-worker.js` (`CACHE_NAME`) so returning visitors get the new files.
+**Note:** the service worker fetches the HTML and `config.js` from the network first, so a configuration change reaches returning visitors on the next load. After a bigger update (CSS/JS), still bump the cache version in `service-worker.js` (`CACHE_NAME`) to force everything to refresh at once.
 
 ### Configuring Radio Name and Colors (PWA)
 

From 7fd09704c23e66eebdc77dbad475c6c01b724270 Mon Sep 17 00:00:00 2001
From: jailsonsb2 <jailson.sb2@gmail.com>
Date: Sun, 2 Aug 2026 17:27:52 -0300
Subject: [PATCH 5/6] fix: healthcheck em IPv4, charset utf-8 e Cache-Control
 duplicado

Achados ao rodar a imagem de verdade:

- HEALTHCHECK usava localhost, que dentro do container resolve primeiro para
  ::1. O nginx escuta so em IPv4 (listen [::]:80 quebra em container sem
  IPv6), entao o healthcheck dava "connection refused" com o site no ar e o
  container ficava unhealthy. Agora usa 127.0.0.1.
- nginx nao declarava charset: o nome da radio com acento dependia do browser
  adivinhar a codificacao. Agora charset utf-8 tambem em js e json.
- expires somado a add_header Cache-Control mandava o header duplicado
  ("max-age=3600,public, max-age=3600"). Ficou so o expires.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 Dockerfile        |  7 +++++--
 docker/nginx.conf | 10 ++++++++--
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index a40b43d..9437c00 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -34,5 +34,8 @@ RUN chmod +x /docker-entrypoint.d/40-radioplayer-config.sh
 
 EXPOSE 80
 
-HEALTHCHECK --interval=30s --timeout=5s --start-period=5s --retries=3 \
-    CMD wget -q --spider http://localhost/index.html || exit 1
+# 127.0.0.1 e não localhost: dentro do container o localhost resolve primeiro
+# para ::1, e o nginx escuta só em IPv4 (listen [::]:80 quebra em container sem
+# IPv6) — o healthcheck levaria "connection refused" com o site no ar.
+HEALTHCHECK --interval=30s --timeout=5s --start-period=10s --retries=3 \
+    CMD wget -q --spider http://127.0.0.1/index.html || exit 1
diff --git a/docker/nginx.conf b/docker/nginx.conf
index ad57af9..7c0714b 100644
--- a/docker/nginx.conf
+++ b/docker/nginx.conf
@@ -5,6 +5,12 @@ server {
     root /usr/share/nginx/html;
     index index.html;
 
+    # O nome da rádio pode ter acento e vai parar no config.js/manifest.json.
+    # Sem o charset declarado o browser precisa adivinhar a codificação.
+    charset utf-8;
+    charset_types text/css text/plain application/javascript application/json
+                  application/manifest+json image/svg+xml;
+
     gzip on;
     gzip_min_length 256;
     gzip_types text/plain text/css application/javascript application/json image/svg+xml;
@@ -29,16 +35,16 @@ server {
     }
 
     # Imagens e fontes praticamente não mudam.
+    # Só o `expires` — somado a um add_header Cache-Control o header sai
+    # duplicado na resposta.
     location ~* \.(png|jpe?g|gif|svg|ico|woff2?|ttf|eot)$ {
         expires 7d;
-        add_header Cache-Control "public, max-age=604800" always;
     }
 
     # CSS e JS mudam a cada atualização da imagem — cache curto para que um
     # `docker pull` novo apareça rápido.
     location ~* \.(css|js)$ {
         expires 1h;
-        add_header Cache-Control "public, max-age=3600" always;
     }
 
     location / {

From 80ecadf1bc20015b616c7a9ac40d2f0e9c158c6c Mon Sep 17 00:00:00 2001
From: jailsonsb2 <jailson.sb2@gmail.com>
Date: Sun, 2 Aug 2026 17:34:02 -0300
Subject: [PATCH 6/6] docs: notas de operacao do Docker no README

Acrescenta o que so ficou claro rodando a imagem: tamanho real (~76 MB),
healthcheck embarcado, e o aviso de por tras de proxy reverso com HTTPS
(sem origem segura o browser bloqueia o convite de instalar o PWA e a
Media Session API).

Deixa explicito tambem que o container serve o player, nao os metadados:
capa, letra e now playing continuam vindo das APIs publicas.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 README.md | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index d46af32..8a9ab5e 100644
--- a/README.md
+++ b/README.md
@@ -8,7 +8,7 @@
 
 **[▶ Try the live demo](https://jailsonsb2.github.io/RadioPlayer/)** — a modern, dependency-free **HTML5 radio player** for any stream (**Icecast, Shoutcast, Zeno.FM, RadioJar, Azuracast** and more): the album art of the current song becomes a blurred full-page backdrop, with glass-style circular controls on top. Now playing metadata, album art, song lyrics, recently played history, **YouTube clip mode** and installable **PWA** — no Bootstrap, no jQuery, no API key. Just HTML, CSS and vanilla JavaScript.
 
-> 🇧🇷 **Player de rádio online para o seu site — grátis e sem chave de API.** Mostra a música tocando agora com capa do álbum, letra da música, histórico das últimas tocadas e até o **clipe do YouTube sincronizado com a rádio**. Compatível com Icecast, Shoutcast, Zeno.FM e Azuracast. É só editar duas linhas e hospedar em qualquer servidor (ou de graça na Vercel/Netlify/GitHub Pages).
+> 🇧🇷 **Player de rádio online para o seu site — grátis e sem chave de API.** Mostra a música tocando agora com capa do álbum, letra da música, histórico das últimas tocadas e até o **clipe do YouTube sincronizado com a rádio**. Compatível com Icecast, Shoutcast, Zeno.FM e Azuracast. É só editar duas linhas e hospedar em qualquer servidor (ou de graça na Vercel/Netlify/GitHub Pages) — ou subir com **Docker** em um comando, configurando tudo por variável de ambiente.
 
 ## Demo Screenshots
 
@@ -47,6 +47,8 @@
 * Responsive design — mobile-first single column, side-by-side layout on desktop
 * Progressive Web App (PWA) with an "Install app" button when the browser allows it
 * Accent color and surfaces themeable via CSS variables
+* Single-file configuration in [config.js](config.js) — no need to touch the player source
+* 🐳 **Docker image** ready for self-hosting, fully configurable by environment variables ([see below](#-docker))
 
 ## How do I add this radio player to my website?
 
@@ -84,7 +86,7 @@ All the design tokens live at the top of [css/style.css](css/style.css) as CSS v
 
 ## Installation
 
-Just put the files in your server or use Free Hosting:
+Just put the files in your server, run the [Docker image](#-docker), or use Free Hosting:
 
 [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/jailsonsb2/RadioPlayer)
 [![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/jailsonsb2/RadioPlayer)
@@ -134,7 +136,12 @@ The container generates `config.js` and `manifest.json` from these on startup, s
 docker build -t radioplayer .
 ```
 
-The image is built for `linux/amd64` and `linux/arm64` (Raspberry Pi, ARM NAS).
+**Notes**
+
+* Built for `linux/amd64` and `linux/arm64` — Raspberry Pi and ARM NAS included. Image size ≈ 76 MB (nginx alpine + ~1.7 MB of player files).
+* Ships a `HEALTHCHECK`, so Portainer / Unraid / `docker ps` show the real container health.
+* Everything is served over plain HTTP on port 80 inside the container. **Put it behind a reverse proxy with HTTPS** if you expose it to the internet — browsers block the PWA install prompt and the Media Session API on insecure origins.
+* The full album art, lyrics and now playing metadata still come from the public APIs listed in [Data Sources](#data-sources) — the container serves the player, not the metadata.
 
 ### Progressive Web App (PWA)