remove old upload functionality, fix progressbar

7 files changed, 207 insertions, 412 deletions

diff --git a/www/index.html b/www/index.html
index 12ab827..114cafd 100644
--- a/www/index.html
+++ b/www/index.html
@@ -394,11 +394,17 @@
 
       <table>
         <tr class="progressBar progressBarTemplate jingles">
-	        <td><span class="label label-default"><span class="glyphicon glyphicon-transfer"></span></span></td>
+          <td><span class="label label-default"><span class="glyphicon glyphicon-transfer"></span></span></td>
+          <td class="cut-number">
+            ...
+          </td>
+          <td class="file-name">
+            ...
+          </td>
           <td class="file-bytes">
             beginne...
           </td>
-          <td colspan="3">
+          <td colspan="1">
             <div class="progress"><div class="progress-bar" style="width: 0%;"></div></div>
           </td>
           <td class="text-center">
diff --git a/www/js/importer.js b/www/js/importer.js
index 96e7fc2..6599c5b 100644
--- a/www/js/importer.js
+++ b/www/js/importer.js
@@ -24,14 +24,14 @@
 
 var Rdxport = Rdxport || {};
 
-Rdxport.Importer = function(username, token) {
+Rdxport.Importer = function(username, token, rhimpordEndpoint) {
   this.username = username;
   this.token = token;
+  this.rhimpordEndpoint = rhimpordEndpoint;
 
   this.$el = $('#uploadModal');
-  this.uploads = [];
-  this.socketUploads = [];
   this.listWebSocket = null;
+  this.uploads = [];
 
   this.initListWebSocket();
 };
@@ -48,26 +48,35 @@ Rdxport.Importer.TYPE_PROGRESS = 'progress';
 Rdxport.Importer.TYPE_DONE = 'done';
 
 Rdxport.Importer.prototype.initListWebSocket = function() {
-  var importer = this;
-
-  this.listWebSocket = new WebSocket('wss://import.helsinki.at/rhimportd');
+  var self = this;
+  this.listWebSocket = new WebSocket(this.rhimpordEndpoint);
 
-  this.listWebSocket.onclose = function (code, reason) {
+  this.listWebSocket.onclose = function(code, reason) {
     console.log('close');
     console.log(code);
     console.log(reason);
   };
 
-  this.listWebSocket.onerror = function (error) {
+  this.listWebSocket.onerror = function(error) {
     console.log('error');
     console.log(error);
   };
 
-  this.listWebSocket.onopen = function () {
-    console.log('open');
+  this.listWebSocket.onopen = function() {
+    /*console.log('send list');
+    var sendOptions = {
+      COMMAND: Rdxport.Importer.CMD_LIST,
+      LOGIN_NAME: importer.username,
+      PASSWORD: importer.token
+    };
+    var self = this;
+    setInterval(function() {
+      console.log(sendOptions);
+      self.send(JSON.stringify(sendOptions));
+    }, 10 * 1000);*/
   };
 
-  this.listWebSocket.onmessage = function (event) {
+  this.listWebSocket.onmessage = function(event) {
     console.log('message');
     console.log(event.data);
 
@@ -75,34 +84,15 @@ Rdxport.Importer.prototype.initListWebSocket = function() {
     if (data.TYPE.toLowerCase() === Rdxport.Importer.TYPE_LIST) {
       $.each(data.SESSIONS, function(id, reference) {
         //todo: set group, groupView, cart, cut
-        var upload = new Rdxport.SocketUpload(null, null, null, null, null, null);
+        //todo: only open new socket if id/reference is new
+        var upload = new Rdxport.Upload(null, null, null, null, null, null);
         upload.reconnect(id, reference);
-        self.socketUploads.push(upload);
+        self.uploads.push(upload);
       });
     }
   };
 };
 
-Rdxport.Importer.prototype.updateWebsocketUploads = function() {
-  console.log('send new');
-  var sendOptions = {
-    COMMAND: Rdxport.Importer.CMD_LIST,
-    LOGIN_NAME: importer.username,
-    PASSWORD: importer.token,
-    TIMEOUT: 200,
-    REFERENCE_ID: "999",
-    SHOW_ID: 10000,
-    CLEAR_SHOW_CARTS: true,
-    SOURCE_URI: 'archiv://2016/03/31/05/00'
-  };
-  // todo: get rid of timeout
-  var listWebSocket = this.listWebSocket;
-  setTimeout(function() {
-    console.log(sendOptions);
-    listWebSocket.send(JSON.stringify(sendOptions));
-  }, 1000);
-};
-
 Rdxport.Importer.prototype.resetModal = function() {
   $('div.modal-header h4', this.$el).text("Datei auswählen...");
   $('.modal-body .drop', this.$el).empty().css("background-image", "url('/img/dz-backdrop.png')");
@@ -110,10 +100,7 @@ Rdxport.Importer.prototype.resetModal = function() {
   $('#uploadModal-confirm', this.$el).attr('disabled','disabled').off('click');
 };
 
-Rdxport.Importer.prototype.openModal = function(group, groupView, createCart, newCartNumber, useMetadata) {
-  createCart = typeof createCart === 'undefined' ? false : createCart;
-  useMetadata = typeof useMetadata === 'undefined' ? false : useMetadata;
-
+Rdxport.Importer.prototype.openModal = function(group, groupView, cartNumber, newCartNumber, useMetadata) {
   this.resetModal();
   $('.modal-body .drop', this.$el).append($('<form>'));
 
@@ -149,13 +136,15 @@ Rdxport.Importer.prototype.openModal = function(group, groupView, createCart, ne
     $('.modal-body #sourceUri', self.$el).val('');
 
     $('#uploadModal-confirm', self.$el).off('click').on('click', function() {
-      var upload = new Rdxport.Upload(group, groupView, createCart, newCartNumber, useMetadata, dropzone);
-      self.uploads.push(upload);
+      // todo
+      //var sourceUri = '';
+      //var upload = new Rdxport.Upload(group, groupView, createCart, newCartNumber, useMetadata, dropzone);
+      //self.uploads.push(upload);
 
       self.$el.off('hide.bs.modal');
       self.$el.modal('hide');
     })
-        .removeAttr('disabled').focus();
+      .removeAttr('disabled').focus();
   });
 
   $('.modal-body #sourceUri', this.$el).off().on('keyup change', function(event) {
@@ -166,9 +155,9 @@ Rdxport.Importer.prototype.openModal = function(group, groupView, createCart, ne
     $('.modal-body .drop', self.$el).css("background-image", "url('/img/dz-backdrop.png')");
     $('#uploadModal-confirm', self.$el).off('click').on('click', function() {
       var sourceUri = $('.modal-body #sourceUri', self.$el).val();
-      var upload = new Rdxport.SocketUpload(group, groupView, createCart, newCartNumber, useMetadata, sourceUri);
+      var upload = new Rdxport.Upload(sourceUri, group, groupView, cartNumber, newCartNumber, useMetadata);
       upload.import();
-      self.socketUploads.push(upload);
+      self.uploads.push(upload);
 
       self.$el.off('hide.bs.modal');
       self.$el.modal('hide');
@@ -179,15 +168,9 @@ Rdxport.Importer.prototype.openModal = function(group, groupView, createCart, ne
   this.$el.modal({keyboard: true});
 };
 
-Rdxport.Importer.prototype.isUploading = function(includeSocketUploads) {
-  includeSocketUploads = includeSocketUploads || false;
-  var uploads = this.uploads;
-  if (includeSocketUploads) {
-    uploads = this.uploads.concat(this.socketUploads);
-  }
-
+Rdxport.Importer.prototype.isUploading = function() {
   var $result = false;
-  $.each(uploads, function(index, upload) {
+  $.each(this.uploads, function(index, upload) {
     if (upload && upload.isUploading()) {
       $result = true;
       return false;
@@ -196,14 +179,8 @@ Rdxport.Importer.prototype.isUploading = function(includeSocketUploads) {
   return $result;
 };
 
-Rdxport.Importer.prototype.cancelAllUploads = function(includeSocketUploads) {
-  includeSocketUploads = includeSocketUploads || false;
-  var uploads = this.uploads;
-  if (includeSocketUploads) {
-    uploads = this.uploads.concat(this.socketUploads);
-  }
-
-  $.each(uploads, function(index, upload) {
+Rdxport.Importer.prototype.cancelAllUploads = function() {
+  $.each(this.uploads, function(index, upload) {
     if (upload) {
       upload.cancel();
     }
@@ -218,19 +195,16 @@ Rdxport.Importer.prototype.removeUpload = function(upload) {
       return false;
     }
   });
-  $.each(this.socketUploads, function(index, currentUpload){
-    if(currentUpload === upload) {
-      self.socketUploads.splice(index, 1);
-      return false;
-    }
-  });
 };
 
-Rdxport.Importer.prototype.getUploadByCartNumber = function (cartNumber) {
+Rdxport.Importer.prototype.getUploadByCartNumber = function(cartNumber) {
+  if (cartNumber === null) {
+    return null;
+  }
   var upload = null;
-  var uploads = this.uploads.concat(this.socketUploads);
-  $.each(uploads, function(index, currentUpload) {
-    if (currentUpload.newCartNumber === cartNumber ) {
+  $.each(this.uploads, function(index, currentUpload) {
+    if (currentUpload.cartNumber === cartNumber ||
+        currentUpload.newCartNumber === cartNumber) {
       upload =  currentUpload;
       return false;
     }
@@ -238,129 +212,100 @@ Rdxport.Importer.prototype.getUploadByCartNumber = function (cartNumber) {
   return upload;
 };
 
-Rdxport.Importer.prototype.getUploadByCartAndCutNumber = function (cartNumber, cutNumber) {
-  var upload = null;
-  var uploads = this.uploads.concat(this.socketUploads);
-  $.each(uploads, function(index, currentUpload) {
-    if (currentUpload.newCartNumber === cartNumber &&
-        currentUpload.cut !== null &&
-        currentUpload.cut.number === cutNumber) {
-      upload = currentUpload;
-      return false;
-    }
+Rdxport.Importer.prototype.getUploadsByCartNumber = function(cartNumber) {
+  if (cartNumber === null) {
+    return null;
+  }
+  return this.uploads.filter(function (currentUpload) {
+    return currentUpload.cartNumber === cartNumber ||
+      currentUpload.newCartNumber === cartNumber;
   });
-  return upload;
 };
 
-Rdxport.SocketUpload = function(group, groupView, createCart, newCartNumber, useMetadata, sourceUri) {
+Rdxport.Importer.prototype.getUploadsByGroupName = function(groupName) {
+  if (groupName === null) {
+    return null;
+  }
+  return this.uploads.filter(function (currentUpload) {
+    return currentUpload.group.name === groupName;
+  });
+};
+
+Rdxport.Upload = function(sourceUri, group, groupView, cartNumber, newCartNumber, useMetadata) {
+  this.sourceUri = sourceUri;
+  this.filename = sourceUri.substr(sourceUri.lastIndexOf('/') + 1);
   this.group = group;
   this.groupView = groupView;
-  this.createCart = createCart;
+  this.cartNumber = cartNumber;
   this.newCartNumber = newCartNumber;
   this.useMetadata = useMetadata;
-  this.sourceUri = sourceUri;
 
+  this.uploadId = null;
   this.webSocket = null;
   this.uploadprogress = {
+    bytesSent: 0,
+    total: 0,
     progress: 0,
     progress_step: 0,
-    progress_step_name: '',
-    total: 0,
-    bytesSent: 0
+    progress_step_name: ''
   };
-  this.cart = createCart ? null : this.group.carts[0];
-  this.cut = null;
 };
 
-Rdxport.SocketUpload.prototype.reconnect = function(id, reference) {
-  this.webSocket = new WebSocket('wss://import.helsinki.at/rhimportd');
-
-  this.webSocket.onclose = function(code, reason) {
-    console.log('close');
-    console.log(code);
-    console.log(reason);
-  };
-
-  this.webSocket.onerror = function(error) {
-    console.log('error');
-    console.log(error);
-  };
-
-  this.webSocket.onopen = function() {
-    console.log('open');
-
-    console.log('send reconnect');
-    var reconnectOptions = {
-      COMMAND: Rdxport.Importer.CMD_RECONNECT,
-      LOGIN_NAME: importer.username,
-      PASSWORD: importer.token,
-      ID: id
-    };
-    console.log(reconnectOptions);
-    this.send(JSON.stringify(reconnectOptions));
-  };
-
-  this.webSocket.onmessage = function(event) {
-    console.log('message');
-    console.log(event.data);
-  };
+Rdxport.Upload.prototype.isUploading = function() {
+  return this.uploadprogress.progress_step < 2 && this.uploadprogress.progress < 100;
 };
 
-Rdxport.SocketUpload.prototype.isUploading = function() {
-  return this.uploadprogress.progress < 100;
+Rdxport.Upload.prototype.onclose = function(code, reason) {
+  console.log('close');
+  console.log(code);
+  console.log(reason);
 };
 
-Rdxport.SocketUpload.prototype.cancel = function() {
+Rdxport.Upload.prototype.onerror = function(error) {
+  console.log('error');
 
-  //todo cancel socket
-
-  /*var self = this;
-  if (this.createCart && this.cart !== null) {
-    rdxport.removeCart(this.cart.number, function() {
-      self.group.fetchCarts();
-    });
-    this.cart = null;
-  } else if (this.cart !== null && this.cut !== null) {
-    rdxport.removeCut(this.cart.number, this.cut.number, function() {
-      self.group.fetchCarts();
-    });
-    this.cut = null;
-  }*/
-
-  importer.removeUpload(this);
+  var file = {
+    cartNumber: this.cartNumber || this.newCartNumber
+  };
+  this.importFileUploadError(file, error);
 };
 
-Rdxport.SocketUpload.prototype.import = function() {
-  var self = this;
-
-  this.webSocket = new WebSocket('wss://import.helsinki.at/rhimportd'); // todo: put url somewhere
-
-  this.webSocket.onclose = function(code, reason) {
-    console.log('close');
-    console.log(code);
-    console.log(reason);
+Rdxport.Upload.prototype.onmessage = function(event) {
+  var data = $.parseJSON(event.data);
+  this.uploadId = data.ID;
+  var file = {
+    cartNumber: this.cartNumber || this.newCartNumber
   };
+  switch (data.TYPE.toLowerCase()) {
+    case Rdxport.Importer.TYPE_ERROR:
+      this.importFileUploadError(file, data.ERROR_STRING);
+      break;
+    case Rdxport.Importer.TYPE_PROGRESS:
+      this.uploadprogress.progress = data.PROGRESS;
+      this.uploadprogress.progress_step = data.PROGRESS_STEP;
+      this.uploadprogress.progress_step_name = data.PROGRESS_STEP_NAME;
+      this.groupView.uploadProgress(this, file);
+      break;
+    case Rdxport.Importer.TYPE_DONE:
+      this.importFileUploadSuccess();
+      break;
+  }
+};
 
-  this.webSocket.onerror = function(error) {
-    console.log('error');
+Rdxport.Upload.prototype.import = function() {
+  var self = this;
 
-    var file = {
-      cartNumber: self.newCartNumber,
-      cutNumber: null
-    };
-    self.importFileUploadError(file, error);
-  };
+  this.webSocket = new WebSocket(importer.rhimpordEndpoint);
+  this.webSocket.onclose = function(code, reason) { self.onclose(code, reason) };
+  this.webSocket.onerror = function(error) { self.onerror(error); };
+  this.webSocket.onmessage = function(event) { self.onmessage(event) };
 
   this.webSocket.onopen = function() {
-    console.log('open');
-
-    console.log('send new');
     var sendOptions = {
       COMMAND: Rdxport.Importer.CMD_NEW,
       LOGIN_NAME: importer.username,
       PASSWORD: importer.token,
       TIMEOUT: 200,
-      REFERENCE_ID: '999',
       SOURCE_URI: self.sourceUri,
       CHANNELS: 2,
       // todo: is this needed?
@@ -368,155 +313,51 @@ Rdxport.SocketUpload.prototype.import = function() {
       //AUTOTRIM_LEVEL: self.cart.trimlevel,
       USE_METADATA: self.useMetadata
     };
-    if (self.newCartNumber) {
-      sendOptions.CART_NUMBER = parseInt(self.newCartNumber);
-    } else if(self.cart) {
-      sendOptions.CART_NUMBER = parseInt(self.cart.number);
-    }
-    if (self.createCart && self.group instanceof Rdxport.Musicpool) {
-      sendOptions.MUSIC_POOL_GROUP = self.group.groupName;
+    if (self.cartNumber) {
+      sendOptions.REFERENCE_ID = self.group.groupName + '/' + self.cartNumber;
+      sendOptions.CART_NUMBER = parseInt(self.cartNumber);
+    } else {
+      if (self.newCartNumber) {
+        sendOptions.REFERENCE_ID = self.group.groupName + '/' + self.newCartNumber;
+        sendOptions.CART_NUMBER = parseInt(self.newCartNumber);
+      } else if (self.group instanceof Rdxport.Musicpool) {
+        sendOptions.MUSIC_POOL_GROUP = self.group.groupName;
+      }
     }
     console.log(sendOptions);
     this.send(JSON.stringify(sendOptions));
 
     self.group.fetchCarts();
   };
-
-  this.webSocket.onmessage = function(event) {
-    console.log(event.data);
-
-    var file = {
-      cartNumber: self.newCartNumber,
-      cutNumber: null
-    };
-
-    var data = $.parseJSON(event.data);
-
-    switch (data.TYPE.toLowerCase()) {
-      case Rdxport.Importer.TYPE_ERROR:
-        self.importFileUploadError(file, data.ERROR_STRING);
-        break;
-      case Rdxport.Importer.TYPE_PROGRESS:
-        self.uploadprogress = {
-          progress: data.PROGRESS,
-          progress_step: data.PROGRESS_STEP,
-          progress_step_name: data.PROGRESS_STEP_NAME,
-          total: 0,
-          bytesSent: 0
-        };
-        self.groupView.uploadProgress(self, file);
-        break;
-      case Rdxport.Importer.TYPE_DONE:
-        self.importFileUploadSuccess();
-        break;
-    }
-  };
-};
-
-Rdxport.SocketUpload.prototype.importFileUploadSuccess = function() {
-  importer.removeUpload(this);
-  this.group.fetchCarts();
 };
 
-Rdxport.SocketUpload.prototype.importFileUploadError = function(file, msg, xhr) {
-  var self = this;
-  this.groupView.uploadError(this, file, msg, xhr, function() {
-    self.cancel();
-  });
-};
+Rdxport.Upload.prototype.reconnect = function(id, reference) {
+  this.webSocket = new WebSocket(importer.rhimpordEndpoint);
+  this.webSocket.onclose = function(code, reason) { self.onclose(code, reason) };
+  this.webSocket.onerror = function(error) { self.onerror(error); };
+  this.webSocket.onmessage = function(event) { self.onmessage(event) };
 
-Rdxport.Upload = function(group, groupView, createCart, newCartNumber, useMetadata, dropzone) {
-  this.group = group;
-  this.groupView = groupView;
-  this.createCart = createCart;
-  this.newCartNumber = newCartNumber;
-  this.useMetadata = useMetadata;
-  this.dropzone = dropzone;
-
-  this.uploadprogress = {
-    progress: 0,
-    total: 0,
-    bytesSent: 0
+  this.webSocket.onopen = function() {
+    var reconnectOptions = {
+      COMMAND: Rdxport.Importer.CMD_RECONNECT,
+      LOGIN_NAME: importer.username,
+      PASSWORD: importer.token,
+      ID: id
+    };
+    console.log(reconnectOptions);
+    this.send(JSON.stringify(reconnectOptions));
   };
-  this.cart = null;
-  this.cut = null;
-
-  this.import();
-};
-
-Rdxport.Upload.prototype.isUploading = function() {
-  var files = this.dropzone.getUploadingFiles();
-  return files.length > 0;
 };
 
 Rdxport.Upload.prototype.cancel = function() {
-  this.dropzone.off(Dropzone.ERROR);
-  this.dropzone.removeAllFiles(true);
-  this.dropzone.disable();
-  this.dropzone.destroy();
-
-  var self = this;
-  if (this.createCart && this.cart !== null) {
-    rdxport.removeCart(this.cart.number, function() {
-      self.group.fetchCarts();
-    });
-    this.cart = null;
-  } else if (this.cart !== null && this.cut !== null) {
-    rdxport.removeCut(this.cart.number, this.cut.number, function() {
-      self.group.fetchCarts();
-    });
-    this.cut = null;
-  }
-
+  this.webSocket.send(JSON.stringify({ COMMAND: 'cancel' }));
+  this.webSocket.close();
+  this.group.fetchCarts();
   importer.removeUpload(this);
 };
 
-Rdxport.Upload.prototype.import = function() {
-  var self = this;
-
-  this.dropzone.off('uploadprogress').on('uploadprogress', function(file) {
-    self.uploadprogress = file.upload;
-    self.groupView.uploadProgress(self, file);
-  });
-  this.dropzone.off(Dropzone.SUCCESS).on(Dropzone.SUCCESS, function(file) {
-    self.importFileUploadSuccess();
-  });
-  this.dropzone.off(Dropzone.ERROR).on(Dropzone.ERROR, function(file, msg, xhr) {
-    self.importFileUploadError(file, msg, xhr);
-  });
-  // debug
-  //self.importFileUploadError({cartNumber: 100000}, '<?xml version="1.0" encoding="UTF-8"?><woot><ResponseCode>123</ResponseCode><ErrorString>Fake error</ErrorString></woot>', null);
-
-  this.addCart(function(file) {
-    self.addCut(file);
-  });
-};
-
-Rdxport.Upload.prototype.addCart = function(success) {
-  var files = this.dropzone.getAcceptedFiles();
-  var file = files[files.length - 1];
-
-  var self = this;
-  if (this.createCart) {
-    rdxport.addCart(this.group.groupName, 'audio', {CART_NUMBER: this.newCartNumber}, function(cartXML) {
-      self.cart = new Rdxport.Cart(cartXML, self.group);
-      success(file);
-    }).fail(function() {
-      //self.importFileUploadError(files[0], 'Failed to add Cart.');
-    });
-  } else {
-    this.cart = this.group.carts[0];
-    success(file);
-  }
-};
-
 Rdxport.Upload.prototype.importFileUploadSuccess = function() {
-  this.dropzone.off(Dropzone.ERROR);
-  this.dropzone.removeAllFiles(true);
-  this.dropzone.disable();
-  this.dropzone.destroy();
   importer.removeUpload(this);
-
   this.group.fetchCarts();
 };
 
@@ -526,38 +367,3 @@ Rdxport.Upload.prototype.importFileUploadError = function(file, msg, xhr) {
     self.cancel();
   });
 };
-
-Rdxport.Upload.prototype.addCut = function(file) {
-  var self = this;
-
-  rdxport.addAndEditCut(this.cart.number, {DESCRIPTION: file.name}, function(cutXml) {
-    self.cut = new Rdxport.Cut(cutXml, self.cart);
-
-    self.dropzone.on('sending', function(file, xhr, formData) {
-      var cutNumber = $('cutNumber', cutXml).text();
-      var cutNumberLeading = cutNumber;
-      switch (cutNumber.toString().length) {
-        case 0: cutNumberLeading = '000' + cutNumber; break;
-        case 1: cutNumberLeading = '00' + cutNumber; break;
-        case 2: cutNumberLeading = '0' + cutNumber; break;
-        case 3: default: cutNumberLeading = cutNumber; break;
-      }
-      file.cartNumber = self.cart.number;
-      file.cutNumber = cutNumberLeading;
-
-      formData.append('COMMAND', 2);
-      formData.append('LOGIN_NAME', auth.username);
-      formData.append('PASSWORD', auth.token);
-      formData.append('CART_NUMBER', self.cart.number);
-      formData.append('CUT_NUMBER', cutNumber);
-      formData.append('CHANNELS', 2);
-      formData.append('NORMALIZATION_LEVEL', self.cart.normlevel);
-      formData.append('AUTOTRIM_LEVEL', self.cart.trimlevel);
-      formData.append('USE_METADATA', (self.useMetadata ? 1 : 0));
-    });
-
-    self.dropzone.processQueue();
-    self.group.fetchCarts();
-
-  });
-};
diff --git a/www/js/jingles.js b/www/js/jingles.js
index 48c7f13..b82166f 100644
--- a/www/js/jingles.js
+++ b/www/js/jingles.js
@@ -29,7 +29,6 @@ var jingleGroupListView = null;
 function jingles_init() {
   var groupList = new Rdxport.GroupList();
   jingleGroupListView = new Rdxport.JingleGroupListView(groupList);
-  importer.updateWebsocketUploads();
 }
 
 function jingles_cleanup() {
@@ -57,7 +56,6 @@ Rdxport.JingleGroupListView = function(model) {
 };
 
 Rdxport.JingleGroupListView.prototype.destroy = function() {
-  var self = this;
   $(this.jingleGroupViews).each(function(index, groupView) {
     groupView.destroy();
   });
@@ -110,7 +108,7 @@ Rdxport.JingleGroupView.prototype.render = function() {
   $('table tbody tr', this.$el).remove();
 
   $('.uploadButton', this.$el).on('click', function() {
-    importer.openModal(self.model, self, false, null, false);
+    importer.openModal(self.model, self, self.model.carts[0].number, null, false);
   });
 };
 
@@ -119,14 +117,10 @@ Rdxport.JingleGroupView.prototype.destroy = function() {
 };
 
 Rdxport.JingleGroupView.prototype.uploadProgress = function(upload, file) {
-  if (!file.cartNumber || !file.cutNumber) {
-    return;
-  }
-  var $cut = $('#jingle-' + file.cartNumber + '-' + file.cutNumber).first();
+  var $cut = $('tr[data-upload-id="' + upload.uploadId + '"]').first();
   if (!$cut.hasClass('uploading')) {
     var $progressBar = $('.progressBarTemplate.jingles').clone().removeClass('progressBarTemplate');
-    $('.file-name', $progressBar).text(file.name);
-    $('.cart-number', $progressBar).text(file.cartNumber);
+    $('.file-name', $progressBar).text(upload.filename);
     $cut.html($progressBar.html());
 
     $('button', $cut).on('click', function() {
@@ -162,7 +156,7 @@ Rdxport.JingleGroupView.prototype.uploadError = function(upload, file, msg, xhr,
     .attr('id', 'jingle-' + file.cartNumber + '-' + file.cutNumber)
     .append($('<td>').html(status))
     .append($('<td>').text(file.cartNumber))
-    .append($('<td>').addClass('file-name').text(file.name))
+    .append($('<td>').addClass('file-name').text(upload.filename))
     .append($('<td>').append($('<b>').text('Import Fehler')))
     .append($('<td colspan="1">').append(reason))
     .append($('<td>').css('text-align', 'center').append(dismiss_button));
@@ -191,6 +185,11 @@ Rdxport.JingleCartView = function(model, groupView, active) {
 
       $('table > tbody', self.groupView.$el).append(cutView.$el);
     });
+    var uploads = importer.getUploadsByCartNumber(this.model.number);
+    $(uploads).each(function(index, upload) {
+      var $el = Rdxport.JingleCutView.renderUploading(upload, self.model.number);
+      $('table > tbody', self.groupView.$el).append($el);
+    });
   }
 };
 
@@ -199,13 +198,7 @@ Rdxport.JingleCutView = function(model) {
 
   this.$spinner = null;
   this.$el = null;
-
-  var upload = null;
-  if ((upload = importer.getUploadByCartAndCutNumber(this.model.cartNumber, this.model.number)) !== null) {
-    this.renderUploading(upload);
-  } else {
-    this.render();
-  }
+  this.render();
 };
 
 Rdxport.JingleCutView.prototype.render = function() {
@@ -256,21 +249,21 @@ Rdxport.JingleCutView.prototype.render = function() {
       );
 };
 
-Rdxport.JingleCutView.prototype.renderUploading = function(upload) {
+Rdxport.JingleCutView.renderUploading = function(upload) {
   var $progressBar = $('.progressBarTemplate.jingles').clone().removeClass('progressBarTemplate');
-  $('.file-name', $progressBar).text(this.model.name);
-  $('.cart-number', $progressBar).text(this.model.number);
+  $('.file-name', $progressBar).text(upload.filename);
 
-  this.$el = $('<tr>')
-    .attr('id', 'jingle-' + this.model.cartNumber + '-' + this.model.number)
+  var $el = $('<tr>')
     .html($progressBar.html())
-    .addClass('uploading');
+    .addClass('uploading')
+    .attr('data-upload-id', upload.uploadId);
 
-  $('button', this.$el).on('click', function() {
+  $('button', $el).on('click', function() {
     upload.cancel();
   });
 
-  updateProgressBar(this.$el, upload);
+  updateProgressBar($el, upload);
+  return $el;
 };
 
 Rdxport.JingleCutView.prototype.move = function() {
diff --git a/www/js/musicpools.js b/www/js/musicpools.js
index 6719183..ba85788 100644
--- a/www/js/musicpools.js
+++ b/www/js/musicpools.js
@@ -29,7 +29,6 @@ var musicpoolsView = null;
 function musicpools_init(subpage) {
   var musicpools = new Rdxport.GroupList();
   musicpoolsView = new Rdxport.MusicpoolsView(musicpools, subpage);
-  importer.updateWebsocketUploads();
 }
 
 function musicpools_cleanup() {
@@ -168,20 +167,23 @@ Rdxport.MusicpoolView.prototype.render = function() {
 
     $('table > tbody', self.$el).append(cartView.$el);
   });
+  var uploads = importer.getUploadsByGroupName(this.model.name);
+  $(uploads).each(function(index, upload) {
+    var $el = Rdxport.MusicpoolCartView.renderUploading(upload, self.model.number);
+    $('table > tbody', self.$el).append($el);
+  });
+
 
   $('.uploadButton', this.$el).on('click', function() {
-    importer.openModal(self.model, self, true, null, true);
+    importer.openModal(self.model, self, null, null, true);
   });
 };
 
 Rdxport.MusicpoolView.prototype.uploadProgress = function(upload, file) {
-  if (!file.cartNumber || !file.cutNumber) {
-    return;
-  }
-  var $cart = $('#musicpool-' + file.cartNumber).first();
+  var $cart = $('tr[data-upload-id="' + upload.uploadId + '"]').first();
   if (!$cart.hasClass('uploading')) {
     var $progressBar = $('.progressBarTemplate.musicpools').clone().removeClass('progressBarTemplate');
-    $('.file-name', $progressBar).text(file.name);
+    $('.file-name', $progressBar).text(upload.filename);
     $('.cart-number', $progressBar).text(file.cartNumber);
     $cart.html($progressBar.html());
 
@@ -214,7 +216,7 @@ Rdxport.MusicpoolView.prototype.uploadError = function(upload, file, msg, xhr, a
   var $errorRow = $('<tr>')
     .attr('id', 'musicpool-' + file.cartNumber)
     .append($('<td>').text(file.cartNumber))
-    .append($('<td>').addClass('file-name').text(file.name))
+    .append($('<td>').addClass('file-name').text(upload.filename))
     .append($('<td>').append($('<b>').text('Import Fehler')))
     .append($('<td colspan="5">').append(reason))
     .append($('<td>').css('text-align', 'center').append(dismiss_button));
@@ -232,12 +234,7 @@ Rdxport.MusicpoolCartView = function(model) {
   this.$spinner = null;
   this.$el = null;
 
-  var upload = null;
-  if ((upload = importer.getUploadByCartNumber(this.model.number)) !== null) {
-    this.renderUploading(upload);
-  } else {
-    this.render();
-  }
+  this.render();
 };
 
 Rdxport.MusicpoolCartView.prototype.render = function() {
@@ -281,21 +278,22 @@ Rdxport.MusicpoolCartView.prototype.render = function() {
     .append($('<td>').addClass('text-center').append(deleteButton));
 };
 
-Rdxport.MusicpoolCartView.prototype.renderUploading = function(upload) {
+Rdxport.MusicpoolCartView.renderUploading = function(upload) {
   var $progressBar = $('.progressBarTemplate.musicpools').clone().removeClass('progressBarTemplate');
-  $('.file-name', $progressBar).text(this.model.title);
-  $('.cart-number', $progressBar).text(this.model.number);
+  $('.file-name', $progressBar).text(upload.filename);
 
-  this.$el = $('<tr>')
-    .attr('id', 'musicpool-' + this.model.number)
+  var $el = $('<tr>')
     .html($progressBar.html())
-    .addClass('uploading');
+    .attr('id', 'musicpool-upload-' + upload.uploadId)
+    .addClass('uploading')
+    .attr('data-upload-id', upload.uploadId);
 
-  $('button', this.$el).on('click', function() {
+  $('button', $el).on('click', function() {
     upload.cancel();
   });
 
-  updateProgressBar(this.$el, upload);
+  updateProgressBar($el, upload);
+  return $el;
 };
 
 Rdxport.MusicpoolCartView.prototype.delete = function() {
diff --git a/www/js/router.js b/www/js/router.js
index cfeaf23..f442e9e 100644
--- a/www/js/router.js
+++ b/www/js/router.js
@@ -47,15 +47,15 @@ Rdxport.Router.prototype.route = function(page, subpage) {
     return;
   }
   if (importer && importer.isUploading()) {
-    alert('Achtung: Es laufen noch imports.');
+    //alert('Achtung: Es laufen noch imports.');
     return;
   }
 
   if (!importer) {
-    importer = new Rdxport.Importer(this.auth.username, this.auth.token);
+    importer = new Rdxport.Importer(this.auth.username, this.auth.token, 'wss://import.helsinki.at/rhimportd');
     window.onbeforeunload = function(event) {
       if (importer.isUploading()) {
-        return 'Achtung: Es laufen noch imports.';
+        //return 'Achtung: Es laufen noch imports.';
       }
     };
   }
@@ -134,7 +134,7 @@ Rdxport.Router.prototype.login = function() {
 
 Rdxport.Router.prototype.logout = function() {
   if (importer && importer.isUploading()) {
-    alert('Achtung: Es laufen noch imports.');
+    //alert('Achtung: Es laufen noch imports.');
     return;
   }
 
diff --git a/www/js/shows.js b/www/js/shows.js
index 03855fe..f4cfbbd 100644
--- a/www/js/shows.js
+++ b/www/js/shows.js
@@ -29,7 +29,6 @@ var showListView = null;
 function shows_init(subpage) {
   var showList = new Rdxport.GroupList();
   showListView = new Rdxport.ShowListView(showList, subpage);
-  importer.updateWebsocketUploads();
 
   drawClock('Do, 1.1.1970', '00:00:00', 0);
   clock_add_callback(drawClock);
@@ -49,7 +48,7 @@ Rdxport.ShowListView = function(model, subpage) {
   this.setCurrentShowId(subpage);
 
   var self = this;
-  $(this.model).on('update', function() {
+  $(this.model).off('update').on('update', function() {
     $(self.model.groups).each(function(index, show) {
       var showView = new Rdxport.ShowView(show);
       self.showViews.push(showView);
@@ -203,7 +202,7 @@ Rdxport.ShowView = function(model) {
   this.$el = null;
 
   var self = this;
-  this.model.$this.on('update', function() {
+  this.model.$this.off('update').on('update', function() {
     self.render();
   });
 };
@@ -235,16 +234,13 @@ Rdxport.ShowView.prototype.render = function() {
   var self = this;
   $(this.model.logs).each(function(index, log) {
     var cart = self.model.getCartByNumber(log.cartNumber);
-    if (cart) {
+    var upload = importer.getUploadByCartNumber(log.cartNumber);
+    if (upload) {
+      $('#app-shows table > tbody').append(Rdxport.ShowCartView.renderUploading(upload, log.cartNumber));
+    } else if (cart) {
       var cartView = new Rdxport.ShowCartView(cart, self);
       self.cartViews.push(cartView);
-      var upload = null;
-      if ((upload = importer.getUploadByCartNumber(log.cartNumber)) !== null) {
-        cartView.renderUploading(upload);
-      } else {
-        cartView.render();
-      }
-
+      cartView.render();
       $('#app-shows table > tbody').append(cartView.$el);
     } else {
       $('#app-shows table > tbody').append(Rdxport.ShowCartView.renderEmpty(self.model, self, log.cartNumber));
@@ -253,17 +249,14 @@ Rdxport.ShowView.prototype.render = function() {
 };
 
 Rdxport.ShowView.prototype.uploadProgress = function(upload, file) {
-  if (!file.cartNumber || !file.cutNumber) {
-    return;
-  }
-  var $cart = $('#show-cart-' + file.cartNumber).first();
+  var $cart = $('tr[data-upload-id="' + upload.uploadId + '"]').first();
   if (!$cart.hasClass('uploading')) {
     var $progressBar = $('.progressBarTemplate.shows').clone().removeClass('progressBarTemplate');
     $('.file-name', $progressBar).text(file.name);
     $('.cart-number', $progressBar).text(file.cartNumber);
     $cart.html($progressBar.html());
 
-    $('button', $cart).on('click', function() {
+    $('button', $cart).off('click').on('click', function() {
       upload.cancel();
     });
 
@@ -292,12 +285,12 @@ Rdxport.ShowView.prototype.uploadError = function(upload, file, msg, xhr, acknow
   var $errorRow = $('<tr>')
       .attr("id", "show-cart-" + file.cartNumber)
       .append($('<td>').text(file.cartNumber))
-      .append($('<td>').addClass('file-name').text(file.name))
+      .append($('<td>').addClass('file-name').text(upload.filename))
       .append($('<td>').append($('<b>').text('Import Fehler')))
       .append($('<td colspan="3">').append(reason))
       .append($('<td>').css('text-align', 'center').append(dismiss_button));
 
-  $('button', $errorRow).on('click', function() {
+  $('button', $errorRow).off('click').on('click', function() {
     acknowledge();
   });
 
@@ -316,7 +309,7 @@ Rdxport.ShowCartView.prototype.render = function() {
   var $deleteButton = $('<button class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span>&nbsp;&nbsp;Löschen</button>');
 
   var self = this;
-  $deleteButton.on('click', function() {
+  $deleteButton.off('click').on('click', function() {
     self.delete();
   });
 
@@ -344,29 +337,30 @@ Rdxport.ShowCartView.prototype.render = function() {
     .append($('<td>').css('text-align', 'center').append($deleteButton));
 };
 
-Rdxport.ShowCartView.prototype.renderUploading = function(upload) {
+Rdxport.ShowCartView.renderUploading = function(upload, cartNumber) {
   var $progressBar = $('.progressBarTemplate.shows').clone().removeClass('progressBarTemplate');
-  $('.file-name', $progressBar).text(this.model.title);
-  $('.cart-number', $progressBar).text(this.model.number);
+  $('.file-name', $progressBar).text(upload.filename);
+  $('.cart-number', $progressBar).text(cartNumber);
 
-  this.$el.empty()
-    .attr('id', 'show-cart-' + this.model.number)
+  var $el = $('<tr>')
     .html($progressBar.html())
-    .attr('id', 'show-cart-' + this.model.number)
-    .addClass('uploading');
+    .attr('id', 'show-cart-' + cartNumber)
+    .addClass('uploading')
+    .attr('data-upload-id', upload.uploadId);
 
-  $('button', this.$el).on('click', function() {
+  $('button', $el).off('click').on('click', function() {
     upload.cancel();
   });
 
-  updateProgressBar(this.$el, upload);
+  updateProgressBar($el, upload);
+  return $el;
 };
 
 Rdxport.ShowCartView.renderEmpty = function(group, groupView, cartNumber) {
   var $uploadButton = $('<button class="uploadButton btn btn-primary btn-xs"><span class="glyphicon glyphicon-upload"></span>&nbsp;&nbsp;Importieren</button>');
 
-  $uploadButton.on('click', function() {
-    importer.openModal(group, groupView, true, cartNumber, true);
+  $uploadButton.off('click').on('click', function() {
+    importer.openModal(group, groupView, cartNumber, null, true);
   });
 
   return $('<tr>')
diff --git a/www/js/utils.js b/www/js/utils.js
index 7e7a656..a2a28b2 100644
--- a/www/js/utils.js
+++ b/www/js/utils.js
@@ -146,10 +146,8 @@ jQuery.fn.sort = function() {
 };
 
 function updateProgressBar($el, upload) {
-  if(upload.uploadprogress.progress < 99) {
-    var bytes_str = Number((upload.uploadprogress.bytesSent/1024)/1024).toFixed(1) + " von " +
-      Number((upload.uploadprogress.total/1024)/1024).toFixed(1) + " MB";
-    $el.find('.file-bytes').text(bytes_str);
+  if(upload.uploadprogress.progress_step < 2) {
+    $el.find('.file-bytes').text(Number(upload.uploadprogress.progress).toFixed(2) + '%');
     $el.find('.progress .progress-bar').css("width", upload.uploadprogress.progress + "%");
   } else {
     $el.find('.file-bytes').text('importiere...');