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,15 +33,28 @@ function App(vnode_init){
               ])
             ]),
           m('.top-right', {key: 'top-right'}, [
-            (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)
+            (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('button', {key: 'new-bin-button', onclick: o(new_bin_handler)}, 'New Bin...'),
-            (s.is_editing_bin_name
-              ? m('button', {key:'save-bin-name-button', onclick: o(bin_name_commit_handler)}, 'Save')
-              : m('button', {key:'rename-bin-button', onclick: o(bin_name_editing_toggle_button_handler)}, 'Rename')
-              )
+            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)
+                ),
+              m('button', {key: 'new-bin-button', onclick: o(new_bin_handler)}, 'New Bin...'),
+              (s.is_editing_bin_name
+                ? m('button', {key:'save-bin-name-button', onclick: o(bin_name_commit_handler)}, 'Save')
+                : m('button', {key:'rename-bin-button', onclick: o(bin_name_editing_toggle_button_handler)}, 'Rename')
+                )
+              ])
             ])
           ]),
         m('.main', {key: 'main'}, [

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: []