Add nicknames to multi list packages (close #7)

www/assets/js/track.js

@@ -84,14 +84,20 @@ function updateTrackingMultiListStatus() {
     if (codes.length > 0) {
         $("#tracking-multi-list ul").html("");
         for (var i = 0; i < codes.length; i++) {
-            $("#tracking-multi-list ul").append('<li><div style="cursor: pointer;" class="item-content tracking-code-multi-link noselect" data-trackingcode="' + codes[i] + '" onclick="router.navigate(\'/track/' + codes[i] + '\')">'
-                    + '<div class="item-inner item-cell"><div class="item-row"><div class="item-cell">' + codes[i] + '</div></div>'
+            $("#tracking-multi-list ul").append('<li><div style="cursor: pointer;" class="item-content tracking-code-multi-link noselect" data-trackingcode="' + codes[i].code + '" onclick="router.navigate(\'/track/' + codes[i].code + '\')">'
+                    + '<div class="item-inner item-cell">'
+                    + (codes[i].nick == "" ? "" : '<div class="item-row"><div class="item-cell"><b>' + codes[i].nick + '</b></div></div>')
+                    + '<div class="item-row"><div class="item-cell">' + codes[i].code + '</div></div>'
                     + '<div class="item-row"><div class="item-cell">'
                     + '<img src="" class="trackingeventicon tracking-multi-status-icon" /> <span class="tracking-multi-status-text"></span>'
                     + '</div></div></div></div></li>');
         }
+        var codelist = [];
+        for (var i = 0; i < codes.length; i++) {
+            codelist.push(codes[i].code);
+        }
         apirequest(SETTINGS.apis.trackmultiple, {
-            code: codes.join(",")
+            code: codelist.join(",")
         }, function (resp) {
             if (resp.status == "OK") {
                 for (const code in resp.results) {
@@ -302,12 +308,23 @@ $("#app").on("contextmenu taphold", ".tracking-code-multi-link", function (evt)
         buttons: [
             [
                 {
-                    text: 'Track',
+                    text: 'Open',
                     bold: true,
                     onClick: function () {
                         openTrackingInfoPage(code);
                     }
                 },
+                {
+                    text: 'Add/Change Nickname',
+                    onClick: function () {
+                        app.dialog.prompt("Set a nickname for " + code, "Package Name", function (input) {
+                            addNicknameToTrackingMultiList(code, htmlEntities(input));
+                            updateTrackingMultiListStatus();
+                        }, function () {
+                            // canceled
+                        }, "");
+                    }
+                },
                 {
                     text: 'Remove from list',
                     onClick: function () {
@@ -426,44 +443,79 @@ function removeFromTrackingHistory(code) {
 
 
 function getTrackingMultiList() {
-    var history = getStorage("multitrackingcodes");
-    if (history == "false" || history == "null" || history == null) {
+    var multilist = getStorage("multitrackingcodes");
+
+    if (multilist == "false" || multilist == "null" || multilist == null) {
         return [];
     } else {
-        return JSON.parse(history);
+        var multilistjson = JSON.parse(multilist);
+
+        if (multilistjson.length > 0) {
+            if (typeof multilistjson[0] == "object") {
+                return multilistjson;
+            } else {
+                // Old version is just string array, new version is array of objects,
+                // do a conversion
+                // TODO: Remove this code once everyone's updated to this version, since it's not efficient to do typeof every time
+                var newmultilist = [];
+                for (var i = 0; i < multilistjson.length; i++) {
+                    newmultilist.push({
+                        code: multilistjson[i],
+                        nick: ""
+                    });
+                }
+                setStorage("multitrackingcodes", JSON.stringify(newmultilist));
+                return newmultilist;
+            }
+        } else {
+            return [];
+        }
     }
 }
 
-function addToTrackingMultiList(code) {
-    var history = getTrackingMultiList();
+function addToTrackingMultiList(code, nickname) {
+    if (typeof nickname != "string") {
+        nickname = "";
+    }
+    var multilist = getTrackingMultiList();
 
-    for (var i = 0; i < history.length; i++) {
-        if (history[i] == code) {
-            history.splice(i, 1);
+    for (var i = 0; i < multilist.length; i++) {
+        if (multilist[i].code == code) {
+            // Already in list, remove so we can add with the new nick if set
+            multilist.splice(i, 1);
         }
     }
-    // Add the code back to the list so it's at the top
-    history.push(code);
+    // Add the code to the list
+    multilist.push({
+        code: code,
+        nick: nickname
+    });
 
-    while (history.length > 10) {
-        history.shift();
+    setStorage("multitrackingcodes", JSON.stringify(multilist));
+}
+
+function addNicknameToTrackingMultiList(code, nickname) {
+    var multilist = getTrackingMultiList();
+
+    for (var i = 0; i < multilist.length; i++) {
+        if (multilist[i].code == code) {
+            multilist[i].nick = nickname;
+        }
     }
-    setStorage("multitrackingcodes", JSON.stringify(history));
+
+    setStorage("multitrackingcodes", JSON.stringify(multilist));
 }
 
 function removeFromTrackingMultiList(code) {
-    var history = getTrackingMultiList();
+    var multilist = getTrackingMultiList();
 
-    for (var i = 0; i < history.length; i++) {
-        if (history[i] == code) {
-            history.splice(i, 1);
+    for (var i = 0; i < multilist.length; i++) {
+        if (multilist[i].code == code) {
+            multilist.splice(i, 1);
         }
     }
 
-    while (history.length > 10) {
-        history.shift();
-    }
-    setStorage("multitrackingcodes", JSON.stringify(history));
+    setStorage("multitrackingcodes", JSON.stringify(multilist));
 
     $(".tracking-code-multi-link[data-trackingcode=\"" + code + "\"]").parent("li").remove();
 }

www/assets/js/util.js

@@ -325,4 +325,14 @@ function colorThemeNameToHex(theme) {
     };
 
     return colors[theme.toLowerCase()];
+}
+
+/**
+ * Make an untrusted string safe for inlining in HTML by replacing dangerous characters with HTML entities.
+ * Credit: https://stackoverflow.com/a/14130005 CC-BY-SA 3.0
+ * @param {String} str
+ * @returns {String}
+ */
+function htmlEntities(str) {
+    return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
 }