login form rules

backend/db.coffee

@@ -7,6 +7,14 @@ sqlite3 = (require 'sqlite3').verbose()
 # bruteforce countermeasure
 saltRounds = 13
 
+messages =
+  empty:    'Empty user name or password'
+  hash:     'Failed to process your data, try again later'
+  exists:   'User name is already taken'
+  noexists: 'Wrong user name or password'
+  password: 'Wrong user name or password'
+  db:       'Failed to access the database, try again later'
+
 class FFTCGDB
   constructor: (filename, truncate) ->
     @filename = filename
@@ -56,24 +64,33 @@ class FFTCGDB
       @db.close (err) ->
         if err
           logger.error "FAIL '#{err.message}'"
-          reject 'db'
+          reject null
         else
           logger.warn  "OK close '#{@filename}'"
-          resolve 'ok'
+          resolve null
+
+  validate: (login, password) ->
+    defined = (value) -> value? and value isnt ''
+
+    new Promise (resolve, reject) =>
+      if (defined login) and (defined password)
+        # both are defined
+        resolve null
+      else
+        # no user name or password given
+        logger.info "validate: FAIL empty '#{login}' or password"
+        reject null
 
   register: (login, password) ->
     new Promise (resolve, reject) =>
       # validate user input
-      if login == '' or password == ''
+      @validate login, password
-        # no user name or password given
+      .then =>
-        logger.info "reg: FAIL empty '#{login}' or password"
-        reject 'invalid'
-
         # hash password
         bcrypt.hash password, saltRounds, (err, hash) =>
           if err
             logger.warn "reg: FAIL hash for '#{login}'"
-          reject 'hash'
+            reject messages.hash
 
           else
             # try creating row in users table
@@ -82,7 +99,7 @@ class FFTCGDB
               stmt.finalize()
               if err
                 logger.warn "reg: FAIL db '#{err.code}' for '#{login}'"
-              reject 'existence' # user already exists
+                reject messages.exists # user already exists
 
               else
                 logger.info "reg: OK '#{login}'"
@@ -91,27 +108,33 @@ class FFTCGDB
                   user: @lastID
                   login: login
 
+      .catch ->
+        reject messages.empty
+
   login: (login, password) ->
     new Promise (resolve, reject) =>
+      # validate user input
+      @validate login, password
+      .then =>
         # get users table row
         stmt = @db.prepare 'SELECT user, login, pwdhash FROM users WHERE login = ?'
         stmt.get [login], (err, row) =>
           stmt.finalize()
           if err
             logger.warn "login: FAIL db '#{err.code}' for '#{login}'"
-          reject 'db'
+            reject messages.db
 
           else if not row
             # hash the password for timing attack reasons
             bcrypt.hash password, saltRounds, (err, hash) ->
               logger.debug "login: FAIL nonexistent '#{login}'"
-            reject 'existence' # user doesnt exist
+              reject messages.noexists # user doesnt exist
 
           else
             bcrypt.compare password, row.pwdhash, (err, res) ->
               if err
                 logger.warn "login: FAIL hash for '#{login}'"
-              reject 'hash'
+                reject messages.hash
 
               if res == true
                 logger.debug "login: OK '#{row.login}'"
@@ -122,8 +145,10 @@ class FFTCGDB
 
               else
                 logger.debug "login: FAIL password for '#{login}'"
-              # login failed
+                reject messages.password # login failed
-              reject 'login'
+
+      .catch ->
+        reject messages.empty
 
   addDeck: (user, deckCards) ->
     new Promise (resolve, reject) =>
@@ -133,7 +158,7 @@ class FFTCGDB
         stmt.finalize()
         if err
           logger.warn "addDeck: FAIL db '#{err.code}' for '#{user}'"
-          reject 'db'
+          reject messages.db
 
         else
           logger.debug "addDeck: OK '#{@lastID}'"
@@ -146,7 +171,7 @@ class FFTCGDB
         stmt.finalize()
         if err
           logger.warn "modDeck: FAIL db '#{err.code}' for '#{deckID}'"
-          reject 'db'
+          reject messages.db
         else
           logger.debug "modDeck: OK '#{deckID}'"
           resolve deckID
@@ -158,7 +183,7 @@ class FFTCGDB
         stmt.finalize()
         if err
           logger.warn "getDeck: FAIL db '#{err.code}' for '#{deckID}'"
-          reject 'db'
+          reject messages.db
         else
           logger.debug "getDeck: OK '#{deckID}'"
           resolve (id: row.deck, content: JSON.parse row.json for row, i in rows)
@@ -170,7 +195,7 @@ class FFTCGDB
         stmt.finalize()
         if err
           logger.warn "delDeck: FAIL db '#{err.code}' for '#{deckID}'"
-          reject 'db'
+          reject messages.db
         else
           logger.debug "delDeck: OK '#{deckID}'"
           resolve deckID

backend/routes/user/login.coffee

@@ -24,8 +24,8 @@ module.exports =
           # login successful: start new session
           logger.info "OK '#{request.body.login}'"
           session.start user
-          .then (session_id) ->
+          .then (cookie_data) ->
-            resolve session_id
+            resolve cookie_data
 
         .catch (err) ->
           # login failed
@@ -34,8 +34,8 @@ module.exports =
             success: false
             message: err
 
-    .then (session_id) ->
+    .then (cookie_data) ->
       # login or resume successful
       reply.send
         success: true
-        message: session_id
+        message: JSON.stringify cookie_data

backend/routes/user/logout.coffee

@@ -2,8 +2,6 @@ logger = (require 'logging').default 'logout'
 
 # session storage (volatile data)
 session = (require '../../session')
-# fftcg.db (persistent data)
-fftcgdb = (require '../../db')
 
 module.exports =
   url: '/user/logout'

backend/session.coffee

@@ -3,12 +3,12 @@ redis = (require 'redis')
 crypto = (require 'crypto')
 logger = (require 'logging').default 'session'
 
-# expiry times in seconds
+# expiry times in days
 EXPIRY =
   # games expire 1 week after creation
-  game:    1 * 60 * 60 * 24 * 7
+  game:    7
   # logins expire 1 month after last action
-  login:   1 * 60 * 60 * 24 * 30
+  login:   30
 
 
 class FFTCGSESSION
@@ -29,9 +29,13 @@ class FFTCGSESSION
       logger.debug 'digest', digest
 
       # push (hash, data) into DB for the configured timespan
-      @db.setex digest, EXPIRY.login, (JSON.stringify data), (err) ->
+      @db.setex digest, EXPIRY.login * 86400, (JSON.stringify data), (err) ->
         logger.info "OK '#{digest}' created"
-        resolve digest
+        # return cookie data
+        resolve
+          value:  digest
+          properties:
+            expires:  EXPIRY.login
 
   destroy: (digest) ->
     new Promise (resolve, reject) =>
@@ -46,7 +50,7 @@ class FFTCGSESSION
   check: (digest) ->
     new Promise (resolve, reject) =>
       # refresh expiry timer on digest
-      @db.expire digest, EXPIRY.login, (err, res) =>
+      @db.expire digest, EXPIRY.login * 86400, (err, res) =>
         if res == 0
           reject null
 

frontend/src/components/Header.vue

@@ -0,0 +1,16 @@
+<template>
+  <v-flex mb-4>
+    <h1 class="display-2 font-weight-bold mb-3">
+      Hello World!
+    </h1>
+    <p class="subheading font-weight-regular">
+      App under development, please don't submit any valuable data!
+    </p>
+  </v-flex>
+</template>
+
+<script>
+export default {
+  name: "Header"
+}
+</script>

frontend/src/components/forms/FormDialog.vue

@@ -5,6 +5,13 @@
     </v-btn>
 
     <v-card>
+      <v-snackbar v-model="snackbar.visible" :timeout="6000" :color="snackbar.color" absolute top>
+        {{ snackbar.text }}
+        <v-btn @click.native="snackbar.visible = false" fab flat icon>
+          <v-icon>close</v-icon>
+        </v-btn>
+      </v-snackbar>
+
       <v-form
         ref="form"
         v-model="valid"
@@ -23,7 +30,7 @@
           </v-btn>
 
           <v-btn color="error" @click.native="dialog = false">
-            Cancel
+            Close
           </v-btn>
         </v-card-actions>
       </v-form>
@@ -36,7 +43,12 @@ export default {
   name: 'FormDialog',
   data: () => ({
     dialog: false,
-    valid: true
+    valid: true,
+    snackbar: {
+      visible: false,
+      color: '',
+      text: ''
+    }
   }),
 
   props: {
@@ -46,8 +58,20 @@ export default {
   methods: {
     validate() {
       if (this.$refs.form.validate()) {
-        this.$emit('confirm')
+        this.$emit('validated')
       }
+    },
+
+    showSnackbar(text, color) {
+      if (text == '') return
+
+      this.snackbar.visible = false
+
+      window.setTimeout(() => {
+        this.snackbar.text = text
+        this.snackbar.color = color
+        this.snackbar.visible = true
+      }, 100)
     }
   },
 

frontend/src/components/forms/Login.vue

@@ -1,5 +1,5 @@
 <template>
-  <FormDialog buttonText="Login" @confirm="doLogin">
+  <FormDialog ref="main" buttonText="Login" @validated="doLogin">
     <v-card-title class="headline">
       Log In
     </v-card-title>
@@ -8,12 +8,14 @@
       <v-text-field
         ref="autofocus"
         v-model="login"
+        :rules="loginRules"
         label="User name"
         required
       ></v-text-field>
 
       <v-text-field
         v-model="password"
+        :rules="passwordRules"
         :append-icon="showPassword ? 'visibility' : 'visibility_off'"
         @click:append="showPassword = !showPassword"
         :type="showPassword ? 'text' : 'password'"
@@ -38,8 +40,11 @@ export default {
 
   data: () => ({
     login: '',
+    loginRules: [v => !!v || 'Please enter user name'],
+
     password: '',
-    showPassword: false
+    showPassword: false,
+    passwordRules: [v => !!v || 'Please enter password'],
   }),
 
   methods: {
@@ -51,12 +56,14 @@ export default {
           password: this.password
         })
         .then(response => {
-          // this.$refs.form.reset()
           console.log('login', response.data)
           if (response.data.success) {
-            Cookies.set('session', response.data.message, { expires: 30 })
+            let cookie_data = JSON.parse(response.data.message)
-            console.log('cookie', Cookies.get())
+            Cookies.set('session', cookie_data.value, cookie_data.properties)
+            this.$refs.main.showSnackbar("Login successful!", 'success')
             this.$router.push('about')
+          } else {
+            this.$refs.main.showSnackbar(response.data.message, 'error')
           }
         })
     }

frontend/src/components/forms/Register.vue

@@ -1,5 +1,5 @@
 <template>
-  <FormDialog buttonText="Register" @confirm="doRegister">
+  <FormDialog ref="main" buttonText="Register" @validated="doRegister">
     <v-card-title class="headline">
       Register
     </v-card-title>
@@ -75,8 +75,12 @@ export default {
           password: this.password
         })
         .then(response => {
-          // this.$refs.form.reset()
           console.log('register', response.data)
+          if (response.data.success) {
+            this.$refs.main.showSnackbar("Registration successful!", 'success')
+          } else {
+            this.$refs.main.showSnackbar(response.data.message, 'error')
+          }
         })
     }
   }

frontend/src/views/About.vue

@@ -1,11 +1,7 @@
 <template>
   <v-container>
-    <v-flex mb-4>
+    <Header />
-      <h1 class="display-2 font-weight-bold mb-3">Hello World!</h1>
+
-      <p class="subheading font-weight-regular">
-        App under development, please don't submit any valuable data!
-      </p>
-    </v-flex>
     <p>user session: {{ sessionID }}</p>
     <v-btn @click.native="logout">Logout</v-btn>
   </v-container>
@@ -15,9 +11,15 @@
 import * as Cookies from 'js-cookie'
 import axios from '@/plugins/axios'
 
+import Header from '@/components/Header.vue'
+
 export default {
   name: 'About',
 
+  components: {
+    Header
+  },
+
   data: () => ({
     sessionID: ''
   }),

frontend/src/views/Home.vue

@@ -1,13 +1,6 @@
 <template>
   <v-container>
-    <v-flex mb-4>
+    <Header />
-      <h1 class="display-2 font-weight-bold mb-3">
-        Hello World!
-      </h1>
-      <p class="subheading font-weight-regular">
-        App under development, please don't submit any valuable data!
-      </p>
-    </v-flex>
 
     <LoginForm />
     <RegisterForm />
@@ -18,6 +11,7 @@
 import * as Cookies from 'js-cookie'
 import axios from '@/plugins/axios'
 
+import Header from '@/components/Header.vue'
 import LoginForm from '@/components/forms/Login.vue'
 import RegisterForm from '@/components/forms/Register.vue'
 
@@ -31,6 +25,7 @@ export default {
   },
 
   components: {
+    Header,
     LoginForm,
     RegisterForm
   },