diff --git a/scancodeio/static/add-inputs.js b/scancodeio/static/add-inputs.js index 508326ce2..51cd303d3 100644 --- a/scancodeio/static/add-inputs.js +++ b/scancodeio/static/add-inputs.js @@ -21,6 +21,8 @@ // Visit https://github.com/nexB/scancode.io for support and download. const fileInput = document.querySelector('#id_input_files'); +let selectedFiles = []; // Store selected files + fileInput.onchange = updateFiles; // Update the list of files to be uploaded in the UI @@ -28,8 +30,24 @@ function updateFiles() { if (fileInput.files.length > 0) { const fileName = document.querySelector('#inputs_file_name'); fileName.innerHTML = ""; - for (let file of fileInput.files) { - fileName.innerHTML += `${file.name}`; + + // Update the selectedFiles array + selectedFiles = selectedFiles.concat(Array.from(fileInput.files)); + + for (let file of selectedFiles) { + const fileNameWithoutSpaces = file.name.replace(/\s/g, ''); + fileName.innerHTML += ` + + ${file.name} + + + + + `; + document.getElementById("file-delete-btn-"+ fileNameWithoutSpaces).addEventListener("click", function(event){ + disableEvent(event); + removeFile(fileNameWithoutSpaces); + }); } } } @@ -40,6 +58,25 @@ function disableEvent(event) { event.preventDefault(); } +function removeFile(fileName) { + selectedFiles = selectedFiles.filter(file => { + const fileNameWithoutSpaces = file.name.replace(/\s/g, ''); + return fileNameWithoutSpaces !== fileName; + }); + + const fileNameElement = document.getElementById(`file-name-${fileName}`); + if (fileNameElement) { + fileNameElement.remove(); + } + + const dataTransfer = new DataTransfer(); + for (let file of selectedFiles) { + dataTransfer.items.add(file); + } + + fileInput.files = dataTransfer.files; +} + function dropHandler(event) { disableEvent(event); const droppedFiles = event.dataTransfer.files;