add login and register logic

src/background/createWindow.ts

@@ -34,9 +34,9 @@ export const createWindow = async (options: WindowSettings): Promise<BrowserWind
         win.loadURL("app://./index.html");
       }
 
-        win.webContents.on('did-finish-load', () => {
-            resolve(win);
-        });
+      win.webContents.on('did-finish-load', () => {
+          resolve(win);
+      });
     })
 }
 

src/background/initApp.ts

@@ -4,14 +4,14 @@ import { app } from "electron";
 import { main } from './run';
 import { windowEmitter } from './windowEmitter';
 
+let winActive: boolean;
+
+windowEmitter.on('window-active', (state: boolean) => {
+    winActive =  state;
+});
+
 export function initApp(dev: boolean): void {
 
-    let winActive: boolean;
-
-    windowEmitter.on('window-active', (state: boolean) => {
-        winActive =  state;
-    });
-
     app.on("ready", () => {
       main();
     });

src/background/run.ts

@@ -1,5 +1,5 @@
 import { createWindow } from './createWindow';
-import { ipcMain  } from "electron";
+import { ipcMain, BrowserWindow  } from "electron";
 import { initSession, sendMessage } from './session';
 import { windowEmitter } from './windowEmitter';
 const portAudio = require('naudiodon');
@@ -10,6 +10,14 @@ interface ipcRendererPayload {
 }
 
 let activeSession = false;
+let win: BrowserWindow | null;
+
+windowEmitter.on('ipc-renderer', (payload: ipcRendererPayload) => {
+    if (win)
+    win.webContents.send(payload.endpoint, {
+      message: payload.message
+    });
+});
 
 /*
  * The main function will be run after electron app is ready.
@@ -17,13 +25,10 @@ let activeSession = false;
 export async function main() {
 
     // create main window.
-    const win = await createWindow({ width: 350, height: 525, resizable: false });
+    if (!win) {
+        win = await createWindow({ width: 350, height: 525, resizable: false });
+    }
 
-    windowEmitter.on('ipc-renderer', (payload: ipcRendererPayload) => {
-        win.webContents.send(payload.endpoint, {
-          message: payload.message
-        });
-    });
 
     // Instantiate socket session with crimata-platorm.
     if (!activeSession) {
@@ -41,8 +46,9 @@ export async function main() {
     }
 
     const windowDismount = (): void => {
-         windowEmitter.emit('window-active', false);
-         ipcMain.removeAllListeners('send-message');
+        win = null;
+        windowEmitter.emit('window-active', false);
+        ipcMain.removeAllListeners('send-message');
     }
 
     // Handle window mount and dismount.

src/background/session.ts

@@ -2,6 +2,12 @@ import WebSocket from 'ws';
 import { windowEmitter } from './windowEmitter';
 import { ipcMain  } from "electron";
 
+const EventEmitter = require('events');
+
+class SocketEmitter extends EventEmitter {}
+
+export const socketEmitter = new SocketEmitter();
+
 interface RenderMessage  {
   type: 'render';
   content: string;
@@ -27,6 +33,7 @@ let auth = false;
 const receiveMessage = (message: string): void => {
 
     while(!auth) {
+        console.log('window emitter @ session.ts recieve')
         windowEmitter.emit('auth-res', message);
         return;
     }
@@ -43,6 +50,7 @@ const receiveMessage = (message: string): void => {
 const authUser = async (event: any, payload: string | UserCreds | null): Promise<string> => {
     return new Promise((resolve, reject) => {
         console.log('authenticating...');
+        console.log('window emitter @ session.ts auth')
         windowEmitter.on('auth-res', (res: string) => {
             if (res === 'locked') {
                 reject(res);
@@ -74,20 +82,20 @@ export const initSession = () => {
     socket = new WebSocket(`${ip}:${port}`);
     socket.binaryType = 'arraybuffer';
 
+    // handle renderer auth-token event
+    ipcMain.removeHandler('auth-user'); // avoid setting duplicate handlers
+    ipcMain.handle('auth-user', authUser);
+
     socket.on('open', () => {
         console.log('Success! Connected to Crimata.');
 
-        // handle renderer auth-token event
-        ipcMain.removeHandler('auth-user'); // avoid setting duplicate handlers
-        ipcMain.handle('auth-user', authUser);
-
         // fetch token from renderer
         windowEmitter.emit('ipc-renderer', {
             endpoint: 'fetch-token',
             message: null
         });
-
         success = true;
+
     });
 
     socket.on('error', (e) => {

src/views/login.vue

@@ -49,10 +49,14 @@ export default defineComponent({
           email: email.value,
           password: password.value
         };
-        await invoke(payload);
-        console.log('testing incoke', data.value)
-        setToken(data.value, rememberMe.value);
-        router.push({ name: "home" });
+        try {
+            await invoke(payload);
+            console.log('testing incoke', data.value)
+            setToken(data.value, rememberMe.value);
+            router.push({ name: "home" });
+        } catch(e){
+            console.log('Error loging in.')
+        }
     };
 
     return {

src/views/register.vue

@@ -1,19 +1,28 @@
 <template>
   <div id="login">
     <!-- login title -->
-    <div id="loginTitle">Login</div>
+    <div id="loginTitle">Register</div>
 
     <!-- username and password forms -->
     <div id="loginBox">
       <!-- username -->
-      <input class="input" type="text" v-model="login.username" placeholder="username" />
+      <input class="input" type="text" v-model="email" placeholder="email" />
 
       <!-- password -->
-      <input class="input" type="password" v-model="login.password" placeholder="Password" />
+      <input class="input" type="password" v-model="password" placeholder="Password" />
+
+      <!-- firstName -->
+      <input class="input" type="text" v-model="firstName" placeholder="First name" />
+
+      <!-- lastName -->
+      <input class="input" type="text" v-model="lastName" placeholder="Last name" />
+
+      <input type="checkbox" id="checkbox" v-model="rememberMe" />
+      <label for="checkbox">Remember Me</label>
     </div>
 
     <!-- submit button -->
-    <button class="button" @click="submitCreds">Submit</button>
+    <button class="button" @click="submit">Submit</button>
   </div>
 </template>
 
@@ -40,31 +49,39 @@ interface RegisterPayload {
 export default defineComponent({
   name: "Register",
   setup() {
-    const payload = reactive<RegisterPayload>({
-      email: undefined,
-      password: undefined,
-      firstName: undefined,
-      lastName: undefined,
-    });
-
-    const { error, loading, invoke, data, errorMessage } = useIpc(
-      "auth-register"
-    );
+    const email = ref("");
+    const password = ref("");
+    const firstName = ref("");
+    const lastName = ref("");
+    const rememberMe = ref("");
 
+    const { invoke, data,} = useIpc("auth-user");
     const { setToken } = useAuth();
     const router = useRouter();
 
+    const payload: RegisterPayload = {
+      email: email.value,
+      password: password.value,
+      firstName: firstName.value,
+      lastName: lastName.value,
+    };
+
     const submit = async () => {
-      await invoke(payload);
-      setToken(data.value, true);
-      router.push({ name: "home" });
+      try {
+          await invoke(payload);
+          setToken(data.value, true);
+          router.push({ name: "home" });
+      } catch(e) {
+          console.log('Failed to register.')
+      }
     };
 
     return {
-      ...toRefs(payload),
+      email,
+      password,
+      firstName,
+      lastName,
       submit,
-      loading,
-      errorMessage,
     };
   },
 });

testServer.js

@@ -16,7 +16,7 @@ wss.on("connection", function connection(ws, req) {
   ws.on("message", function incoming(message) {
 
     console.log(message)
-      if (message === 'no-token') {
+      if (message === 'no-token' || message === 'undefined') {
           console.log('no token to authenticate');
           ws.send('locked');
       }