From 68c56c028f3b4b35998f788906420d16533cf6bc Mon Sep 17 00:00:00 2001 From: Peter Grassberger Date: Tue, 1 Dec 2015 18:18:11 +0100 Subject: jingle: add crude progress bar diff --git a/www/js/jingles.js b/www/js/jingles.js index 810a03d..39b7471 100644 --- a/www/js/jingles.js +++ b/www/js/jingles.js @@ -185,7 +185,7 @@ JingleGroup.prototype.render = function() { $('table tbody tr', this.$el).remove(); $('.uploadButton', this.$el).on('click', function() { - importer.showUploadModal(self.mainCart); + importer.showUploadModal(self); }); if (this.mainCart) { @@ -198,6 +198,42 @@ JingleGroup.prototype.render = function() { $('table > tbody', self.$el).append(cut.render()); }); } + $('table > tbody', self.$el).append(this.renderProgressbar()); +}; + +JingleGroup.prototype.renderProgressbar = function() { + var progress_bar = '
'; + var cancel_button = ''; + + return $('').addClass('progressBar').hide() + .append($('').text('')) + .append($('').addClass('file-name').text('-')) + .append($('').addClass('file-bytes').text('??.? von ??.? MB')) + .append($('').append(progress_bar)) + .append($('').css('text-align', 'center').append(cancel_button)); +}; + +JingleGroup.prototype.uploading = function() { + console.log('uploading!'); + $('table > tbody .progressBar', this.$el).show(); +}; + +JingleGroup.prototype.uploadProgress = function(file) { + console.log('uploadProgress!'); + + var stats = $('table > tbody .progressBar', this.$el); + + if(file.upload.progress < 99) { + var bytes_str = Number((file.upload.bytesSent/1024)/1024).toFixed(1) + " von " + + Number((file.upload.total/1024)/1024).toFixed(1) + " MB"; + stats.find('.file-bytes').text(bytes_str); + stats.find('.progress .bar').css("width", file.upload.progress + "%"); + } else { + stats.find('.file-bytes').text('importiere...'); + stats.find('.progress .bar').css('width', '100%'); + stats.find('.progress').addClass('progress-striped').addClass('active'); + } }; var JingleCart = function(number, title, groupName) { @@ -325,13 +361,14 @@ JingleCut.prototype.render = function() { - - var Importer = function() { this.$el = $('#uploadModal'); + this.currentGroup = null; }; -Importer.prototype.showUploadModal = function(cart) { +Importer.prototype.showUploadModal = function(group) { + this.currentGroup = group; + var uploadModal = $('#uploadModal'); $('div.modal-header h3', uploadModal).text("Datei auswählen..."); var form = $('
'); @@ -349,7 +386,7 @@ Importer.prototype.showUploadModal = function(cart) { autoProcessQueue: false, init: function() { this.on("addedfile", function(file) { - self.importFileAdded(this, file, cart); + self.importFileAdded(this, file); }); this.on("error", function(file, msg) { self.importFileSelectError(this, file, msg); @@ -360,7 +397,7 @@ Importer.prototype.showUploadModal = function(cart) { $('#uploadModal').modal({keyboard: true}); }; -Importer.prototype.importFileAdded = function(dropzone, file, cart) { +Importer.prototype.importFileAdded = function(dropzone, file) { $(dropzone.getAcceptedFiles()).each(function(idx, elem) { dropzone.removeFile(elem); }); var uploadModal = $('#uploadModal'); @@ -368,7 +405,7 @@ Importer.prototype.importFileAdded = function(dropzone, file, cart) { $('div.modal-header h3', uploadModal).text(file.name); var self = this; $('#uploadModal-confirm', uploadModal).unbind('click').click(function() { - self.importCartConfirm(cart, dropzone); + self.importCartConfirm(dropzone); }).removeAttr('disabled'); }; @@ -380,8 +417,13 @@ Importer.prototype.importFileSelectError = function(dropzone, file, msg) { dropzone.removeFile(file); }; -Importer.prototype.importCartConfirm = function(cart, dz) { +Importer.prototype.importCartConfirm = function(dz) { $('#uploadModal').modal('hide'); + + this.currentGroup.uploading(); + + + //var cart_row = $('#show-cart-' + cart); //cart_row.find('.btn').attr('disabled','disabled'); //var importing_row = jingles_newImportingEntry(cart); @@ -392,39 +434,26 @@ Importer.prototype.importCartConfirm = function(cart, dz) { var files = dz.getAcceptedFiles(); //importing_row.find('.file-name').text(files[0].name); //jingles_importUpdateProgress(files[0], importing_row); - //dz.on("uploadprogress", function(file) { jingles_importUpdateProgress(file, importing_row); }); var self = this; + dz.on("uploadprogress", function(file) { self.currentGroup.uploadProgress(file); }); dz.on("success", function(file) { - self.importFileUploadSuccess(cart, dz, file); + self.importFileUploadSuccess(dz, file); }); dz.on("error", function(file, msg, xhr) { - self.importFileUploadError(cart, this, file, msg, xhr); + self.importFileUploadError(this, file, msg, xhr); }); - this.importAddCut(cart, dz, files[0]) -}; - -Importer.prototype.importUpdateProgress = function(file, stats) { - if(file.upload.progress < 99) { - var bytes_str = Number((file.upload.bytesSent/1024)/1024).toFixed(1) + " von " + - Number((file.upload.total/1024)/1024).toFixed(1) + " MB"; - stats.find('.file-bytes').text(bytes_str); - stats.find('.progress .bar').css("width", file.upload.progress + "%"); - } else { - stats.find('.file-bytes').text('importiere...'); - stats.find('.progress .bar').css('width', '100%'); - stats.find('.progress').addClass('progress-striped').addClass('active'); - } + this.importAddCut(dz, files[0]) }; -Importer.prototype.importFileUploadSuccess = function(cart, dz, file) { +Importer.prototype.importFileUploadSuccess = function(dz, file) { //var command = { LOGIN_NAME: auth_username, PASSWORD: auth_token, DESCRIPTION: file. }; //jingles_updateGroupCartInfo(cart); dz.disable(); - $(cart).trigger('add'); + $(this.currentGroup.mainCart).trigger('add'); }; -Importer.prototype.importFileUploadError = function(cart, dz, file, msg, xhr) { +Importer.prototype.importFileUploadError = function(dz, file, msg, xhr) { //var error_row = jingles_newImportErrorEntry(cart, msg); //error_row.find('button').unbind('click').click(function() { //jingles_deleteCart(cart); @@ -434,8 +463,9 @@ Importer.prototype.importFileUploadError = function(cart, dz, file, msg, xhr) { dz.disable(); }; -Importer.prototype.importAddCut = function(cart, dz, file) { +Importer.prototype.importAddCut = function(dz, file) { // todo: set additional parameters like DESCRIPTION here, when patch has been applied. + var cart = this.currentGroup.mainCart; rivendell.addCut(cart.number, function(cutXml) { var cutNumber = $(cutXml).find('cutNumber').text(); dz.on('sending', function(file, xhr, formData) { -- cgit v0.10.2