// Enable JS-only functionalities and disable nojs ones.
Array.prototype.slice.call(document.getElementsByClassName("jsonly")).forEach(e => e.removeAttribute("style"));
Array.prototype.slice.call(document.getElementsByClassName("nojs")).forEach(e => e.style.display = "none");
document.getElementById('fileinput').setAttribute('multiple','');

// get form
const form = document.getElementById('dropzone');

function upload(file) {
	// create the XHR
	const xhr = new XMLHttpRequest();
			
	// Create list item
	const list=document.getElementById('links');
	var entry=document.createElement('li');
	entry.innerHTML = file.name + '<br /><progress></progress>';
	list.appendChild(entry);

	// Progress bar
	xhr.upload.addEventListener('progress', function(e) {
		entry.innerHTML = file.name + '<br /><progress max="' + e.total + '" value="' + e.loaded +'"></progress>';
	});

	// Links response
	xhr.onload = () => {
		entry.innerHTML = '<a href="' + xhr.responseText + '">' + xhr.responseText + '</a>';
	};

	// create and send the request
	xhr.open('PUT', '/' + file.name);
	xhr.send(file);
}

// add event listener on form
form.addEventListener('submit', e => {
	// disable normal sending
	e.preventDefault();

	// get file list
	const files = document.getElementById('fileinput').files;

	// upload each file
	for (let i = 0; i < files.length; i++) {
		upload(files[i]);
	}
});