From e52fbf061dde4639cb5ba81cdc73235e0cd46b7b Mon Sep 17 00:00:00 2001
From: Paul de Vries <pablo@blacktower.nl>
Date: Mon, 5 Dec 2016 13:56:19 +0100
Subject: [PATCH 1/2] Add support to save credentials to a password manager
 #1607

---
 src/octoprint/server/util/flask.py             |  1 +
 .../static/js/app/bindings/valuewithinit.js    | 11 +++++++++++
 .../static/js/app/viewmodels/loginstate.js     | 15 +++++++--------
 src/octoprint/templates/navbar/login.jinja2    | 18 ++++++++++--------
 4 files changed, 29 insertions(+), 16 deletions(-)
 create mode 100644 src/octoprint/static/js/app/bindings/valuewithinit.js

diff --git a/src/octoprint/server/util/flask.py b/src/octoprint/server/util/flask.py
index 36a1fd5e..56590bf8 100644
--- a/src/octoprint/server/util/flask.py
+++ b/src/octoprint/server/util/flask.py
@@ -1297,6 +1297,7 @@ def collect_core_assets(enable_gcodeviewer=True, preferred_stylesheet="css"):
 		'js/app/bindings/slimscrolledforeach.js',
 		'js/app/bindings/toggle.js',
 		'js/app/bindings/togglecontent.js',
+		'js/app/bindings/valuewithinit.js',
 		'js/app/viewmodels/appearance.js',
 		'js/app/viewmodels/connection.js',
 		'js/app/viewmodels/control.js',
diff --git a/src/octoprint/static/js/app/bindings/valuewithinit.js b/src/octoprint/static/js/app/bindings/valuewithinit.js
new file mode 100644
index 00000000..dce55826
--- /dev/null
+++ b/src/octoprint/static/js/app/bindings/valuewithinit.js
@@ -0,0 +1,11 @@
+ko.bindingHandlers.valueWithInit = {
+    init: function(element, valueAccessor, allBindingsAccessor, context) {
+        var observable = valueAccessor();
+        var value = element.value;
+
+        observable(value);
+
+        ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor, context);
+    },
+    update: ko.bindingHandlers.value.update
+};
\ No newline at end of file
diff --git a/src/octoprint/static/js/app/viewmodels/loginstate.js b/src/octoprint/static/js/app/viewmodels/loginstate.js
index 7a72a0cd..05766fd0 100644
--- a/src/octoprint/static/js/app/viewmodels/loginstate.js
+++ b/src/octoprint/static/js/app/viewmodels/loginstate.js
@@ -76,6 +76,10 @@ $(function() {
                     self.loginUser("");
                     self.loginPass("");
                     self.loginRemember(false);
+
+                    if (history && history.replaceState) {
+                        history.replaceState({success: true}, document.title, window.location.pathname);
+                    }
                 })
                 .fail(function() {
                     new PNotify({title: gettext("Login failed"), text: gettext("User unknown or wrong password"), type: "error"});
@@ -95,14 +99,9 @@ $(function() {
                 });
         };
 
-        self.onLoginUserKeyup = function(data, event) {
-            if (event.keyCode == 13) {
-                self.elementPasswordInput.focus();
-            }
-        };
-
-        self.onLoginPassKeyup = function(data, event) {
-            if (event.keyCode == 13) {
+        self.prepareLogin = function(data, event, extra) {
+            if (event.type === "submit" || (event.type === "keyup" && event.keyCode == 13)) {
+                event.preventDefault();
                 self.login();
             }
         };
diff --git a/src/octoprint/templates/navbar/login.jinja2 b/src/octoprint/templates/navbar/login.jinja2
index f712f82d..fa70fa17 100644
--- a/src/octoprint/templates/navbar/login.jinja2
+++ b/src/octoprint/templates/navbar/login.jinja2
@@ -3,14 +3,16 @@
     <b class="caret"></b>
 </a>
 <div id="login_dropdown_loggedout" style="padding: 15px" class="dropdown-menu" data-bind="css: {hide: loginState.loggedIn(), 'dropdown-menu': !loginState.loggedIn()}">
-    <label for="login_user">{{ _('Username') }}</label>
-    <input type="text" id="login_user" data-bind="value: loginState.loginUser, event: {'keyup': loginState.onLoginUserKeyup}" placeholder="{{ _('Username') }}" autocapitalize="none">
-    <label for="login_pass">{{ _('Password') }}</label>
-    <input type="password" id="login_pass" data-bind="value: loginState.loginPass, event: {'keyup': loginState.onLoginPassKeyup}" placeholder="{{ _('Password') }}">
-    <label class="checkbox">
-        <input type="checkbox" id="login_remember" data-bind="checked: loginState.loginRemember"> {{ _('Remember me') }}
-    </label>
-    <button class="btn btn-block btn-primary" id="login_button" data-bind="click: function() { loginState.login(); }">{{ _('Login') }}</button>
+    <form id="loginForm" data-bind="event: {'submit': loginState.prepareLogin }" autocomplete="on">
+        <label for="login_user">{{ _('Username') }}</label>
+        <input type="text" id="login_user" name="username" data-bind="valueWithInit: loginState.loginUser, event: {'keyup': loginState.prepareLogin }" placeholder="{{ _('Username') }}" autocapitalize="none" autocomplete="on">
+        <label for="login_pass">{{ _('Password') }}</label>
+        <input type="password" id="login_pass" name="password" data-bind="valueWithInit: loginState.loginPass, event: {'keyup': loginState.prepareLogin }" placeholder="{{ _('Password') }}" autocomplete="on">
+        <label class="checkbox">
+            <input type="checkbox" id="login_remember" data-bind="checked: loginState.loginRemember"> {{ _('Remember me') }}
+        </label>
+        <button type="submit" class="btn btn-block btn-primary" id="login_button">{{ _('Login') }}</button>
+    </form>
 </div>
 <ul id="login_dropdown_loggedin" class="hide" data-bind="css: {hide: !loginState.loggedIn(), 'dropdown-menu': loginState.loggedIn()}">
     <li><a href="#" id="usersettings_button" data-bind="click: function() { usersettings.show(); }">{{ _('User Settings') }}</a></li>

From 6d158cb0d02e52921f078dcff26f792dc9660a92 Mon Sep 17 00:00:00 2001
From: Paul de Vries <pablo@blacktower.nl>
Date: Mon, 5 Dec 2016 15:34:48 +0100
Subject: [PATCH 2/2] Fix small bug on unreliable submit event + seperate
 onKeyUp event

---
 src/octoprint/static/js/app/viewmodels/loginstate.js | 12 +++++++++---
 src/octoprint/templates/navbar/login.jinja2          |  4 ++--
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/octoprint/static/js/app/viewmodels/loginstate.js b/src/octoprint/static/js/app/viewmodels/loginstate.js
index 05766fd0..5b12fa77 100644
--- a/src/octoprint/static/js/app/viewmodels/loginstate.js
+++ b/src/octoprint/static/js/app/viewmodels/loginstate.js
@@ -99,13 +99,19 @@ $(function() {
                 });
         };
 
-        self.prepareLogin = function(data, event, extra) {
-            if (event.type === "submit" || (event.type === "keyup" && event.keyCode == 13)) {
+        self.prepareLogin = function(data, event) {
+            if(event && event.preventDefault) {
                 event.preventDefault();
-                self.login();
             }
+            self.login();
         };
 
+        self.onKeyUp = function(data, event) {
+            if (event && event.keyCode == 13) {
+                $('#loginForm').submit();
+            }
+        }
+
         self.onAllBound = function(allViewModels) {
             self.allViewModels = allViewModels;
         };
diff --git a/src/octoprint/templates/navbar/login.jinja2 b/src/octoprint/templates/navbar/login.jinja2
index fa70fa17..a071cf9c 100644
--- a/src/octoprint/templates/navbar/login.jinja2
+++ b/src/octoprint/templates/navbar/login.jinja2
@@ -5,9 +5,9 @@
 <div id="login_dropdown_loggedout" style="padding: 15px" class="dropdown-menu" data-bind="css: {hide: loginState.loggedIn(), 'dropdown-menu': !loginState.loggedIn()}">
     <form id="loginForm" data-bind="event: {'submit': loginState.prepareLogin }" autocomplete="on">
         <label for="login_user">{{ _('Username') }}</label>
-        <input type="text" id="login_user" name="username" data-bind="valueWithInit: loginState.loginUser, event: {'keyup': loginState.prepareLogin }" placeholder="{{ _('Username') }}" autocapitalize="none" autocomplete="on">
+        <input type="text" id="login_user" name="username" data-bind="valueWithInit: loginState.loginUser, event: {'keyup': loginState.onKeyUp }" placeholder="{{ _('Username') }}" autocapitalize="none" autocomplete="on">
         <label for="login_pass">{{ _('Password') }}</label>
-        <input type="password" id="login_pass" name="password" data-bind="valueWithInit: loginState.loginPass, event: {'keyup': loginState.prepareLogin }" placeholder="{{ _('Password') }}" autocomplete="on">
+        <input type="password" id="login_pass" name="password" data-bind="valueWithInit: loginState.loginPass, event: {'keyup': loginState.onKeyUp }" placeholder="{{ _('Password') }}" autocomplete="on">
         <label class="checkbox">
             <input type="checkbox" id="login_remember" data-bind="checked: loginState.loginRemember"> {{ _('Remember me') }}
         </label>