Added a Web UI accesible via port 8265. Needs more testing and dev work. Logging to file must be enabled for the Web UI to read the log file.

mrusse · mrusse · commit 8429838040f4 · 2026-03-05T00:20:01.000-05:00
diff --git a/.gitattributes b/.gitattributes
@@ -0,0 +1 @@
+*.sh text eol=lf
diff --git a/Dockerfile b/Dockerfile
@@ -3,6 +3,8 @@ FROM python:3.11
 WORKDIR /app
 
 COPY requirements.txt soularr.py run.sh .
+COPY webui/ webui/
+COPY resources/ resources/
 
 RUN apt-get update \
     && apt-get install -y tini \
@@ -14,5 +16,7 @@ RUN apt-get update \
 ENV PYTHONUNBUFFERED=1
 ENV IN_DOCKER=Yes
 
+EXPOSE 8265
+
 ENTRYPOINT ["tini", "-g", "--"]
 CMD ["/app/run.sh"]
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -4,13 +4,17 @@ services:
     restart: unless-stopped
     container_name: soularr
     hostname: soularr
-    environment: 
+    environment:
       - PUID=1000
       - PGID=1000
       - TZ=Etc/UTC
       #Script interval in seconds
       - SCRIPT_INTERVAL=300
+      - WEBUI_ENABLED=true
     user: "1000:1000"
+    ports:
+      #Web UI port
+      - "8265:8265"
     volumes:
       #"You can set /downloads to whatever you want but will then need to change the Slskd download dir in your config file"
       - /path/to/slskd/downloads:/downloads
diff --git a/requirements.txt b/requirements.txt
@@ -1,3 +1,5 @@
 music-tag==0.4.3
 pyarr==5.2.0
-slskd-api==0.1.5
+slskd-api==0.1.5
+flask
+waitress
diff --git a/resources/favicon.ico b/resources/favicon.ico
diff --git a/resources/github.svg b/resources/github.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
+    <path d="M12 2C6.477 2 2 6.477 2 12c0 4.418 2.865 8.166 6.839 9.489.5.092.682-.217.682-.482 0-.237-.009-.868-.013-1.703-2.782.604-3.369-1.342-3.369-1.342-.454-1.155-1.11-1.463-1.11-1.463-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.269 2.75 1.025A9.578 9.578 0 0 1 12 6.836a9.59 9.59 0 0 1 2.504.337c1.909-1.294 2.747-1.025 2.747-1.025.546 1.377.202 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.336-.012 2.415-.012 2.743 0 .267.18.578.688.48C19.138 20.163 22 16.418 22 12c0-5.523-4.477-10-10-10z"/>
+</svg>
diff --git a/resources/logs.svg b/resources/logs.svg
@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
+    <polyline points="14 2 14 8 20 8"/>
+    <line x1="16" y1="13" x2="8" y2="13"/>
+    <line x1="16" y1="17" x2="8" y2="17"/>
+    <polyline points="10 9 9 9 8 9"/>
+</svg>
diff --git a/resources/settings.svg b/resources/settings.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+    <circle cx="12" cy="12" r="3"/>
+    <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/>
+</svg>
diff --git a/resources/sponsor.svg b/resources/sponsor.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
+    <path d="M12 21.593c-.425-.439-6.338-6.565-8.743-9.195C1.98 10.98 1.5 9.623 1.5 8.25 1.5 5.355 3.855 3 6.75 3c1.655 0 3.16.795 4.125 2.03a.75.75 0 0 0 1.25 0C13.09 3.795 14.595 3 16.25 3 19.145 3 21.5 5.355 21.5 8.25c0 1.373-.48 2.73-1.757 4.148-2.405 2.63-8.318 8.756-8.743 9.195z"/>
+</svg>
diff --git a/run.sh b/run.sh
@@ -6,6 +6,11 @@
 
 INTERVAL=${SCRIPT_INTERVAL:-300}
 
+# Start the web UI in the background (default enabled)
+if [ "${WEBUI_ENABLED:-true}" = "true" ]; then
+    python -u /app/webui/webui.py "$@" &
+fi
+
 while true; do
     if ps aux | grep "[s]oularr.py" > /dev/null; then
         echo "Soularr is already running. Exiting..."
@@ -17,4 +22,4 @@ while true; do
     dt=$(date '+%d/%m/%Y %H:%M:%S');
     echo "$dt - Waiting for $INTERVAL seconds before checking again..."
     sleep $INTERVAL
-done
+done
diff --git a/soularr.py b/soularr.py
@@ -886,7 +886,7 @@ def handle_rejected(album_id, file, problems):
         Handle Rejected files. Returns True if the album was deleted or a requeue was
         attempted (caller should stop processing this album this iteration).
         Rejected files often indicate grab limits; we wait for all other files to reach
-        a stable state before requeueing.
+        a stable state before requeuing.
         """
         files = grab_list[album_id]["files"]
         if len(problems) == len(files):
diff --git a/webui/static/app.js b/webui/static/app.js
@@ -0,0 +1,112 @@
+let autoScroll = true;
+const log = document.getElementById('log');
+const scrollBtn = document.getElementById('scroll-btn');
+
+const cmEditor = CodeMirror.fromTextArea(document.getElementById('config-editor'), {
+    mode: 'properties',
+    theme: 'soularr',
+    lineNumbers: true,
+    indentWithTabs: false,
+    lineWrapping: false,
+    extraKeys: { Tab: false },
+});
+
+function showView(name, btn) {
+    document.querySelectorAll('.view').forEach(v => v.classList.remove('active'));
+    document.querySelectorAll('.nav-btn').forEach(b => b.classList.remove('active'));
+    document.getElementById('view-' + name).classList.add('active');
+    btn.classList.add('active');
+    if (name === 'settings') {
+        loadConfig();
+        cmEditor.refresh();
+    }
+}
+
+function loadConfig() {
+    fetch('/api/config')
+        .then(r => r.json())
+        .then(data => {
+            document.getElementById('config-path').textContent = data.path;
+            cmEditor.setValue(data.content);
+            if (!data.exists) {
+                cmEditor.setOption('placeholder', 'Config file not found at the path above.');
+            }
+        });
+}
+
+function saveConfig() {
+    const btn = document.getElementById('save-btn');
+    const content = cmEditor.getValue();
+    btn.disabled = true;
+
+    let dotCount = 1;
+    btn.textContent = 'Saving.';
+    btn.classList.add('saving');
+    const dotAnim = setInterval(() => {
+        if (dotCount < 3) {
+            dotCount++;
+            btn.textContent = 'Saving' + '.'.repeat(dotCount);
+        }
+    }, 400);
+
+    const minDelay = new Promise(resolve => setTimeout(resolve, 1200));
+    const request = fetch('/api/config', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ content })
+    }).then(r => r.json());
+
+    Promise.all([request, minDelay])
+        .then(([data]) => {
+            clearInterval(dotAnim);
+            btn.classList.remove('saving');
+            btn.textContent = data.ok ? 'Saved' : 'Error';
+            btn.classList.toggle('active', data.ok);
+            btn.classList.toggle('save-error', !data.ok);
+            setTimeout(() => {
+                btn.textContent = 'Save';
+                btn.disabled = false;
+                btn.classList.remove('active', 'save-error');
+            }, 1000);
+        })
+        .catch(() => {
+            clearInterval(dotAnim);
+            btn.classList.remove('saving');
+            btn.textContent = 'Error';
+            btn.classList.add('save-error');
+            setTimeout(() => {
+                btn.textContent = 'Save';
+                btn.disabled = false;
+                btn.classList.remove('save-error');
+            }, 1000);
+        });
+}
+
+function toggleScroll() {
+    autoScroll = !autoScroll;
+    scrollBtn.classList.toggle('active', autoScroll);
+    if (autoScroll) log.scrollTop = log.scrollHeight;
+}
+
+function clearLog() {
+    log.innerHTML = '';
+}
+
+function classify(line) {
+    if (line.includes('[ERROR|'))   return 'level-error';
+    if (line.includes('[WARNING|')) return 'level-warn';
+    if (line.includes('[DEBUG|'))   return 'level-debug';
+    return 'level-info';
+}
+
+function appendLine(text) {
+    const div = document.createElement('div');
+    div.className = 'log-line ' + classify(text);
+    div.textContent = text;
+    log.appendChild(div);
+    if (autoScroll) log.scrollTop = log.scrollHeight;
+}
+
+const es = new EventSource('/stream');
+es.onmessage = e => appendLine(e.data);
+es.onerror = () => appendLine('--- connection lost, retrying... ---');
diff --git a/webui/static/style.css b/webui/static/style.css
diff --git a/webui/templates/index.html b/webui/templates/index.html
diff --git a/webui/webui.py b/webui/webui.py
