Implement chunk uploading
This commit is contained in:
cuom1999
parent
e1f19fb794
commit
e261fc9e3b
46 changed files with 24033 additions and 9 deletions
32
templates/fine_uploader/script.html
Normal file
32
templates/fine_uploader/script.html
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
<script type="text/template" id="qq-template">
|
||||
<div class="qq-uploader-selector qq-uploader">
|
||||
<div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
|
||||
<span>{{_('Drop files here to upload')}}</span>
|
||||
</div>
|
||||
<div class="qq-upload-button-selector qq-upload-button">
|
||||
<div>{{_('Upload file')}}</div>
|
||||
</div>
|
||||
<span class="qq-drop-processing-selector qq-drop-processing">
|
||||
<span>Processing dropped files...</span>
|
||||
<span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
|
||||
</span>
|
||||
<ul class="qq-upload-list-selector qq-upload-list">
|
||||
<li>
|
||||
<div class="qq-progress-bar-container-selector">
|
||||
<div class="qq-progress-bar-selector qq-progress-bar"></div>
|
||||
</div>
|
||||
<span class="qq-upload-spinner-selector qq-upload-spinner"></span>
|
||||
<span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
|
||||
<span class="qq-upload-file-selector qq-upload-file"></span>
|
||||
<input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
|
||||
<span class="qq-upload-size-selector qq-upload-size"></span>
|
||||
<a class="qq-upload-cancel-selector qq-upload-cancel" href="#">{{_('Cancel')}}</a>
|
||||
<a class="qq-upload-retry-selector qq-upload-retry" href="#">{{_('Retry')}}</a>
|
||||
<a class="qq-upload-delete-selector qq-upload-delete" href="#">{{_('Delete')}}</a>
|
||||
<button class="qq-upload-pause-selector qq-upload-pause">{{_('Pause')}}</button>
|
||||
<button class="qq-upload-continue-selector qq-upload-continue">{{_('Continue')}}</button>
|
||||
<span class="qq-upload-status-text-selector qq-upload-status-text"></span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</script>
|
||||
|
|
@ -3,14 +3,38 @@
|
|||
{% block js_media %}
|
||||
<script type="text/javascript">
|
||||
window.valid_files = {{valid_files_json}};
|
||||
|
||||
$(function () {
|
||||
});
|
||||
window.big_input = (window.valid_files.length > 100);
|
||||
</script>
|
||||
<script type="text/javascript" src="{{ static('jquery-ui.min.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ static('libs/featherlight/featherlight.min.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ static('fine-uploader/jquery.fine-uploader.js') }}"></script>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$("#problem-data-zipfile_fine_uploader").fineUploader({
|
||||
request: {
|
||||
endpoint: "{{url('problem_zip_upload', problem.code)}}",
|
||||
params: {
|
||||
'csrfmiddlewaretoken': '{{ csrf_token }}'
|
||||
}
|
||||
},
|
||||
chunking: {
|
||||
enabled: true,
|
||||
partSize: 40000000,
|
||||
},
|
||||
resume: {
|
||||
enabled: true
|
||||
},
|
||||
validation: {
|
||||
allowedExtensions: ['zip'],
|
||||
},
|
||||
}).on('complete', function (event, id, name, responseJSON) {
|
||||
console.log(responseJSON);
|
||||
if (!responseJSON.success) {
|
||||
alert('Fail to upload: ' + responseJSON.error);
|
||||
}
|
||||
else window.location.reload();
|
||||
});;
|
||||
|
||||
function update_select2() {
|
||||
$('tbody:not(.extra-row-body) .type-column select').select2({
|
||||
minimumResultsForSearch: -1
|
||||
|
|
@ -20,6 +44,7 @@
|
|||
update_select2();
|
||||
|
||||
function autofill_if_exists($select, file) {
|
||||
console.log(1);
|
||||
if (!$select.val() && ~window.valid_files.indexOf(file))
|
||||
$select.val(file).trigger('change');
|
||||
}
|
||||
|
|
@ -34,7 +59,7 @@
|
|||
style: 'width: 100%'
|
||||
})).val();
|
||||
$select.select2({
|
||||
data: window.valid_files,
|
||||
data: window.big_input ? [val] : window.valid_files,
|
||||
allowClear: true,
|
||||
placeholder: ''
|
||||
}).val(val).trigger('change').on('change', function () {
|
||||
|
|
@ -269,16 +294,25 @@
|
|||
inFiles.sort();
|
||||
outFiles.sort();
|
||||
|
||||
// big number of input
|
||||
if (inFiles.length > 100) {
|
||||
window.big_input = true;
|
||||
}
|
||||
|
||||
// add boxes
|
||||
while ($total.val() < inFiles.length) {
|
||||
$('a#add-case-row').click();
|
||||
}
|
||||
// fill cases
|
||||
for (var i = 0; i < inFiles.length; i++) {
|
||||
$("#id_cases-" + i + "-input_file").val(inFiles[i]).change();
|
||||
var $select = $("#id_cases-" + i + "-input_file");
|
||||
$select.select2('destroy').empty().select2({ data: [inFiles[i]] });
|
||||
$select.val(inFiles[i]).change();
|
||||
}
|
||||
for (var i = 0; i < outFiles.length; i++) {
|
||||
$("#id_cases-" + i + "-output_file").val(outFiles[i]).change();
|
||||
var $select = $("#id_cases-" + i + "-output_file");
|
||||
$select.select2('destroy').empty().select2({ data: [outFiles[i]] });
|
||||
$select.val(outFiles[i]).change();
|
||||
}
|
||||
|
||||
// add points
|
||||
|
|
@ -336,9 +370,11 @@
|
|||
|
||||
}).change();
|
||||
</script>
|
||||
{% include 'fine_uploader/script.html' %}
|
||||
{% endblock %}
|
||||
|
||||
{% block media %}
|
||||
<link href="{{ static ('fine-uploader/fine-uploader.css') }}" rel="stylesheet">
|
||||
<style>
|
||||
#case-table .select2 {
|
||||
text-align: initial;
|
||||
|
|
|
|||
4
templates/widgets/fine_uploader.html
Normal file
4
templates/widgets/fine_uploader.html
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{% if widget.is_initial %}
|
||||
{{ widget.initial_text }}: <a href="{{ widget.value.url }}">{{ widget.value }}</a>
|
||||
{% endif %}
|
||||
<center id={{widget.fine_uploader_id}} class="fine-uploader"></center>
|
||||
Loading…
Add table
Add a link
Reference in a new issue