PHP/JavaScript Uploader
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
uploads/assets/js/uploading.js

98 lines
2.6 KiB

function isEmptyArray(array) {
return Array.isArray(array) && array.length === 0;
}
function handleFiles(files) {
const formData = new FormData();
const validFiles = [];
for (const file of files) {
if (file.size > 0) {
formData.append('files[]', file);
validFiles.push(file);
} else {
console.warn(`The file "${file.name}" is empty and will be skipped.`);
}
}
if (validFiles.length === 0) {
alert('No valid files to upload. All selected files are empty.');
return;
}
fetch('upload.php', {
method: 'POST',
body: formData
}).then(response => {
if (!response.ok) {
throw new Error('Network response was not ok: ' + response.status);
}
return response.json();
}).then(results => {
let successes = [];
let errors = [];
results.forEach(result => {
if (result.status == "success") {
successes.push(result.message);
} else {
errors.push(result.message);
}
});
if (!isEmptyArray(successes)) {
const success = successes.map(text => text).join(", ");
alert("Successfully uploaded: " + success);
}
if (!isEmptyArray(errors)) {
const error = errors.map(text => text).join(", ");
alert("Failed on: " + error);
}
}).catch(error => {
if (error.message.startsWith('Network response')) {
alert('Internal Server Error (500): There was a problem with the server.');
} else {
alert('Error:' + error);
}
}).finally(() => {
for (const key in formData) {
if (formData.hasOwnProperty(key)) {
delete formData[key];
}
}
while (validFiles.length > 0) {
validFiles.pop();
}
});
}
document.addEventListener('DOMContentLoaded', function() {
const uploadContainer = document.getElementById('uploadContainer');
const fileInput = document.getElementById('fileInput');
uploadContainer.addEventListener('click', () => fileInput.click());
uploadContainer.addEventListener('dragover', (e) => {
e.preventDefault();
uploadContainer.classList.add('dragover');
});
uploadContainer.addEventListener('dragleave', () => {
uploadContainer.classList.remove('dragover');
});
uploadContainer.addEventListener('drop', (e) => {
e.preventDefault();
uploadContainer.classList.remove('dragover');
let total = 0;
try {
total = e.dataTransfer.files.length;
} catch (error) {
console.error("Opps" + error.message);
}
if (total > 0) {
handleFiles(e.dataTransfer.files);
} else {
alert("No files dropped. Please try again.");
}
});
fileInput.addEventListener('change', (e) => handleFiles(e.target.files));
});