Duplicated labels removal

src/js/models/panel_model.js

@@ -243,13 +243,26 @@
             var oldLabs = this.get("labels");
             // Need to clone the list of labels...
             var labs = [];
+            var newLabKey = [];
+            for (var i=0; i<labels.length; i++) {
+                newLabKey.push(this.get_label_key(labels[i]));
+            }
+
             for (var i=0; i<oldLabs.length; i++) {
-                labs.push( $.extend(true, {}, oldLabs[i]) );
+                lbl = oldLabs[i];
+                lbl_key = this.get_label_key(lbl);
+                // for existing label that matches...
+                if (!newLabKey.includes(lbl_key)) {
+                    // otherwise leave un-edited
+                    labs.push( $.extend(true, {}, lbl));
+                }
             }
+
             // ... then add new labels ...
             for (var j=0; j<labels.length; j++) {
                 labs.push( $.extend(true, {}, labels[j]) );
             }
+
             // ... so that we get the changed event triggering OK
             this.save('labels', labs);
         },
@@ -422,7 +435,6 @@
         // labels_map is {labelKey: {size:s, text:t, position:p, color:c}} or {labelKey: false} to delete
         // where labelKey specifies the label to edit. "l.text + '_' + l.size + '_' + l.color + '_' + l.position"
         edit_labels: function(labels_map) {
-
             var oldLabs = this.get('labels');
             // Need to clone the list of labels...
             var labs = [],

src/js/views/right_panel_view.js

@@ -483,7 +483,6 @@
 
         // Use the label 'key' to specify which labels to update
         handle_label_edit: function(event) {
-
             var $form = $(event.target),
                 label_text = $('.label-text', $form).val(),
                 font_size = $('.font-size', $form).text().trim(),
@@ -497,7 +496,6 @@
 
             var newlbls = {};
             newlbls[key] = new_label;
-
             this.models.forEach(function(m){
                 m.edit_labels(newlbls);
             });
@@ -524,15 +522,25 @@
 
             // Render template for each position and append to $el
             var html = "";
+            var filteredLbls = []
             _.each(positions, function(lbls, p) {
-
                 lbls = _.map(lbls, function(label, key){ return label; });
 
                 var json = {'position':p, 'labels':lbls};
                 if (lbls.length === 0) return;
+                console.log(lbls)
+                lbls.forEach(function(lbl){
+                    filteredLbls.push(lbl)
+                })
+
                 json.inner_template = self.inner_template;
                 html += self.template(json);
             });
+
+            this.models.forEach(function(m){
+                m.save('labels', filteredLbls);
+            })
+
             self.$el.append(html);
 
             return this;