Add listing

src/main/resources/static/css/styles.css

@@ -82,3 +82,21 @@ body {
     overflow: hidden;
     background: transparent;
 }
+
+.panel {
+    margin-top: 24px;
+    padding: 16px;
+    background: #0b1220;
+    border-radius: 10px;
+    border: 1px solid #1f2937;
+}
+
+.panel ul {
+    list-style: none;
+    padding: 0;
+    margin: 8px 0 0 0;
+}
+
+.panel li {
+    margin: 6px 0;
+}

src/main/resources/static/js/admin.js

@@ -62,13 +62,18 @@ function draw() {
 }
 
 function uploadAsset() {
-    const url = document.getElementById('asset-url').value;
-    const width = parseFloat(document.getElementById('asset-width').value);
-    const height = parseFloat(document.getElementById('asset-height').value);
+    const fileInput = document.getElementById('asset-file');
+    if (!fileInput || !fileInput.files || fileInput.files.length === 0) {
+        alert('Please choose an image to upload.');
+        return;
+    }
+    const data = new FormData();
+    data.append('file', fileInput.files[0]);
     fetch(`/api/channels/${broadcaster}/assets`, {
         method: 'POST',
-        headers: {'Content-Type': 'application/json'},
-        body: JSON.stringify({url, width, height})
+        body: data
+    }).then(() => {
+        fileInput.value = '';
     });
 }