closer to user login/register

nginx/public_html/App.js

@@ -1,5 +1,18 @@
 import Note from './Note.js';
-import {new_note_handler, search_term_change_handler, sorting_change_handler, load_notes, new_bin_handler, bin_name_change_handler, bin_name_editing_toggle_button_handler, bin_name_commit_handler} from './handlers/App.js';
+import {
+    new_note_handler, 
+    search_term_change_handler, 
+    sorting_change_handler, 
+    load_notes, 
+    new_bin_handler, 
+    bin_name_change_handler, 
+    bin_name_editing_toggle_button_handler, 
+    bin_name_commit_handler,
+    login_request_handler,
+    logout_request_handler,
+    username_change_handler,
+    password_change_handler
+    } from './handlers/App.js';
 
 
 function App(vnode_init){
@@ -20,6 +33,18 @@ function App(vnode_init){
               ])
             ]),
           m('.top-right', {key: 'top-right'}, [
+            (s.login.is_logged_in
+              ? m('.login-info', {key:'login-info'}, [
+                  m('.text', 'Logged in as '+s.login.user.username),
+                  m('button', {onclick: o(logout_request_handler)}, 'Logout')
+                  ])
+              : m('.login-form', {key:'login-form'}, [
+                  m('input.username', {key:'username', value: s.login.username, onchange: o(username_change_handler)}),
+                  m('input.password[type=password]', {key:'password', value: s.login.password, onchange: o(password_change_handler)}),
+                  m('button', {key:'login-button', onclick: o(login_request_handler)}, 'Login/Auto-Register')
+                  ])
+              ),
+            m('.buttons', {key:'buttons'}, [
               (s.is_editing_bin_name
                 ? m('input.bin-name-textbox', {key: 'bin-name-textbox', value: s.temp_bin_name, onchange: o(bin_name_change_handler)})
                 : m('.bin-name', {key: 'bin-name'}, s.bin.name)
@@ -30,6 +55,7 @@ function App(vnode_init){
                 : m('button', {key:'rename-bin-button', onclick: o(bin_name_editing_toggle_button_handler)}, 'Rename')
                 )
               ])
+            ])
           ]),
         m('.main', {key: 'main'}, [
           m('.notes', s.notes.map(note_state =>

nginx/public_html/handlers/App.js

@@ -50,7 +50,12 @@ const login_request_handler = function(state, dispatch, e){
       else{
         dispatch('login-failed');
         }
-      });
+      })
+    .catch(e=>{ dispatch('login-failed'); });
+  };
+const logout_request_handler = function(state, dispatch, e){
+  dispatch('logout-requested');
+  api.post('/logout', {session_id: state.login.session_id});
   };
 const bin_name_editing_toggle_button_handler = function(state, dispatch){
   dispatch('update-bin-name-editing', !state.is_editing_bin_name);
@@ -70,6 +75,7 @@ export {new_note_handler,
   username_change_handler, 
   password_change_handler, 
   login_request_handler,
+  logout_request_handler, 
   bin_name_editing_toggle_button_handler,
   bin_name_change_handler,
   bin_name_commit_handler

nginx/public_html/index.js

@@ -38,8 +38,9 @@ const reducer = handleActions({
     'update-username': (s, username) => { s.login.username=username; },
     'update-password': (s, password) => { s.login.password=password; },
     'login-requested': (s) => { s.login.showing=false; },
-    'login-succeeded': (s, user, session_id) => { s.login.showing=false; s.login.password=''; s.login.user=user; s.login.session_id=session_id; },
+    'login-succeeded': (s, user, session_id) => { s.login.is_logged_in=true; s.login.showing=false; s.login.password=''; s.login.user=user; s.login.session_id=session_id; },
     'login-failed': (s) => { s.login.showing=true; s.login.password=''; },
+    'logout-requested': (s) => { s.login.is_logged_in=false; s.login.showing=true; s.login.username=''; s.login.password=''; s.login.session_id=''; },
     'update-bin-name-editing': (s, is_editing) => { s.is_editing_bin_name=is_editing; },
     'update-bin-name': (s, name) => { s.temp_bin_name=name; },
     'commit-bin-name': (s) => { s.bin.name=s.temp_bin_name; s.is_editing_bin_name=false; }
@@ -56,11 +57,11 @@ const reducer = handleActions({
           showing: true,
           username: '', // value of textbox
           password: '', // value of textbox
-          logged_in: false,
-          user: {
+          is_logged_in: false,
+          user: null /*{
             id: '',
             username: ''
-            },
+            }*/,
           session_id: ''
           }
         //search_result_notes: []

node/package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "express": "^4.17.1",
+    "nanoid": "^3.1.22",
     "pg": "^8.5.1"
   }
 }

node/server.js

@@ -1,4 +1,5 @@
 const express = require('express');
+const {nanoid} = require('nanoid');
 
 const { Pool } = require('pg');
 const db = new Pool({
@@ -16,6 +17,7 @@ const port = 80;
 db.query("CREATE TABLE IF NOT EXISTS bin (id VARCHAR PRIMARY KEY);"
       + "CREATE TABLE IF NOT EXISTS note (id VARCHAR PRIMARY KEY, text TEXT, modified TIMESTAMPTZ);"
       + "CREATE TABLE IF NOT EXISTS bin_note (bin_id VARCHAR REFERENCES bin (id), note_id VARCHAR REFERENCES note (id), PRIMARY KEY (bin_id, note_id));"
+      + "CREATE TABLE IF NOT EXISTS user_ (id VARCHAR PRIMARY KEY, username TEXT, password TEXT);" // table 'user' is already taken
       );
 
 
@@ -81,6 +83,38 @@ router.post('/save', (req, res)=>{
   // {status: 'ok'}
   });
 
+const login_check_stmt = 
+          "SELECT id, password FROM user_ AS u"
+        +" WHERE u.username = $1";
+const register_stmt = 
+          "INSERT INTO user_ (id, username, password) VALUES ($1, $2, $3)";
+router.post('/login', (req, res)=>{
+  const {username, password_from_client} = req.body;
+  db.query(login_check_stmt, [username])
+    .then(result=>{
+      // if there is such a username:
+      if(result.rows.length > 0){
+        const row = result.rows[0];
+        const id=row.id, password_from_db=row.password;
+        // if the passwords match:
+        if(password_from_client === password_from_db){
+          res.json({success:true, user:{id, username}, session_id:nanoid()});
+          }
+        else{
+          res.json({success: false});
+          }
+        }
+      // if no such user exists:
+      else{
+        const id = nanoid();
+        db.query(register_stmt, [id, username, password_from_client])
+          .then(r=>{
+            res.json({success: true, user:{id, username}, session_id:nanoid()});
+            });
+        }
+      });
+  });
+
 app.use('/', express.json(), router);
 
 

node/yarn.lock

@@ -966,6 +966,11 @@ mute-stream@~0.0.4:
   resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.8.tgz#1630c42b2251ff81e2a283de96a5497ea92e5e0d"
   integrity sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==
 
+nanoid@^3.1.22:
+  version "3.1.22"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.22.tgz#b35f8fb7d151990a8aebd5aa5015c03cf726f844"
+  integrity sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==
+
 needle@2.4.0:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/needle/-/needle-2.4.0.tgz#6833e74975c444642590e15a750288c5f939b57c"