From 4935944b6b88532252badac703ea925cb082c61f Mon Sep 17 00:00:00 2001
From: Guillaume Vincent <guillaume@oslab.fr>
Date: Tue, 3 Jan 2017 17:39:11 +0100
Subject: [PATCH] add fingerprint on login page

---
 src/components/MasterPassword.vue | 10 +++++++++-
 src/views/Login.vue               | 37 ++++++++++++++-----------------------
 2 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/src/components/MasterPassword.vue b/src/components/MasterPassword.vue
index abc5a1d..e2781be 100644
--- a/src/components/MasterPassword.vue
+++ b/src/components/MasterPassword.vue
@@ -11,6 +11,7 @@
                autocomplete="new-password"
                autocorrect="off"
                autocapitalize="off"
+               v-model="password"
                v-on:input="updatePassword($event.target.value)">
         <fingerprint v-bind:fingerprint="fingerprint" v-on:click.native="togglePasswordType($refs.password)">
         </fingerprint>
@@ -27,7 +28,14 @@
         props: ['value'],
         data(){
             return {
-                fingerprint: ''
+                fingerprint: '',
+                password: this.value
+            }
+        },
+        watch: {
+            'value': function (password) {
+                this.password = password;
+                this.updatePassword(password);
             }
         },
         methods: {
diff --git a/src/views/Login.vue b/src/views/Login.vue
index b1de77f..9d4d793 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -25,25 +25,16 @@
             </div>
         </div>
         <div class="form-group">
-            <div class="inner-addon left-addon">
-                <i class="fa fa-lock"></i>
-                <input id="password"
-                       name="password"
-                       type="password"
-                       class="form-control"
-                       required
-                       placeholder="LessPass password"
-                       v-model="password">
-                <small class="form-text text-muted passwordHelp text-xs-right">
-                    <span v-on:click.prevent="transformMasterPassword">click me to transform into a LessPass password</span>
-                    <span class="tag tag-default" v-on:click.prevent="showPasswordHelp=!showPasswordHelp">?</span>
-                </small>
-                <small class="form-text text-warning" v-if="showPasswordHelp">
-                    Your master password <b>should not be saved</b> on a database even encrypted.
-                    If you want to use your master password here, you can click the help to replace your master password
-                    with a LessPass generated password.
-                </small>
-            </div>
+            <master-password v-model="password"></master-password>
+            <small class="form-text text-muted passwordHelp">
+                <span v-on:click="transformMasterPassword">click me to transform into a LessPass password</span>
+                <span class="tag tag-default" v-on:click.prevent="showPasswordHelp=!showPasswordHelp">?</span>
+            </small>
+            <small class="form-text text-warning" v-if="showPasswordHelp">
+                Your master password <b>should not be saved</b> on a database even encrypted.
+                If you want to use your master password here, you can click the help to replace your master password
+                with a LessPass generated password.
+            </small>
         </div>
         <div class="form-group row">
             <div class="col-xs-7">
@@ -97,6 +88,7 @@
     import Storage from '../api/storage';
     import {mapGetters} from 'vuex';
     import VersionButton from '../components/VersionButton.vue';
+    import MasterPassword from '../components/MasterPassword.vue';
 
     const defaultErrors = {
         userNameAlreadyExist: false,
@@ -124,7 +116,8 @@
             };
         },
         components: {
-            VersionButton
+            VersionButton,
+            MasterPassword
         },
         computed: {
             ...mapGetters(['version']),
@@ -209,8 +202,6 @@
                 this.showError = true;
             },
             transformMasterPassword(){
-                const password = this.password;
-                this.password = '';
                 const defaultPasswordProfile = {
                     lowercase: true,
                     uppercase: true,
@@ -220,7 +211,7 @@
                     counter: 1,
                     version: this.version,
                 };
-                return LessPass.generatePassword('lesspass.com', this.email, password, defaultPasswordProfile).then(generatedPassword => {
+                return LessPass.generatePassword('lesspass.com', this.email, this.password, defaultPasswordProfile).then(generatedPassword => {
                     this.password = generatedPassword;
                 });
             }