render filename as spinner until first progress with title is received

4 files changed, 24 insertions, 7 deletions

diff --git a/www/js/importer.js b/www/js/importer.js
index caac692..9576768 100644
--- a/www/js/importer.js
+++ b/www/js/importer.js
@@ -391,7 +391,7 @@ Rdxport.Upload.prototype.onmessage = function(event) {
       console.log(data);
       if (this.file && !this.sendingFile) {
         this.sendingFile = true;
-        
+
         var command = {
           type: "POST",
           contentType: "application/octet-stream",
@@ -403,11 +403,13 @@ Rdxport.Upload.prototype.onmessage = function(event) {
         };
         $.ajax('https://import.helsinki.at/upload/' + importer.username + '/' + data.ID, command);
       }
+      this.isNew = true;
       this.group.fetchCarts();
       this.groupView.uploadProgress(this);
       break;
     case Rdxport.Importer.TYPE_PROGRESS:
       //console.log(data);
+      this.isNew = false;
       this.uploadprogress.current = data.CURRENT;
       this.uploadprogress.total = data.TOTAL;
       this.uploadprogress.progress = data.PROGRESS;
diff --git a/www/js/jingles.js b/www/js/jingles.js
index 8d9ed86..ffaafcd 100644
--- a/www/js/jingles.js
+++ b/www/js/jingles.js
@@ -132,7 +132,7 @@ Rdxport.JingleGroupView.prototype.uploadProgress = function(upload) {
 
     $cut.addClass('uploading');
   }
-  if (upload.title) {
+  if (!upload.isNew && upload.title) {
     $('.file-name', $cut).text(upload.title);
   }
   if (upload.cartNumber && upload.cutNumber) {
@@ -283,7 +283,12 @@ Rdxport.JingleCutView.prototype.render = function() {
 
 Rdxport.JingleCutView.renderUploading = function(upload) {
   var $progressBar = $('.progressBarTemplate.jingles').clone().removeClass('progressBarTemplate');
-  $('.file-name', $progressBar).text(upload.title);
+  if (upload.isNew) {
+    var spinner = $('#hiddenTemplates .spinnerTemplate').clone().removeClass('spinnerTemplate');
+    $('.file-name', $progressBar).html(spinner);
+  } else {
+    $('.file-name', $progressBar).text(upload.title);
+  }
 
   var $el = $('<tr>')
     .html($progressBar.html())
diff --git a/www/js/musicpools.js b/www/js/musicpools.js
index c873eab..c9083e8 100644
--- a/www/js/musicpools.js
+++ b/www/js/musicpools.js
@@ -211,7 +211,7 @@ Rdxport.MusicpoolView.prototype.uploadProgress = function(upload) {
 
     $cart.addClass('uploading');
   }
-  if (upload.title) {
+  if (!upload.isNew && upload.title) {
     $('.file-name', $cart).text(upload.title);
   }
   if (upload.cartNumber) {
@@ -302,7 +302,12 @@ Rdxport.MusicpoolCartView.prototype.render = function() {
 
 Rdxport.MusicpoolCartView.renderUploading = function(upload) {
   var $progressBar = $('.progressBarTemplate.musicpools').clone().removeClass('progressBarTemplate');
-  $('.file-name', $progressBar).text(upload.title);
+  if (upload.isNew) {
+    var spinner = $('#hiddenTemplates .spinnerTemplate').clone().removeClass('spinnerTemplate');
+    $('.file-name', $progressBar).html(spinner);
+  } else {
+    $('.file-name', $progressBar).text(upload.title);
+  }
 
   var $el = $('<tr>')
     .html($progressBar.html())
diff --git a/www/js/shows.js b/www/js/shows.js
index b8f0c2a..8e1d17e 100644
--- a/www/js/shows.js
+++ b/www/js/shows.js
@@ -281,7 +281,7 @@ Rdxport.ShowView.prototype.uploadProgress = function(upload) {
 
     $cart.addClass('uploading');
   }
-  if (upload.title) {
+  if (!upload.isNew && upload.title) {
     $('.file-name', $cart).text(upload.title);
   }
   if (upload.cartNumber) {
@@ -362,7 +362,12 @@ Rdxport.ShowCartView.prototype.render = function() {
 
 Rdxport.ShowCartView.renderUploading = function(upload) {
   var $progressBar = $('.progressBarTemplate.shows').clone().removeClass('progressBarTemplate');
-  $('.file-name', $progressBar).text(upload.title);
+  if (upload.isNew) {
+    var spinner = $('#hiddenTemplates .spinnerTemplate').clone().removeClass('spinnerTemplate');
+    $('.file-name', $progressBar).html(spinner);
+  } else {
+    $('.file-name', $progressBar).text(upload.title);
+  }
   $('.cart-number', $progressBar).text(upload.cartNumber);
 
   var $el = $('<tr>')