<div id="drop-area" class="ctdl-upload-drop-area">
<form class="my-form">
<p>${_("Drop files here to upload")}</p>
- <input type="file" id="fileElem" multiple accept="*/*" onChange="handleFiles(this.files)">
+ <input type="file" id="fileElem" multiple accept="*/*" onChange="handle_upload_files(this.files)">
</form>
</div>
</div>
//let dropArea = document.getElementById("ctdl-upload");
let dropArea = document.getElementById(parent_div);
;['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
- dropArea.addEventListener(eventName, preventDefaults, false)
+ dropArea.addEventListener(eventName, upload_prevent_defaults, false)
})
;["dragenter", "dragover"].forEach(eventName => {
- dropArea.addEventListener(eventName, highlight, false)
+ dropArea.addEventListener(eventName, upload_highlight, false)
})
;['dragleave', 'drop'].forEach(eventName => {
- dropArea.addEventListener(eventName, unhighlight, false)
+ dropArea.addEventListener(eventName, upload_unhighlight, false)
})
- dropArea.addEventListener('drop', handleDrop, false);
+ dropArea.addEventListener('drop', upload_handle_drop, false);
// make the modal smaller than the containing window but pretty big
//document.getElementById("ctdl-upload").style.width =
// prevent drag and drop events from propagating up through the DOM
-function preventDefaults(e) {
+function upload_prevent_defaults(e) {
e.preventDefault();
e.stopPropagation();
}
-function handleDrop(e) {
+function upload_handle_drop(e) {
let dt = e.dataTransfer;
let files = dt.files;
- handleFiles(files);
+ handle_upload_files(files);
}
-function handleFiles(files) {
- ([...files]).forEach(uploadFile)
+function handle_upload_files(files) {
+ ([...files]).forEach(upload_file)
}
-function uploadFile(file) {
+function upload_file(file) {
var url = '/ctdl/a/upload';
var xhr = new XMLHttpRequest();
var formData = new FormData();
if (xhr.readyState == 4 && xhr.status == 200) {
document.getElementById("ctdl-upload_list").innerHTML += "<li>succeeeeed</li>";
console.log("upload succeeded");
+ num_attachments += 1;
}
else if (xhr.readyState == 4 && xhr.status != 200) {
document.getElementById("ctdl-upload_list").innerHTML += "<li>EPIC FAIL</li>";
formData.append('file', file);
xhr.send(formData);
+ console.log("uploading...");
}
-function highlight(e) {
+function upload_highlight(e) {
let dropArea = document.getElementById("ctdl-upload");
dropArea.classList.add('highlight')
document.getElementById("ctdl-upload").style.display = "block"; /* also make it appear */
}
-function unhighlight(e) {
+function upload_unhighlight(e) {
let dropArea = document.getElementById("ctdl-upload");
dropArea.classList.remove('highlight')
}