revert usage of Map

underscore checks isEqual, but doesn't support equality on Map objects https://underscorejs.org/docs/modules/isEqual.html

In a previous commit i replaced a raw object with a Map

So the initial request ends up triggering a change on the legend, but later requests don't, because they compare equal incorrectly.

maybe this is fixed in new backbone/underscore, idk.

public/models/LegendModel.js

@@ -22,7 +22,10 @@ class LegendModel extends Backbone.Model {
         this.set({ artistColors: {} });
     }
     get_artist_color(artist) {
-        return this.get('artistColors').get(artist.toLowerCase());
+        return this.artist_colors()[artist.toLowerCase()];
+    }
+    artist_colors() {
+        return this.get('artistColors');
     }
     compute_artist_colors(scrobbles) {
         let a = _.chain(scrobbles.models)
@@ -31,16 +34,16 @@ class LegendModel extends Backbone.Model {
             .sortBy('length')
             .reverse()
             .value();
-        let artistColors = new Map();
+        let artistColors = {};
         const otherColor = LEGEND_COLORS[0];
         for (let i = 0; i < a.length; i++) {
-            let x = a[i];
-            artistColors.set(x[0].artist().toLowerCase(), {
-                artist: x[0].artist(),
+            let scrobbles = a[i];
+            artistColors[scrobbles[0].artist().toLowerCase()] = {
+                artist: scrobbles[0].artist(),
                 color: LEGEND_COLORS[i + 1] || otherColor,
-                count: x.length,
+                count: scrobbles.length,
                 showInLegend: !!LEGEND_COLORS[i + 1],
-            });
+            };
         }
         this.set({ artistColors, otherColor });
     }

public/views/LegendView.js

@@ -1,8 +1,9 @@
 class LegendView extends Backbone.View {
     render() {
         this.$("li").remove();
-        let artistColors = legendModel.get("artistColors");
-        for (const color of artistColors.values()) {
+        let artistColors = legendModel.artist_colors();
+        for (const k in artistColors) {
+            const color = artistColors[k];
             if (color.showInLegend) {
                 $("<li>")
                     .text(`${color.artist} (${color.count})`)

src/models/LegendModel.ts

@@ -27,8 +27,13 @@ class LegendModel extends Backbone.Model {
   initialize() {
     this.set({ artistColors: {} });
   }
+
   get_artist_color(artist: string): ArtistColor {
-    return this.get('artistColors').get(artist.toLowerCase());
+    return this.artist_colors()[artist.toLowerCase()];
+  }
+
+  artist_colors(): { [key: string]: ArtistColor; } {
+    return this.get('artistColors');
   }
   compute_artist_colors(scrobbles: ScrobbleCollection) {
     let a = _.chain(scrobbles.models)
@@ -38,16 +43,16 @@ class LegendModel extends Backbone.Model {
       .reverse()
       .value();
 
-    let artistColors: Map<string, ArtistColor> = new Map();
+    let artistColors: { [key: string]: ArtistColor; } = {};
     const otherColor = LEGEND_COLORS[0];
     for (let i = 0; i < a.length; i++) {
-      let x = a[i];
-      artistColors.set(x[0].artist().toLowerCase(), {
-        artist: x[0].artist(),
+      let scrobbles = a[i];
+      artistColors[scrobbles[0].artist().toLowerCase()] = {
+        artist: scrobbles[0].artist(),
         color: LEGEND_COLORS[i + 1] || otherColor,
-        count: x.length,
+        count: scrobbles.length,
         showInLegend: !!LEGEND_COLORS[i + 1],
-      });
+      };
     }
 
     this.set({ artistColors, otherColor });

src/views/LegendView.ts

@@ -1,8 +1,9 @@
 class LegendView extends Backbone.View {
   render() {
     this.$("li").remove();
-    let artistColors = legendModel.get("artistColors");
-    for (const color of artistColors.values()) {
+    let artistColors = legendModel.artist_colors();
+    for (const k in artistColors) {
+      const color = artistColors[k];
       if (color.showInLegend) {
         $("<li>")
           .text(`${color.artist} (${color.count})`)