Removed password from the options

css/options.css

@@ -43,7 +43,9 @@ h1 {
 #loggedOutPanel,
 #onlineAdvancedPanel,
 #onlineError,
-#onlineSuccess {
+#onlineSuccess,
+#onlineURLPanel,
+#onlineServiceInfo {
     display: none;
 }
 

manifests/firefox.json

@@ -1,6 +1,6 @@
 {
 	"permissions": [
-		"*://*.nikurasu.org/*"
+		"*://*.nikurasu.org/api/*"
 	],
 
 	"applications": {

options.html

@@ -297,7 +297,8 @@ <h1 class="text-container py-2 px-2"><i class="fas fa-globe"></i> Online Save</h
             <div class="col">
                 <div class="form-group text-container p-2">
                     <label class="font-weight-bold">Online Save <a data-default="onlineSave" class="btn btn-sm btn-secondary"><i class="fas fa-trash"></i><span class="d-none d-xl-inline"> Restore default</span></a></label>
-                    <p>Online Save will update your data on a MMD Online Save instance. I propose a default one hosted on my site <a href="https://mmd.nikurasu.org">nikurasu</a>.</p>
+                    <p>Online Save will update your data on a MMD Online Save instance, which you can find <a href="https://github.com/Glagan/MMD-Online-Save">here</a>. I propose a default one hosted on my site <a href="https://mmd.nikurasu.org">nikurasu</a>.</p>
+                    <div id="onlineServiceInfo" class="alert alert-info" role="alert">You can't currently host your own MMD Online Save for Firefox (working only on Chrome) since permissions don't allow me to make requests to a domain which isn't in the extension manifest, and I can't know what domain you will use.</div>
                     <p>You only need to set a Username and Password, then when you need to use your data on another computer or another device, log in and your data will be imported.</p>
                     <p>All data is still saved locally, and the extension only use local storage to retrieve data, you can disable online save and delete all of your saved data at any time.<br />
                     What Online Save do is updating your save online every time your save is updated locally.</p>
@@ -339,11 +340,9 @@ <h1 class="text-container py-2 px-2"><i class="fas fa-globe"></i> Online Save</h
                     <div id="onlineError" class="alert alert-danger" role="alert"></div>
                     <!-- Values -->
                     <form id="onlineForm">
-                        <div class="form-group text-container p-2">
+                        <div id="onlineURLPanel" class="form-group text-container p-2">
                             <label class="font-weight-bold">Online URL <a data-default="onlineURL" class="btn btn-sm btn-secondary"><i class="fas fa-trash"></i><span class="d-none d-xl-inline"> Restore default</span></a></label>
                             <p class="d-none d-xl-block">The URL of the online service.</p>
-                            <div class="alert alert-info" role="alert">If you wish to host your own service and use it on <b>Firefox</b> you need to send me a message due to <b>Firefox</b> limitations.<br>
-                            You don't need to message me if you wish to host your own service and use it only on <b>Chrome</b>.</div>
                             <div class="px-0">
                                 <!--<input data-option="onlineURL" data-type="text" type="text" name="onlineURL" placeholder="URL" class="form-control" />-->
                                 <input type="text" name="onlineURL" placeholder="URL" class="form-control" />

scripts/defaultOptions.js

@@ -30,7 +30,6 @@ let defaultOptions = {
     onlineSave: false,
     onlineURL: "https://mmd.nikurasu.org/api/",
     username: "",
-    password: "",
     isLoggedIn: false,
     token: "",
     version: 2.0

scripts/optionsManager.js

@@ -31,6 +31,13 @@ class OptionsManager {
         this.onlineSuccess = document.getElementById("onlineSuccess");
         this.downloadOnlineButton = document.getElementById("downloadOnline");
 
+        // Only Chrome users can update the online save
+        if (CHROME) {
+            document.getElementById("onlineURLPanel").style.display = "block";
+        } else {
+            document.getElementById("onlineServiceInfo").style.display = "block";
+        }
+
         //
         this.options = {};
         this.myAnimeListMangaList = {};
@@ -202,7 +209,6 @@ class OptionsManager {
         // Restore online options
         this.onlineForm.onlineURL.value = this.options.onlineURL;
         this.onlineForm.username.value = this.options.username;
-        this.onlineForm.password.value = this.options.password;
 
         // Show panels
         this.toggleOnlinePanels(this.options.onlineSave);
@@ -859,12 +865,23 @@ class OptionsManager {
         this.onlineSuccess.appendChild(document.createTextNode(response.status));
     }
 
+    getPassword() {
+        let password = this.onlineForm.password.value;
+        this.onlineForm.password.value = "";
+        if (password == "" || password.length < 10) {
+            this.handleOnlineError("Empty or invalid password.");
+            return false;
+        }
+        return password;
+    }
+
     async login() {
         this.hideOnlineMessage();
 
         let onlineURL = this.onlineForm.onlineURL.value;
         let username = this.onlineForm.username.value;
-        let password = this.onlineForm.password.value;
+        let password = this.getPassword();
+        if (!password) return;
 
         // Send a request to the "login" route /user
         try {
@@ -882,7 +899,6 @@ class OptionsManager {
             if (response.status == 200) {
                 this.options.onlineURL = onlineURL;
                 this.options.username = username;
-                this.options.password = password;
                 this.options.isLoggedIn = true;
                 this.options.token = text.token;
                 this.handleOnlineSuccess(text);
@@ -901,9 +917,10 @@ class OptionsManager {
 
         let onlineURL = this.onlineForm.onlineURL.value;
         let body = {
-            username: this.onlineForm.username.value,
-            password: this.onlineForm.password.value
+            username: this.onlineForm.username.value
         };
+        body.password = this.getPassword();
+        if (!body.password) return;
 
         // Send a request to the /user route
         try {
@@ -920,7 +937,6 @@ class OptionsManager {
             if (response.status == 201) {
                 this.options.onlineURL = onlineURL;
                 this.options.username = body.username;
-                this.options.password = body.password;
                 this.options.isLoggedIn = true;
                 this.options.token = text.token;
                 this.handleOnlineSuccess(text);
@@ -939,7 +955,6 @@ class OptionsManager {
 
         // Set the options
         this.options.username = "";
-        this.options.password = "";
         this.options.isLoggedIn = false;
         this.options.token = "";
         // Delete the form too
@@ -1032,27 +1047,28 @@ class OptionsManager {
     async deleteOnline() {
         this.hideOnlineMessage();
 
+        let password = this.getPassword();
+        if (!password) return;
+
         // Send a simple DELETE request
         try {
             let response = await fetch(this.options.onlineURL + "user/self", {
                 method: "DELETE",
                 headers: {
                     "Accept": "application/json",
                     "X-Auth-Name": this.options.username,
-                    "X-Auth-Pass": this.options.password
+                    "X-Auth-Pass": password
                 }
             });
             let text = await response.json();
 
             if (response.status == 200) {
                 // Delete in the options
                 this.options.username = "";
-                this.options.password = "";
                 this.options.isLoggedIn = false;
                 this.options.token = "";
                 // Delete the form too
                 this.onlineForm.username.value = "";
-                this.onlineForm.password.value = "";
                 // Save
                 this.handleOnlineSuccess(text);
                 this.saveOptions();
@@ -1068,12 +1084,20 @@ class OptionsManager {
     async update() {
         this.hideOnlineMessage();
 
-        // Can't change the online URL or username while updating credentials
-        this.onlineForm.onlineURL.value = this.options.onlineURL;
-        this.onlineForm.username.value = this.options.username;
+        let password = this.getPassword();
+        if (!password) return;
+
+        let oldPassword = this.onlineForm.password.dataset.currentPassword;
+        if (oldPassword === undefined) {
+            this.onlineForm.password.dataset.currentPassword = password;
+            this.handleOnlineSuccess("Enter your new password and click Update Credentials again.");
+        } else {
+            delete this.onlineForm.password.dataset.currentPassword;
+        }
+
         // Only the password can be updated
         let body = {
-            password: this.onlineForm.password.value
+            password: password
         };
 
         try {
@@ -1083,14 +1107,13 @@ class OptionsManager {
                     "Accept": "application/json",
                     "Content-Type": "application/json; charset=utf-8",
                     "X-Auth-Name": this.options.username,
-                    "X-Auth-Pass": this.options.password
+                    "X-Auth-Pass": oldPassword
                 },
                 body: JSON.stringify(body)
             });
             let text = await response.json();
 
             if (response.status == 200) {
-                this.options.password = body.password;
                 this.options.token = text.token;
                 this.handleOnlineSuccess(text);
                 this.saveOptions();
@@ -1105,19 +1128,22 @@ class OptionsManager {
     async refreshToken() {
         this.hideOnlineMessage();
 
+        let password = this.getPassword();
+        if (!password) return;
+
         try {
             let response = await fetch(this.options.onlineURL + "user/self/token/refresh", {
                 method: "GET",
                 headers: {
                     "Accept": "application/json",
                     "X-Auth-Name": this.options.username,
-                    "X-Auth-Pass": this.options.password
+                    "X-Auth-Pass": password
                 }
             });
             let text = await response.json();
 
             if (response.status == 200) {
-                // Delete in the options
+                // Update in the options
                 this.options.token = text.token;
                 // Save
                 this.handleOnlineSuccess("Token updated.");
@@ -1133,13 +1159,16 @@ class OptionsManager {
     async receiveToken() {
         this.hideOnlineMessage();
 
+        let password = this.getPassword();
+        if (!password) return;
+
         try {
             let response = await fetch(this.options.onlineURL + "user/self/token", {
                 method: "GET",
                 headers: {
                     "Accept": "application/json",
                     "X-Auth-Name": this.options.username,
-                    "X-Auth-Pass": this.options.password
+                    "X-Auth-Pass": password
                 }
             });
             let text = await response.json();

scripts/sharedFunctions.js

@@ -168,11 +168,11 @@ async function updateLocalStorage(manga, options) {
             let response = await fetch(options.onlineURL + "user/self/title/" + manga.mangaDexId, {
                 method: "POST",
                 mode: "cors",
-                headers: new Headers({
+                headers: {
                     "Accept": "application/json",
                     "Content-Type": "application/json; charset=utf-8",
                     "X-Auth-Token": options.token
-                }),
+                },
                 body: JSON.stringify(body)
             });