<script src="{% static 'filex/fileupload/jquery.fileupload.js' %}"></script>
<script src="{% static 'filex/underscore/underscore-min.js' %}"></script>
<script src="{% static 'filex/humanize/humanize-duration.js' %}"></script>
+<script src="{% static 'qcg/moment/moment.min.js' %}"></script>
+<script src="{% static 'qcg/moment/pl.js' %}"></script>
<script>
$(function () {
'use strict';
- var template = _.template($('#template').html());
+ var host = '{{ host }}',
+ path = '{{ path }}',
+ template = _.template($('#template').html()),
+ conflictTemplate = _.template($('#conflict-template').html()),
+ $conflictStack = $.when(),
+ $conflict = $('#conflict').modal({
+ show: false,
+ keyboard: false,
+ backdrop: 'static'
+ }),
+ applyToAll;
function humanBytes(bytes, no_unit) {
function format(val, unit) {
$('#files').fileupload({
sequentialUploads: true,
add: function (e, data) {
- $.each(data.files, function (index, file) {
- data.context = $(template(file));
- $('#elements').append(data.context);
- });
+ var file = data.files[0];
+
+ data.context = $(template(file));
+ $('#elements').append(data.context);
data.submit();
},
+ submit: function (e, data) {
+ var file = data.files[0],
+ $this = $(this);
+
+ data.context.find('.progress-info').text('Przetwarzanie');
+
+ function finish(action) {
+ if (action == 'replace')
+ data.jqXHR = $this.fileupload('send', data);
+ else
+ data.context.find('.progress-info').text('Pominięto');
+ }
+
+ $.getJSON('{% url 'filex:info' %}', {host: host, path: path + '/' + file.name}, function(response) {
+ if (applyToAll != undefined) {
+ finish(applyToAll);
+ return;
+ }
+
+ $conflictStack = $conflictStack.then(function() {
+ if (applyToAll != undefined) {
+ finish(applyToAll);
+ return;
+ }
+
+ var deferred = $.Deferred();
+
+ $conflict.one('hidden.bs.modal', function() {
+ deferred.resolve();
+ });
+
+ $('#btn-skip').off().on('click', function() {
+ if ($('#apply-to-all').prop('checked')) {
+ applyToAll = 'skip';
+ }
+
+ $conflict.modal('hide');
+ finish('skip');
+ });
+ $('#btn-replace').off().on('click', function() {
+ if ($('#apply-to-all').prop('checked')) {
+ applyToAll = 'replace';
+ }
+
+ $conflict.modal('hide');
+ finish('replace');
+ });
+
+ $conflict.find('.modal-body').html(conflictTemplate({
+ name: file.name,
+ srcDate: moment(file.lastModified),
+ srcSize: humanBytes(file.size),
+ dstDate: moment(response.date),
+ dstSize: humanBytes(response.size)
+ }));
+ $conflict.modal('show');
+
+ return deferred.promise();
+ });
+
+ }).fail(function(xhr, textStatus) {
+ // if file does not exist we are good to go
+ if (xhr.status == 404)
+ finish('replace');
+ else {
+ data.context.find('.progress-info').text('Błąd');
+ console.error("Info query failed: " + textStatus);
+ }
+ });
+
+ return false;
+ },
progress: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
data.context.find('.progress-info').text('Zakończono');
},
fail: function (e, data) {
- data.context.find('.progress-info').text('Błąd');
- console.log(data.errorThrown);
- console.log(data.textStatus);
+ data.context.find('.progress-info').text((data.jqXHR.responseJSON || {}).error || 'Błąd');
+ console.error(data);
}
});
return 'Nie zakończono przesyłania wszystkich plików, czy chcesz kontynuować?';
});
- $(window).on('dragenter dragleave drop', function(e) {
+ $(window).on('dragenter dragleave drop', function() {
$('#drop-overlay').toggleClass('in');
})
</div>
</div>
</script>
+
+<script type="text/template" id="conflict-template">
+ <h4>W wybranej lokalizacji plik on nazwie <em><%= name %></em> już istnieje!</h4>
+
+ <table class="table">
+ <thead>
+ <tr>
+ <th></th>
+ <th>Lokalny</th>
+ <th>Zdalny</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <th scope="row">Data modyfikacji</th>
+ <td><%= srcDate.format('D MMM YYYY, h:mm') %></td>
+ <td><%= dstDate.format('D MMM YYYY, h:mm') %></td>
+ </tr>
+ <tr>
+ <th scope="row">Rozmiar</th>
+ <td><%= srcSize %></td>
+ <td><%= dstSize %></td>
+ </tr>
+ </tbody>
+ </table>
+</script>