From ad406d72e4509c6761bf90b922c26f81c89814b9 Mon Sep 17 00:00:00 2001
From: Ajay Ramachandran <dev@ajay.app>
Date: Wed, 14 Oct 2020 23:23:42 -0400
Subject: [PATCH] Improve username setting

---
 public/popup.css | 12 +++++++++---
 src/popup.ts     | 33 ++++++++++++---------------------
 2 files changed, 21 insertions(+), 24 deletions(-)

diff --git a/public/popup.css b/public/popup.css
index 92ffa051..d5298e3c 100644
--- a/public/popup.css
+++ b/public/popup.css
@@ -196,8 +196,8 @@ div.logoText>p, .sbHeader {
   margin-bottom: 12px !important;
 }
 #mainControls{
-flex-flow: column;
-align-items: center;
+  flex-flow: column;
+  align-items: center;
 }
 #submitTimesContainer{
   flex-flow: column;
@@ -216,7 +216,13 @@ align-items: center;
   border: none;
   color: white;
   width: fit-content;
-  padding: 0;
+  padding-left: 0;
+
+  cursor: pointer;
+}
+
+#submitUsername {
+  padding-left: 5pt;
 }
 
 #additionalButtons, #additionalButtons>button {
diff --git a/src/popup.ts b/src/popup.ts
index 742a2054..a02e1216 100644
--- a/src/popup.ts
+++ b/src/popup.ts
@@ -129,6 +129,7 @@ async function runThePopup(messageListener?: MessageListener) {
     PageElements.submitTimes.addEventListener("click", submitTimes);
     //PageElements.showNoticeAgain.addEventListener("click", showNoticeAgain);
     PageElements.setUsernameButton.addEventListener("click", setUsernameButton);
+    PageElements.usernameValue.addEventListener("click", setUsernameButton);
     PageElements.submitUsername.addEventListener("click", submitUsername);
     PageElements.optionsButton.addEventListener("click", openOptions);
     PageElements.helpButton.addEventListener("click", openHelp);
@@ -834,27 +835,15 @@ async function runThePopup(messageListener?: MessageListener) {
 
     //make the options username setting option visible
     function setUsernameButton() {
-        //get username from the server
-        utils.sendRequestToServer("GET", "/api/getUsername?userID=" + Config.config.userID, function (response) {
-            if (response.status == 200) {
-                PageElements.usernameInput.value = JSON.parse(response.responseText).userName;
+        PageElements.usernameInput.value = PageElements.usernameValue.innerText;
 
-                PageElements.submitUsername.style.display = "unset";
-                PageElements.usernameInput.style.display = "unset";
+        PageElements.submitUsername.style.display = "unset";
+        PageElements.usernameInput.style.display = "unset";
 
-                PageElements.setUsernameContainer.style.display = "none";
-                PageElements.setUsername.style.display = "flex";
-                PageElements
-                PageElements.setUsernameStatusContainer.style.display = "none";
-            } else {
-                PageElements.setUsername.style.display = "unset";
-                PageElements.submitUsername.style.display = "none";
-                PageElements.usernameInput.style.display = "none";
-
-                PageElements.setUsernameStatusContainer.style.display = "unset";
-                PageElements.setUsernameStatus.innerText = utils.getErrorMessage(response.status);
-            }
-        });
+        PageElements.setUsernameContainer.style.display = "none";
+        PageElements.setUsername.style.display = "flex";
+        
+        PageElements.setUsernameStatusContainer.style.display = "none";
     }
 
     //submit the new username
@@ -863,14 +852,16 @@ async function runThePopup(messageListener?: MessageListener) {
         PageElements.setUsernameStatusContainer.style.display = "unset";
         PageElements.setUsernameStatus.innerText = chrome.i18n.getMessage("Loading");
 
-        //get the userID
         utils.sendRequestToServer("POST", "/api/setUsername?userID=" + Config.config.userID + "&username=" + PageElements.usernameInput.value, function (response) {
             if (response.status == 200) {
                 //submitted
                 PageElements.submitUsername.style.display = "none";
                 PageElements.usernameInput.style.display = "none";
 
-                PageElements.setUsernameStatus.innerText = chrome.i18n.getMessage("success");
+                PageElements.setUsernameContainer.style.removeProperty("display");
+                PageElements.usernameValue.innerText = PageElements.usernameInput.value;
+
+                PageElements.setUsernameStatusContainer.style.display = "none";
             } else {
                 PageElements.setUsernameStatus.innerText = utils.getErrorMessage(response.status);
             }