Removed gitea-ci

.air.toml

@@ -6,7 +6,7 @@ tmp_dir = "tmp"
   bin = "./tmp/main"
   cmd = "go build -o ./tmp/main ./cmd"
   delay = 1000
-  exclude_dir = ["assets", "tmp", "vendor", "testdata"]
+  exclude_dir = ["assets", "tmp", "vendor", "testdata", "frontend", "swagger", "cmd/frontend", "cmd/swagger"]
   exclude_file = []
   exclude_regex = ["_test.go"]
   exclude_unchanged = false

.dockerignore

@@ -1,25 +0,0 @@
-# Directories
-.gitea
-git
-.idea
-testMusic
-testCharacters
-
-# Files
-Dockerfile
-docker-compose*
-compose.yaml
-.dockerignore
-.gitignore
-*.pprof
-main
-conf.yaml
-.env
-
-# Test files and fixtures
-*_test.go
-internal/testutil
-*_dump.sql
-
-# OS
-.DS_Store

.gitea/workflows/ci.yaml

@@ -1,107 +0,0 @@
-name: CI
-
-# Branches and pull requests: unit tests, integration tests and a check that the image builds (amd64 only).
-# Version tags (v1.2.3): the same tests, then build amd64 + arm64 and push the image.
-on:
-  push:
-    branches:
-      - main
-      - develop
-    tags:
-      - "v*.*.*"
-  pull_request:
-  workflow_dispatch:
-
-# A newer push to the same branch cancels the run that is still going.
-concurrency:
-  group: ci-${{ gitea.ref }}
-  cancel-in-progress: true
-
-jobs:
-  test:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-go@v5
-        with:
-          go-version-file: go.mod
-      - name: Generate templ components
-        run: go tool templ generate
-      - name: Vet
-        run: go vet ./... && go vet -tags integration ./...
-      - name: Unit tests
-        run: go test -race ./...
-      - name: Cross-compile for arm64
-        run: GOOS=linux GOARCH=arm64 CGO_ENABLED=0 go build -o /dev/null ./cmd
-
-  integration:
-    runs-on: ubuntu-latest
-    env:
-      # The test helper stops its own container, so the reaper container is not needed.
-      TESTCONTAINERS_RYUK_DISABLED: "true"
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-go@v5
-        with:
-          go-version-file: go.mod
-      - name: Generate templ components
-        run: go tool templ generate
-      - name: Integration tests (PostgreSQL via testcontainers)
-        run: go test -tags integration -race -timeout 15m ./internal/db/... ./internal/backend/...
-
-  # Checks that the image builds. Runs in parallel with the tests; nothing is pushed.
-  docker:
-    if: ${{ !startsWith(gitea.ref, 'refs/tags/') }}
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: docker/setup-buildx-action@v3
-        with:
-          config-inline: |
-            [registry."gitea.sanplex.xyz/sansan"]
-              http = true
-              insecure = true
-      - name: Login to Gitea
-        uses: docker/login-action@v3
-        with:
-          registry: gitea.sanplex.xyz
-          username: ${{ github.repository_owner }}
-          password: ${{ secrets.TOKEN }}
-      - name: Build (amd64)
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          platforms: linux/amd64
-          push: false
-          cache-from: type=gha
-          cache-to: type=gha,mode=max,ignore-error=true
-
-  # Only for version tags, and only when all tests have passed.
-  publish:
-    if: ${{ startsWith(gitea.ref, 'refs/tags/v') }}
-    needs: [test, integration]
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: docker/setup-buildx-action@v3
-        with:
-          config-inline: |
-            [registry."gitea.sanplex.xyz/sansan"]
-              http = true
-              insecure = true
-      - name: Login to Gitea
-        uses: docker/login-action@v3
-        with:
-          registry: gitea.sanplex.xyz
-          username: ${{ github.repository_owner }}
-          password: ${{ secrets.TOKEN }}
-      - name: Build and push (amd64 + arm64)
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          platforms: linux/amd64,linux/arm64
-          push: true
-          cache-from: type=gha
-          tags: |
-            gitea.sanplex.xyz/sansan/musicserver:${{ gitea.ref_name }}
-            gitea.sanplex.xyz/sansan/musicserver:latest

.gitea/workflows/gitea-release.yaml

@@ -0,0 +1,46 @@
+
+name: Publish
+run-name: ${{ gitea.actor }} is runs ci pipeline
+#on:
+#  release:
+#    types: [published]
+on: [push]
+
+jobs:
+#  test:
+#    runs-on: ubuntu-latest
+#    steps:
+#      - run: echo "The release ${{ gitea.ref }} ${{ gitea.ref_name }} was published"
+  
+  build:
+    runs-on: ubuntu-latest
+#    if: gitea.ref == 'refs/heads/main'
+    steps:
+      - uses: https://github.com/actions/checkout@v4
+  
+  publish:
+    runs-on: ubuntu-latest
+    needs: build
+    if: gitea.ref != 'refs/heads/main'
+    steps:
+      - uses: https://github.com/actions/checkout@v4
+      - name: Set up Docker Buildx
+        uses: https://github.com/docker/setup-buildx-action@v3
+        with:
+          config-inline: |
+            [registry."gitea.sanplex.tech/sansan"]
+              http = true
+              insecure = true            
+      - name: Login to Gitea
+        uses: docker/login-action@v2
+        with:
+          registry: gitea.sanplex.tech
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.TOKEN }}
+      - name: Build and push Docker image
+        uses: https://github.com/docker/build-push-action@v5
+        with:
+          context: .
+          file: ./Dockerfile
+          push: true
+          tags: "gitea.sanplex.tech/sansan/musicserver:${{gitea.ref_name}}, gitea.sanplex.tech/sansan/musicserver:latest"

.gitignore

@@ -3,17 +3,6 @@ tmp
 .idea
 *templ.go
 conf.yaml
+output.css
 compose.yaml
-.env
-cpu.pprof
-main
-
-# Database dumps
-*_dump.sql
-
-# Generated with `just openapi`
-/openapi.json
-/openapi-3.0.json
-
-# Local cover images (COVERS_PATH)
-/covers/
+tailwindcss

.idea/.gitignore

@@ -0,0 +1,8 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml

.idea/MusicServer.iml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module version="4">
+  <component name="Go" enabled="true">
+    <buildTags>
+      <option name="customFlags">
+        <array>
+          <option value="prod" />
+        </array>
+      </option>
+    </buildTags>
+  </component>
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/codeStyles/codeStyleConfig.xml

@@ -0,0 +1,5 @@
+<component name="ProjectCodeStyleConfiguration">
+  <state>
+    <option name="PREFERRED_PROJECT_CODE_STYLE" value="Default" />
+  </state>
+</component>

.idea/dataSources.xml

@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="DataSourceManagerImpl" format="xml" multifile-model="true">
+    <data-source source="LOCAL" name="music_prod@192.168.86.100" uuid="e63caf71-2b1a-400d-9cc4-4b87b1f9b807">
+      <driver-ref>postgresql</driver-ref>
+      <synchronize>true</synchronize>
+      <jdbc-driver>org.postgresql.Driver</jdbc-driver>
+      <jdbc-url>jdbc:postgresql://192.168.86.100:5432/music_prod</jdbc-url>
+    </data-source>
+    <data-source source="LOCAL" name="music_test@192.168.86.100" uuid="d063e147-d7f0-48db-9f04-57a108261ef1">
+      <driver-ref>postgresql</driver-ref>
+      <synchronize>true</synchronize>
+      <jdbc-driver>org.postgresql.Driver</jdbc-driver>
+      <jdbc-url>jdbc:postgresql://192.168.86.100:5432/music_test</jdbc-url>
+    </data-source>
+    <data-source source="LOCAL" name="music_test@ssh.sanplex.xyz" uuid="a9cf3eb8-abc2-479b-9f27-12b4cbbfc321">
+      <driver-ref>postgresql</driver-ref>
+      <synchronize>true</synchronize>
+      <jdbc-driver>org.postgresql.Driver</jdbc-driver>
+      <jdbc-url>jdbc:postgresql://ssh.sanplex.xyz:9432/music_test</jdbc-url>
+    </data-source>
+    <data-source source="LOCAL" name="music_prod@ssh.sanplex.xyz" uuid="20917ace-4e9a-4273-bdb7-13ebc774cbba">
+      <driver-ref>postgresql</driver-ref>
+      <synchronize>true</synchronize>
+      <jdbc-driver>org.postgresql.Driver</jdbc-driver>
+      <jdbc-url>jdbc:postgresql://ssh.sanplex.xyz:9432/music_prod</jdbc-url>
+    </data-source>
+  </component>
+</project>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/MusicServer.iml" filepath="$PROJECT_DIR$/.idea/MusicServer.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>

Dockerfile

@@ -1,45 +1,41 @@
-# The frontend is built and published separately; override to pin a version.
-ARG FRONTEND_IMAGE=gitea.sanplex.xyz/sansan/musicfrontend:latest
+FROM golang:1.23-alpine as build_go
+RUN apk add --no-cache curl
 
-# Stage 1: Build the backend on the build machine and cross-compile for the target platform,
-# so multi-platform builds need no emulation.
-FROM --platform=$BUILDPLATFORM golang:1.26-alpine AS build
-ARG TARGETOS TARGETARCH
 WORKDIR /app
+
 COPY go.mod go.sum ./
-RUN --mount=type=cache,target=/go/pkg/mod go mod download
-COPY cmd/ ./cmd/
-COPY internal/ ./internal/
-RUN --mount=type=cache,target=/go/pkg/mod --mount=type=cache,target=/root/.cache/go-build \
-    go tool templ generate
-RUN --mount=type=cache,target=/go/pkg/mod --mount=type=cache,target=/root/.cache/go-build \
-    CGO_ENABLED=0 GOOS=$TARGETOS GOARCH=$TARGETARCH \
-    go build -trimpath -ldflags="-s -w" -tags timetzdata -o main ./cmd
+RUN go mod download
 
-# Stage 2: Frontend static files (the same for every platform)
-FROM --platform=$BUILDPLATFORM ${FRONTEND_IMAGE} AS frontend
+COPY . .
+#RUN go install github.com/a-h/templ/cmd/templ@latest && \
+#templ generate && \
+#curl -sL https://github.com/tailwindlabs/tailwindcss/releases/latest/download/tailwindcss-linux-x64 -o tailwindcss && \
+#chmod +x tailwindcss && \
+#./tailwindcss-build -i cmd/web/assets/css/input.css -o cmd/web/assets/css/output.css
 
-# Stage 3: Final image. No RUN steps here, so no emulation is needed for other architectures.
-FROM alpine:3.22
-COPY --from=build /etc/ssl/certs/ca-certificates.crt /etc/ssl/certs/
-WORKDIR /app
-COPY --from=build /app/main .
-COPY --from=frontend /usr/share/nginx/html /frontend
+RUN go install github.com/a-h/templ/cmd/templ@latest
+RUN templ generate
+
+# Install and make tailwindcss executable
+RUN curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/tailwindcss-linux-x64 \
+	&& mv tailwindcss-linux-x64 tailwindcss && chmod +x tailwindcss
+CMD ./tailwindcss -i cmd/web/assets/css/input.css -o cmd/web/assets/css/output.css --minify
+
+RUN go build -o main cmd/main.go
+
+# Stage 2, distribution container
+FROM golang:1.23-alpine
+EXPOSE 8080
+VOLUME /sorted
+VOLUME /frontend
+
+ENV DB_HOST ""
+ENV DB_PORT ""
+ENV DB_USERNAME ""
+ENV DB_PASSWORD ""
+ENV DB_NAME ""
+
+COPY --from=build_go /app/main .
 COPY ./songs/ ./songs/
 
-# The music volume must be readable by uid 1000, and writable for the .id file cleanup during sync
-# and for soundtrack uploads (kept in .uploads until finished).
-USER 1000:1000
-EXPOSE 8080
-# Prometheus metrics (METRICS_PORT). Keep it off the public proxy.
-EXPOSE 2112
-VOLUME /sorted
-VOLUME /characters
-
-# Required: DB_HOST, DB_PORT, DB_USERNAME, DB_PASSWORD, DB_NAME, MUSIC_PATH, CHARACTERS_PATH
-# Covers (optional): COVERS_PATH, a writable folder such as a /covers volume, turns covers on.
-# STEAMGRIDDB_API_KEY also turns on the automatic search (SteamGridDB, then AniList).
-# Uploads (optional): UPLOAD_MAX_FILE_MB (default 50) and UPLOAD_MAX_TOTAL_MB (default 2048).
-ENV PORT=8080
-
-CMD ["./main"]
+CMD ./main

app.yaml

@@ -0,0 +1,8 @@
+application: musicserver 
+version: 2.2.0
+runtime: go115
+api_version: go1
+
+handlers:
+- url: /.*
+  script: _go_app

cmd/frontend/.gitignore

@@ -0,0 +1,21 @@
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

cmd/frontend/README.md

@@ -0,0 +1,24 @@
+# music-randomizer-vue
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Lints and fixes files
+```
+npm run lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

cmd/frontend/babel.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}

cmd/frontend/index.js

@@ -0,0 +1,26 @@
+const express = require("express");
+const path = require("path");
+const routes = require("./routes.js");
+const app = express();
+const cors = require("cors");
+/* const bodyParser = require("body-parser"); */
+const PORT = process.env.PORT || 5005;
+const mainUrl = "test";
+
+
+console.log(`Server started on port ${PORT}`);
+
+//app.use(bodyParser.json());
+
+//Routes
+/* app.use(express.static(path.join(__dirname, "public"))); */
+/* app.use(express.static(path.join(__dirname, "assets"))); */
+app.use(express.static(path.join(__dirname)));
+app.use(express.static(path.join(__dirname, "dist")));
+/* app.use(express.static(path.join(__dirname, "public"))); */
+
+/* console.log(__dirname); */
+app.use(cors());
+app.use(routes);
+
+app.listen(PORT, "0.0.0.0");

cmd/frontend/package.json

@@ -0,0 +1,51 @@
+{
+   "name": "music-randomizer-vue",
+   "version": "0.1.0",
+   "private": true,
+   "scripts": {
+      "serve": "vue-cli-service serve",
+      "build": "vue-cli-service build",
+      "lint": "vue-cli-service lint"
+   },
+   "dependencies": {
+      "axios": "^0.21.1",
+      "config.js": "^0.1.0",
+      "core-js": "^3.8.2",
+      "cors": "^2.8.5",
+      "express": "^4.17.1",
+      "nodemon": "^2.0.7",
+      "vue": "^3.0.5",
+      "vue-axios": "^3.2.2",
+      "vuex": "^4.0.0-rc.2"
+   },
+   "devDependencies": {
+      "@vue/cli-plugin-babel": "^4.5.10",
+      "@vue/cli-plugin-eslint": "^4.5.10",
+      "@vue/cli-service": "^4.5.10",
+      "@vue/compiler-sfc": "^3.0.5",
+      "babel-eslint": "^10.1.0",
+      "eslint": "^6.7.2",
+      "eslint-plugin-vue": "^7.4.1"
+   },
+   "eslintConfig": {
+      "root": true,
+      "env": {
+         "node": true
+      },
+      "extends": [
+         "plugin:vue/vue3-essential",
+         "eslint:recommended"
+      ],
+      "parserOptions": {
+         "parser": "babel-eslint"
+      },
+      "rules": {
+         "no-debugger": 1
+      }
+   },
+   "browserslist": [
+      "> 1%",
+      "last 2 versions",
+      "not dead"
+   ]
+}

cmd/frontend/public/cancel-black-36dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="36px" height="36px"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"/></svg>

cmd/frontend/public/index.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="preconnect" href="https://fonts.gstatic.com">
+   <link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

cmd/frontend/public/keyboard_arrow_down-black-36dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="36px" height="36px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"/></svg>

cmd/frontend/public/keyboard_arrow_up-black-36dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="36px" height="36px"><path d="M0 0h24v24H0z" fill="none"/><path d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"/></svg>

cmd/frontend/public/person_add_alt_1-black-36dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="black" width="36px" height="36px"><g><rect fill="none" height="24" width="24"/></g><g><path d="M13,8c0-2.21-1.79-4-4-4S5,5.79,5,8s1.79,4,4,4S13,10.21,13,8z M15,10v2h3v3h2v-3h3v-2h-3V7h-2v3H15z M1,18v2h16v-2 c0-2.66-5.33-4-8-4S1,15.34,1,18z"/></g></svg>

cmd/frontend/public/person_remove-black-36dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="black" width="36px" height="36px"><g><rect fill="none" height="24" width="24"/></g><g><path d="M14,8c0-2.21-1.79-4-4-4S6,5.79,6,8s1.79,4,4,4S14,10.21,14,8z M17,10v2h6v-2H17z M2,18v2h16v-2c0-2.66-5.33-4-8-4 S2,15.34,2,18z"/></g></svg>

cmd/frontend/src/App.vue

@@ -0,0 +1,147 @@
+<template>
+   <the-header @start-sound-test="startSoundTest"></the-header>
+   <the-main ref="theMain"></the-main>
+</template>
+
+<script>
+import TheHeader from "./components/layout/TheHeader.vue";
+import TheMain from "./components/layout/TheMain.vue";
+
+export default {
+   components: {
+      TheHeader,
+      TheMain,
+   },
+   data() {
+      return {
+         screenWidth: 1000,
+      };
+   },
+   computed: {
+      displayWhenDesktop() {
+         if (this.screenWidth > 600) {
+            return true;
+         } else {
+            return false;
+         }
+      },
+   },
+   methods: {
+      startSoundTest() {
+         this.$refs.theMain.startSoundTest();
+      },
+   },
+   mounted() {
+      this.screenWidth = window.innerWidth;
+      window.addEventListener("resize", () => (this.screenWidth = window.innerWidth));
+   },
+};
+</script>
+
+<style>
+* {
+   margin: 0;
+   padding: 0;
+   font-family: Helvetica;
+}
+
+button {
+   background: rgb(54, 54, 54);
+   border-radius: 10px;
+   border-color: #ff9c00;
+   color: #ff9c00;
+   font-size: 1em;
+   padding: 10px;
+   outline: none;
+}
+
+.app {
+   display: flex;
+   height: 100vh;
+}
+
+body {
+   background-color: #555;
+}
+
+/* Global modal stuff */
+
+.modalAni-enter-from,
+.modalAni-leave-to {
+   opacity: 0;
+   transform: translateY(-20px);
+}
+.modalAni-enter-to,
+.modalAni-leave-from {
+   opacity: 1;
+}
+.modalAni-enter-active,
+.modalAni-leave-active {
+   transition: all 0.25s ease-out;
+}
+
+.modal {
+   position: fixed; /* Stay in place */
+   z-index: 10; /* Sit on top */
+   left: 0;
+   top: 0;
+   width: 100%; /* Full width */
+   height: 100%; /* Full height */
+   overflow: hidden;
+   background-color: rgb(0, 0, 0); /* Fallback color */
+   background-color: rgba(0, 0, 0, 0.5); /* Black w/ opacity */
+}
+.modalContainer {
+   background-color: #eeeeee;
+   margin: 10% auto; /* 15% from the top and centered */
+   border: 1px solid #888;
+   width: 50%; /* Could be more or less, depending on screen size */
+}
+.modalWrapper {
+   display: flex;
+   position: relative;
+   flex-wrap: wrap;
+   padding: 10px 40px;
+}
+
+.modalWrapper:last-child {
+   margin-bottom: 50px;
+}
+
+.closeModalImg {
+   position: absolute;
+   right: 8px;
+   top: 8px;
+   cursor: pointer;
+   opacity: 70%;
+}
+.modal h1 {
+   color: black;
+   margin-left: auto;
+   margin-right: auto;
+   padding-top: 10px;
+   font-size: 1.9rem;
+}
+.modal p {
+   color: black;
+}
+
+@media only screen and (max-width: 1000px) {
+   .modalContainer {
+      margin: 10% auto; /* 15% from the top and centered */
+      width: 93%; /* Could be more or less, depending on screen size */
+   }
+   .modalWrapper {
+      padding: 10px 10px;
+   }
+
+   .modalWrapper:last-child {
+      margin-bottom: 10px;
+   }
+
+   .modal h1 {
+      padding-top: 10px;
+      font-size: 1.6rem;
+   }
+}
+</style>

cmd/frontend/src/arne.js

@@ -0,0 +1,3 @@
+export default {
+    hostname: "$HOSTNAME",
+}

cmd/frontend/src/components/items/CurrentlyPlaying.vue

@@ -0,0 +1,95 @@
+<template>
+   <!-- <div class="currentlyPlayingDiv">
+      <div class="textWrapper">
+         <transition-group name="displayingInfo" appear>
+            <p v-if="currentTrackHidden" :key="1">????????</p>
+            <p v-else :key="2">{{ currentGame }}</p>
+            <p v-if="currentTrackHidden" :key="3">??????</p>
+            <p v-else :key="4">{{ currentTrack }}</p>
+         </transition-group>
+      </div>
+   </div> -->
+   <div class="currentlyPlayingDiv">
+      <transition name="displayingInfo">
+         <div v-if="currentTrackHidden" class="textWrapper">
+            <p>????????</p>
+            <p>??????</p>
+         </div>
+         <div v-else class="textWrapper">
+            <p>{{ currentGame }}</p>
+            <p>{{ currentTrack }}</p>
+         </div>
+      </transition>
+   </div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+   computed: {
+      ...mapState(["currentGame", "currentTrack", "currentTrackHidden"]),
+   },
+};
+</script>
+
+<style scoped>
+.displayingInfo-enter-from,
+.displayingInfo-leave-to {
+   opacity: 0;
+}
+.displayingInfo-enter-to,
+.displayingInfo-leave-from {
+   opacity: 1;
+}
+.displayingInfo-enter-active {
+   transition: opacity 0.7s ease-out;
+}
+
+.displayingInfo-leave-active {
+   display: none;
+}
+
+.currentlyPlayingDiv {
+   display: flex;
+   flex-wrap: wrap;
+   justify-content: center;
+   width: 60vw;
+   height: 27vh;
+   margin-right: 0.5vw;
+   color: #ff8800;
+   background-color: #333;
+   border-radius: 10px;
+   text-align: center;
+   overflow: hidden;
+}
+.currentlyPlayingDiv .textWrapper {
+   padding: 0.75vw;
+}
+.currentlyPlayingDiv .textWrapper p {
+   width: 100%;
+   font-size: 2.3em;
+}
+
+.currentlyPlayingDiv p:first-child {
+   margin-top: 1.5vw;
+   margin-bottom: 1.5vw;
+   font-size: 2.8em;
+}
+
+@media only screen and (max-width: 1000px) {
+   .currentlyPlayingDiv {
+      width: 100vw;
+      height: 35vw;
+      margin-right: 0;
+      border-radius: 0px;
+      align-content: center;
+   }
+   .currentlyPlayingDiv .textWrapper p {
+      font-size: 1.1em;
+   }
+   .currentlyPlayingDiv p:first-child {
+      margin-bottom: 2vw;
+      font-size: 1.4em;
+   }
+}
+</style>

cmd/frontend/src/components/items/InspirationWindow.vue

@@ -0,0 +1,170 @@
+<template>
+    <div class="inspirationDiv">
+        <div class="inspirationHeader">
+            <div class="inspirationTitle">
+                <h1>Inspiration</h1>
+            </div>
+            <div  class="searchInput">
+                <input
+                    v-model="searchInputText"
+                    type="text"
+                    @input="searchGame()"
+                    ref="inputField"
+                />
+            </div>
+          <button  @click="clearSearch()">Clear</button>
+        </div>
+        <transition-group
+            tag="ul"
+            name="inspirationList"
+            class="inspirationList"
+            ref="inspirationList"
+        >
+            <li v-for="game in showingGamesList" class="inspirationEntry" :key="game">
+                {{ game }}
+            </li>
+        </transition-group>
+    </div>
+</template>
+
+<script>
+import arne from '../../arne.js'
+import {mapState} from "vuex";
+export default {
+    data() {
+        return {
+            allGamesList: [],
+            showingGamesList: [],
+            scrollDown: true,
+            searchInputText: "",
+        };
+    },
+    computed: {
+        ...mapState(["reloadGamesList"]),
+    },
+    watch: {
+        reloadGamesList(newValue) {
+            if (newValue) {
+                this.reloadGames();
+                this.$store.dispatch("reloadGamesList", false);
+            }
+        }
+    },
+    methods: {
+        clearSearch() {
+          this.searchInputText = "";
+          this.searchGame();
+        },
+        searchGame() {
+            this.showingGamesList = [];
+            for (const game of this.allGamesList) {
+                if (this.searchInputText === "" ||
+                    game.toLowerCase().replace(/\s/g, "")
+                        .includes(this.searchInputText.toLowerCase().replace(/\s/g, ""))) {
+                    this.showingGamesList.push(game);
+                }
+            }
+            if (this.searchInputText.replace(/\s/g, "") !== "") {
+                this.showingGamesList.sort((n1, n2) => {
+                    if (n1 > n2) {
+                        return 1;
+                    }
+                    if (n1 < n2) {
+                        return -1;
+                    }
+                    return 0;
+                });
+            }
+        },
+        scrollInspiration() {
+            let inspirationListDOM = document.querySelector(".inspirationList");
+            let scrollSpeed = 1;
+            let currentScrollLocation = 0;
+
+            currentScrollLocation = inspirationListDOM.scrollTop;
+            this.scrollDown
+                ? inspirationListDOM.scrollBy(0, scrollSpeed)
+                : inspirationListDOM.scrollBy(0, -scrollSpeed);
+
+            if (currentScrollLocation === inspirationListDOM.scrollTop) {
+                this.scrollDown = !this.scrollDown;
+            }
+        },
+        reloadGames() {
+            this.axios({
+                method: "get",
+                url: `${arne.hostname}/music/all`,
+            })
+                .then((response) => {
+                    this.allGamesList = response.data;
+                    this.searchInputText = "";
+                    this.searchGame();
+                    this.$store.dispatch("updateHowManyGames", this.allGamesList.length);
+                })
+                .catch(function(error) {
+                    console.log(error);
+                });
+        }
+    },
+    mounted() {
+        this.reloadGames();
+        window.setInterval(() => {
+            this.scrollInspiration();
+        }, 40);
+    },
+};
+</script>
+
+<style scoped>
+.inspirationDiv {
+    width: 38vw;
+    height: 20vh;
+    color: white;
+}
+
+.inspirationTitle {
+    display: flex;
+    flex: auto;
+    align-items: flex-start;
+    justify-content: flex-start;
+    padding: 5px 10px;
+}
+
+.searchInput {
+    display: flex;
+    flex: auto;
+    align-items: flex-end;
+    justify-content: flex-end;
+    padding: 0 10px;
+}
+
+.inspirationHeader {
+    display: flex;
+    background-color: #333;
+    height: 5vh;
+    justify-content: center;
+    align-items: center;
+}
+
+.inspirationList {
+    display: inline-block;
+    background-color: rgb(66, 66, 66);
+    width: 38vw;
+    height: 22vh;
+    list-style: none;
+    overflow: hidden;
+}
+
+.inspirationEntry {
+    width: 100%;
+    max-width: 38vw;
+    padding: 0.3vh 0.8vh;
+    font-size: 1.2rem;
+}
+
+@media only screen and (max-width: 1000px) {
+    .inspirationDiv {
+        display: none;
+    }
+}
+</style>

cmd/frontend/src/components/items/aboutModal.vue

@@ -0,0 +1,78 @@
+<template>
+   <transition name="modalAni">
+      <div v-if="show" class="modal" @click="checkIfClickShouldCloseModal">
+         <div class="modalContainer">
+            <div class="modalWrapper">
+               <img
+                  class="closeModalImg"
+                  src="cancel-black-36dp.svg"
+                  alt="closeModalIMG"
+                  @click="closeModal"
+               />
+               <h1>Music Player Randomizer v0.1</h1>
+               <p class="descriptionText">
+                  Try your video game music knowledge with this VGM randomizer,
+                  invite your friends and see who is the best.
+               </p>
+               <p class="creditText">
+                  Back-end done by Sebastian Olsson,
+                  <a href="https://twitter.com/Raida91">Twitter</a>
+               </p>
+               <p class="creditText">
+                  Front-end done by Peter Johansson,
+                  <a href="https://twitter.com/WebDevPJ">Twitter</a>
+               </p>
+               <!-- <p class="patchNotesText">
+               Full patch notes can be found
+               <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">here</a>
+            </p> -->
+            </div>
+         </div>
+      </div>
+   </transition>
+</template>
+
+<script>
+export default {
+   data() {
+      return {
+         show: false,
+      };
+   },
+   methods: {
+      closeModal() {
+         this.show = false;
+      },
+      openModal() {
+         this.show = true;
+      },
+      checkIfClickShouldCloseModal(event) {
+         if (event.target.classList[0] === "modal") {
+            this.closeModal();
+         }
+      },
+   },
+};
+</script>
+
+<style scoped>
+p {
+   font-size: 1.2rem;
+   width: 100%;
+}
+
+.descriptionText {
+   margin-top: 35px;
+}
+
+.creditText {
+   margin-top: 30px;
+}
+.creditText:nth-child(5) {
+   margin-top: 0px;
+}
+
+.patchNotesText {
+   margin-top: 20px;
+}
+</style>

cmd/frontend/src/components/items/characterModal.vue

@@ -0,0 +1,160 @@
+<template>
+   <transition name="modalAni">
+      <div v-if="show" class="modal" @click="checkIfClickShouldCloseModal">
+         <div class="modalContainer">
+            <div class="modalWrapper">
+               <img
+                  class="closeModalImg"
+                  src="cancel-black-36dp.svg"
+                  alt="closeModalIMG"
+                  @click="closeModal"
+               />
+               <h1 @click="test">{{ playerName }}, choose your fighter!</h1>
+               <div class="fighterDiv">
+                  <div class="fighter" @click="chooseFighter('Adol')">
+                     <img src="characters/Adol.png" alt="adol" />
+                     <p>Adol Christin</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Link')">
+                     <img src="characters/Link.png" alt="link" />
+                     <p>Link</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Barbarian')">
+                     <img src="characters/Barbarian.png" alt="barbarian" />
+                     <p>Barbarian</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Layton')">
+                     <img src="characters/Layton.png" alt="layton" />
+                     <p>Professor Layton</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Kiryu')">
+                     <img src="characters/Kiryu.png" alt="kiryu" />
+                     <p>Kazuma Kiryu</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Miles')">
+                     <img src="characters/Miles.png" alt="miles" />
+                     <p>Miles Edgeworth</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Lemmings')">
+                     <img src="characters/Lemmings.png" alt="lemmings" />
+                     <p>Lemmings</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Samus')">
+                     <img src="characters/Samus.png" alt="samus" />
+                     <p>Samus</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Kratos')">
+                     <img src="characters/Kratos.png" alt="kratos" />
+                     <p>Kratos</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Aloy')">
+                     <img src="characters/Aloy.png" alt="aloy" />
+                     <p>Aloy</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Sora')">
+                     <img src="characters/Sora.png" alt="sora" />
+                     <p>Sora</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('Raiden')">
+                     <img src="characters/Raiden.png" alt="raiden" />
+                     <p>Raiden</p>
+                  </div>
+                  <div class="fighter" @click="chooseFighter('PaperMario')">
+                     <img src="characters/PaperMario.png" alt="paper mario" />
+                     <p>Paper Mario</p>
+                  </div>
+               </div>
+            </div>
+         </div>
+      </div>
+   </transition>
+</template>
+
+<script>
+export default {
+   data() {
+      return {
+         show: false,
+         playerName: "",
+      };
+   },
+   methods: {
+      closeModal() {
+         this.show = false;
+      },
+      openModal(playerName) {
+         this.playerName = playerName;
+         this.show = true;
+      },
+      checkIfClickShouldCloseModal(event) {
+         if (event.target.classList[0] === "modal") {
+            this.closeModal();
+         }
+      },
+      chooseFighter(profilePicSrc) {
+         let payload = {
+            playerName: this.playerName,
+            profile: "characters/" + profilePicSrc + ".png",
+         };
+         this.$store.dispatch("changePlayerProfile", payload);
+         this.closeModal();
+      },
+   },
+};
+</script>
+
+<style scoped>
+.modalContainer {
+   width: 80%; /* Could be more or less, depending on screen size */
+}
+.fighterDiv {
+   display: flex;
+   width: 100%;
+   justify-content: center;
+   margin-top: 30px;
+   flex-wrap: wrap;
+}
+
+.fighterDiv img {
+   width: 180px;
+   height: 90px;
+}
+
+.fighter {
+   display: flex;
+   flex-wrap: wrap;
+   justify-content: center;
+   text-align: center;
+   width: 14vw;
+   margin-top: 30px;
+}
+.fighter > * {
+   width: 100%;
+}
+.fighter:hover {
+   outline: 1px solid rgb(128, 83, 0);
+   outline-offset: 2px;
+   cursor: pointer;
+}
+.fighter p {
+   margin-top: 8px;
+   font-size: 1.3rem;
+}
+
+@media only screen and (max-width: 1000px) {
+   .modalContainer {
+      width: 95%; /* Could be more or less, depending on screen size */
+   }
+   .fighterDiv {
+      margin-top: 30px;
+   }
+   .fighterDiv img {
+      width: 80px;
+      height: 40px;
+   }
+
+   .fighter {
+      width: 25vw;
+   }
+}
+</style>

cmd/frontend/src/components/items/extraButtons.vue

@@ -0,0 +1,111 @@
+<template>
+    <div class="extraButtonsDiv">
+        <button @click="resetPlaylist">Reset playlist</button>
+        <button @click="resetPoints">Reset points</button>
+        <button @click="syncGames">Sync games</button>
+        <button @click="startSoundTest">Sound test</button>
+    </div>
+</template>
+
+<script>
+import arne from '../../arne.js'
+export default {
+    data() {
+        return {
+            emptyPlaylist: [],
+        };
+    },
+    methods: {
+        async resetPoints() {
+            this.$store.dispatch("resetPlayerScore");
+            this.$store.dispatch("resetPlayerWelcomed");
+            this.$store.dispatch("resetPlayerMatchPoint");
+            this.$store.dispatch("setRoundStarted", false);
+        },
+        async resetPlaylist() {
+            await this.APIresetPlaylist();
+            this.$store.dispatch("updatePlaylistHistory", this.emptyPlaylist);
+            this.$store.dispatch("setCurrentlyLoadingTrack", "N/A");
+            this.$store.dispatch("setCurrentTrackHidden", false);
+        },
+        async syncGames() {
+            await this.APIsyncGames();
+            await this.APIresetPlaylist();
+            this.$store.dispatch("resetPlayerScore");
+            this.$store.dispatch("resetPlayerWelcomed");
+            this.$store.dispatch("resetPlayerMatchPoint");
+            this.$store.dispatch("setRoundStarted", false);
+            this.$store.dispatch("updatePlaylistHistory", this.emptyPlaylist);
+            this.$store.dispatch("setCurrentlyLoadingTrack", "N/A");
+            this.$store.dispatch("setCurrentTrackHidden", false);
+            this.$store.dispatch("reloadGamesList", true);
+        },
+        startSoundTest() {
+            this.$emit("start-sound-test");
+        },
+        APIresetPlaylist() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/reset`,
+                })
+                    .then(() => {
+                        resolve();
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIsyncGames() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/sync`,
+                })
+                    .then(() => {
+                        resolve();
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+    },
+};
+</script>
+
+<style scoped>
+.extraButtonsDiv {
+    display: flex;
+    margin-top: 2px;
+    margin-left: 10px;
+}
+
+button {
+    display: flex;
+    align-items: center;
+    height: 65%;
+    margin-right: 0.4vw;
+    border-radius: 10px;
+    border-width: 1px;
+}
+
+@media only screen and (max-width: 1000px) {
+    .extraButtonsDiv {
+        display: flex;
+        position: relative;
+        flex-wrap: wrap;
+        justify-content: center;
+    }
+
+    button {
+        width: 51vw;
+        height: 40px;
+        margin-bottom: 10px;
+        justify-content: center;
+    }
+}
+</style>

cmd/frontend/src/components/items/mobileMenu.vue

@@ -0,0 +1,136 @@
+<template>
+   <div
+      v-if="show"
+      class="mobileMenu"
+      @click="checkIfClickShouldCloseMobileMenu"
+   >
+      <transition name="mobileMenuAni">
+         <div v-if="showContent" class="mobileMenuContainer">
+            <div class="mobileMenuWrapper">
+               <h1>Menu</h1>
+               <button class="settingsButton" @click="showSettingsModal">
+                  Settings
+               </button>
+               <button class="statisticsButton" @click="showStatisticsModal">
+                  Statistics
+               </button>
+               <button class="aboutButton" @click="showAboutModal">
+                  About
+               </button>
+               <h1>Control</h1>
+               <extra-buttons
+                  @start-sound-test="startSoundTest"
+               ></extra-buttons>
+            </div>
+         </div>
+      </transition>
+   </div>
+</template>
+
+<script>
+import extraButtons from "./extraButtons.vue";
+
+export default {
+   components: {
+      extraButtons,
+   },
+   data() {
+      return {
+         show: false,
+         showContent: false,
+      };
+   },
+   methods: {
+      closeMobileMenu() {
+         this.showContent = false;
+         setTimeout(() => {
+            this.show = false;
+         }, 250);
+      },
+      openMobileMenu() {
+         this.show = true;
+      },
+      openMobileMenuContent() {
+         this.showContent = true;
+      },
+      checkIfClickShouldCloseMobileMenu(event) {
+         if (event.target.classList[0] === "mobileMenu") {
+            this.closeMobileMenu();
+         }
+      },
+      showSettingsModal() {
+         this.show = false;
+         this.showContent = false;
+         this.$emit("show-settings-modal");
+      },
+      showStatisticsModal() {
+         this.show = false;
+         this.showContent = false;
+         this.$emit("show-statistics-modal");
+      },
+      showAboutModal() {
+         this.show = false;
+         this.showContent = false;
+         this.$emit("show-about-modal");
+      },
+      startSoundTest() {
+         this.$emit("start-sound-test");
+      },
+   },
+};
+</script>
+
+<style scoped>
+.mobileMenuAni-enter-from,
+.mobileMenuAni-leave-to {
+   opacity: 0.6;
+   transform: translateX(80vw);
+}
+.mobileMenuAni-enter-to,
+.mobileMenuAni-leave-from {
+   opacity: 1;
+   transform: translateX(0vw);
+}
+.mobileMenuAni-enter-active,
+.mobileMenuAni-leave-active {
+   transition: all 0.3s ease-out;
+}
+
+.mobileMenu {
+   position: fixed;
+   z-index: 8;
+   right: 0;
+   bottom: 0;
+   width: 100%;
+   height: 100%;
+   overflow: hidden;
+   background-color: rgb(0, 0, 0);
+   background-color: rgba(0, 0, 0, 0.5);
+}
+
+.mobileMenuContainer {
+   background-color: #c4c4c4;
+   width: 80vw;
+   height: 100%;
+   margin-left: 20%;
+}
+
+.mobileMenuWrapper {
+   display: flex;
+   position: relative;
+   flex-wrap: wrap;
+   justify-content: center;
+}
+
+h1 {
+   margin: 10px 0px;
+   width: 100%;
+   text-align: center;
+}
+
+button {
+   width: 51vw;
+   height: 40px;
+   margin-bottom: 10px;
+}
+</style>

cmd/frontend/src/components/items/playersWindow.vue

@@ -0,0 +1,354 @@
+<template>
+    <div class="playersWindowDiv">
+        <div @click="toggleDisplay" class="playerListTitle">
+            <img v-if="display" class="arrow arrowToggle" src="keyboard_arrow_up-black-36dp.svg" />
+            <img v-else class="arrow arrowToggle" src="keyboard_arrow_down-black-36dp.svg" />
+            <h1>Players</h1>
+            <img
+                src="person_add_alt_1-black-36dp.svg"
+                alt="addPlayer"
+                class="addPlayerIMG"
+                @click="toggleNewPlayerInput()"
+            />
+        </div>
+        <transition-group tag="div" v-if="display" name="playerList" class="playerList">
+            <div class="player" v-for="player in listOfPlayers" :key="player.playerName">
+                <p>{{ player.playerName }}: {{ player.score }}</p>
+                <img
+                    class="profilePicture"
+                    :src="player.profile"
+                    @click="openCharacterModal(player.playerName)"
+                />
+                <button @click="changeScore(player.playerName, 1)">+1</button>
+                <button @click="changeScore(player.playerName, -1)">-1</button>
+                <img
+                    src="person_remove-black-36dp.svg"
+                    @click="removePlayer(player.playerName)"
+                    alt=""
+                />
+            </div>
+            <div class="newPlayerInput" v-if="showNewPlayerInput === true">
+                <input
+                    v-model="newPlayerInputText"
+                    type="text"
+                    @keypress.enter="addNewPlayer()"
+                    ref="inputField"
+                    placeholder="Player name"
+                />
+                <button @click="addNewPlayer()">Add</button>
+            </div>
+        </transition-group>
+        <winning-modal ref="winningModal"></winning-modal>
+        <character-modal ref="characterModal"></character-modal>
+    </div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+import winningModal from "../items/winningModal.vue";
+import characterModal from "../items/characterModal.vue";
+export default {
+    components: {
+        winningModal,
+        characterModal,
+    },
+    data() {
+        return {
+            showNewPlayerInput: false,
+            newPlayerInputText: "",
+            display: true,
+        };
+    },
+    computed: {
+        ...mapState(["listOfPlayers", "winningScore"]),
+    },
+    methods: {
+        removePlayer(playerName) {
+            this.$store.dispatch("removePlayer", playerName);
+        },
+        newPlayerValidation() {
+            /* Validation variables */
+            let errors = [];
+            let newName = this.newPlayerInputText;
+
+            /* Check for empty value */
+            if (newName.trim() === "") {
+                errors.push("No player name was entered");
+            }
+
+            /* Prepare data of players and check for already entered ones */
+            let copyOfPlayerList = this.listOfPlayers;
+            let arrayOfPlayers = copyOfPlayerList.map((player) => player.playerName.toLowerCase());
+            if (arrayOfPlayers.includes(newName.toLowerCase())) {
+                errors.push("This player already exists");
+            }
+
+            /* Check amount of players */
+            if (arrayOfPlayers.length > 6) {
+                errors.push("Too many players already exists");
+            }
+
+            /* If everything went fine, return an empty  */
+            return errors;
+        },
+        addNewPlayer() {
+            let errors = this.newPlayerValidation();
+            if (errors.length === 0) {
+                this.$store.dispatch("addNewPlayer", this.newPlayerInputText);
+                this.newPlayerInputText = "";
+            } else {
+                console.log(errors);
+            }
+        },
+        toggleNewPlayerInput() {
+            this.showNewPlayerInput = !this.showNewPlayerInput;
+            if (this.showNewPlayerInput === true) {
+                this.$nextTick(() => this.$refs.inputField.focus());
+            }
+        },
+        changeScore(playerName, score) {
+            let payload = {
+                playerName: playerName,
+                score: score,
+            };
+            this.$store.dispatch("changePlayerScore", payload);
+            for (let i = 0; i < this.listOfPlayers.length; i++) {
+                /* If a player received their first point */
+                if (this.listOfPlayers[i].score == 1 && this.listOfPlayers[i].welcomed === false) {
+                    let payload = {
+                        playerName: playerName,
+                        welcomeSet: true,
+                    };
+                    this.$store.dispatch("changePlayerWelcomed", payload);
+                    this.$emit("play-welcome-sound");
+                }
+                /* If a player reach match point */
+                if (this.listOfPlayers[i].score === this.winningScore-1) {
+                    let payload = {
+                        playerName: playerName,
+                        matchPointSet: true,
+                    };
+                    this.$store.dispatch("changePlayerMatchPoint", payload);
+                    this.$emit("play-match-point-sound");
+                }
+                /* If a player won */
+                if (this.listOfPlayers[i].score === this.winningScore) {
+                    this.$refs.winningModal.openModal(this.listOfPlayers[i].playerName);
+                    this.$emit("play-winning-sound");
+                }
+            }
+        },
+        openCharacterModal(playerName) {
+            this.$refs.characterModal.openModal(playerName);
+        },
+        getProfileSrc(profileToGet) {
+            console.log(this.listOfPlayers[0]);
+            let src = `characters/${profileToGet}`;
+            console.log(src);
+            return src;
+        },
+        toggleDisplay(event) {
+            if (event.target.classList[0] != "addPlayerIMG") {
+                if (window.innerWidth < 600) {
+                    this.display = !this.display;
+                }
+            }
+        },
+    },
+};
+</script>
+
+<style scoped>
+.playerList-enter-from,
+.playerList-leave-to {
+    opacity: 0;
+}
+.playerList-enter-to,
+.playerList-leave-from {
+    opacity: 1;
+}
+.playerList-enter-active {
+    transition: all 0.5s ease-out;
+}
+.playerList-leave-active {
+    position: absolute;
+    transition: all 0.2s ease-in;
+}
+.playerList-move {
+    transition: 0.25s;
+    transition-property: transform, opacity;
+}
+.playerList-move.newPlayerInput {
+    transition: 0.2s;
+    transition-property: transform;
+}
+/* End of Animation block */
+
+.playersWindowDiv {
+    display: inline-block;
+    width: 38vw;
+    color: white;
+}
+.playerListTitle {
+    display: flex;
+    width: 100%;
+    background-color: #333;
+    height: 5vh;
+    align-content: center;
+    align-items: center;
+    text-align: center;
+}
+.playerListTitle h1 {
+    text-align: center;
+    position: relative;
+    margin-left: auto;
+    margin-right: auto;
+    flex-grow: 100;
+}
+.playerListTitle .addPlayerIMG {
+    justify-self: flex-end;
+    margin-left: auto;
+    margin-right: 5px;
+    flex-grow: 1;
+    filter: invert(66%) sepia(96%) saturate(2783%) hue-rotate(1deg) brightness(105%) contrast(103%);
+}
+.playerListTitle .arrow {
+    flex-grow: 1;
+}
+.playerListTitle .arrowToggle {
+    display: none;
+}
+.playerList {
+    display: inline-block;
+    background-color: rgb(66, 66, 66);
+    min-height: 37vh;
+}
+.playerList .player {
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: flex-end;
+    width: 38vw;
+    height: 6vh;
+    font-size: 1.8rem;
+    align-content: center;
+    align-items: center;
+}
+
+.playerList .player p {
+    margin-left: 5px;
+    margin-right: auto;
+}
+
+.playerList .player .profilePicture {
+    width: 100px;
+    height: 50px;
+    background-color: red;
+    margin-right: 2vw;
+    cursor: pointer;
+}
+
+.playerList .player button {
+    align-content: center;
+    padding: 3px;
+    width: 50px;
+    height: 4vh;
+    margin-right: 0.6vw;
+    line-height: 0;
+}
+
+.playerList .player button:last-of-type {
+    margin-right: 3vw;
+}
+
+.playerList .player img {
+    margin-right: 5px;
+}
+
+.newPlayerInput {
+    display: flex;
+    width: 38vw;
+    height: 50px;
+    align-items: center;
+    justify-content: center;
+    padding: 5px 0;
+    background-color: rgb(107, 106, 106);
+}
+
+.newPlayerInput p {
+    font-size: 1.3rem;
+    flex-grow: 1;
+    text-align: center;
+}
+
+.newPlayerInput input {
+    height: 70%;
+    width: 250px;
+    font-size: 1.5rem;
+    margin: 0 5px;
+    text-align: center;
+}
+
+.newPlayerInput button {
+    margin: 0 10px;
+    height: 80%;
+    align-self: center;
+}
+
+@media only screen and (max-width: 1000px) {
+    .playersWindowDiv {
+        width: 100%;
+    }
+    .playerListTitle {
+        height: 10vw;
+        font-size: 0.8rem;
+    }
+    .playerListTitle .addPlayerIMG {
+        height: 9vw;
+    }
+    .playerListTitle .arrowToggle {
+        display: block;
+        max-height: 100%;
+        left: 0;
+        filter: invert(77%) sepia(8%) saturate(6%) hue-rotate(317deg) brightness(95%) contrast(87%);
+    }
+    .playerList {
+        width: 100%;
+        height: 60vw;
+        min-height: 190px;
+        overflow: scroll;
+    }
+    .playerList .player {
+        width: 100vw;
+        height: 12vw;
+        font-size: 1rem;
+    }
+    .playerList .player .profilePicture {
+        width: 60px;
+        height: 30px;
+        margin-right: 1.5vw;
+    }
+    .playerList .player button {
+        align-content: center;
+        padding: 3px;
+        width: 45px;
+        height: 10vw;
+        margin-right: 1vw;
+        line-height: 0;
+    }
+
+    .newPlayerInput {
+        width: 100%;
+        height: 30px;
+    }
+    .newPlayerInput input {
+        height: 90%;
+        width: 200px;
+        font-size: 1.2rem;
+    }
+    .newPlayerInput button {
+        margin: 0 10px;
+        height: 40px;
+        border-radius: 2px;
+    }
+}
+</style>

cmd/frontend/src/components/items/playlistHistory.vue

@@ -0,0 +1,191 @@
+<template>
+    <div class="playlistHistoryDiv">
+        <div @click="toggleDisplay" class="playlistHistoryTitle">
+            <h1>Playlist history</h1>
+            <img v-if="display" src="keyboard_arrow_up-black-36dp.svg" alt="" />
+            <img v-else src="keyboard_arrow_down-black-36dp.svg" alt="" />
+        </div>
+        <transition-group
+            tag="div"
+            v-if="display"
+            name="playlistHistory"
+            class="playlistHistory"
+            ref="playlistHistory"
+        >
+            <div
+                class="track"
+                v-for="track in playlistHistory"
+                :key="track.SongNo"
+                @click="playSelectedTrack(track, $event)"
+            >
+                <p
+                    v-if="checkIfHidden(track, playlistHistory)"
+                    :class="{ activeTrack: track.CurrentlyPlaying }"
+                >
+                    ??? - ???
+                </p>
+                <p v-else-if="track.Game !== ''" :class="{ activeTrack: track.CurrentlyPlaying }">
+                    {{ track.SongNo + 1 }}. {{ track.Game }} -
+                    {{ displayTrack(track.Song) }}
+                </p>
+                <span v-if="currentlyLoadingTrack === track.SongNo" class="loadingTrack">
+               -- Loading --
+            </span>
+            </div>
+        </transition-group>
+    </div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+    data() {
+        return {
+            display: true,
+        };
+    },
+    computed: {
+        ...mapState(["playlistHistory", "currentTrackHidden", "currentlyLoadingTrack"]),
+    },
+    methods: {
+        checkIfHidden(track, playlistHistory) {
+            return track.SongNo === playlistHistory.length - 1 && this.currentTrackHidden;
+        },
+        displayTrack(trackName) {
+            /* Todo: Is this if-check necessary? */
+            if (trackName === undefined) {
+                return "";
+            } else {
+                return trackName.replace(".mp3", "");
+            }
+        },
+        playSelectedTrack(track, event) {
+            console.log(event.path);
+            this.$store.dispatch("setCurrentlyLoadingTrack", track.SongNo);
+            this.$emit("play-selected-track", track);
+        },
+        scrollToBottom() {
+            if (this.display) {
+                this.$nextTick(() => {
+                    this.$refs.playlistHistory.$el.scrollTop = this.$refs.playlistHistory.$el.scrollHeight;
+                });
+            }
+        },
+        toggleDisplay() {
+            if (window.innerWidth < 600) {
+                this.display = !this.display;
+            }
+        },
+    },
+    created() {
+        if (window.innerWidth < 600) {
+            this.display = false;
+        }
+    },
+};
+</script>
+
+<style scoped>
+
+/* Scroll */
+
+.playlistHistory::-webkit-scrollbar {
+    width: 17px;
+}
+.playlistHistory {
+    scrollbar-color: #4f5253c2;
+}
+.playlistHistory::-webkit-scrollbar-track {
+    background: #393c4179;
+    border-radius: 5px;
+}
+.playlistHistory::-webkit-scrollbar-thumb {
+    background-color: #6d7679c2;
+    border-radius: 5px;
+    border: 2px solid #3c434e79;
+}
+
+/* End of Scroll */
+
+.playlistHistoryDiv {
+    display: inline-block;
+    width: 60vw;
+    color: white;
+    margin-right: 0.5vw;
+}
+
+.playlistHistoryTitle {
+    display: flex;
+    background-color: #333;
+    height: 5vh;
+    justify-content: center;
+    align-items: center;
+}
+.playlistHistoryTitle img {
+    display: none;
+}
+.playlistHistory {
+    background-color: rgb(66, 66, 66);
+    width: 60vw;
+    height: 37vh;
+    overflow-x: hidden;
+    overflow-y: scroll;
+}
+.playlistHistory .track {
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+    width: 57vw;
+    height: auto;
+    min-height: 30px;
+    line-height: 1.5;
+    font-size: 1.1rem;
+    align-items: center;
+    padding: 0.3vh 0.6vh;
+    cursor: pointer;
+}
+.playlistHistory .track:nth-child(even) {
+    background-color: #4e4e4e;
+}
+.playlistHistory .activeTrack {
+    color: yellow;
+}
+.loadingTrack {
+    color: #ff9c00;
+    margin-left: 20px;
+}
+
+@media only screen and (max-width: 1000px) {
+    .playlistHistory::-webkit-scrollbar {
+        width: 5px;
+    }
+    .playlistHistoryDiv {
+        width: 100%;
+        margin: 0 0 0.3vw;
+    }
+
+    .playlistHistoryTitle {
+        height: 10vw;
+        font-size: 0.8rem;
+    }
+    .playlistHistoryTitle img {
+        display: block;
+        position: absolute;
+        max-height: 100%;
+        left: 0;
+        filter: invert(77%) sepia(8%) saturate(6%) hue-rotate(317deg) brightness(95%) contrast(87%);
+    }
+    .playlistHistory {
+        width: 100vw;
+        height: 56vw;
+    }
+    .playlistHistory .track {
+        width: 98vw;
+        font-size: 0.8rem;
+        padding: 1.5vw 1vw;
+    }
+    .loadingTrack {
+        display: none;
+    }
+}
+</style>

cmd/frontend/src/components/items/settingsModal.vue

@@ -0,0 +1,209 @@
+<template>
+    <!-- Round Settings, Stop after current, Don't hide title -->
+    <transition name="modalAni">
+        <div v-if="show" class="modal" @click="checkIfClickShouldCloseModal">
+            <div class="modalContainer">
+                <div class="modalWrapper">
+                    <img
+                        class="closeModalImg"
+                        src="cancel-black-36dp.svg"
+                        alt="closeModalIMG"
+                        @click="closeModal"
+                    />
+                    <h1>Settings</h1>
+
+                    <div class="checkboxDiv">
+                        <input
+                            type="checkbox"
+                            name="stopAfterCurrent"
+                            id="stopAfterCurrent"
+                            v-model="checkboxStopAfterCurrent"
+                            @change="updateOptionStopAfterCurrent"
+                        />
+                        <label for="stopAfterCurrent">Stop after current</label>
+                    </div>
+                    <div class="checkboxDiv">
+                        <input
+                            type="checkbox"
+                            name="hideTitle"
+                            id="hideTitle"
+                            v-model="checkboxHideTitle"
+                            @change="updateOptionHideTitle"
+                        />
+                        <label for="hideTitle">Hide next track</label>
+                    </div>
+                    <div class="checkboxDiv">
+                        <input
+                            type="checkbox"
+                            name="addPlayed"
+                            id="addPlayed"
+                            v-model="checkboxAddPlayed"
+                            @change="updateOptionAddPlayed"
+                        />
+                        <label for="addPlayed">Turn on played to database</label>
+                    </div>
+                    <div class="checkboxDiv">
+                        <input
+                            type="checkbox"
+                            name="lowPlayed"
+                            id="lowPlayed"
+                            v-model="checkboxLowPlayed"
+                            @change="updateOptionLowPlayed"
+                        />
+                        <label for="lowPlayed">Use low played mode</label>
+                    </div>
+
+                    <div class="winningScoreDiv">
+                        <span>Winning Score: {{ winningScore }}</span>
+                        <button
+                            :class="{ disabled: roundStarted }"
+                            :disabled="roundStarted"
+                            @click="changeScore(-1)"
+                        >
+                            -1
+                        </button>
+                        <button
+                            :class="{ disabled: roundStarted }"
+                            :disabled="roundStarted"
+                            @click="changeScore(1)"
+                        >
+                            +1
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </transition>
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+    data() {
+        return {
+            show: false,
+            checkboxStopAfterCurrent: false,
+            checkboxHideTitle: false,
+            checkboxAddPlayed: false,
+            checkboxLowPlayed: false,
+        };
+    },
+    computed: {
+        ...mapState(["winningScore", "roundStarted", "stopAfterCurrent", "hideNextTrack", "addPlayed", "lowPlayed"]),
+    },
+    methods: {
+        closeModal() {
+            this.show = false;
+        },
+        openModal() {
+            this.show = true;
+        },
+        checkIfClickShouldCloseModal(event) {
+            if (event.target.classList[0] === "modal") {
+                this.closeModal();
+            }
+        },
+        updateOptionHideTitle() {
+            if (this.checkboxHideTitle) {
+                this.$store.dispatch("updateHideNextTitle", true);
+            } else {
+                this.$store.dispatch("updateHideNextTitle", false);
+            }
+        },
+        updateOptionAddPlayed() {
+            if (this.checkboxAddPlayed) {
+                this.$store.dispatch("updateAddPlayed", true);
+            } else {
+                this.$store.dispatch("updateAddPlayed", false);
+            }
+        },
+        updateOptionLowPlayed() {
+            if (this.checkboxLowPlayed) {
+                this.$store.dispatch("updateLowPlayed", true);
+            } else {
+                this.$store.dispatch("updateLowPlayed", false);
+            }
+        },
+        updateOptionStopAfterCurrent() {
+            if (this.checkboxStopAfterCurrent) {
+                this.$store.dispatch("updateStopAfterCurrent", true);
+            } else {
+                this.$store.dispatch("updateStopAfterCurrent", false);
+            }
+        },
+        changeScore(score) {
+            if (score < 0) {
+                this.$store.dispatch("setWinningScore", -1);
+            } else {
+                this.$store.dispatch("setWinningScore", 1);
+            }
+        },
+    },
+    mounted() {
+        this.checkboxStopAfterCurrent = this.stopAfterCurrent;
+        this.checkboxHideTitle = this.hideNextTrack;
+        this.checkboxAddPlayed = this.addPlayed;
+        this.checkboxLowPlayed = this.lowPlayed;
+    },
+};
+</script>
+
+<style scoped>
+.winningScoreDiv {
+    width: 100%;
+    display: inline-flex;
+    align-items: center;
+    flex-wrap: nowrap;
+    margin-top: 30px;
+}
+
+.checkboxDiv {
+    margin: 5px;
+    width: 100%;
+}
+.checkboxDiv:first-of-type {
+    margin-top: 20px;
+}
+.checkboxDiv input {
+    transform: scale(1.3);
+}
+.checkboxDiv label {
+    margin-left: 10px;
+    font-size: 1.5rem;
+}
+
+.winningScoreDiv span {
+    font-size: 1.7rem;
+    margin-right: 10px;
+    width: 245px;
+}
+.winningScoreDiv button {
+    display: flex;
+    width: 50px;
+    height: 33px;
+    background: rgb(16, 99, 194);
+    color: rgb(235, 235, 235);
+    border-color: rgb(161, 161, 161);
+    justify-content: center;
+    align-items: center;
+    line-height: 0;
+    font-size: 1.5rem;
+    margin: 3px;
+}
+
+.disabled {
+    opacity: 50%;
+}
+
+@media only screen and (max-width: 1000px) {
+    .checkboxDiv label {
+        font-size: 1.3rem;
+    }
+
+    .winningScoreDiv span {
+        font-size: 1.3rem;
+        margin-right: 10px;
+        width: 245px;
+    }
+}
+</style>

cmd/frontend/src/components/items/statisticsModal.vue

@@ -0,0 +1,68 @@
+<template>
+   <transition name="modalAni">
+      <div v-if="show" class="modal" @click="checkIfClickShouldCloseModal">
+         <div class="modalContainer">
+            <div class="modalWrapper">
+               <img
+                  class="closeModalImg"
+                  src="cancel-black-36dp.svg"
+                  alt="closeModalIMG"
+                  @click="closeModal"
+               />
+               <h1>Statistics</h1>
+               <p>Total amount of games in the playlist: {{ howManyGames }}</p>
+            </div>
+         </div>
+      </div>
+   </transition>
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+   data() {
+      return {
+         show: false,
+      };
+   },
+   computed: {
+      ...mapState(["howManyGames"]),
+   },
+   methods: {
+      closeModal() {
+         this.show = false;
+      },
+      openModal() {
+         this.show = true;
+      },
+      checkIfClickShouldCloseModal(event) {
+         if (event.target.classList[0] === "modal") {
+            this.closeModal();
+         }
+      },
+   },
+};
+</script>
+
+<style scoped>
+p {
+   font-size: 1.2rem;
+   width: 100%;
+   margin-top: 30px;
+}
+
+.descriptionText {
+   margin-top: 35px;
+}
+
+.creditText {
+   margin-top: 30px;
+}
+.creditText:nth-child(5) {
+   margin-top: 0px;
+}
+
+.patchNotesText {
+   margin-top: 20px;
+}
+</style>

cmd/frontend/src/components/items/winningModal.vue

@@ -0,0 +1,50 @@
+<template>
+    <transition name="modalAni">
+        <div v-if="show" class="modal" @click="checkIfClickShouldCloseModal">
+            <div class="modalContainer">
+                <div class="modalWrapper">
+                    <img
+                        class="closeModalImg"
+                        src="cancel-black-36dp.svg"
+                        alt="closeModalIMG"
+                        @click="closeModal"
+                    />
+                    <h1>{{ playerName }} won!!</h1>
+                </div>
+            </div>
+        </div>
+    </transition>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            show: false,
+            playerName: "",
+        };
+    },
+    methods: {
+        closeModal() {
+            this.show = false;
+        },
+        showPeter() {
+            let randomNumber = Math.floor(Math.random() * 10);
+            console.log(randomNumber);
+            console.log("Test");
+            return randomNumber < 2;
+        },
+        openModal(playerName) {
+            this.playerName = playerName;
+            this.show = true;
+        },
+        checkIfClickShouldCloseModal(event) {
+            if (event.target.classList[0] === "modal") {
+                this.closeModal();
+            }
+        },
+    },
+};
+</script>
+
+<style scoped></style>

cmd/frontend/src/components/layout/TheFooter.vue

@@ -0,0 +1,441 @@
+<template>
+    <footer>
+        <div class="audioAndButtonsDiv">
+            <div class="audioButtonsDiv">
+                <button
+                    class="bigButton"
+                    :class="{ disabled: disableButtons }"
+                    :disabled="disableButtons"
+                    @click="randomizeTrack()"
+                >
+                    <p v-if="!disableButtons"><u>R</u>andomize new track</p>
+                    <p v-else>Loading...</p>
+                </button>
+                <button class="bigButton" @click="showAnswer()"><u>S</u>how answer</button>
+            </div>
+            <div class="audioDiv">
+                <audio
+                    controls
+                    class="audioPlayer"
+                    :src="currentTrackSrcFile"
+                    ref="audioPlayer"
+                    :onended="trackHasEnded"
+                ></audio>
+            </div>
+        </div>
+    </footer>
+</template>
+
+<script>
+import { mapState } from "vuex";
+import arne from "../../arne.js";
+export default {
+    data() {
+        return {
+            currentTrackSrcFile: "",
+            disableButtons: false,
+            loadingBar: "",
+        };
+    },
+    computed: {
+        ...mapState([
+            "stopAfterCurrent",
+            "localPlaylist",
+            "hideNextTrack",
+            "roundStarted",
+            "specialTrackIsPlaying",
+            "addPlayed",
+            "lowPlayed",
+        ]),
+    },
+    methods: {
+        async randomizeTrack() {
+            console.log("Randomizing track");
+            /* Prevents anyone from changing the winning score after the round has started */
+            if (this.roundStarted === false) {
+                this.$store.dispatch("setRoundStarted", true);
+            }
+            let trackAddedToQue = false;
+            this.disableButtons = true;
+            let copyOfPlaylist = this.localPlaylist;
+            setTimeout(() => this.isHidden = false, 2000);
+            //If the local playlist of MP3s is empty, wait for a new track to load
+            if (copyOfPlaylist.length === 0) {
+                console.log("No track preloaded, loading a new one");
+                if (this.lowPlayed) {
+                    await this.APIgetRandomizedLowTrack();
+                } else {
+                    await this.APIgetRandomizedTrack();
+                }
+                if (this.addPlayed) {
+                    await this.APIaddPlayed();
+                }
+                await this.APIaddToQue();
+                trackAddedToQue = true;
+            }
+            //Update the source file for the media player (binded property to Audio tag in the template)
+            this.currentTrackSrcFile = window.URL.createObjectURL(copyOfPlaylist[0]);
+            if (!trackAddedToQue) {
+                if (this.addPlayed) {
+                    await this.APIaddPlayed();
+                }
+                await this.APIaddToQue();
+            }
+            await this.APIgetPlaylistHistory();
+
+            this.$refs.audioPlayer.play();
+            this.$emit("scroll-to-bottom-playlist-history");
+            copyOfPlaylist.shift();
+            if (this.hideNextTrack) {
+                this.$store.dispatch("setCurrentTrackHidden", true);
+            } else {
+                this.$store.dispatch("setCurrentTrackHidden", false);
+            }
+            await this.APIgetInfoAboutCurrentTrack();
+            await this.randomizeTrackInAdvance();
+            this.disableButtons = false;
+        },
+        async randomizeTrackInAdvance() {
+            console.log("Randomizing track in advance");
+            try {
+                if (this.lowPlayed) {
+                    await this.APIgetRandomizedLowTrack();
+                } else {
+                    await this.APIgetRandomizedTrack();
+                }
+            } catch (error) {
+                console.log(error);
+                console.log("Error: A track couldn't be loaded in advance");
+            }
+            return new Promise((resolve) => {
+                resolve();
+            });
+        },
+        async playSpecificTrack(track) {
+            await this.APIplaySpecificTrack(track.SongNo);
+            this.$store.dispatch("setCurrentlyLoadingTrack", "");
+            await this.APIgetPlaylistHistory();
+            this.$store.dispatch("setCurrentTrackHidden", false);
+            await this.APIgetInfoAboutCurrentTrack();
+        },
+        showAnswer() {
+            this.$store.dispatch("setCurrentTrackHidden", false);
+        },
+        startSoundTest() {
+            this.$refs.audioPlayer.pause();
+            this.currentTrackSrcFile = "sounds/check.mp3";
+            this.$store.dispatch("setSpecialTrackIsPlaying", true);
+            this.$nextTick(() => {
+                this.$refs.audioPlayer.currentTime = 0;
+                this.$refs.audioPlayer.play();
+            });
+        },
+        playWelcomeSound() {
+            let randomNumber = Math.floor(Math.random() * 10);
+            this.$refs.audioPlayer.pause();
+            if (randomNumber === 0) {
+                this.currentTrackSrcFile = "sounds/sound1.mp3";
+            } else if (randomNumber < 5) {
+                this.currentTrackSrcFile = "sounds/intro_short.mp3";
+            } else {
+                this.currentTrackSrcFile = "sounds/intro_long.mp3";
+            }
+            this.$store.dispatch("setSpecialTrackIsPlaying", true);
+            this.$nextTick(() => {
+                this.$refs.audioPlayer.currentTime = 0;
+                this.$refs.audioPlayer.play();
+            });
+        },
+        playMatchSound() {
+            this.$refs.audioPlayer.pause();
+            this.currentTrackSrcFile = "sounds/sound0.mp3";
+            this.$store.dispatch("setSpecialTrackIsPlaying", true);
+            this.$nextTick(() => {
+                this.$refs.audioPlayer.currentTime = 0;
+                this.$refs.audioPlayer.play();
+            });
+        },
+        playWinningSound() {
+            this.$refs.audioPlayer.pause();
+            this.currentTrackSrcFile = "sounds/winning.mp3";
+            this.$store.dispatch("setSpecialTrackIsPlaying", true);
+            this.$nextTick(() => {
+                this.$refs.audioPlayer.currentTime = 0;
+                this.$refs.audioPlayer.play();
+            });
+        },
+        APIgetRandomizedTrack() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/rand`,
+                    responseType: "blob",
+                    onDownloadProgress: (progressEvent) => {
+                        let percentCompleted = Math.round(
+                            (progressEvent.loaded * 100) / progressEvent.total
+                        );
+                        if (percentCompleted % 10 === 0) {
+                            //Debug for slow downloading
+                            //console.log(percentCompleted);
+                        }
+                    },
+                })
+                    .then((response) => {
+                        let mp3 = new Blob([response.data], { type: "audio/mp3" });
+                        this.$store.dispatch("updateLocalPlaylist", mp3);
+                        this.$nextTick(() => {
+                            resolve();
+                        });
+                    })
+                    .catch(function(error) {
+                        console.log("An error happened when fetching the track");
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIgetRandomizedLowTrack() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/rand/low`,
+                    responseType: "blob",
+                    onDownloadProgress: (progressEvent) => {
+                        let percentCompleted = Math.round(
+                            (progressEvent.loaded * 100) / progressEvent.total
+                        );
+                        if (percentCompleted % 10 === 0) {
+                            //Debug for slow downloading
+                            //console.log(percentCompleted);
+                        }
+                    },
+                })
+                    .then((response) => {
+                        let mp3 = new Blob([response.data], { type: "audio/mp3" });
+                        this.$store.dispatch("updateLocalPlaylist", mp3);
+                        this.$nextTick(() => {
+                            resolve();
+                        });
+                    })
+                    .catch(function(error) {
+                        console.log("An error happened when fetching the track");
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIaddPlayed() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/addPlayed`,
+                })
+                    .then(() => {
+                        resolve(false);
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIaddToQue() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/addQue`,
+                })
+                    .then(() => {
+                        resolve(false);
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIgetInfoAboutCurrentTrack() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/info`,
+                })
+                    .then((response) => {
+                        let gameInfoObject = {
+                            game: response.data.Game,
+                            track: response.data.Song.replace(".mp3", ""),
+                            songNo: response.data.SongNo,
+                        };
+                        this.$store.dispatch("setCurrentGame", gameInfoObject.game);
+                        this.$store.dispatch("setCurrentTrack", gameInfoObject.track);
+                        resolve(false);
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIgetPlaylistHistory() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/list`,
+                })
+                    .then((response) => {
+                        let tracklistArray = response.data;
+                        this.$store.dispatch("updatePlaylistHistory", tracklistArray);
+                        resolve();
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        APIplaySpecificTrack(trackNumber) {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music?song=${trackNumber}`,
+                    responseType: "blob",
+                })
+                    .then((response) => {
+                        let mp3 = new Blob([response.data], { type: "audio/mp3" });
+                        this.currentTrackSrcFile = window.URL.createObjectURL(mp3);
+                        this.$nextTick(() => {
+                            this.$refs.audioPlayer.play();
+                            resolve();
+                        });
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
+        trackHasEnded() {
+            if (this.specialTrackIsPlaying) {
+                this.$store.dispatch("setSpecialTrackIsPlaying", false);
+                return 0;
+            }
+            if (!this.stopAfterCurrent) {
+                this.randomizeTrack();
+            }
+        },
+    },
+    async mounted() {
+        await this.APIgetPlaylistHistory();
+    },
+};
+</script>
+
+<style scoped>
+footer {
+    display: flex;
+    position: absolute;
+    bottom: 0;
+    justify-content: flex-end;
+    width: 100%;
+}
+
+.audioAndButtonsDiv {
+    display: flex;
+    flex-wrap: wrap;
+    width: 80vw;
+    margin-right: 1vh;
+}
+.audioButtonsDiv {
+    display: flex;
+    flex-direction: row-reverse;
+    width: 100%;
+    margin-bottom: 2vh;
+    align-items: center;
+}
+
+.audioButtonsDiv button:nth-child(1) {
+    margin-right: 3vw;
+    width: 200px;
+}
+.audioButtonsDiv button:nth-child(2) {
+    margin-right: 25vw;
+    width: 220px;
+}
+.audioButtonsDiv .bigButton {
+    height: 7vh;
+}
+.disabled {
+    opacity: 0.5;
+}
+
+.audioDiv {
+    width: 100%;
+}
+.audioDiv audio {
+    width: 100%;
+    font-size: 2rem;
+}
+audio::-webkit-media-controls-panel {
+    background-color: rgb(185, 185, 185);
+}
+audio::-webkit-media-controls-current-time-display {
+    color: rgb(0, 0, 0);
+    font-size: 4em;
+}
+audio::-webkit-media-controls-time-remaining-display {
+    color: rgb(0, 0, 0);
+    font-size: 4em;
+}
+
+@media only screen and (max-width: 1000px) {
+    footer {
+        position: static;
+        justify-content: center;
+    }
+
+    .audioAndButtonsDiv {
+        width: 100vw;
+        margin: 0;
+    }
+    .audioButtonsDiv {
+        margin-bottom: 2vw;
+        font-size: 1rem;
+    }
+
+    .audioButtonsDiv button:nth-child(1) {
+        margin: 0;
+        width: 50vw;
+        border-radius: 2px;
+    }
+    .audioButtonsDiv button:nth-child(2) {
+        margin: 0;
+        width: 50vw;
+        border-radius: 2px;
+    }
+    .audioButtonsDiv .bigButton {
+        height: 22vw;
+    }
+    .disabled {
+        opacity: 0.5;
+    }
+
+    .audioDiv {
+        width: 100%;
+    }
+    .audioDiv audio {
+        font-size: 1rem;
+    }
+    audio::-webkit-media-controls-panel {
+        background-color: rgb(185, 185, 185);
+        border-radius: 2px;
+    }
+    audio::-webkit-media-controls-current-time-display {
+        color: rgb(0, 0, 0);
+        font-size: 2em;
+    }
+    audio::-webkit-media-controls-time-remaining-display {
+        color: rgb(0, 0, 0);
+        font-size: 2em;
+    }
+}
+</style>

cmd/frontend/src/components/layout/TheHeader.vue

@@ -0,0 +1,139 @@
+<template>
+   <nav>
+      <p class="title">Music Player Randomizer</p>
+      <div class="navMenuWrapper">
+         <button class="settingsButton" @click="showSettingsModal">
+            Settings
+         </button>
+         <button class="statisticsButton" @click="showStatisticsModal">
+            Statistics
+         </button>
+         <button class="aboutButton" @click="showAboutModal">About</button>
+      </div>
+      <p v-if="!$parent.displayWhenDesktop" class="mobileMenuButton" @click="showMobileMenu">
+         Menu
+      </p>
+      <settingsModal ref="settingsModal"></settingsModal>
+      <statisticsModal ref="statisticsModal"></statisticsModal>
+      <aboutModal ref="aboutModal"></aboutModal>
+      <mobileMenu
+         ref="mobileMenu"
+         @start-sound-test="startSoundTest"
+         @show-settings-modal="showSettingsModal"
+         @show-statistics-modal="showStatisticsModal"
+         @show-about-modal="showAboutModal"
+      ></mobileMenu>
+   </nav>
+</template>
+
+<script>
+import aboutModal from "../items/aboutModal.vue";
+import statisticsModal from "../items/statisticsModal.vue";
+import settingsModal from "../items/settingsModal.vue";
+import mobileMenu from "../items/mobileMenu.vue";
+
+export default {
+   components: {
+      aboutModal,
+      settingsModal,
+      statisticsModal,
+      mobileMenu,
+   },
+   methods: {
+      playSelectedTrack(track) {
+         this.$refs.theFooter.playSpecificTrack(track);
+      },
+      scrollToBottomPlaylistHistory() {
+         this.$refs.playlistHistory.scrollToBottom();
+      },
+      showAboutModal() {
+         this.$refs.aboutModal.openModal();
+      },
+      showSettingsModal() {
+         this.$refs.settingsModal.openModal();
+      },
+      showStatisticsModal() {
+         this.$refs.statisticsModal.openModal();
+      },
+      showMobileMenu() {
+         this.$refs.mobileMenu.openMobileMenu();
+         this.showMobileMenuContent();
+      },
+      showMobileMenuContent() {
+         setTimeout(() => {
+            this.$refs.mobileMenu.openMobileMenuContent();
+         }, 20);
+      },
+      startSoundTest() {
+         this.$emit("start-sound-test");
+      },
+   },
+};
+</script>
+
+<style scoped>
+nav {
+   background: #333;
+   display: flex;
+   align-content: center;
+   align-items: center;
+   width: 100%;
+   height: 5vh;
+}
+
+.title {
+   color: #fff;
+   font-size: 2rem;
+   margin-left: 2vw;
+   font-style: normal;
+}
+
+.navMenuWrapper {
+   margin-left: auto;
+   height: 5vh;
+}
+
+.navMenuWrapper button {
+   background: #333;
+   color: #ff9c00;
+   font-size: 1.3rem;
+   outline: none;
+   cursor: pointer;
+   border: none;
+   border-radius: 3px;
+   height: 100%;
+   padding: 0 20px;
+}
+
+.navMenuWrapper button:hover {
+   background-color: #555;
+}
+
+/* Mobile */
+@media only screen and (max-width: 1000px) {
+   nav {
+      justify-content: center;
+      height: 10vw;
+   }
+   .title {
+      font-size: 1.2rem;
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      margin-left: 5px;
+      /* text-align: ; */
+   }
+
+   .navMenuWrapper {
+      display: none;
+   }
+
+   .mobileMenuButton {
+      color: white;
+      background: grey;
+      padding: 6px;
+      border-top-left-radius: 7px;
+      border-bottom-left-radius: 7px;
+   }
+}
+</style>

cmd/frontend/src/components/layout/TheMain.vue

@@ -0,0 +1,103 @@
+<template>
+    <div class="theMainDiv">
+        <div class="mainFirstRow">
+            <currently-playing></currently-playing>
+            <inspiration-window></inspiration-window>
+        </div>
+        <div class="mainSecondRow">
+            <playlist-history
+                ref="playlistHistory"
+                @play-selected-track="playSelectedTrack"
+            ></playlist-history>
+            <players-window
+                @play-welcome-sound="playWelcomeSound"
+                @play-match-point-sound="playMatchSound"
+                @play-winning-sound="playWinningSound"
+            ></players-window>
+        </div>
+        <extra-buttons
+            v-if="$parent.displayWhenDesktop"
+            @start-sound-test="startSoundTest"
+        ></extra-buttons>
+        <the-footer
+            ref="theFooter"
+            @scroll-to-bottom-playlist-history="scrollToBottomPlaylistHistory"
+        ></the-footer>
+        <!-- <the-footer ref="theFooter"></the-footer> -->
+    </div>
+</template>
+
+<script>
+import currentlyPlaying from "../items/CurrentlyPlaying.vue";
+import inspirationWindow from "../items/InspirationWindow.vue";
+import playersWindow from "../items/playersWindow.vue";
+import playlistHistory from "../items/playlistHistory.vue";
+import extraButtons from "../items/extraButtons.vue";
+import theFooter from "./TheFooter.vue";
+
+export default {
+    components: {
+        currentlyPlaying,
+        playersWindow,
+        playlistHistory,
+        inspirationWindow,
+        extraButtons,
+        theFooter,
+    },
+    methods: {
+        playSelectedTrack(track) {
+            this.$refs.theFooter.playSpecificTrack(track);
+        },
+        scrollToBottomPlaylistHistory() {
+            this.$refs.playlistHistory.scrollToBottom();
+        },
+        startSoundTest() {
+            this.$refs.theFooter.startSoundTest();
+        },
+        playWelcomeSound() {
+            this.$refs.theFooter.playWelcomeSound();
+        },
+        playMatchSound() {
+            this.$refs.theFooter.playMatchSound();
+        },
+        playWinningSound() {
+            this.$refs.theFooter.playWinningSound();
+        },
+    },
+};
+</script>
+
+<style scoped>
+.theMainDiv {
+    display: flex;
+    flex-wrap: wrap;
+    width: 100%;
+}
+
+.mainFirstRow {
+    display: flex;
+    flex-wrap: nowrap;
+    width: 100%;
+    margin: 0.5vw;
+}
+.mainSecondRow {
+    display: flex;
+    flex-wrap: nowrap;
+    width: 100%;
+    margin: 0 0.5vw;
+}
+
+@media only screen and (max-width: 1000px) {
+    .mainFirstRow {
+        margin: 0;
+        margin-top: 0.5vw;
+    }
+    .mainSecondRow {
+        display: flex;
+        flex-wrap: wrap;
+        width: 100%;
+        margin: 0;
+        margin-top: 0.5vw;
+    }
+}
+</style>

cmd/frontend/src/main.js

@@ -0,0 +1,261 @@
+import { createApp } from "vue";
+import { createStore } from "vuex";
+import App from "./App.vue";
+import axios from "axios";
+import VueAxios from "vue-axios";
+
+const store = createStore({
+    state() {
+        return {
+            currentGame: "",
+            currentTrack: ``,
+            currentTrackHidden: false,
+            currentlyLoadingTrack: "",
+            specialTrackIsPlaying: false,
+            someoneHasWon: false,
+            winningScore: 20,
+            roundStarted: false,
+            reloadGamesList: false,
+            listOfPlayers: [],
+            localPlaylist: [],
+            playlistHistory: [
+                {
+                    SongNo: "",
+                    Game: "",
+                    Song: "",
+                },
+            ],
+            /* Stats */
+            howManyGames: 0,
+            /* Options */
+            stopAfterCurrent: true,
+            hideNextTrack: true,
+            addPlayed: true,
+            lowPlayed: false,
+        };
+    },
+    mutations: {
+        setCurrentGame(state, payload) {
+            state.currentGame = payload;
+        },
+        setCurrentTrack(state, payload) {
+            state.currentTrack = payload;
+        },
+        setCurrentTrackHidden(state, payload) {
+            state.currentTrackHidden = payload;
+        },
+        setCurrentlyLoadingTrack(state, payload) {
+            state.currentlyLoadingTrack = payload;
+        },
+        setSpecialTrackIsPlaying(state, payload) {
+            state.specialTrackIsPlaying = payload;
+        },
+        setSomeoneHasWon(state, payload) {
+            state.someoneHasWon = payload;
+        },
+        setWinningScore(state, payload) {
+            state.winningScore += payload;
+        },
+        setRoundStarted(state, payload) {
+            state.roundStarted = payload;
+        },
+        updateListOfPlayers(state, payload) {
+            state.listOfPlayers = payload;
+        },
+        changePlayerScore(state, payload) {
+            state.listOfPlayers[payload.indexOfPlayer].score += payload.scoreToChange;
+        },
+        changePlayerWelcomed(state, payload) {
+            state.listOfPlayers[payload.indexOfPlayer].welcomed = payload.playerWelcomeTrueOrFalse;
+        },
+        changePlayerMatchPoint(state, payload) {
+            state.listOfPlayers[payload.indexOfPlayer].matchPoint = payload.playerMatchPointTrueOrFalse;
+        },
+        changePlayerProfile(state, payload) {
+            state.listOfPlayers[payload.indexOfPlayer].profile = payload.profileSrc;
+        },
+        resetPlayerScore(state, payload) {
+            state.listOfPlayers = payload;
+        },
+        resetPlayerWelcomed(state, payload) {
+            state.listOfPlayers = payload;
+        },
+        resetPlayerMatchPoint(state, payload) {
+            state.listOfPlayers = payload;
+        },
+        updateLocalPlaylist(state, payload) {
+            state.localPlaylist.push(payload);
+        },
+        updatePlaylistHistory(state, payload) {
+            state.playlistHistory = payload;
+        },
+        updateHowManyGames(state, payload) {
+            state.howManyGames = payload;
+        },
+        reloadGamesList(state, payload) {
+            state.reloadGamesList = payload;
+        },
+        updateStopAfterCurrent(state, payload) {
+            state.stopAfterCurrent = payload;
+        },
+        updateHideNextTitle(state, payload) {
+            state.hideNextTrack = payload;
+        },
+        updateAddPlayed(state, payload) {
+            state.addPlayed = payload;
+        },
+        updateLowPlayed(state, payload) {
+            state.lowPlayed = payload;
+        },
+    },
+    actions: {
+        setCurrentGame(context, payload) {
+            context.commit("setCurrentGame", payload);
+        },
+        setCurrentTrack(context, payload) {
+            context.commit("setCurrentTrack", payload);
+        },
+        setCurrentTrackHidden(context, payload) {
+            context.commit("setCurrentTrackHidden", payload);
+        },
+        setCurrentlyLoadingTrack(context, payload) {
+            context.commit("setCurrentlyLoadingTrack", payload);
+        },
+        setSpecialTrackIsPlaying(context, payload) {
+            context.commit("setSpecialTrackIsPlaying", payload);
+        },
+        setSomeoneHasWon(context, payload) {
+            context.commit("someoneHasWon", payload);
+        },
+        setWinningScore(context, payload) {
+            context.commit("setWinningScore", payload);
+        },
+        setRoundStarted(context, payload) {
+            context.commit("setRoundStarted", payload);
+        },
+        removePlayer(context, payload) {
+            let newPlayerList = this.state.listOfPlayers.filter(
+                (player) => player.playerName != payload
+            );
+            context.commit("updateListOfPlayers", newPlayerList);
+        },
+        addNewPlayer(context, payload) {
+            let newPlayerList = this.state.listOfPlayers;
+            let newPlayer = {
+                playerName: payload,
+                score: 0,
+                welcomed: false,
+                matchPoint: false,
+                profile: "characters/noCharacter.png",
+            };
+            newPlayerList.push(newPlayer);
+            context.commit("updateListOfPlayers", newPlayerList);
+        },
+        changePlayerScore(context, payload) {
+            let copyOfPlayerList = this.state.listOfPlayers;
+            let indexOfPlayer = copyOfPlayerList.findIndex(
+                (player) => player.playerName === payload.playerName
+            );
+            let scoreToChange = payload.score;
+            context.commit("changePlayerScore", {
+                indexOfPlayer,
+                scoreToChange,
+            });
+        },
+        changePlayerWelcomed(context, payload) {
+            let copyOfPlayerList = this.state.listOfPlayers;
+            let indexOfPlayer = copyOfPlayerList.findIndex(
+                (player) => player.playerName === payload.playerName
+            );
+            let playerWelcomeTrueOrFalse = payload.welcomeSet;
+            context.commit("changePlayerWelcomed", {
+                indexOfPlayer,
+                playerWelcomeTrueOrFalse,
+            });
+        },
+        changePlayerMatchPoint(context, payload) {
+            let copyOfPlayerList = this.state.listOfPlayers;
+            let indexOfPlayer = copyOfPlayerList.findIndex(
+                (player) => player.playerName === payload.playerName
+            );
+            let playerMatchPointTrueOrFalse = payload.matchPointSet;
+            context.commit("changePlayerMatchPoint", {
+                indexOfPlayer,
+                playerMatchPointTrueOrFalse,
+            });
+        },
+        changePlayerProfile(context, payload) {
+            let copyOfPlayerList = this.state.listOfPlayers;
+            let indexOfPlayer = copyOfPlayerList.findIndex(
+                (player) => player.playerName === payload.playerName
+            );
+            let profileSrc = payload.profile;
+            context.commit("changePlayerProfile", {
+                indexOfPlayer,
+                profileSrc,
+            });
+        },
+        resetPlayerScore(context) {
+            /* The JSON.parse and JSON.stringify parts are used to make a copy that doesn't affect the original */
+            let copyOfPlayerList = JSON.parse(JSON.stringify(this.state.listOfPlayers));
+            for (let i = 0; i < copyOfPlayerList.length; i++) {
+                copyOfPlayerList[i].score = 0;
+            }
+            context.commit("resetPlayerScore", copyOfPlayerList);
+        },
+        resetPlayerWelcomed(context) {
+            /* The JSON.parse and JSON.stringify parts are used to make a copy that doesn't affect the original */
+            let copyOfPlayerList = JSON.parse(JSON.stringify(this.state.listOfPlayers));
+            for (let i = 0; i < copyOfPlayerList.length; i++) {
+                copyOfPlayerList[i].welcomed = false;
+            }
+            context.commit("resetPlayerWelcomed", copyOfPlayerList);
+        },
+        resetPlayerMatchPoint(context) {
+            /* The JSON.parse and JSON.stringify parts are used to make a copy that doesn't affect the original */
+            let copyOfPlayerList = JSON.parse(JSON.stringify(this.state.listOfPlayers));
+            for (let i = 0; i < copyOfPlayerList.length; i++) {
+                copyOfPlayerList[i].matchPoint = false;
+            }
+            context.commit("resetPlayerMatchPoint", copyOfPlayerList);
+        },
+        updateLocalPlaylist(context, payload) {
+            context.commit("updateLocalPlaylist", payload);
+        },
+        updatePlaylistHistory(context, payload) {
+            context.commit("updatePlaylistHistory", payload);
+        },
+        updateHowManyGames(context, payload) {
+            context.commit("updateHowManyGames", payload);
+        },
+        reloadGamesList(context, payload) {
+            context.commit("reloadGamesList", payload);
+        },
+        updateStopAfterCurrent(context, payload) {
+            context.commit("updateStopAfterCurrent", payload);
+        },
+        updateHideNextTitle(context, payload) {
+            context.commit("updateHideNextTitle", payload);
+        },
+        updateAddPlayed(context, payload) {
+            context.commit("updateAddPlayed", payload);
+        },
+        updateLowPlayed(context, payload) {
+            context.commit("updateLowPlayed", payload);
+        },
+    },
+
+    getters: {
+        /* Empty ATM */
+        /* getListOfPlayers: (state) => {
+           return state.listOfPlayers;
+        }, */
+    },
+});
+
+const app = createApp(App);
+
+app.use(store);
+app.use(VueAxios, axios);
+
+app.mount("#app");

cmd/main.go

@@ -1,42 +1,17 @@
 package main
 
 import (
-	"context"
-	"os/signal"
-	"syscall"
-	"time"
-
-	"music-server/internal/logging"
-	"music-server/internal/server"
-
-	"go.uber.org/zap"
+	"embed"
+	"music-server/pkg/conf"
 )
 
-const shutdownTimeout = 5 * time.Second
+//go:embed swagger
+var swagger embed.FS
 
 func main() {
-	ctx, stop := signal.NotifyContext(context.Background(), syscall.SIGINT, syscall.SIGTERM)
-	defer stop()
+	conf.SetupDb()
 
-	s := server.NewServerInstance()
+	conf.SetupRestServer(swagger)
 
-	serveErr := make(chan error, 1)
-	go func() { serveErr <- s.ListenAndServe() }()
-
-	select {
-	case err := <-serveErr:
-		if err != nil {
-			logging.GetLogger().Fatal("HTTP server error", zap.Error(err))
-		}
-	case <-ctx.Done():
-		stop()
-		logging.GetLogger().Info("Shutting down gracefully, press Ctrl+C again to force")
-	}
-
-	shutdownCtx, cancel := context.WithTimeout(context.Background(), shutdownTimeout)
-	defer cancel()
-	if err := s.Shutdown(shutdownCtx); err != nil {
-		logging.GetLogger().Error("Server forced to shutdown with error", zap.Error(err))
-	}
-	logging.GetLogger().Info("Graceful shutdown complete")
+	conf.CloseDb()
 }

cmd/openapi/main.go

@@ -1,51 +0,0 @@
-// Command openapi writes the MusicServer API description without starting the server.
-//
-//	go run ./cmd/openapi -out .
-//
-// It writes openapi.json (OpenAPI 3.1) and openapi-3.0.json (OpenAPI 3.0, for tools
-// that don't support 3.1 yet). A running server serves the same files at /openapi.json
-// and /openapi-3.0.json.
-package main
-
-import (
-	"flag"
-	"fmt"
-	"os"
-	"path/filepath"
-
-	"music-server/internal/server"
-)
-
-func main() {
-	out := flag.String("out", ".", "directory to write openapi.json and openapi-3.0.json to")
-	flag.Parse()
-
-	if err := run(*out); err != nil {
-		fmt.Fprintln(os.Stderr, "openapi:", err)
-		os.Exit(1)
-	}
-}
-
-func run(out string) error {
-	spec := server.OpenAPISpec()
-	v31, err := spec.MarshalJSON()
-	if err != nil {
-		return err
-	}
-	v30, err := spec.Downgrade()
-	if err != nil {
-		return err
-	}
-
-	if err := os.MkdirAll(out, 0o755); err != nil {
-		return err
-	}
-	for name, data := range map[string][]byte{"openapi.json": v31, "openapi-3.0.json": v30} {
-		path := filepath.Join(out, name)
-		if err := os.WriteFile(path, data, 0o644); err != nil {
-			return err
-		}
-		fmt.Println("Wrote", path)
-	}
-	return nil
-}

cmd/openapi/main_test.go

@@ -1,28 +0,0 @@
-package main
-
-import (
-	"encoding/json"
-	"os"
-	"path/filepath"
-	"testing"
-
-	"github.com/stretchr/testify/assert"
-	"github.com/stretchr/testify/require"
-)
-
-func TestRunWritesBothVersions(t *testing.T) {
-	dir := t.TempDir()
-	require.NoError(t, run(dir))
-
-	for name, version := range map[string]string{"openapi.json": "3.1.0", "openapi-3.0.json": "3.0.3"} {
-		data, err := os.ReadFile(filepath.Join(dir, name))
-		require.NoError(t, err)
-		var spec struct {
-			OpenAPI string         `json:"openapi"`
-			Paths   map[string]any `json:"paths"`
-		}
-		require.NoError(t, json.Unmarshal(data, &spec), name)
-		assert.Equal(t, version, spec.OpenAPI, name)
-		assert.Contains(t, spec.Paths, "/api/v1/music/info", name)
-	}
-}

cmd/search/index.144x144.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://b6bierb3v4yoq"
+path="res://.godot/imported/index.144x144.png-03ea9bc9a40782e35fa8c68f683d2623.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://web/index.144x144.png"
+dest_files=["res://.godot/imported/index.144x144.png-03ea9bc9a40782e35fa8c68f683d2623.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1

cmd/search/index.180x180.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://b0euyv6xwufjw"
+path="res://.godot/imported/index.180x180.png-9c97e3aaba17027b76e6e765bcdc0add.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://web/index.180x180.png"
+dest_files=["res://.godot/imported/index.180x180.png-9c97e3aaba17027b76e6e765bcdc0add.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1

cmd/search/index.512x512.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://c30mhkc1yernc"
+path="res://.godot/imported/index.512x512.png-4cda31773312dccaaf53a4ff122aad13.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://web/index.512x512.png"
+dest_files=["res://.godot/imported/index.512x512.png-4cda31773312dccaaf53a4ff122aad13.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1

cmd/search/index.apple-touch-icon.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://d0tny2k1tdlnq"
+path="res://.godot/imported/index.apple-touch-icon.png-939ec69c79bbf504b92ad8ceed469d51.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://web/index.apple-touch-icon.png"
+dest_files=["res://.godot/imported/index.apple-touch-icon.png-939ec69c79bbf504b92ad8ceed469d51.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1

cmd/search/index.audio.worklet.js

@@ -0,0 +1,213 @@
+/**************************************************************************/
+/*  audio.worklet.js                                                      */
+/**************************************************************************/
+/*                         This file is part of:                          */
+/*                             GODOT ENGINE                               */
+/*                        https://godotengine.org                         */
+/**************************************************************************/
+/* Copyright (c) 2014-present Godot Engine contributors (see AUTHORS.md). */
+/* Copyright (c) 2007-2014 Juan Linietsky, Ariel Manzur.                  */
+/*                                                                        */
+/* Permission is hereby granted, free of charge, to any person obtaining  */
+/* a copy of this software and associated documentation files (the        */
+/* "Software"), to deal in the Software without restriction, including    */
+/* without limitation the rights to use, copy, modify, merge, publish,    */
+/* distribute, sublicense, and/or sell copies of the Software, and to     */
+/* permit persons to whom the Software is furnished to do so, subject to  */
+/* the following conditions:                                              */
+/*                                                                        */
+/* The above copyright notice and this permission notice shall be         */
+/* included in all copies or substantial portions of the Software.        */
+/*                                                                        */
+/* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,        */
+/* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF     */
+/* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. */
+/* IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY   */
+/* CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,   */
+/* TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE      */
+/* SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.                 */
+/**************************************************************************/
+
+class RingBuffer {
+	constructor(p_buffer, p_state, p_threads) {
+		this.buffer = p_buffer;
+		this.avail = p_state;
+		this.threads = p_threads;
+		this.rpos = 0;
+		this.wpos = 0;
+	}
+
+	data_left() {
+		return this.threads ? Atomics.load(this.avail, 0) : this.avail;
+	}
+
+	space_left() {
+		return this.buffer.length - this.data_left();
+	}
+
+	read(output) {
+		const size = this.buffer.length;
+		let from = 0;
+		let to_write = output.length;
+		if (this.rpos + to_write > size) {
+			const high = size - this.rpos;
+			output.set(this.buffer.subarray(this.rpos, size));
+			from = high;
+			to_write -= high;
+			this.rpos = 0;
+		}
+		if (to_write) {
+			output.set(this.buffer.subarray(this.rpos, this.rpos + to_write), from);
+		}
+		this.rpos += to_write;
+		if (this.threads) {
+			Atomics.add(this.avail, 0, -output.length);
+			Atomics.notify(this.avail, 0);
+		} else {
+			this.avail -= output.length;
+		}
+	}
+
+	write(p_buffer) {
+		const to_write = p_buffer.length;
+		const mw = this.buffer.length - this.wpos;
+		if (mw >= to_write) {
+			this.buffer.set(p_buffer, this.wpos);
+			this.wpos += to_write;
+			if (mw === to_write) {
+				this.wpos = 0;
+			}
+		} else {
+			const high = p_buffer.subarray(0, mw);
+			const low = p_buffer.subarray(mw);
+			this.buffer.set(high, this.wpos);
+			this.buffer.set(low);
+			this.wpos = low.length;
+		}
+		if (this.threads) {
+			Atomics.add(this.avail, 0, to_write);
+			Atomics.notify(this.avail, 0);
+		} else {
+			this.avail += to_write;
+		}
+	}
+}
+
+class GodotProcessor extends AudioWorkletProcessor {
+	constructor() {
+		super();
+		this.threads = false;
+		this.running = true;
+		this.lock = null;
+		this.notifier = null;
+		this.output = null;
+		this.output_buffer = new Float32Array();
+		this.input = null;
+		this.input_buffer = new Float32Array();
+		this.port.onmessage = (event) => {
+			const cmd = event.data['cmd'];
+			const data = event.data['data'];
+			this.parse_message(cmd, data);
+		};
+	}
+
+	process_notify() {
+		if (this.notifier) {
+			Atomics.add(this.notifier, 0, 1);
+			Atomics.notify(this.notifier, 0);
+		}
+	}
+
+	parse_message(p_cmd, p_data) {
+		if (p_cmd === 'start' && p_data) {
+			const state = p_data[0];
+			let idx = 0;
+			this.threads = true;
+			this.lock = state.subarray(idx, ++idx);
+			this.notifier = state.subarray(idx, ++idx);
+			const avail_in = state.subarray(idx, ++idx);
+			const avail_out = state.subarray(idx, ++idx);
+			this.input = new RingBuffer(p_data[1], avail_in, true);
+			this.output = new RingBuffer(p_data[2], avail_out, true);
+		} else if (p_cmd === 'stop') {
+			this.running = false;
+			this.output = null;
+			this.input = null;
+			this.lock = null;
+			this.notifier = null;
+		} else if (p_cmd === 'start_nothreads') {
+			this.output = new RingBuffer(p_data[0], p_data[0].length, false);
+		} else if (p_cmd === 'chunk') {
+			this.output.write(p_data);
+		}
+	}
+
+	static array_has_data(arr) {
+		return arr.length && arr[0].length && arr[0][0].length;
+	}
+
+	process(inputs, outputs, parameters) {
+		if (!this.running) {
+			return false; // Stop processing.
+		}
+		if (this.output === null) {
+			return true; // Not ready yet, keep processing.
+		}
+		const process_input = GodotProcessor.array_has_data(inputs);
+		if (process_input) {
+			const input = inputs[0];
+			const chunk = input[0].length * input.length;
+			if (this.input_buffer.length !== chunk) {
+				this.input_buffer = new Float32Array(chunk);
+			}
+			if (!this.threads) {
+				GodotProcessor.write_input(this.input_buffer, input);
+				this.port.postMessage({ 'cmd': 'input', 'data': this.input_buffer });
+			} else if (this.input.space_left() >= chunk) {
+				GodotProcessor.write_input(this.input_buffer, input);
+				this.input.write(this.input_buffer);
+			} else {
+				// this.port.postMessage('Input buffer is full! Skipping input frame.'); // Uncomment this line to debug input buffer.
+			}
+		}
+		const process_output = GodotProcessor.array_has_data(outputs);
+		if (process_output) {
+			const output = outputs[0];
+			const chunk = output[0].length * output.length;
+			if (this.output_buffer.length !== chunk) {
+				this.output_buffer = new Float32Array(chunk);
+			}
+			if (this.output.data_left() >= chunk) {
+				this.output.read(this.output_buffer);
+				GodotProcessor.write_output(output, this.output_buffer);
+				if (!this.threads) {
+					this.port.postMessage({ 'cmd': 'read', 'data': chunk });
+				}
+			} else {
+				// this.port.postMessage('Output buffer has not enough frames! Skipping output frame.'); // Uncomment this line to debug output buffer.
+			}
+		}
+		this.process_notify();
+		return true;
+	}
+
+	static write_output(dest, source) {
+		const channels = dest.length;
+		for (let ch = 0; ch < channels; ch++) {
+			for (let sample = 0; sample < dest[ch].length; sample++) {
+				dest[ch][sample] = source[sample * channels + ch];
+			}
+		}
+	}
+
+	static write_input(dest, source) {
+		const channels = source.length;
+		for (let ch = 0; ch < channels; ch++) {
+			for (let sample = 0; sample < source[ch].length; sample++) {
+				dest[sample * channels + ch] = source[ch][sample];
+			}
+		}
+	}
+}
+
+registerProcessor('godot-processor', GodotProcessor);

cmd/search/index.html

@@ -0,0 +1,200 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
+		<title>MusicSearch</title>
+		<style>
+html, body, #canvas {
+	margin: 0;
+	padding: 0;
+	border: 0;
+}
+
+body {
+	color: white;
+	background-color: black;
+	overflow: hidden;
+	touch-action: none;
+}
+
+#canvas {
+	display: block;
+}
+
+#canvas:focus {
+	outline: none;
+}
+
+#status, #status-splash, #status-progress {
+	position: absolute;
+	left: 0;
+	right: 0;
+}
+
+#status, #status-splash {
+	top: 0;
+	bottom: 0;
+}
+
+#status {
+	background-color: #242424;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	visibility: hidden;
+}
+
+#status-splash {
+	max-height: 100%;
+	max-width: 100%;
+	margin: auto;
+}
+
+#status-progress, #status-notice {
+	display: none;
+}
+
+#status-progress {
+	bottom: 10%;
+	width: 50%;
+	margin: 0 auto;
+}
+
+#status-notice {
+	background-color: #5b3943;
+	border-radius: 0.5rem;
+	border: 1px solid #9b3943;
+	color: #e0e0e0;
+	font-family: 'Noto Sans', 'Droid Sans', Arial, sans-serif;
+	line-height: 1.3;
+	margin: 0 2rem;
+	overflow: hidden;
+	padding: 1rem;
+	text-align: center;
+	z-index: 1;
+}
+		</style>
+		<link id="-gd-engine-icon" rel="icon" type="image/png" href="index.icon.png" />
+<link rel="apple-touch-icon" href="index.apple-touch-icon.png"/>
+<link rel="manifest" href="index.manifest.json">
+
+	</head>
+	<body>
+		<canvas id="canvas">
+			Your browser does not support the canvas tag.
+		</canvas>
+
+		<noscript>
+			Your browser does not support JavaScript.
+		</noscript>
+
+		<div id="status">
+			<img id="status-splash" src="index.png" alt="">
+			<progress id="status-progress"></progress>
+			<div id="status-notice"></div>
+		</div>
+
+		<script src="index.js"></script>
+		<script>
+const GODOT_CONFIG = {"args":[],"canvasResizePolicy":2,"ensureCrossOriginIsolationHeaders":false,"executable":"index","experimentalVK":false,"fileSizes":{"index.pck":86816,"index.wasm":35376909},"focusCanvas":true,"gdextensionLibs":[],"serviceWorker":"index.service.worker.js"};
+const GODOT_THREADS_ENABLED = false;
+const engine = new Engine(GODOT_CONFIG);
+
+(function () {
+	const statusOverlay = document.getElementById('status');
+	const statusProgress = document.getElementById('status-progress');
+	const statusNotice = document.getElementById('status-notice');
+
+	let initializing = true;
+	let statusMode = '';
+
+	function setStatusMode(mode) {
+		if (statusMode === mode || !initializing) {
+			return;
+		}
+		if (mode === 'hidden') {
+			statusOverlay.remove();
+			initializing = false;
+			return;
+		}
+		statusOverlay.style.visibility = 'visible';
+		statusProgress.style.display = mode === 'progress' ? 'block' : 'none';
+		statusNotice.style.display = mode === 'notice' ? 'block' : 'none';
+		statusMode = mode;
+	}
+
+	function setStatusNotice(text) {
+		while (statusNotice.lastChild) {
+			statusNotice.removeChild(statusNotice.lastChild);
+		}
+		const lines = text.split('\n');
+		lines.forEach((line) => {
+			statusNotice.appendChild(document.createTextNode(line));
+			statusNotice.appendChild(document.createElement('br'));
+		});
+	}
+
+	function displayFailureNotice(err) {
+		console.error(err);
+		if (err instanceof Error) {
+			setStatusNotice(err.message);
+		} else if (typeof err === 'string') {
+			setStatusNotice(err);
+		} else {
+			setStatusNotice('An unknown error occured');
+		}
+		setStatusMode('notice');
+		initializing = false;
+	}
+
+	const missing = Engine.getMissingFeatures({
+		threads: GODOT_THREADS_ENABLED,
+	});
+
+	if (missing.length !== 0) {
+		if (GODOT_CONFIG['serviceWorker'] && GODOT_CONFIG['ensureCrossOriginIsolationHeaders'] && 'serviceWorker' in navigator) {
+			// There's a chance that installing the service worker would fix the issue
+			Promise.race([
+				navigator.serviceWorker.getRegistration().then((registration) => {
+					if (registration != null) {
+						return Promise.reject(new Error('Service worker already exists.'));
+					}
+					return registration;
+				}).then(() => engine.installServiceWorker()),
+				// For some reason, `getRegistration()` can stall
+				new Promise((resolve) => {
+					setTimeout(() => resolve(), 2000);
+				}),
+			]).catch((err) => {
+				console.error('Error while registering service worker:', err);
+			}).then(() => {
+				window.location.reload();
+			});
+		} else {
+			// Display the message as usual
+			const missingMsg = 'Error\nThe following features required to run Godot projects on the Web are missing:\n';
+			displayFailureNotice(missingMsg + missing.join('\n'));
+		}
+	} else {
+		setStatusMode('progress');
+		engine.startGame({
+			'onProgress': function (current, total) {
+				if (current > 0 && total > 0) {
+					statusProgress.value = current;
+					statusProgress.max = total;
+				} else {
+					statusProgress.removeAttribute('value');
+					statusProgress.removeAttribute('max');
+				}
+			},
+		}).then(() => {
+			setStatusMode('hidden');
+		}, displayFailureNotice);
+	}
+}());
+		</script>
+	</body>
+</html>
+

cmd/search/index.icon.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://c8gblkbcsrrwo"
+path="res://.godot/imported/index.icon.png-c615af856eabc03ca93d51f6a8f07b60.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://web/index.icon.png"
+dest_files=["res://.godot/imported/index.icon.png-c615af856eabc03ca93d51f6a8f07b60.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1

cmd/search/index.js

@@ -0,0 +1,908 @@
+
+var Godot = (() => {
+  var _scriptName = typeof document != 'undefined' ? document.currentScript?.src : undefined;
+  
+  return (
+function(moduleArg = {}) {
+  var moduleRtn;
+
+var Module=moduleArg;var readyPromiseResolve,readyPromiseReject;var readyPromise=new Promise((resolve,reject)=>{readyPromiseResolve=resolve;readyPromiseReject=reject});["_memory","__Z14godot_web_mainiPPc","__emwebxr_on_input_event","__emwebxr_on_simple_event","___indirect_function_table","_main","onRuntimeInitialized"].forEach(prop=>{if(!Object.getOwnPropertyDescriptor(readyPromise,prop)){Object.defineProperty(readyPromise,prop,{get:()=>abort("You are getting "+prop+" on the Promise object, instead of the instance. Use .then() to get called back with the instance, see the MODULARIZE docs in src/settings.js"),set:()=>abort("You are setting "+prop+" on the Promise object, instead of the instance. Use .then() to get called back with the instance, see the MODULARIZE docs in src/settings.js")})}});var ENVIRONMENT_IS_WEB=typeof window=="object";var ENVIRONMENT_IS_WORKER=typeof importScripts=="function";var ENVIRONMENT_IS_NODE=typeof process=="object"&&typeof process.versions=="object"&&typeof process.versions.node=="string";var ENVIRONMENT_IS_SHELL=!ENVIRONMENT_IS_WEB&&!ENVIRONMENT_IS_NODE&&!ENVIRONMENT_IS_WORKER;if(Module["ENVIRONMENT"]){throw new Error("Module.ENVIRONMENT has been deprecated. To force the environment, use the ENVIRONMENT compile-time option (for example, -sENVIRONMENT=web or -sENVIRONMENT=node)")}var moduleOverrides=Object.assign({},Module);var arguments_=[];var thisProgram="./this.program";var quit_=(status,toThrow)=>{throw toThrow};var scriptDirectory="";function locateFile(path){if(Module["locateFile"]){return Module["locateFile"](path,scriptDirectory)}return scriptDirectory+path}var readAsync,readBinary;if(ENVIRONMENT_IS_SHELL){if(typeof process=="object"&&typeof require==="function"||typeof window=="object"||typeof importScripts=="function")throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - and run it someplace else - like on the web?)")}else if(ENVIRONMENT_IS_WEB||ENVIRONMENT_IS_WORKER){if(ENVIRONMENT_IS_WORKER){scriptDirectory=self.location.href}else if(typeof document!="undefined"&&document.currentScript){scriptDirectory=document.currentScript.src}if(_scriptName){scriptDirectory=_scriptName}if(scriptDirectory.startsWith("blob:")){scriptDirectory=""}else{scriptDirectory=scriptDirectory.substr(0,scriptDirectory.replace(/[?#].*/,"").lastIndexOf("/")+1)}if(!(typeof window=="object"||typeof importScripts=="function"))throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - and run it someplace else - like on the web?)");{if(ENVIRONMENT_IS_WORKER){readBinary=url=>{var xhr=new XMLHttpRequest;xhr.open("GET",url,false);xhr.responseType="arraybuffer";xhr.send(null);return new Uint8Array(xhr.response)}}readAsync=url=>{assert(!isFileURI(url),"readAsync does not work with file:// URLs");return fetch(url,{credentials:"same-origin"}).then(response=>{if(response.ok){return response.arrayBuffer()}return Promise.reject(new Error(response.status+" : "+response.url))})}}}else{throw new Error("environment detection error")}var out=Module["print"]||console.log.bind(console);var err=Module["printErr"]||console.error.bind(console);Object.assign(Module,moduleOverrides);moduleOverrides=null;checkIncomingModuleAPI();if(Module["arguments"])arguments_=Module["arguments"];legacyModuleProp("arguments","arguments_");if(Module["thisProgram"])thisProgram=Module["thisProgram"];legacyModuleProp("thisProgram","thisProgram");if(Module["quit"])quit_=Module["quit"];legacyModuleProp("quit","quit_");assert(typeof Module["memoryInitializerPrefixURL"]=="undefined","Module.memoryInitializerPrefixURL option was removed, use Module.locateFile instead");assert(typeof Module["pthreadMainPrefixURL"]=="undefined","Module.pthreadMainPrefixURL option was removed, use Module.locateFile instead");assert(typeof Module["cdInitializerPrefixURL"]=="undefined","Module.cdInitializerPrefixURL option was removed, use Module.locateFile instead");assert(typeof Module["filePackagePrefixURL"]=="undefined","Module.filePackagePrefixURL option was removed, use Module.locateFile instead");assert(typeof Module["read"]=="undefined","Module.read option was removed");assert(typeof Module["readAsync"]=="undefined","Module.readAsync option was removed (modify readAsync in JS)");assert(typeof Module["readBinary"]=="undefined","Module.readBinary option was removed (modify readBinary in JS)");assert(typeof Module["setWindowTitle"]=="undefined","Module.setWindowTitle option was removed (modify emscripten_set_window_title in JS)");assert(typeof Module["TOTAL_MEMORY"]=="undefined","Module.TOTAL_MEMORY has been renamed Module.INITIAL_MEMORY");legacyModuleProp("asm","wasmExports");legacyModuleProp("readAsync","readAsync");legacyModuleProp("readBinary","readBinary");legacyModuleProp("setWindowTitle","setWindowTitle");assert(!ENVIRONMENT_IS_NODE,"node environment detected buLine truncated
+
+
+  return moduleRtn;
+}
+);
+})();
+if (typeof exports === 'object' && typeof module === 'object')
+  module.exports = Godot;
+else if (typeof define === 'function' && define['amd'])
+  define([], () => Godot);
+
+const Features = {
+	/**
+	 * Check whether WebGL is available. Optionally, specify a particular version of WebGL to check for.
+	 *
+	 * @param {number=} [majorVersion=1] The major WebGL version to check for.
+	 * @returns {boolean} If the given major version of WebGL is available.
+	 * @function Engine.isWebGLAvailable
+	 */
+	isWebGLAvailable: function (majorVersion = 1) {
+		try {
+			return !!document.createElement('canvas').getContext(['webgl', 'webgl2'][majorVersion - 1]);
+		} catch (e) { /* Not available */ }
+		return false;
+	},
+
+	/**
+	 * Check whether the Fetch API available and supports streaming responses.
+	 *
+	 * @returns {boolean} If the Fetch API is available and supports streaming responses.
+	 * @function Engine.isFetchAvailable
+	 */
+	isFetchAvailable: function () {
+		return 'fetch' in window && 'Response' in window && 'body' in window.Response.prototype;
+	},
+
+	/**
+	 * Check whether the engine is running in a Secure Context.
+	 *
+	 * @returns {boolean} If the engine is running in a Secure Context.
+	 * @function Engine.isSecureContext
+	 */
+	isSecureContext: function () {
+		return window['isSecureContext'] === true;
+	},
+
+	/**
+	 * Check whether the engine is cross origin isolated.
+	 * This value is dependent on Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers sent by the server.
+	 *
+	 * @returns {boolean} If the engine is running in a Secure Context.
+	 * @function Engine.isSecureContext
+	 */
+	isCrossOriginIsolated: function () {
+		return window['crossOriginIsolated'] === true;
+	},
+
+	/**
+	 * Check whether SharedBufferArray is available.
+	 *
+	 * Most browsers require the page to be running in a secure context, and the
+	 * the server to provide specific CORS headers for SharedArrayBuffer to be available.
+	 *
+	 * @returns {boolean} If SharedArrayBuffer is available.
+	 * @function Engine.isSharedArrayBufferAvailable
+	 */
+	isSharedArrayBufferAvailable: function () {
+		return 'SharedArrayBuffer' in window;
+	},
+
+	/**
+	 * Check whether the AudioContext supports AudioWorkletNodes.
+	 *
+	 * @returns {boolean} If AudioWorkletNode is available.
+	 * @function Engine.isAudioWorkletAvailable
+	 */
+	isAudioWorkletAvailable: function () {
+		return 'AudioContext' in window && 'audioWorklet' in AudioContext.prototype;
+	},
+
+	/**
+	 * Return an array of missing required features (as string).
+	 *
+	 * @returns {Array<string>} A list of human-readable missing features.
+	 * @function Engine.getMissingFeatures
+	 * @param {{threads: (boolean|undefined)}} supportedFeatures
+	 */
+	getMissingFeatures: function (supportedFeatures = {}) {
+		const {
+			// Quotes are needed for the Closure compiler.
+			'threads': supportsThreads = true,
+		} = supportedFeatures;
+
+		const missing = [];
+		if (!Features.isWebGLAvailable(2)) {
+			missing.push('WebGL2 - Check web browser configuration and hardware support');
+		}
+		if (!Features.isFetchAvailable()) {
+			missing.push('Fetch - Check web browser version');
+		}
+		if (!Features.isSecureContext()) {
+			missing.push('Secure Context - Check web server configuration (use HTTPS)');
+		}
+
+		if (supportsThreads) {
+			if (!Features.isCrossOriginIsolated()) {
+				missing.push('Cross-Origin Isolation - Check that the web server configuration sends the correct headers.');
+			}
+			if (!Features.isSharedArrayBufferAvailable()) {
+				missing.push('SharedArrayBuffer - Check that the web server configuration sends the correct headers.');
+			}
+		}
+
+		// Audio is normally optional since we have a dummy fallback.
+		return missing;
+	},
+};
+
+const Preloader = /** @constructor */ function () { // eslint-disable-line no-unused-vars
+	function getTrackedResponse(response, load_status) {
+		function onloadprogress(reader, controller) {
+			return reader.read().then(function (result) {
+				if (load_status.done) {
+					return Promise.resolve();
+				}
+				if (result.value) {
+					controller.enqueue(result.value);
+					load_status.loaded += result.value.length;
+				}
+				if (!result.done) {
+					return onloadprogress(reader, controller);
+				}
+				load_status.done = true;
+				return Promise.resolve();
+			});
+		}
+		const reader = response.body.getReader();
+		return new Response(new ReadableStream({
+			start: function (controller) {
+				onloadprogress(reader, controller).then(function () {
+					controller.close();
+				});
+			},
+		}), { headers: response.headers });
+	}
+
+	function loadFetch(file, tracker, fileSize, raw) {
+		tracker[file] = {
+			total: fileSize || 0,
+			loaded: 0,
+			done: false,
+		};
+		return fetch(file).then(function (response) {
+			if (!response.ok) {
+				return Promise.reject(new Error(`Failed loading file '${file}'`));
+			}
+			const tr = getTrackedResponse(response, tracker[file]);
+			if (raw) {
+				return Promise.resolve(tr);
+			}
+			return tr.arrayBuffer();
+		});
+	}
+
+	function retry(func, attempts = 1) {
+		function onerror(err) {
+			if (attempts <= 1) {
+				return Promise.reject(err);
+			}
+			return new Promise(function (resolve, reject) {
+				setTimeout(function () {
+					retry(func, attempts - 1).then(resolve).catch(reject);
+				}, 1000);
+			});
+		}
+		return func().catch(onerror);
+	}
+
+	const DOWNLOAD_ATTEMPTS_MAX = 4;
+	const loadingFiles = {};
+	const lastProgress = { loaded: 0, total: 0 };
+	let progressFunc = null;
+
+	const animateProgress = function () {
+		let loaded = 0;
+		let total = 0;
+		let totalIsValid = true;
+		let progressIsFinal = true;
+
+		Object.keys(loadingFiles).forEach(function (file) {
+			const stat = loadingFiles[file];
+			if (!stat.done) {
+				progressIsFinal = false;
+			}
+			if (!totalIsValid || stat.total === 0) {
+				totalIsValid = false;
+				total = 0;
+			} else {
+				total += stat.total;
+			}
+			loaded += stat.loaded;
+		});
+		if (loaded !== lastProgress.loaded || total !== lastProgress.total) {
+			lastProgress.loaded = loaded;
+			lastProgress.total = total;
+			if (typeof progressFunc === 'function') {
+				progressFunc(loaded, total);
+			}
+		}
+		if (!progressIsFinal) {
+			requestAnimationFrame(animateProgress);
+		}
+	};
+
+	this.animateProgress = animateProgress;
+
+	this.setProgressFunc = function (callback) {
+		progressFunc = callback;
+	};
+
+	this.loadPromise = function (file, fileSize, raw = false) {
+		return retry(loadFetch.bind(null, file, loadingFiles, fileSize, raw), DOWNLOAD_ATTEMPTS_MAX);
+	};
+
+	this.preloadedFiles = [];
+	this.preload = function (pathOrBuffer, destPath, fileSize) {
+		let buffer = null;
+		if (typeof pathOrBuffer === 'string') {
+			const me = this;
+			return this.loadPromise(pathOrBuffer, fileSize).then(function (buf) {
+				me.preloadedFiles.push({
+					path: destPath || pathOrBuffer,
+					buffer: buf,
+				});
+				return Promise.resolve();
+			});
+		} else if (pathOrBuffer instanceof ArrayBuffer) {
+			buffer = new Uint8Array(pathOrBuffer);
+		} else if (ArrayBuffer.isView(pathOrBuffer)) {
+			buffer = new Uint8Array(pathOrBuffer.buffer);
+		}
+		if (buffer) {
+			this.preloadedFiles.push({
+				path: destPath,
+				buffer: pathOrBuffer,
+			});
+			return Promise.resolve();
+		}
+		return Promise.reject(new Error('Invalid object for preloading'));
+	};
+};
+
+/**
+ * An object used to configure the Engine instance based on godot export options, and to override those in custom HTML
+ * templates if needed.
+ *
+ * @header Engine configuration
+ * @summary The Engine configuration object. This is just a typedef, create it like a regular object, e.g.:
+ *
+ * ``const MyConfig = { executable: 'godot', unloadAfterInit: false }``
+ *
+ * @typedef {Object} EngineConfig
+ */
+const EngineConfig = {}; // eslint-disable-line no-unused-vars
+
+/**
+ * @struct
+ * @constructor
+ * @ignore
+ */
+const InternalConfig = function (initConfig) { // eslint-disable-line no-unused-vars
+	const cfg = /** @lends {InternalConfig.prototype} */ {
+		/**
+		 * Whether to unload the engine automatically after the instance is initialized.
+		 *
+		 * @memberof EngineConfig
+		 * @default
+		 * @type {boolean}
+		 */
+		unloadAfterInit: true,
+		/**
+		 * The HTML DOM Canvas object to use.
+		 *
+		 * By default, the first canvas element in the document will be used is none is specified.
+		 *
+		 * @memberof EngineConfig
+		 * @default
+		 * @type {?HTMLCanvasElement}
+		 */
+		canvas: null,
+		/**
+		 * The name of the WASM file without the extension. (Set by Godot Editor export process).
+		 *
+		 * @memberof EngineConfig
+		 * @default
+		 * @type {string}
+		 */
+		executable: '',
+		/**
+		 * An alternative name for the game pck to load. The executable name is used otherwise.
+		 *
+		 * @memberof EngineConfig
+		 * @default
+		 * @type {?string}
+		 */
+		mainPack: null,
+		/**
+		 * Specify a language code to select the proper localization for the game.
+		 *
+		 * The browser locale will be used if none is specified. See complete list of
+		 * :ref:`supported locales <doc_locales>`.
+		 *
+		 * @memberof EngineConfig
+		 * @type {?string}
+		 * @default
+		 */
+		locale: null,
+		/**
+		 * The canvas resize policy determines how the canvas should be resized by Godot.
+		 *
+		 * ``0`` means Godot won't do any resizing. This is useful if you want to control the canvas size from
+		 * javascript code in your template.
+		 *
+		 * ``1`` means Godot will resize the canvas on start, and when changing window size via engine functions.
+		 *
+		 * ``2`` means Godot will adapt the canvas size to match the whole browser window.
+		 *
+		 * @memberof EngineConfig
+		 * @type {number}
+		 * @default
+		 */
+		canvasResizePolicy: 2,
+		/**
+		 * The arguments to be passed as command line arguments on startup.
+		 *
+		 * See :ref:`command line tutorial <doc_command_line_tutorial>`.
+		 *
+		 * **Note**: :js:meth:`startGame <Engine.prototype.startGame>` will always add the ``--main-pack`` argument.
+		 *
+		 * @memberof EngineConfig
+		 * @type {Array<string>}
+		 * @default
+		 */
+		args: [],
+		/**
+		 * When enabled, the game canvas will automatically grab the focus when the engine starts.
+		 *
+		 * @memberof EngineConfig
+		 * @type {boolean}
+		 * @default
+		 */
+		focusCanvas: true,
+		/**
+		 * When enabled, this will turn on experimental virtual keyboard support on mobile.
+		 *
+		 * @memberof EngineConfig
+		 * @type {boolean}
+		 * @default
+		 */
+		experimentalVK: false,
+		/**
+		 * The progressive web app service worker to install.
+		 * @memberof EngineConfig
+		 * @default
+		 * @type {string}
+		 */
+		serviceWorker: '',
+		/**
+		 * @ignore
+		 * @type {Array.<string>}
+		 */
+		persistentPaths: ['/userfs'],
+		/**
+		 * @ignore
+		 * @type {boolean}
+		 */
+		persistentDrops: false,
+		/**
+		 * @ignore
+		 * @type {Array.<string>}
+		 */
+		gdextensionLibs: [],
+		/**
+		 * @ignore
+		 * @type {Array.<string>}
+		 */
+		fileSizes: [],
+		/**
+		 * A callback function for handling Godot's ``OS.execute`` calls.
+		 *
+		 * This is for example used in the Web Editor template to switch between project manager and editor, and for running the game.
+		 *
+		 * @callback EngineConfig.onExecute
+		 * @param {string} path The path that Godot's wants executed.
+		 * @param {Array.<string>} args The arguments of the "command" to execute.
+		 */
+		/**
+		 * @ignore
+		 * @type {?function(string, Array.<string>)}
+		 */
+		onExecute: null,
+		/**
+		 * A callback function for being notified when the Godot instance quits.
+		 *
+		 * **Note**: This function will not be called if the engine crashes or become unresponsive.
+		 *
+		 * @callback EngineConfig.onExit
+		 * @param {number} status_code The status code returned by Godot on exit.
+		 */
+		/**
+		 * @ignore
+		 * @type {?function(number)}
+		 */
+		onExit: null,
+		/**
+		 * A callback function for displaying download progress.
+		 *
+		 * The function is called once per frame while downloading files, so the usage of ``requestAnimationFrame()``
+		 * is not necessary.
+		 *
+		 * If the callback function receives a total amount of bytes as 0, this means that it is impossible to calculate.
+		 * Possible reasons include:
+		 *
+		 * -  Files are delivered with server-side chunked compression
+		 * -  Files are delivered with server-side compression on Chromium
+		 * -  Not all file downloads have started yet (usually on servers without multi-threading)
+		 *
+		 * @callback EngineConfig.onProgress
+		 * @param {number} current The current amount of downloaded bytes so far.
+		 * @param {number} total The total amount of bytes to be downloaded.
+		 */
+		/**
+		 * @ignore
+		 * @type {?function(number, number)}
+		 */
+		onProgress: null,
+		/**
+		 * A callback function for handling the standard output stream. This method should usually only be used in debug pages.
+		 *
+		 * By default, ``console.log()`` is used.
+		 *
+		 * @callback EngineConfig.onPrint
+		 * @param {...*} [var_args] A variadic number of arguments to be printed.
+		 */
+		/**
+		 * @ignore
+		 * @type {?function(...*)}
+		 */
+		onPrint: function () {
+			console.log.apply(console, Array.from(arguments)); // eslint-disable-line no-console
+		},
+		/**
+		 * A callback function for handling the standard error stream. This method should usually only be used in debug pages.
+		 *
+		 * By default, ``console.error()`` is used.
+		 *
+		 * @callback EngineConfig.onPrintError
+		 * @param {...*} [var_args] A variadic number of arguments to be printed as errors.
+		*/
+		/**
+		 * @ignore
+		 * @type {?function(...*)}
+		 */
+		onPrintError: function (var_args) {
+			console.error.apply(console, Array.from(arguments)); // eslint-disable-line no-console
+		},
+	};
+
+	/**
+	 * @ignore
+	 * @struct
+	 * @constructor
+	 * @param {EngineConfig} opts
+	 */
+	function Config(opts) {
+		this.update(opts);
+	}
+
+	Config.prototype = cfg;
+
+	/**
+	 * @ignore
+	 * @param {EngineConfig} opts
+	 */
+	Config.prototype.update = function (opts) {
+		const config = opts || {};
+		// NOTE: We must explicitly pass the default, accessing it via
+		// the key will fail due to closure compiler renames.
+		function parse(key, def) {
+			if (typeof (config[key]) === 'undefined') {
+				return def;
+			}
+			return config[key];
+		}
+		// Module config
+		this.unloadAfterInit = parse('unloadAfterInit', this.unloadAfterInit);
+		this.onPrintError = parse('onPrintError', this.onPrintError);
+		this.onPrint = parse('onPrint', this.onPrint);
+		this.onProgress = parse('onProgress', this.onProgress);
+
+		// Godot config
+		this.canvas = parse('canvas', this.canvas);
+		this.executable = parse('executable', this.executable);
+		this.mainPack = parse('mainPack', this.mainPack);
+		this.locale = parse('locale', this.locale);
+		this.canvasResizePolicy = parse('canvasResizePolicy', this.canvasResizePolicy);
+		this.persistentPaths = parse('persistentPaths', this.persistentPaths);
+		this.persistentDrops = parse('persistentDrops', this.persistentDrops);
+		this.experimentalVK = parse('experimentalVK', this.experimentalVK);
+		this.focusCanvas = parse('focusCanvas', this.focusCanvas);
+		this.serviceWorker = parse('serviceWorker', this.serviceWorker);
+		this.gdextensionLibs = parse('gdextensionLibs', this.gdextensionLibs);
+		this.fileSizes = parse('fileSizes', this.fileSizes);
+		this.args = parse('args', this.args);
+		this.onExecute = parse('onExecute', this.onExecute);
+		this.onExit = parse('onExit', this.onExit);
+	};
+
+	/**
+	 * @ignore
+	 * @param {string} loadPath
+	 * @param {Response} response
+	 */
+	Config.prototype.getModuleConfig = function (loadPath, response) {
+		let r = response;
+		const gdext = this.gdextensionLibs;
+		return {
+			'print': this.onPrint,
+			'printErr': this.onPrintError,
+			'thisProgram': this.executable,
+			'noExitRuntime': false,
+			'dynamicLibraries': [`${loadPath}.side.wasm`].concat(this.gdextensionLibs),
+			'instantiateWasm': function (imports, onSuccess) {
+				function done(result) {
+					onSuccess(result['instance'], result['module']);
+				}
+				if (typeof (WebAssembly.instantiateStreaming) !== 'undefined') {
+					WebAssembly.instantiateStreaming(Promise.resolve(r), imports).then(done);
+				} else {
+					r.arrayBuffer().then(function (buffer) {
+						WebAssembly.instantiate(buffer, imports).then(done);
+					});
+				}
+				r = null;
+				return {};
+			},
+			'locateFile': function (path) {
+				if (!path.startsWith('godot.')) {
+					return path;
+				} else if (path.endsWith('.worker.js')) {
+					return `${loadPath}.worker.js`;
+				} else if (path.endsWith('.audio.worklet.js')) {
+					return `${loadPath}.audio.worklet.js`;
+				} else if (path.endsWith('.js')) {
+					return `${loadPath}.js`;
+				} else if (path in gdext) {
+					return path;
+				} else if (path.endsWith('.side.wasm')) {
+					return `${loadPath}.side.wasm`;
+				} else if (path.endsWith('.wasm')) {
+					return `${loadPath}.wasm`;
+				}
+				return path;
+			},
+		};
+	};
+
+	/**
+	 * @ignore
+	 * @param {function()} cleanup
+	 */
+	Config.prototype.getGodotConfig = function (cleanup) {
+		// Try to find a canvas
+		if (!(this.canvas instanceof HTMLCanvasElement)) {
+			const nodes = document.getElementsByTagName('canvas');
+			if (nodes.length && nodes[0] instanceof HTMLCanvasElement) {
+				const first = nodes[0];
+				this.canvas = /** @type {!HTMLCanvasElement} */ (first);
+			}
+			if (!this.canvas) {
+				throw new Error('No canvas found in page');
+			}
+		}
+		// Canvas can grab focus on click, or key events won't work.
+		if (this.canvas.tabIndex < 0) {
+			this.canvas.tabIndex = 0;
+		}
+
+		// Browser locale, or custom one if defined.
+		let locale = this.locale;
+		if (!locale) {
+			locale = navigator.languages ? navigator.languages[0] : navigator.language;
+			locale = locale.split('.')[0];
+		}
+		locale = locale.replace('-', '_');
+		const onExit = this.onExit;
+
+		// Godot configuration.
+		return {
+			'canvas': this.canvas,
+			'canvasResizePolicy': this.canvasResizePolicy,
+			'locale': locale,
+			'persistentDrops': this.persistentDrops,
+			'virtualKeyboard': this.experimentalVK,
+			'focusCanvas': this.focusCanvas,
+			'onExecute': this.onExecute,
+			'onExit': function (p_code) {
+				cleanup(); // We always need to call the cleanup callback to free memory.
+				if (typeof (onExit) === 'function') {
+					onExit(p_code);
+				}
+			},
+		};
+	};
+	return new Config(initConfig);
+};
+
+/**
+ * Projects exported for the Web expose the :js:class:`Engine` class to the JavaScript environment, that allows
+ * fine control over the engine's start-up process.
+ *
+ * This API is built in an asynchronous manner and requires basic understanding
+ * of `Promises <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises>`__.
+ *
+ * @module Engine
+ * @header Web export JavaScript reference
+ */
+const Engine = (function () {
+	const preloader = new Preloader();
+
+	let loadPromise = null;
+	let loadPath = '';
+	let initPromise = null;
+
+	/**
+	 * @classdesc The ``Engine`` class provides methods for loading and starting exported projects on the Web. For default export
+	 * settings, this is already part of the exported HTML page. To understand practical use of the ``Engine`` class,
+	 * see :ref:`Custom HTML page for Web export <doc_customizing_html5_shell>`.
+	 *
+	 * @description Create a new Engine instance with the given configuration.
+	 *
+	 * @global
+	 * @constructor
+	 * @param {EngineConfig} initConfig The initial config for this instance.
+	 */
+	function Engine(initConfig) { // eslint-disable-line no-shadow
+		this.config = new InternalConfig(initConfig);
+		this.rtenv = null;
+	}
+
+	/**
+	 * Load the engine from the specified base path.
+	 *
+	 * @param {string} basePath Base path of the engine to load.
+	 * @param {number=} [size=0] The file size if known.
+	 * @returns {Promise} A Promise that resolves once the engine is loaded.
+	 *
+	 * @function Engine.load
+	 */
+	Engine.load = function (basePath, size) {
+		if (loadPromise == null) {
+			loadPath = basePath;
+			loadPromise = preloader.loadPromise(`${loadPath}.wasm`, size, true);
+			requestAnimationFrame(preloader.animateProgress);
+		}
+		return loadPromise;
+	};
+
+	/**
+	 * Unload the engine to free memory.
+	 *
+	 * This method will be called automatically depending on the configuration. See :js:attr:`unloadAfterInit`.
+	 *
+	 * @function Engine.unload
+	 */
+	Engine.unload = function () {
+		loadPromise = null;
+	};
+
+	/**
+	 * Safe Engine constructor, creates a new prototype for every new instance to avoid prototype pollution.
+	 * @ignore
+	 * @constructor
+	 */
+	function SafeEngine(initConfig) {
+		const proto = /** @lends Engine.prototype */ {
+			/**
+			 * Initialize the engine instance. Optionally, pass the base path to the engine to load it,
+			 * if it hasn't been loaded yet. See :js:meth:`Engine.load`.
+			 *
+			 * @param {string=} basePath Base path of the engine to load.
+			 * @return {Promise} A ``Promise`` that resolves once the engine is loaded and initialized.
+			 */
+			init: function (basePath) {
+				if (initPromise) {
+					return initPromise;
+				}
+				if (loadPromise == null) {
+					if (!basePath) {
+						initPromise = Promise.reject(new Error('A base path must be provided when calling `init` and the engine is not loaded.'));
+						return initPromise;
+					}
+					Engine.load(basePath, this.config.fileSizes[`${basePath}.wasm`]);
+				}
+				const me = this;
+				function doInit(promise) {
+					// Care! Promise chaining is bogus with old emscripten versions.
+					// This caused a regression with the Mono build (which uses an older emscripten version).
+					// Make sure to test that when refactoring.
+					return new Promise(function (resolve, reject) {
+						promise.then(function (response) {
+							const cloned = new Response(response.clone().body, { 'headers': [['content-type', 'application/wasm']] });
+							Godot(me.config.getModuleConfig(loadPath, cloned)).then(function (module) {
+								const paths = me.config.persistentPaths;
+								module['initFS'](paths).then(function (err) {
+									me.rtenv = module;
+									if (me.config.unloadAfterInit) {
+										Engine.unload();
+									}
+									resolve();
+								});
+							});
+						});
+					});
+				}
+				preloader.setProgressFunc(this.config.onProgress);
+				initPromise = doInit(loadPromise);
+				return initPromise;
+			},
+
+			/**
+			 * Load a file so it is available in the instance's file system once it runs. Must be called **before** starting the
+			 * instance.
+			 *
+			 * If not provided, the ``path`` is derived from the URL of the loaded file.
+			 *
+			 * @param {string|ArrayBuffer} file The file to preload.
+			 *
+			 * If a ``string`` the file will be loaded from that path.
+			 *
+			 * If an ``ArrayBuffer`` or a view on one, the buffer will used as the content of the file.
+			 *
+			 * @param {string=} path Path by which the file will be accessible. Required, if ``file`` is not a string.
+			 *
+			 * @returns {Promise} A Promise that resolves once the file is loaded.
+			 */
+			preloadFile: function (file, path) {
+				return preloader.preload(file, path, this.config.fileSizes[file]);
+			},
+
+			/**
+			 * Start the engine instance using the given override configuration (if any).
+			 * :js:meth:`startGame <Engine.prototype.startGame>` can be used in typical cases instead.
+			 *
+			 * This will initialize the instance if it is not initialized. For manual initialization, see :js:meth:`init <Engine.prototype.init>`.
+			 * The engine must be loaded beforehand.
+			 *
+			 * Fails if a canvas cannot be found on the page, or not specified in the configuration.
+			 *
+			 * @param {EngineConfig} override An optional configuration override.
+			 * @return {Promise} Promise that resolves once the engine started.
+			 */
+			start: function (override) {
+				this.config.update(override);
+				const me = this;
+				return me.init().then(function () {
+					if (!me.rtenv) {
+						return Promise.reject(new Error('The engine must be initialized before it can be started'));
+					}
+
+					let config = {};
+					try {
+						config = me.config.getGodotConfig(function () {
+							me.rtenv = null;
+						});
+					} catch (e) {
+						return Promise.reject(e);
+					}
+					// Godot configuration.
+					me.rtenv['initConfig'](config);
+
+					// Preload GDExtension libraries.
+					if (me.config.gdextensionLibs.length > 0 && !me.rtenv['loadDynamicLibrary']) {
+						return Promise.reject(new Error('GDExtension libraries are not supported by this engine version. '
+							+ 'Enable "Extensions Support" for your export preset and/or build your custom template with "dlink_enabled=yes".'));
+					}
+					return new Promise(function (resolve, reject) {
+						for (const file of preloader.preloadedFiles) {
+							me.rtenv['copyToFS'](file.path, file.buffer);
+						}
+						preloader.preloadedFiles.length = 0; // Clear memory
+						me.rtenv['callMain'](me.config.args);
+						initPromise = null;
+						me.installServiceWorker();
+						resolve();
+					});
+				});
+			},
+
+			/**
+			 * Start the game instance using the given configuration override (if any).
+			 *
+			 * This will initialize the instance if it is not initialized. For manual initialization, see :js:meth:`init <Engine.prototype.init>`.
+			 *
+			 * This will load the engine if it is not loaded, and preload the main pck.
+			 *
+			 * This method expects the initial config (or the override) to have both the :js:attr:`executable` and :js:attr:`mainPack`
+			 * properties set (normally done by the editor during export).
+			 *
+			 * @param {EngineConfig} override An optional configuration override.
+			 * @return {Promise} Promise that resolves once the game started.
+			 */
+			startGame: function (override) {
+				this.config.update(override);
+				// Add main-pack argument.
+				const exe = this.config.executable;
+				const pack = this.config.mainPack || `${exe}.pck`;
+				this.config.args = ['--main-pack', pack].concat(this.config.args);
+				// Start and init with execName as loadPath if not inited.
+				const me = this;
+				return Promise.all([
+					this.init(exe),
+					this.preloadFile(pack, pack),
+				]).then(function () {
+					return me.start.apply(me);
+				});
+			},
+
+			/**
+			 * Create a file at the specified ``path`` with the passed as ``buffer`` in the instance's file system.
+			 *
+			 * @param {string} path The location where the file will be created.
+			 * @param {ArrayBuffer} buffer The content of the file.
+			 */
+			copyToFS: function (path, buffer) {
+				if (this.rtenv == null) {
+					throw new Error('Engine must be inited before copying files');
+				}
+				this.rtenv['copyToFS'](path, buffer);
+			},
+
+			/**
+			 * Request that the current instance quit.
+			 *
+			 * This is akin the user pressing the close button in the window manager, and will
+			 * have no effect if the engine has crashed, or is stuck in a loop.
+			 *
+			 */
+			requestQuit: function () {
+				if (this.rtenv) {
+					this.rtenv['request_quit']();
+				}
+			},
+
+			/**
+			 * Install the progressive-web app service worker.
+			 * @returns {Promise} The service worker registration promise.
+			 */
+			installServiceWorker: function () {
+				if (this.config.serviceWorker && 'serviceWorker' in navigator) {
+					return navigator.serviceWorker.register(this.config.serviceWorker);
+				}
+				return Promise.resolve();
+			},
+		};
+
+		Engine.prototype = proto;
+		// Closure compiler exported instance methods.
+		Engine.prototype['init'] = Engine.prototype.init;
+		Engine.prototype['preloadFile'] = Engine.prototype.preloadFile;
+		Engine.prototype['start'] = Engine.prototype.start;
+		Engine.prototype['startGame'] = Engine.prototype.startGame;
+		Engine.prototype['copyToFS'] = Engine.prototype.copyToFS;
+		Engine.prototype['requestQuit'] = Engine.prototype.requestQuit;
+		Engine.prototype['installServiceWorker'] = Engine.prototype.installServiceWorker;
+		// Also expose static methods as instance methods
+		Engine.prototype['load'] = Engine.load;
+		Engine.prototype['unload'] = Engine.unload;
+		return new Engine(initConfig);
+	}
+
+	// Closure compiler exported static methods.
+	SafeEngine['load'] = Engine.load;
+	SafeEngine['unload'] = Engine.unload;
+
+	// Feature-detection utilities.
+	SafeEngine['isWebGLAvailable'] = Features.isWebGLAvailable;
+	SafeEngine['isFetchAvailable'] = Features.isFetchAvailable;
+	SafeEngine['isSecureContext'] = Features.isSecureContext;
+	SafeEngine['isCrossOriginIsolated'] = Features.isCrossOriginIsolated;
+	SafeEngine['isSharedArrayBufferAvailable'] = Features.isSharedArrayBufferAvailable;
+	SafeEngine['isAudioWorkletAvailable'] = Features.isAudioWorkletAvailable;
+	SafeEngine['getMissingFeatures'] = Features.getMissingFeatures;
+
+	return SafeEngine;
+}());
+if (typeof window !== 'undefined') {
+	window['Engine'] = Engine;
+}

cmd/search/index.manifest.json

@@ -0,0 +1 @@
+{"background_color":"#000000","display":"standalone","icons":[{"sizes":"144x144","src":"index.144x144.png","type":"image/png"},{"sizes":"180x180","src":"index.180x180.png","type":"image/png"},{"sizes":"512x512","src":"index.512x512.png","type":"image/png"}],"name":"MusicSearch","orientation":"any","start_url":"./index.html"}

cmd/search/index.offline.html

@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="X-UA-Compatible" content="IE=edge">
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<title>You are offline</title>
+		<style>
+html {
+	background-color: #000000;
+	color: #ffffff;
+}
+
+body {
+	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+	margin: 2rem;
+}
+
+p {
+	margin-block: 1rem;
+}
+
+button {
+	display: block;
+	padding: 1rem 2rem;
+	margin: 3rem auto 0;
+}
+		</style>
+	</head>
+	<body>
+		<h1>You are offline</h1>
+		<p>This application requires an Internet connection to run for the first time.</p>
+		<p>Press the button below to try reloading:</p>
+		<button type="button">Reload</button>
+		<script>
+document.querySelector('button').addEventListener('click', () => {
+	window.location.reload();
+});
+		</script>
+	</body>
+</html>

cmd/search/index.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://bxh15ilo8hoq"
+path="res://.godot/imported/index.png-80964ad67552d78b1e33f58ad16188ff.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://web/index.png"
+dest_files=["res://.godot/imported/index.png-80964ad67552d78b1e33f58ad16188ff.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1

cmd/search/index.service.worker.js

@@ -0,0 +1,166 @@
+// This service worker is required to expose an exported Godot project as a
+// Progressive Web App. It provides an offline fallback page telling the user
+// that they need an Internet connection to run the project if desired.
+// Incrementing CACHE_VERSION will kick off the install event and force
+// previously cached resources to be updated from the network.
+/** @type {string} */
+const CACHE_VERSION = '1726998131|1051448710';
+/** @type {string} */
+const CACHE_PREFIX = 'MusicSearch-sw-cache-';
+const CACHE_NAME = CACHE_PREFIX + CACHE_VERSION;
+/** @type {string} */
+const OFFLINE_URL = 'index.offline.html';
+/** @type {boolean} */
+const ENSURE_CROSSORIGIN_ISOLATION_HEADERS = false;
+// Files that will be cached on load.
+/** @type {string[]} */
+const CACHED_FILES = ["index.html","index.js","index.offline.html","index.icon.png","index.apple-touch-icon.png","index.worker.js","index.audio.worklet.js"];
+// Files that we might not want the user to preload, and will only be cached on first load.
+/** @type {string[]} */
+const CACHABLE_FILES = ["index.wasm","index.pck"];
+const FULL_CACHE = CACHED_FILES.concat(CACHABLE_FILES);
+
+self.addEventListener('install', (event) => {
+	event.waitUntil(caches.open(CACHE_NAME).then((cache) => cache.addAll(CACHED_FILES)));
+});
+
+self.addEventListener('activate', (event) => {
+	event.waitUntil(caches.keys().then(
+		function (keys) {
+			// Remove old caches.
+			return Promise.all(keys.filter((key) => key.startsWith(CACHE_PREFIX) && key !== CACHE_NAME).map((key) => caches.delete(key)));
+		}
+	).then(function () {
+		// Enable navigation preload if available.
+		return ('navigationPreload' in self.registration) ? self.registration.navigationPreload.enable() : Promise.resolve();
+	}));
+});
+
+/**
+ * Ensures that the response has the correct COEP/COOP headers
+ * @param {Response} response
+ * @returns {Response}
+ */
+function ensureCrossOriginIsolationHeaders(response) {
+	if (response.headers.get('Cross-Origin-Embedder-Policy') === 'require-corp'
+		&& response.headers.get('Cross-Origin-Opener-Policy') === 'same-origin') {
+		return response;
+	}
+
+	const crossOriginIsolatedHeaders = new Headers(response.headers);
+	crossOriginIsolatedHeaders.set('Cross-Origin-Embedder-Policy', 'require-corp');
+	crossOriginIsolatedHeaders.set('Cross-Origin-Opener-Policy', 'same-origin');
+	const newResponse = new Response(response.body, {
+		status: response.status,
+		statusText: response.statusText,
+		headers: crossOriginIsolatedHeaders,
+	});
+
+	return newResponse;
+}
+
+/**
+ * Calls fetch and cache the result if it is cacheable
+ * @param {FetchEvent} event
+ * @param {Cache} cache
+ * @param {boolean} isCacheable
+ * @returns {Response}
+ */
+async function fetchAndCache(event, cache, isCacheable) {
+	// Use the preloaded response, if it's there
+	/** @type { Response } */
+	let response = await event.preloadResponse;
+	if (response == null) {
+		// Or, go over network.
+		response = await self.fetch(event.request);
+	}
+
+	if (ENSURE_CROSSORIGIN_ISOLATION_HEADERS) {
+		response = ensureCrossOriginIsolationHeaders(response);
+	}
+
+	if (isCacheable) {
+		// And update the cache
+		cache.put(event.request, response.clone());
+	}
+
+	return response;
+}
+
+self.addEventListener(
+	'fetch',
+	/**
+	 * Triggered on fetch
+	 * @param {FetchEvent} event
+	 */
+	(event) => {
+		const isNavigate = event.request.mode === 'navigate';
+		const url = event.request.url || '';
+		const referrer = event.request.referrer || '';
+		const base = referrer.slice(0, referrer.lastIndexOf('/') + 1);
+		const local = url.startsWith(base) ? url.replace(base, '') : '';
+		const isCachable = FULL_CACHE.some((v) => v === local) || (base === referrer && base.endsWith(CACHED_FILES[0]));
+		if (isNavigate || isCachable) {
+			event.respondWith((async () => {
+				// Try to use cache first
+				const cache = await caches.open(CACHE_NAME);
+				if (isNavigate) {
+					// Check if we have full cache during HTML page request.
+					/** @type {Response[]} */
+					const fullCache = await Promise.all(FULL_CACHE.map((name) => cache.match(name)));
+					const missing = fullCache.some((v) => v === undefined);
+					if (missing) {
+						try {
+							// Try network if some cached file is missing (so we can display offline page in case).
+							const response = await fetchAndCache(event, cache, isCachable);
+							return response;
+						} catch (e) {
+							// And return the hopefully always cached offline page in case of network failure.
+							console.error('Network error: ', e); // eslint-disable-line no-console
+							return caches.match(OFFLINE_URL);
+						}
+					}
+				}
+				let cached = await cache.match(event.request);
+				if (cached != null) {
+					if (ENSURE_CROSSORIGIN_ISOLATION_HEADERS) {
+						cached = ensureCrossOriginIsolationHeaders(cached);
+					}
+					return cached;
+				}
+				// Try network if don't have it in cache.
+				const response = await fetchAndCache(event, cache, isCachable);
+				return response;
+			})());
+		} else if (ENSURE_CROSSORIGIN_ISOLATION_HEADERS) {
+			event.respondWith((async () => {
+				let response = await fetch(event.request);
+				response = ensureCrossOriginIsolationHeaders(response);
+				return response;
+			})());
+		}
+	}
+);
+
+self.addEventListener('message', (event) => {
+	// No cross origin
+	if (event.origin !== self.origin) {
+		return;
+	}
+	const id = event.source.id || '';
+	const msg = event.data || '';
+	// Ensure it's one of our clients.
+	self.clients.get(id).then(function (client) {
+		if (!client) {
+			return; // Not a valid client.
+		}
+		if (msg === 'claim') {
+			self.skipWaiting().then(() => self.clients.claim());
+		} else if (msg === 'clear') {
+			caches.delete(CACHE_NAME);
+		} else if (msg === 'update') {
+			self.skipWaiting().then(() => self.clients.claim()).then(() => self.clients.matchAll()).then((all) => all.forEach((c) => c.navigate(c.url)));
+		}
+	});
+});
+

cmd/swagger/index.html

@@ -0,0 +1,60 @@
+<!-- HTML for static distribution bundle build -->
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <title>Swagger UI</title>
+    <link rel="stylesheet" type="text/css" href="./swagger-ui.css" />
+    <link rel="icon" type="image/png" href="./favicon-32x32.png" sizes="32x32" />
+    <link rel="icon" type="image/png" href="./favicon-16x16.png" sizes="16x16" />
+    <style>
+      html
+      {
+        box-sizing: border-box;
+        overflow: -moz-scrollbars-vertical;
+        overflow-y: scroll;
+      }
+
+      *,
+      *:before,
+      *:after
+      {
+        box-sizing: inherit;
+      }
+
+      body
+      {
+        margin:0;
+        background: #fafafa;
+      }
+    </style>
+  </head>
+
+  <body>
+    <div id="swagger-ui"></div>
+
+    <script src="./swagger-ui-bundle.js" charset="UTF-8"> </script>
+    <script src="./swagger-ui-standalone-preset.js" charset="UTF-8"> </script>
+    <script>
+    window.onload = function() {
+      // Begin Swagger UI call region
+      const ui = SwaggerUIBundle({
+        url: "./swagger.yaml",
+        dom_id: '#swagger-ui',
+        deepLinking: true,
+        presets: [
+          SwaggerUIBundle.presets.apis,
+          SwaggerUIStandalonePreset
+        ],
+        plugins: [
+          SwaggerUIBundle.plugins.DownloadUrl
+        ],
+        layout: "StandaloneLayout"
+      });
+      // End Swagger UI call region
+
+      window.ui = ui;
+    };
+  </script>
+  </body>
+</html>

cmd/swagger/oauth2-redirect.html

@@ -0,0 +1,75 @@
+<!doctype html>
+<html lang="en-US">
+<head>
+    <title>Swagger UI: OAuth2 Redirect</title>
+</head>
+<body>
+<script>
+    'use strict';
+    function run () {
+        var oauth2 = window.opener.swaggerUIRedirectOauth2;
+        var sentState = oauth2.state;
+        var redirectUrl = oauth2.redirectUrl;
+        var isValid, qp, arr;
+
+        if (/code|token|error/.test(window.location.hash)) {
+            qp = window.location.hash.substring(1);
+        } else {
+            qp = location.search.substring(1);
+        }
+
+        arr = qp.split("&");
+        arr.forEach(function (v,i,_arr) { _arr[i] = '"' + v.replace('=', '":"') + '"';});
+        qp = qp ? JSON.parse('{' + arr.join() + '}',
+                function (key, value) {
+                    return key === "" ? value : decodeURIComponent(value);
+                }
+        ) : {};
+
+        isValid = qp.state === sentState;
+
+        if ((
+          oauth2.auth.schema.get("flow") === "accessCode" ||
+          oauth2.auth.schema.get("flow") === "authorizationCode" ||
+          oauth2.auth.schema.get("flow") === "authorization_code"
+        ) && !oauth2.auth.code) {
+            if (!isValid) {
+                oauth2.errCb({
+                    authId: oauth2.auth.name,
+                    source: "auth",
+                    level: "warning",
+                    message: "Authorization may be unsafe, passed state was changed in server Passed state wasn't returned from auth server"
+                });
+            }
+
+            if (qp.code) {
+                delete oauth2.state;
+                oauth2.auth.code = qp.code;
+                oauth2.callback({auth: oauth2.auth, redirectUrl: redirectUrl});
+            } else {
+                let oauthErrorMsg;
+                if (qp.error) {
+                    oauthErrorMsg = "["+qp.error+"]: " +
+                        (qp.error_description ? qp.error_description+ ". " : "no accessCode received from the server. ") +
+                        (qp.error_uri ? "More info: "+qp.error_uri : "");
+                }
+
+                oauth2.errCb({
+                    authId: oauth2.auth.name,
+                    source: "auth",
+                    level: "error",
+                    message: oauthErrorMsg || "[Authorization failed]: no accessCode received from the server"
+                });
+            }
+        } else {
+            oauth2.callback({auth: oauth2.auth, token: qp, isValid: isValid, redirectUrl: redirectUrl});
+        }
+        window.close();
+    }
+
+    window.addEventListener('DOMContentLoaded', function () {
+      run();
+    });
+</script>
+</body>
+</html>

cmd/swagger/swagger-ui-bundle.js

@@ -0,0 +1,3 @@
+/*! For license information please see swagger-ui-bundle.js.LICENSE.txt */
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.SwaggerUIBundle=t():e.SwaggerUIBundle=t()}(this,(function(){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/dist",n(n.s=479)}([function(e,t,n){"use strict";e.exports=n(555)},function(e,t,n){e.exports=function(){"use strict";var e=Array.prototype.slice;function t(e,t){t&&(e.prototype=Object.create(t.prototype)),e.prototype.constructor=e}function n(e){return i(e)?e:J(e)}function r(e){return u(e)?e:K(e)}function o(e){return s(e)?e:Y(e)}function a(e){return i(e)&&!c(e)?e:G(e)}function i(e){return!(!e||!e[f])}function u(e){return!(!e||!e[p])}function s(e){return!(!e||!e[h])}function c(e){return u(e)||s(e)}function l(e){return!(!e||!e[d])}t(r,n),t(o,n),t(a,n),n.isIterable=i,n.isKeyed=u,n.isIndexed=s,n.isAssociative=c,n.isOrdered=l,n.Keyed=r,n.Indexed=o,n.Set=a;var f="@@__IMMUTABLE_ITERABLE__@@",p="@@__IMMUTABLE_KEYED__@@",h="@@__IMMUTABLE_INDEXED__@@",d="@@__IMMUTABLE_ORDERED__@@",m="delete",v=5,g=1<<v,y=g-1,b={},w={value:!1},x={value:!1};function E(e){return e.value=!1,e}function _(e){e&&(e.value=!0)}function S(){}function k(e,t){t=t||0;for(var n=Math.max(0,e.length-t),r=new Array(n),o=0;o<n;o++)r[o]=e[o+t];return r}function A(e){return void 0===e.size&&(e.size=e.__iterate(C)),e.size}function O(e,t){if("number"!=typeof t){var n=t>>>0;if(""+n!==t||4294967295===n)return NaN;t=n}return t<0?A(e)+t:t}function C(){return!0}function j(e,t,n){return(0===e||void 0!==n&&e<=-n)&&(void 0===t||void 0!==n&&t>=n)}function T(e,t){return P(e,t,0)}function I(e,t){return P(e,t,t)}function P(e,t,n){return void 0===e?n:e<0?Math.max(0,t+e):void 0===t?e:Math.min(t,e)}var N=0,M=1,R=2,D="function"==typeof Symbol&&Symbol.iterator,L="@@iterator",B=D||L;function F(e){this.next=e}function z(e,t,n,r){var o=0===e?t:1===e?n:[t,n];return r?r.value=o:r={value:o,done:!1},r}function U(){return{value:void 0,done:!0}}function q(e){return!!H(e)}function V(e){return e&&"function"==typeof e.next}function W(e){var t=H(e);return t&&t.call(e)}function H(e){var t=e&&(D&&e[D]||e[L]);if("function"==typeof t)return t}function $(e){return e&&"number"==typeof e.length}function J(e){return null==e?ie():i(e)?e.toSeq():ce(e)}function K(e){return null==e?ie().toKeyedSeq():i(e)?u(e)?e.toSeq():e.fromEntrySeq():ue(e)}function Y(e){return null==e?ie():i(e)?u(e)?e.entrySeq():e.toIndexedSeq():se(e)}function G(e){return(null==e?ie():i(e)?u(e)?e.entrySeq():e:se(e)).toSetSeq()}F.prototype.toString=function(){return"[Iterator]"},F.KEYS=N,F.VALUES=M,F.ENTRIES=R,F.prototype.inspect=F.prototype.toSource=function(){return this.toString()},F.prototype[B]=function(){return this},t(J,n),J.of=function(){return J(arguments)},J.prototype.toSeq=function(){return this},J.prototype.toString=function(){return this.__toString("Seq {","}")},J.prototype.cacheResult=function(){return!this._cache&&this.__iterateUncached&&(this._cache=this.entrySeq().toArray(),this.size=this._cache.length),this},J.prototype.__iterate=function(e,t){return fe(this,e,t,!0)},J.prototype.__iterator=function(e,t){return pe(this,e,t,!0)},t(K,J),K.prototype.toKeyedSeq=function(){return this},t(Y,J),Y.of=function(){return Y(arguments)},Y.prototype.toIndexedSeq=function(){return this},Y.prototype.toString=function(){return this.__toString("Seq [","]")},Y.prototype.__iterate=function(e,t){return fe(this,e,t,!1)},Y.prototype.__iterator=function(e,t){return pe(this,e,t,!1)},t(G,J),G.of=function(){return G(arguments)},G.prototype.toSetSeq=function(){return this},J.isSeq=ae,J.Keyed=K,J.Set=G,J.Indexed=Y;var Q,Z,X,ee="@@__IMMUTABLE_SEQ__@@";function te(e){this._array=e,this.size=e.length}function ne(e){var t=Object.keys(e);this._object=e,this._keys=t,this.size=t.length}function re(e){this._iterable=e,this.size=e.length||e.size}function oe(e){this._iterator=e,this._iteratorCache=[]}function ae(e){return!(!e||!e[ee])}function ie(){return Q||(Q=new te([]))}function ue(e){var t=Array.isArray(e)?new te(e).fromEntrySeq():V(e)?new oe(e).fromEntrySeq():q(e)?new re(e).fromEntrySeq():"object"==typeof e?new ne(e):void 0;if(Line truncated
+//# sourceMappingURL=swagger-ui-bundle.js.map

cmd/swagger/swagger-ui-bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["webpack://SwaggerUIBundle/webpack/universalModuleDefinition","webpack://SwaggerUIBundle/webpack/bootstrap","webpack://SwaggerUIBundle/./node_modules/react/index.js","webpack://SwaggerUIBundle/./node_modules/immutable/dist/immutable.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/concat.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/defineProperty.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/map.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/classCallCheck.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/createClass.js","webpack://SwaggerUIBundle/./src/core/utils.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/inherits.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/createSuper.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/assertThisInitialized.js","webpack://SwaggerUIBundle/./node_modules/prop-types/index.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/filter.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/slicedToArray.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/toConsumableArray.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/object/keys.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/export.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/global.js","webpack://SwaggerUIBundle/./node_modules/reselect/es/defaultMemoize.js","webpack://SwaggerUIBundle/./node_modules/reselect/es/index.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/typeof.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/index-of.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/slice.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/array/is-array.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/for-each.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/object/assign.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/objectSpread2.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/helpers/extends.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/function-uncurry-this.js","webpack://SwaggerUIBundle/./src/core/window.js","webpack://SwaggerUIBundle/./node_modules/react-immutable-proptypes/dist/ImmutablePropTypes.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/json/stringify.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/reduce.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/includes.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/an-object.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/fails.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/path.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/object-is-prototype-of.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/function-call.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/is-pure.js","webpack://SwaggerUIBundle/./src/core/plugins/oas3/helpers.jsx","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/well-known-symbol.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/entry-virtual.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/is-callable.js","webpack://SwaggerUIBundle/./node_modules/lodash/get.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/regenerator/index.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/is-object.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/a-callable.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/has-own-property.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/define-well-known-symbol.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/iterate.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/bind.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/descriptors.js","webpack://SwaggerUIBundle/./src/core/plugins/spec/actions.js","webpack://SwaggerUIBundle/./node_modules/classnames/index.js","webpack://SwaggerUIBundle/./node_modules/core-js-pure/internals/function-bind-context.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/core-js-stable/instance/find.js","webpack://SwaggerUIBundle/./node_modules/@babel/runtime-corejs3/hLine truncated