Add Docker support with runtime environment variable configuration

- Remove temporary arne.js file
- Add runtime configuration via window.__RUNTIME_CONFIG__
- Create public/config.template.js for hostname injection
- Add Dockerfile with multi-stage build (node + nginx)
- Add docker-entrypoint.sh to generate config.js at startup
- Add .dockerignore
- Update all components to use runtime config instead of arne.js
- Update index.html to load config.js before app

This allows deploying the same Docker image to different environments
by setting the API_HOSTNAME environment variable at runtime.

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
2026-05-30 22:25:59 +02:00
parent 2d7c620c6a
commit bc32ce5fc5
9 changed files with 44 additions and 16 deletions
+7 -8
View File
@@ -28,7 +28,6 @@
<script>
import { mapState } from "vuex";
import arne from "../../arne.js";
export default {
data() {
return {
@@ -168,7 +167,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music/rand`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music/rand`,
responseType: "blob",
onDownloadProgress: (progressEvent) => {
let percentCompleted = Math.round(
@@ -198,7 +197,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music/rand/low`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music/rand/low`,
responseType: "blob",
onDownloadProgress: (progressEvent) => {
let percentCompleted = Math.round(
@@ -228,7 +227,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music/addPlayed`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music/addPlayed`,
})
.then(() => {
resolve(false);
@@ -243,7 +242,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music/addQue`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music/addQue`,
})
.then(() => {
resolve(false);
@@ -258,7 +257,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music/info`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music/info`,
})
.then((response) => {
let gameInfoObject = {
@@ -280,7 +279,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music/list`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music/list`,
})
.then((response) => {
let tracklistArray = response.data;
@@ -297,7 +296,7 @@ export default {
return new Promise((resolve, reject) => {
this.axios({
method: "get",
url: `${arne.hostname}/music?song=${trackNumber}`,
url: `${window.__RUNTIME_CONFIG__.API_HOSTNAME}/music?song=${trackNumber}`,
responseType: "blob",
})
.then((response) => {