Merge branch 'master' into Fix-408

Author: championpaddler

.github/ISSUE_TEMPLATE.md

@@ -1,4 +1,4 @@
-**I'm submitting a ...**  (check one with "x")
+**I'm submitting a ...**  <!-- check one with "x" -->
 - [ ] bug report
 - [ ] feature request
 - [ ] support request => Please do not submit support requests here, instead ask your query in our [Gitter channel](https://gitter.im/fossasia/susi_server)
@@ -25,11 +25,14 @@ insert any relevant code here else remove this section
 
 <!-- Add information about the system you're facing this bug on. If you think this is irrelevant or if it's a UI bug or a feature request, please remove this section -->
 
+**Screenshots of the issue:**
+<!-- Wherever applicable attach a screenshot of the issue. -->
+
 ```
 Your operating system
 ```
 
 **Would you like to work on the issue?**
 
-Please let us know if you can work on it or the issue should be assigned to someone else.
+<!-- Please let us know if you can work on it or the issue should be assigned to someone else. -->
 ```

src/css/login.css

@@ -69,10 +69,18 @@ label {
     border-radius: 0.25rem;
 }
 
+.input-group>#password {
+    padding-right: 3rem;
+}
+
 #passwordlim{
     color: white;
 }
 
+#passwordmatch{
+  color: white;
+}
+
 #loggedin{
     margin-top: 15px;
 }
@@ -99,3 +107,6 @@ label {
 button{
     cursor: pointer;
 }
+.pointer {
+    cursor: pointer;
+}

src/js/login.js

@@ -14,12 +14,12 @@ var defaultThemeValue = "";
 var password = document.getElementById("password");
 var pass = document.getElementById("pass");
 var cPass = document.getElementById("cPass");
-var cemail = document.getElementById("cemail");
 var cpassword = document.getElementById("cpassword");
 var passwordlim = document.getElementById("passwordlim");
 var newPassword = document.getElementById("newPassword");
 var toggle = document.getElementById("toggle");
 var settings=document.getElementById("settings");
+var username = document.getElementById("username");
 
 chrome.storage.sync.get("darktheme", (obj) => {
     if (obj.darktheme === true) {
@@ -40,11 +40,11 @@ toggle.addEventListener("click", ()=>{
 });
 
 pass.addEventListener("click", ()=>{
-$("#cPass").toggle();
+    pass.innerHTML = ($("#cPass").toggle().is(":visible"))?("Click here to hide change password form"):("Click here to change password");
 });
 
 newPassword.addEventListener("keyup", ()=>{
-    if(newPassword.value.length<6){
+    if(newPassword.value.length<6 || newPassword.value.length>64 ){
         passwordlim.removeAttribute("hidden");
         document.getElementById("csubmit").setAttribute("disabled", "true");
     } else {
@@ -53,14 +53,22 @@ newPassword.addEventListener("keyup", ()=>{
     }
 });
 
+confirmPassword.addEventListener("keyup", ()=>{
+    if(confirmPassword.value !== newPassword.value){
+        passwordmatch.removeAttribute("hidden");
+    } else {
+        passwordmatch.setAttribute("hidden", "true");
+    }
+});
+
 cPass.addEventListener("submit", (e)=>{
 	e.stopPropagation();
-		var loginEP = BASE_URL+"/aaa/changepassword.json?"+"changepassword="+ cemail.value + "&password="+ cpassword.value + "&newpassword=" + newPassword.value + "&access_token=" + accessToken ;
+		var loginEP = BASE_URL+"/aaa/changepassword.json?"+"changepassword="+ username.value + "&password="+ cpassword.value + "&newpassword=" + newPassword.value + "&access_token=" + accessToken ;
 		  $.ajax({
 		    	url:loginEP,
 		        dataType: "jsonp",
 				jsonp: "callback",
-				crossDomain: true,		        
+				crossDomain: true,
 		        success: (response) => {
 					alert(response.message);
 					cPass.style.display = "none";
@@ -179,10 +187,16 @@ loginForm.addEventListener("submit", (event) => {
     event.preventDefault();
     var email = document.getElementById("username").value;
     var password = document.getElementById("password").value;
+    var isEmailValid = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(email);
     if (!email) {
         showStatus("Email field cannot be empty",true);
         return;
-    } else if (!password) {
+    }
+    else if(!isEmailValid){
+        showStatus("Please enter a valid email", true);
+        return;
+    }
+    else if (!password) {
         showStatus("Password field cannot be empty",true);
         return;
     }

src/js/options.js

@@ -124,7 +124,7 @@ restore.addEventListener("click", ()=>{
 localimage.addEventListener("change",()=>{
     var tmppath = URL.createObjectURL(localimage.files[0]);
     localStorage.setItem("theValue",tmppath);
-    displayNotification("success", " Image Updates", 1000);
+    displayNotification("success", " Image Updated", 1000);
 });
 
 themeColorPicker.on("change", function(color){

src/js/signup.js

@@ -22,7 +22,7 @@ let showsignupBlock = (show) => {
 };
 
 password.addEventListener("keyup", ()=>{
-    if(password.value.length<6){
+    if(password.value.length<6 || password.value.length>64){
 		passwordlim.removeAttribute("hidden");
 		document.getElementById("signupbutton").setAttribute("disabled", "true");
     } else {

src/login.html

@@ -14,14 +14,14 @@
             <div class="col-md-8">
                 <div class="card">
                     <img src="images/susi-logo.png" class="img-fluid signin-image">
-                    
+
                     <button class="btn btn-warning"   id="settings">SUSI Settings</button>
                     <br/>
                     <div class="alert alert-danger error col-md-10" id="error">
 
                        Error
                    </div>
-                   
+
 
 
                     <div class="nologgedin" id="nologgedin">
@@ -36,7 +36,7 @@
                                 <div class="input-group">
                                 <input type="password" class="form-control" id="password" placeholder="Password">
                                     <span class="field-icon">
-                                        <i class="fa fa-eye" id="toggle"></i>
+                                        <i class="fa fa-eye-slash pointer" id="toggle"></i>
                                     </span>
                                 </div>
                             </div>
@@ -51,26 +51,29 @@
                             </p>
                         </form>
                     </div>
-                    
+
                     <div class="loggedin" id="loggedin">
                         <button class="btn btn-danger" name="Logout" id="logout">Logout</button>
                         <br/>
-                       
+
                         <div style="text-align: center">
                             <a style="color:#fff;"  id="pass" href="#" >Click here to change password</a>
                         </div>
                     </div>
                     <form id="cPass" style="display:none;">
-                        <div class="form-group">
-                            <input type="email" class="form-control fmargin" id="cemail" placeholder="Email">
-                        </div>
                         <div class="form-group">
                             <input type="password" class="form-control fmargin" id="cpassword" placeholder="Password">
                         </div>
                         <div class="form-group">
                             <input type="password" class="form-control fmargin" id="newPassword" placeholder="New Password">
                             <div style="text-align: center">
-                                <small hidden id="passwordlim">Minimum 6 characters required</small>
+                                <small hidden id="passwordlim">Allowed password length is 6 to 64 characters</small>
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <input type="password" class="form-control fmargin" id="confirmPassword" placeholder="Confirm New Password">
+                            <div style="text-align: center">
+                                <small hidden id="passwordmatch">Password does not match.</small>
                             </div>
                         </div>
                         <div style="text-align: center">

src/options.html

@@ -73,7 +73,7 @@ <h3>Settings Page</h3>
                                     <span>Upload Local Image</span>
                                 </div>
                                 <div class="col-sm-7">
-                                    <input id="localupload"  type="file"  placeholder="Background URL" id="backUrl">
+                                    <input id="localupload"  type="file"  placeholder="Background URL" id="backUrl" accept="image/*">
                                 </div>
                             </div>
                         </form>

src/popup.html

@@ -31,14 +31,11 @@
         <div style="z-index: 2;" class="dropdown">
             <div id="dropdown"><img src="images/dots.png" style="width: auto; height: 20px;"></div>
             <div class="dropdown-content">
-                <a href="https://chat.susi.ai/" target="_blank"><li>Chat<img src="images/chat.svg"></li></a>
-                <a href="https://skills.susi.ai/" target="_blank"><li>Skills<img src="images/skills.svg"></li></a>
+                <a href="https://chat.susi.ai/overview" target="_blank"><li>About<img src="images/about.svg" ></li></a>
                 <a href="" id="clear"><li>Clear Chat<img src="images/clearAll.svg" ></li></a>
                 <a id="export"><li>Export<img src="images/export.svg"></li></a>
                 <a href="options.html" target="_blank"><li id="settings-tab">Settings<img src="images/settings.svg" ></li></a>
-                <a href="https://chat.susi.ai/overview" target="_blank"><li>About<img src="images/about.svg" ></li></a>
                 <a href="login.html" target="_blank"><li id="log">Login<img src="images/login.svg" > </li></a>
-                <a href="options.html" target="_blank"><li>Settings <img src="images/settings-icon.svg"></li></a>
             </div>
         </div>
     </header>

src/recover.html

@@ -34,6 +34,9 @@
                         <p style="text-align: center;color:#fff;">
                             There is nothing here!! Recovery link is sent to your email.
                         </p>
+                        <p style="text-align: center;">
+                            <a href="login.html" class="btn btn-success" style="color: #fff; ">Login</a>
+                        </p>
                         <br />
                     </div>
                 </div>

src/script.js

@@ -554,7 +554,7 @@ let composeMyMessage = (text, t= getCurrentTime()) => {
     });
 };
 
-let restoreMessages = (storageItems = []) => {
+let restoreMessages = (storageItems) => {
     if (!storageItems && !accessToken) {
         var htmlMsg = "<div class='empty-history'> Start by saying \"Hi\"</div>";
         $(htmlMsg).appendTo(messages);