From f7c2be39947048b5eda7f5aaa96441a3e701b9dd Mon Sep 17 00:00:00 2001
From: Amitoj Singh <amitojsingh366@gmail.com>
Date: Mon, 28 Jun 2021 13:33:35 +0300
Subject: [PATCH] fix import profile bug

---
 package.json     |   2 +-
 public/help.css  |  41 ++++---
 public/help.html |   2 +-
 public/home.css  | 288 ++++++++++++++++++++++++-----------------------
 public/home.html |  53 +++++----
 5 files changed, 200 insertions(+), 186 deletions(-)

diff --git a/package.json b/package.json
index 32ce7b5..a4f31bb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "easy-rpc",
-    "version": "2.1.1",
+    "version": "2.1.2",
     "description": "A easy discord rpc",
     "main": "dist/index.js",
     "scripts": {
diff --git a/public/help.css b/public/help.css
index de815b8..355e32d 100644
--- a/public/help.css
+++ b/public/help.css
@@ -1,34 +1,33 @@
 :root {
-    background-color: #2C2F33;
-    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-    color: #FFFFFF;
-    font-size: large;
+  background-color: #2c2f33;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  color: #ffffff;
+  font-size: large;
 }
 
-h1{
-    text-align: center;
+h1 {
+  text-align: center;
 }
-h3{
-    padding-left: 50px;
+h3 {
+  padding-left: 50px;
 }
-a{
-    color: #bcd0dd;
+a {
+  color: #bcd0dd;
 }
-.footer-div{
-    text-align: center;
+.footer-div {
+  text-align: center;
 }
 
 .back-btn {
-    width: 100px;
-    height: 40px;
-    background-color: #7289DA;
-    color: #FFFFFF;
-    border: 1px solid #2c2f31;
-    border-radius: 20px;
-    font-size: large;
+  width: 100px;
+  height: 40px;
+  background-color: #5865f2;
+  color: #ffffff;
+  border: 1px solid #2c2f31;
+  border-radius: 20px;
+  font-size: large;
 }
 
 .back-btn:hover {
-    background-color: #8fa7ff;
+  background-color: #8fa7ff;
 }
-
diff --git a/public/help.html b/public/help.html
index 7c99378..afaa48b 100644
--- a/public/help.html
+++ b/public/help.html
@@ -13,7 +13,7 @@ <h6 style="margin: 0px; margin-bottom: 10px; color: #bcd0dd; margin-top: 5px; te
     <h3>Here are a few things to get you started: </h3>
     <div style="padding-left: 50px;">
         <p><strong>&bull; Client ID: </strong>This is the ID of your application. It can be obtained from the <a
-                href="https://discord.com/developers/">Discord Developer
+                href="https://discord.dev">Discord Developer
                 Portal</a><br><i>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Note:
                 The name of this application directly affects the name of the RP</i></p>
         <p><strong>&bull; Start & Stop Times: </strong>These will be the start and stop times of the RP. Just write
diff --git a/public/home.css b/public/home.css
index e0a5941..ccf0ed7 100644
--- a/public/home.css
+++ b/public/home.css
@@ -1,229 +1,237 @@
 :root {
-    background-color: #2C2F33;
-    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-    text-align: center;
-    color: #FFFFFF;
-    font-size: large;
+  background-color: #2c2f33;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  text-align: center;
+  color: #ffffff;
+  font-size: large;
 }
 
 .start-btn {
-    width: 100px;
-    height: 40px;
-    background-color: #5865F2;
-    color: #FFFFFF;
-    border: 1px solid #2c2f31;
-    border-radius: 20px;
-    font-size: large;
+  width: 100px;
+  height: 40px;
+  background-color: #5865f2;
+  color: #ffffff;
+  border: 1px solid #2c2f31;
+  border-radius: 20px;
+  font-size: large;
 }
 
 .start-btn:hover {
-    background-color: #727df1;
+  background-color: #727df1;
 }
 
 .save-btn {
-    width: 100px;
-    height: 40px;
-    background-color: #2c2f31;
-    color: #FFFFFF;
-    border: 1px solid #5865F2;
-    border-radius: 20px;
-    font-size: large;
+  width: 100px;
+  height: 40px;
+  background-color: #2c2f31;
+  color: #ffffff;
+  border: 1px solid #5865f2;
+  border-radius: 20px;
+  font-size: large;
 }
 
 .save-btn:hover {
-    background-color: #5865F2;
+  background-color: #5865f2;
 }
 
 .stop-btn {
-    width: 100px;
-    height: 40px;
-    background-color: #ED4245;
-    color: #FFFFFF;
-    border: 1px solid #2c2f31;
-    border-radius: 20px;
-    font-size: large;
+  width: 100px;
+  height: 40px;
+  background-color: #ed4245;
+  color: #ffffff;
+  border: 1px solid #2c2f31;
+  border-radius: 20px;
+  font-size: large;
 }
 
 .stop-btn:hover {
-    background-color: #ff6673;
+  background-color: #ff6673;
 }
 
 .clear-btn {
-    width: auto;
-    height: auto;
-    background-color: #2C2F33;
-    color: #99AAB5;
-    border: 1px solid #99AAB5;
-    border-radius: 20px;
-    font-size: small;
-    margin-left: 20px;
+  width: auto;
+  height: auto;
+  background-color: #2c2f33;
+  color: #99aab5;
+  border: 1px solid #99aab5;
+  border-radius: 20px;
+  font-size: small;
+  margin-left: 20px;
 }
 
 .clear-btn:hover {
-    background-color: #99AAB5;
-    color: #2C2F33;
-    border: 1px solid #2C2F33;
+  background-color: #99aab5;
+  color: #2c2f33;
+  border: 1px solid #2c2f33;
 }
 
 .clear-btn-del {
-    width: auto;
-    height: auto;
-    background-color: #2C2F33;
-    color: #ED4245;
-    border: 1px solid #ED4245;
-    border-radius: 20px;
-    font-size: small;
-    margin-left: 20px;
+  width: auto;
+  height: auto;
+  background-color: #2c2f33;
+  color: #ed4245;
+  border: 1px solid #ed4245;
+  border-radius: 20px;
+  font-size: small;
+  margin-left: 20px;
 }
 
 .clear-btn-del:hover {
-    background-color: #ED4245;
-    color: #2C2F33;
-    border: 1px solid #2C2F33;
+  background-color: #ed4245;
+  color: #2c2f33;
+  border: 1px solid #2c2f33;
 }
 
 .a {
-    color: #bcd0dd;
-    background: none;
-    margin: 0;
-    padding: 0;
-    border: none;
-    cursor: pointer;
-    text-decoration: underline;
+  color: #bcd0dd;
+  background: none;
+  margin: 0;
+  padding: 0;
+  border: none;
+  cursor: pointer;
+  text-decoration: underline;
 }
 
 a {
-    color: #bcd0dd;
+  color: #bcd0dd;
 }
 
 .input-feild {
-    outline: none;
-    padding: 10px;
-    width: 200px;
-    height: 20px;
-    background-color: #2C2F33;
-    color: #FFFFFF;
-    border: 1px solid #23272A;
-    border-radius: 10px;
-    font-size: large;
+  outline: none;
+  padding: 10px;
+  width: 200px;
+  height: 20px;
+  background-color: #2c2f33;
+  color: #ffffff;
+  border: 1px solid #23272a;
+  border-radius: 10px;
+  font-size: large;
 }
 
 .input-feild-danger {
-    outline: none;
-    padding: 10px;
-    width: 200px;
-    height: 20px;
-    background-color: #2C2F33;
-    color: #FFFFFF;
-    border: 1px solid #ED4245;
-    border-radius: 10px;
-    font-size: large;
+  outline: none;
+  padding: 10px;
+  width: 200px;
+  height: 20px;
+  background-color: #2c2f33;
+  color: #ffffff;
+  border: 1px solid #ed4245;
+  border-radius: 10px;
+  font-size: large;
 }
 
 .input-feild:focus {
-    outline: none;
-    border: 1px solid #5865F2;
+  outline: none;
+  border: 1px solid #5865f2 !important;
+}
+
+.input-feild:hover {
+  outline: none;
+  border: 1px solid #141618;
 }
 
 .banner-running {
-    background-color: #48b584;
-    width: 500px;
-    padding: 1px;
-    border-radius: 8px;
-    text-align: center;
-    align-self: center;
+  background-color: #48b584;
+  width: 500px;
+  padding: 1px;
+  border-radius: 8px;
+  text-align: center;
+  align-self: center;
 }
 
 .banner-error {
-    background-color: #ED4245;
-    width: 500px;
-    padding: 1px;
-    border-radius: 8px;
-    text-align: center;
-    align-self: center;
+  background-color: #ed4245;
+  width: 500px;
+  padding: 1px;
+  border-radius: 8px;
+  text-align: center;
+  align-self: center;
 }
 
 .switch {
-    position: relative;
-    display: inline-block;
-    width: 30px;
-    height: 15px;
+  position: relative;
+  display: inline-block;
+  width: 30px;
+  height: 15px;
 }
 
-
 /* Hide default HTML checkbox */
 
 .switch input {
-    opacity: 0;
-    width: 0;
-    height: 0;
+  opacity: 0;
+  width: 0;
+  height: 0;
 }
 
-
 /* The slider */
 
 .slider {
-    position: absolute;
-    cursor: pointer;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background-color: #ccc;
-    -webkit-transition: .4s;
-    transition: .4s;
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: 0.4s;
+  transition: 0.4s;
 }
 
 .slider:before {
-    position: absolute;
-    content: "";
-    width: 15px;
-    height: 15px;
-    left: 0px;
-    bottom: 0px;
-    background-color: white;
-    -webkit-transition: .4s;
-    transition: .4s;
+  position: absolute;
+  content: "";
+  width: 15px;
+  height: 15px;
+  left: 0px;
+  bottom: 0px;
+  background-color: white;
+  -webkit-transition: 0.4s;
+  transition: 0.4s;
 }
 
-input:checked+.slider {
-    background-color: #5865F2;
+input:checked + .slider {
+  background-color: #5865f2;
 }
 
-input:focus+.slider {
-    box-shadow: 0 0 1px #5865F2;
+input:focus + .slider {
+  box-shadow: 0 0 1px #5865f2;
 }
 
-input:checked+.slider:before {
-    -webkit-transform: translateX(15px);
-    -ms-transform: translateX(15px);
-    transform: translateX(15px);
+input:checked + .slider:before {
+  -webkit-transform: translateX(15px);
+  -ms-transform: translateX(15px);
+  transform: translateX(15px);
 }
 
 .slider.round {
-    border-radius: 34px;
+  border-radius: 34px;
 }
 
 .slider.round:before {
-    border-radius: 50%;
+  border-radius: 50%;
 }
 
 select {
-    padding: 10px;
-    width: 220px;
-    background-color: #2C2F33;
-    color: #FFFFFF;
-    border: 1px solid #23272A;
-    border-radius: 10px;
-    font-size: large;
+  padding: 10px;
+  width: 220px;
+  background-color: #2c2f33;
+  color: #ffffff;
+  border: 1px solid #23272a;
+  border-radius: 10px;
+  font-size: large;
 }
 
 select:hover {
-    outline: none;
-    border: 1px solid #5865F2;
+  outline: none;
+  border: 1px solid #141618;
+}
+
+select:focus {
+  outline: none;
+  border: 1px solid #5865f2;
 }
 
 option {
-    color: #FFFFFF;
-    background-color: #2C2F33;
-}
\ No newline at end of file
+  color: #ffffff;
+  background-color: #2c2f33;
+}
diff --git a/public/home.html b/public/home.html
index c0c1d4d..f481e87 100644
--- a/public/home.html
+++ b/public/home.html
@@ -29,6 +29,10 @@ <h6 style="margin: 0px; margin-bottom: 10px; color: #bcd0dd; margin-top: 5px; te
             <p style="font-size: 15px;"><i class="material-icons" style="font-size: 15px;">info</i>Profile has been
                 sucessfully imported!</p>
         </div>
+        <div class="banner-error" style="display: none;" id="import-error-banner">
+            <p style="font-size: 15px;"><i class="material-icons" style="font-size: 15px;">info</i>There was an error
+                importing this profile, Please try again later</p>
+        </div>
     </center><br>
     <div>
         <select name="profiles" id="profiles"
@@ -189,18 +193,12 @@ <h6 style="margin: 0px; margin-bottom: 10px; color: #bcd0dd; margin-top: 5px; te
     }
 
     function clearProfile() {
-        if (document.getElementById("button_1_label")) {
-            document.getElementById("button_1_label").remove();
-        }
-        if (document.getElementById("button_1_url")) {
-            document.getElementById("button_1_url").remove();
-        }
-        if (document.getElementById("button_2_label")) {
-            document.getElementById("button_2_label").remove();
-        }
-        if (document.getElementById("button_2_url")) {
-            document.getElementById("button_2_url").remove();
-        }
+        if (document.getElementById("button_1_label")) document.getElementById("button_1_label").remove();
+        if (document.getElementById("button_1_url")) document.getElementById("button_1_url").remove();
+        if (document.getElementById("button_2_label")) document.getElementById("button_2_label").remove();
+        if (document.getElementById("button_2_url")) document.getElementById("button_2_url").remove();
+        if (document.getElementById('button-breaker')) document.getElementById('button-breaker').remove();
+
         b1l = "";
         b1u = "";
         b2l = "";
@@ -270,18 +268,24 @@ <h6 style="margin: 0px; margin-bottom: 10px; color: #bcd0dd; margin-top: 5px; te
                     c++;
                     res = JSON.parse(res)
                     if (res.code == 200) {
-                        let data = decodeURIComponent(atob(res.data));
-                        data = JSON.parse(data);
-                        let profiles = localStorage.getItem("@rpc/profiles");
-                        profiles = JSON.parse(profiles);
-                        if (profiles.find((p) => p.id == data.id)) {
-                            let i = profiles.find((p) => p.id == data.id);
-                            profiles.splice(i, 1);
+                        try {
+                            let data = decodeURIComponent(atob(res.data));
+                            data = JSON.parse(data);
+                            let profiles = localStorage.getItem("@rpc/profiles");
+                            profiles = JSON.parse(profiles);
+                            if (profiles.find((p) => p.id == data.id)) {
+                                let i = profiles.find((p) => p.id == data.id);
+                                profiles.splice(i, 1);
+                            }
+                            data.default = false;
+                            profiles.push(data);
+                            localStorage.setItem("@rpc/profiles", JSON.stringify(profiles));
+                            loadProfiles(data.id);
+                            document.getElementById("import-success-banner").style.display = 'inherit';
+                        } catch (e) {
+                            console.log(e);
+                            document.getElementById("import-error-banner").style.display = 'inherit';
                         }
-                        profiles.push(data);
-                        localStorage.setItem("@rpc/profiles", JSON.stringify(profiles));
-                        loadProfiles(data.id);
-                        document.getElementById("import-success-banner").style.display = 'inherit';
                     }
                 }
             }
@@ -461,6 +465,8 @@ <h6 style="margin: 0px; margin-bottom: 10px; color: #bcd0dd; margin-top: 5px; te
         } else {
             let input = document.createElement('input');
             let input_2 = document.createElement('input');
+            let breaker = document.createElement('br');
+            breaker.id = 'button-breaker';
             input.type = 'text';
             input.name = 'button_1_label';
             input.id = 'button_1_label';
@@ -477,6 +483,7 @@ <h6 style="margin: 0px; margin-bottom: 10px; color: #bcd0dd; margin-top: 5px; te
             input_2.value = b1u;
             btn_div.append(input);
             btn_div.append(input_2);
+            btn_div.append(breaker);
         }
     }