show splash when done

src/index.js

@@ -5,7 +5,7 @@ const audioExtensions =['mp3', 'ogg', 'wav', 'flac'];
 const mappings = new Map(JSON.parse(localStorage.getItem('mappings')) || []);
 let statusLine = document.getElementById('status');
 // store for when done with sorting TODO display
-let initialContent = document.getElementById('current-file').innerHTML;
+let splash = document.getElementById('current-file').innerHTML;
 
 let history = [];
 
@@ -19,11 +19,10 @@ let history = [];
 function showServerError(fname, status, text) {
     if (status == 500) {
         message = `in ${fname}: server returned ${status}: '${text}'`;
-    else {
+    } else {
         message = `in ${fname}: server returned ${status}`;
-
     }
-    statusLine.innerHTML = message
+    statusLine.textContent = message;
     console.error(message);
 }
 
@@ -143,8 +142,12 @@ function renderCurrentFile() {
     // }
     const currentFileDiv = document.getElementById('current-file');
     currentFileDiv.innerHTML = "";
+    if (currentFile) {
         let element = createMediaFileElement(currentFile, true);
         currentFileDiv.appendChild(element);
+    } else {
+        currentFileDiv.innerHTML = splash;
+    }
 }
 
 
@@ -168,7 +171,12 @@ function preloadNextFile() {
 
 // set the currentFile variable according to currentFileIdx
 function setCurrentFile() {
-    // if none set and
+    // check configuration
+    if (mappings.size == 0) {
+        statusLine.textContent = "No mappings configured - Click 'Configure' first";
+        return;
+    }
+    // if none set and there are files
     if (currentFileIdx == null && fileList.length > 0) {
         currentFileIdx = 0;
     }
@@ -184,6 +192,7 @@ function setCurrentFile() {
     else {
         currentFileIdx = null;
         currentFile = "";
+        statusLine.textContent = "No more files to sort";
     }
     renderCurrentFile();
     renderFileList();
@@ -200,7 +209,7 @@ async function moveFile(directory) {
     const text = await response.text();
     // console.log(text);
     if (response.ok) {
-        statusLine.innerHTML = `Moved '${currentFile}' to '${directory}'`;
+        statusLine.textContent = `Moved '${currentFile}' to '${directory}'`;
         history.push([currentFile, directory]);
         // remove file from list
         fileList.splice(currentFileIdx, 1);
@@ -216,7 +225,7 @@ async function moveFile(directory) {
 
 async function undo() {
     if (!history.length > 0) {
-        statusLine.innerHTML = "Nothing to undo"
+        statusLine.textContent = "Nothing to undo"
         return;
     }
     const [file, directory] = history.pop();
@@ -248,6 +257,7 @@ async function initialize() {
     renderFileList();
     // setCurrentFile();
     preloadNextFile();
+    statusLine.textContent = "Loaded";
 }
 
 // load existing mappings on page load