diff options
Diffstat (limited to 'qc_app/static/js')
-rw-r--r-- | qc_app/static/js/upload_progress.js | 92 |
1 files changed, 92 insertions, 0 deletions
diff --git a/qc_app/static/js/upload_progress.js b/qc_app/static/js/upload_progress.js new file mode 100644 index 0000000..d615be4 --- /dev/null +++ b/qc_app/static/js/upload_progress.js @@ -0,0 +1,92 @@ +function make_processing_indicator(elt) { + var count = 0; + return function() { + var message = "Checking for errors: " + if(count > 5) { + count = 1; + } + for(i = 0; i < count; i++) { + message = message + "."; + } + elt.innerHTML = message + count = count + 1 + }; +} + +function make_progress_updater(file, indicator_elt) { + var progress_bar = indicator_elt.querySelector("#progress-bar"); + var progress_text = indicator_elt.querySelector("#progress-text"); + var extra_text = indicator_elt.querySelector("#progress-extra-text"); + return function(event) { + if(event.loaded <= file.size) { + var percent = Math.round((event.loaded / file.size) * 100); + progress_bar.value = percent + progress_text.innerHTML = "Uploading: " + percent + "%"; + extra_text.setAttribute("class", "hidden") + } + + if(event.loaded == event.total) { + progress_bar.value = 100; + progress_text.innerHTML = "Uploaded: 100%"; + extra_text.setAttribute("class", null); + intv = setInterval(make_processing_indicator(extra_text), 400); + setTimeout(function() {clearTimeout(intv);}, 20000); + } + }; +} + +function setup_request(file, progress_indicator_elt) { + var request = new XMLHttpRequest(); + var updater = make_progress_updater(file, progress_indicator_elt); + request.upload.addEventListener("progress", updater); + request.onload = function(event) { + document.location.assign(request.responseURL); + }; + return request; +} + +function selected_filetype(radios) { + for(idx = 0; idx < radios.length; idx++) { + if(radios[idx].checked) { + return radios[idx].value; + } + } +} + +function setup_formdata(form) { + var formdata = new FormData(); + formdata.append( + "qc_text_file", + form.querySelector("input[type='file']").files[0]); + formdata.append( + "filetype", + selected_filetype( + Array.from(form.querySelectorAll("input[type='radio']")))); + return formdata; +} + +function upload_data(event) { + event.preventDefault(); + + var pindicator = document.getElementById("progress-indicator"); + pindicator.setAttribute("class", "modal"); + + var form = document.getElementsByTagName("form")[0] + var formdata = setup_formdata(form); + + document.getElementById("progress-filename").innerHTML = ( + form.querySelector("input[type='file']").files[0].name); + var request = setup_request( + form.querySelector("input[type='file']").files[0], + document.getElementById("progress-indicator")); + request.open(form.getAttribute("method"), form.getAttribute("action")); + request.send(formdata); + return false; +} + + +function setup_upload_handlers() { + console.info("Setting up the upload handlers.") + upload_form = document.getElementsByTagName("form")[0]; + upload_form.addEventListener("submit", upload_data); +} |