remove jingle cut from dom on delete

1 files changed, 38 insertions, 11 deletions

diff --git a/www/js/jingles.js b/www/js/jingles.js
index 7e8f51a..2298663 100644
--- a/www/js/jingles.js
+++ b/www/js/jingles.js
@@ -70,6 +70,9 @@ var JingleGroup = function(title, groupName, description, lowcart, highcart, nor
 
   var self = this;
   $(this).on('change', function() {
+    console.log('JingleGroup change!');
+    console.log(self.mainCart);
+    console.log(self.deactivateCart);
     self.render();
   });
 
@@ -94,13 +97,13 @@ JingleGroup.prototype.render = function() {
     $('#jingles-jingAllgem h2').html(this.title);
     $('#jingles-jingAllgem table tbody tr').remove();
     $.each(cuts, function(index, cut) {
-      $('#jingles-jingAllgem table > tbody').append(cut.$el());
+      $('#jingles-jingAllgem table > tbody').append(cut.render());
     });
   } else if (this.groupName === 'jingAnlass') {
     $('#jingles-jingAnlass h2').html(this.title);
     $('#jingles-jingAnlass table tbody tr').remove();
     $.each(cuts, function(index, cut) {
-      $('#jingles-jingAnlass table > tbody').append(cut.$el());
+      $('#jingles-jingAnlass table > tbody').append(cut.render());
     });
   }
 };
@@ -133,13 +136,17 @@ JingleGroup.prototype.createCartFromXml = function(cartXml, active) {
   var cuts = $(cartXml).find("cutList").children();
   cuts.each(function(index, cutXml) {
     var cut = new JingleCut(
+      cart,
       cart.number,
       $(cutXml).find('cutName').text(),
       $(cutXml).find('description').text(),
       active
     );
-    $(cut).on('change', function() {
-      $(self).trigger('change');
+    $(cut).on('change', function(event, silent) {
+      console.log('JingleCut change!');
+      if (!silent) {
+        $(self).trigger('change');
+      }
     });
     cart.addCut(cut);
   });
@@ -160,12 +167,21 @@ JingleCart.prototype.addCut = function(cut) {
   this.cuts.push(cut);
 };
 
-var JingleCut = function(cartNumber, name, description, active) {
+JingleCart.prototype.removeCut = function(cut) {
+  var index = this.cuts.indexOf(cut);
+  if (index > -1) {
+    this.cuts.splice(index, 1);
+  }
+};
+
+var JingleCut = function(cart, cartNumber, name, description, active) {
+  this.cart = cart;
   this.cartNumber = cartNumber;
   this.number = name.substr(-3);
   this.name = name;
   this.description = description;
   this.active = active;
+  this.$el = null;
 };
 
 JingleCut.prototype.move = function() {
@@ -214,15 +230,24 @@ JingleCut.prototype.delete = function(self) {
   console.log(this.cartNumber);
   console.log(this.number);
 
+  var self = this;
   var command = { COMMAND: 11, LOGIN_NAME: auth_username, PASSWORD: auth_token, CART_NUMBER: this.cartNumber, CUT_NUMBER: this.number};
-  $.post("/rd-bin/rdxport.cgi", command, null, "xml").done(function() {
-    console.log('done');
-  });
+  $.post("/rd-bin/rdxport.cgi", command, function() {
+    self.cart.removeCut(this);
 
-  //$(this).trigger('change');
+    self.$el.remove();
+    self.$el = null;
+
+    $(self).trigger('change', true);
+    $(self).off();
+  });
 };
 
-JingleCut.prototype.$el = function() {
+JingleCut.prototype.render = function() {
+  if (this.$el) {
+    return this.$el;
+  }
+
   var moveButton = $('<button class="btn btn-info btn-mini"><i class="icon-arrow-right icon-white"></i> Verschieben</button>');
   var activateButton;
   if (this.active) {
@@ -243,7 +268,7 @@ JingleCut.prototype.$el = function() {
     self.delete();
   });
 
-  return $('<tr>').append($('<td>').text(this.name))
+  this.$el = $('<tr>').append($('<td>').text(this.name))
     .append($('<td>').text(this.description))
     .append(
       $('<td>').css('text-align', 'center')
@@ -251,6 +276,8 @@ JingleCut.prototype.$el = function() {
         .append(activateButton)
         .append(deleteButton)
     );
+
+  return this.$el;
 };
 
 var jinglesGroupList = null;