From 87e87750b7ff9e25795d4b6600ffa735053b994c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Dornier?= <remy.dornier@epfl.ch>
Date: Fri, 10 Nov 2023 10:24:32 +0100
Subject: [PATCH 1/6] remove duplicate labels when editing and add new

---
 src/js/models/panel_model.js | 29 ++++++++++++++++++++++++++---
 1 file changed, 26 insertions(+), 3 deletions(-)

diff --git a/src/js/models/panel_model.js b/src/js/models/panel_model.js
index 7e3c02a67..50e60a78d 100644
--- a/src/js/models/panel_model.js
+++ b/src/js/models/panel_model.js
@@ -241,13 +241,35 @@
             var oldLabs = this.get("labels");
             // Need to clone the list of labels...
             var labs = [];
-            for (var i=0; i<oldLabs.length; i++) {
+            /*for (var i=0; i<oldLabs.length; i++) {
                 labs.push( $.extend(true, {}, oldLabs[i]) );
+            }*/
+           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++) {
+                lbl = oldLabs[i];
+
+                lbl_key = this.get_label_key(lbl);
+                // for existing label that matches...
+                console.log(labels)
+                console.log(lbl)
+                console.log(newLabKey)
+                console.log(lbl_key)
+                console.log(newLabKey.includes(lbl_key))
+                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);
         },
@@ -424,16 +446,17 @@
             var oldLabs = this.get('labels');
             // Need to clone the list of labels...
             var labs = [],
-                lbl, lbl_key;
+                lbl, lbl_key, replaced = false;
             for (var i=0; i<oldLabs.length; i++) {
                 lbl = oldLabs[i];
                 lbl_key = this.get_label_key(lbl);
                 // for existing label that matches...
                 if (labels_map.hasOwnProperty(lbl_key)) {
-                    if (labels_map[lbl_key]) {
+                    if (labels_map[lbl_key] && !replaced) {
                         // replace with the new label
                         lbl = $.extend(true, {}, labels_map[lbl_key]);
                         labs.push( lbl );
+                        replaced = true
                     }
                     // else 'false' are ignored (deleted)
                 } else {

From b4d142f17463c3c3b3f7a4eeefe65d2457218307 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Dornier?= <remy.dornier@epfl.ch>
Date: Fri, 10 Nov 2023 14:08:48 +0100
Subject: [PATCH 2/6] remove duplicates after adding them on the figure when
 editing

---
 src/js/models/panel_model.js     | 17 +++--------------
 src/js/views/right_panel_view.js | 14 +++++++++++---
 2 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/src/js/models/panel_model.js b/src/js/models/panel_model.js
index 50e60a78d..b3468047b 100644
--- a/src/js/models/panel_model.js
+++ b/src/js/models/panel_model.js
@@ -241,24 +241,15 @@
             var oldLabs = this.get("labels");
             // Need to clone the list of labels...
             var labs = [];
-            /*for (var i=0; i<oldLabs.length; i++) {
-                labs.push( $.extend(true, {}, oldLabs[i]) );
-            }*/
-           var newLabKey = []
+            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++) {
                 lbl = oldLabs[i];
-
                 lbl_key = this.get_label_key(lbl);
                 // for existing label that matches...
-                console.log(labels)
-                console.log(lbl)
-                console.log(newLabKey)
-                console.log(lbl_key)
-                console.log(newLabKey.includes(lbl_key))
                 if (!newLabKey.includes(lbl_key)) {
                     // otherwise leave un-edited
                     labs.push( $.extend(true, {}, lbl));
@@ -442,21 +433,19 @@
         // 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 = [],
-                lbl, lbl_key, replaced = false;
+                lbl, lbl_key;
             for (var i=0; i<oldLabs.length; i++) {
                 lbl = oldLabs[i];
                 lbl_key = this.get_label_key(lbl);
                 // for existing label that matches...
                 if (labels_map.hasOwnProperty(lbl_key)) {
-                    if (labels_map[lbl_key] && !replaced) {
+                    if (labels_map[lbl_key]) {
                         // replace with the new label
                         lbl = $.extend(true, {}, labels_map[lbl_key]);
                         labs.push( lbl );
-                        replaced = true
                     }
                     // else 'false' are ignored (deleted)
                 } else {
diff --git a/src/js/views/right_panel_view.js b/src/js/views/right_panel_view.js
index c91641e52..83e464c22 100644
--- a/src/js/views/right_panel_view.js
+++ b/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;

From 1c3b8e2458cc4460ac618a3e5913ab247d8d3133 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Dornier?= <remy.dornier@epfl.ch>
Date: Thu, 16 Nov 2023 10:49:22 +0100
Subject: [PATCH 3/6] Fix undo break by removing duplicates in edit_labels

---
 src/js/models/panel_model.js     | 14 +++++++++++++-
 src/js/views/right_panel_view.js | 10 ----------
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/js/models/panel_model.js b/src/js/models/panel_model.js
index d52cd9ce8..3561340ad 100644
--- a/src/js/models/panel_model.js
+++ b/src/js/models/panel_model.js
@@ -456,8 +456,20 @@
                     labs.push( lbl );
                 }
             }
+
+            // filter unique keys only to remove duplicates
+            var filtered_lbls_map = {}
+            for (var i=0; i<labs.length; i++) {
+                filtered_lbls_map[this.get_label_key(labs[i])] = i
+            }
+        
+            var filtered_lbls = [] 
+            _.each(Object.values(filtered_lbls_map), function(idx){
+                filtered_lbls.push(labs[idx])
+            })
+
             // ... so that we get the changed event triggering OK
-            this.save('labels', labs);
+            this.save('labels', filtered_lbls);
         },
 
         save_channel: function(cIndex, attr, value) {
diff --git a/src/js/views/right_panel_view.js b/src/js/views/right_panel_view.js
index 749e33516..76eb0544e 100644
--- a/src/js/views/right_panel_view.js
+++ b/src/js/views/right_panel_view.js
@@ -522,25 +522,15 @@
 
             // 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;

From a0c9ecb0e5b335211e9ed5a404792bf39c701773 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Dornier?= <remy.dornier@epfl.ch>
Date: Tue, 21 Nov 2023 08:24:09 +0100
Subject: [PATCH 4/6] Fix bug on label sorting

---
 src/js/models/panel_model.js | 24 ++++++++++++------------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/js/models/panel_model.js b/src/js/models/panel_model.js
index 3561340ad..720e21e1e 100644
--- a/src/js/models/panel_model.js
+++ b/src/js/models/panel_model.js
@@ -243,24 +243,24 @@
             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]));
-            }
+            var oldLabKeys = [];
 
+            // Keep old labels unchanged...
             for (var i=0; i<oldLabs.length; 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));
-                }
+                var lbl = oldLabs[i];
+                var lbl_key = this.get_label_key(lbl);
+                oldLabKeys.push(lbl_key);
+                labs.push( $.extend(true, {}, lbl));
             }
 
             // ... then add new labels ...
             for (var j=0; j<labels.length; j++) {
-                labs.push( $.extend(true, {}, labels[j]) );
+                var lbl = labels[j];
+                var lbl_key = this.get_label_key(lbl);
+                if (!oldLabKeys.includes(lbl_key)) {
+                    // otherwise leave un-edited
+                    labs.push( $.extend(true, {}, lbl));
+                }
             }
 
             // ... so that we get the changed event triggering OK

From 8c3caa64a346083dbcd0139aa640311e0e7f0a6a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Dornier?= <remy.dornier@epfl.ch>
Date: Tue, 21 Nov 2023 08:27:09 +0100
Subject: [PATCH 5/6] Remove whitespace lines

---
 src/js/models/panel_model.js     | 3 +--
 src/js/views/right_panel_view.js | 4 +++-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/js/models/panel_model.js b/src/js/models/panel_model.js
index 720e21e1e..0ad93a692 100644
--- a/src/js/models/panel_model.js
+++ b/src/js/models/panel_model.js
@@ -252,7 +252,6 @@
                 oldLabKeys.push(lbl_key);
                 labs.push( $.extend(true, {}, lbl));
             }
-
             // ... then add new labels ...
             for (var j=0; j<labels.length; j++) {
                 var lbl = labels[j];
@@ -262,7 +261,6 @@
                     labs.push( $.extend(true, {}, lbl));
                 }
             }
-
             // ... so that we get the changed event triggering OK
             this.save('labels', labs);
         },
@@ -435,6 +433,7 @@
         // 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 = [],
diff --git a/src/js/views/right_panel_view.js b/src/js/views/right_panel_view.js
index 76eb0544e..a8fecf58a 100644
--- a/src/js/views/right_panel_view.js
+++ b/src/js/views/right_panel_view.js
@@ -483,6 +483,7 @@
 
         // 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(),
@@ -496,6 +497,7 @@
 
             var newlbls = {};
             newlbls[key] = new_label;
+
             this.models.forEach(function(m){
                 m.edit_labels(newlbls);
             });
@@ -523,11 +525,11 @@
             // Render template for each position and append to $el
             var html = "";
             _.each(positions, function(lbls, p) {
+
                 lbls = _.map(lbls, function(label, key){ return label; });
 
                 var json = {'position':p, 'labels':lbls};
                 if (lbls.length === 0) return;
-                
                 json.inner_template = self.inner_template;
                 html += self.template(json);
             });

From 06d2d50615e9257b61ecd463bf0b604949de1be6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Dornier?= <remy.dornier@epfl.ch>
Date: Wed, 22 Nov 2023 16:27:45 +0100
Subject: [PATCH 6/6] shorten the filtering and remove Object.values()

---
 src/js/models/panel_model.js | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/src/js/models/panel_model.js b/src/js/models/panel_model.js
index b23379b02..ebdeabeed 100644
--- a/src/js/models/panel_model.js
+++ b/src/js/models/panel_model.js
@@ -463,16 +463,12 @@
                 }
             }
 
-            // filter unique keys only to remove duplicates
-            var filtered_lbls_map = {}
-            for (var i=0; i<labs.length; i++) {
-                filtered_lbls_map[this.get_label_key(labs[i])] = i
-            }
-        
-            var filtered_lbls = [] 
-            _.each(Object.values(filtered_lbls_map), function(idx){
-                filtered_lbls.push(labs[idx])
-            })
+            // Extract all the keys (even duplicates)
+            var keys = labs.map(lbl => this.get_label_key(lbl));
+
+            // get all unique labels based on filtering keys 
+            //(i.e removing duplicate keys based on the index of the first occurrence of the value)
+            var filtered_lbls = labs.filter((lbl, index) => index == keys.indexOf(this.get_label_key(lbl)));
 
             // ... so that we get the changed event triggering OK
             this.save('labels', filtered_lbls);