updating

src/background/session.ts

@@ -4,7 +4,15 @@ import WebSocket from 'ws';
 import { backgroundMitt } from './emitter';
 import { ipcMain } from "electron";
 import { play } from './audio';
-import { UserCreds, ClientMessage, RenderMessage, Annotation } from "@/types/message/index";
+
+import { 
+    AuthMessage, 
+    Profile, 
+    Annotation, 
+    StandardMessage, 
+    ClientMessage
+} from "@/types/message/index";
+
 import { clientMessage, renderMessage } from '@/modules/message';
 
 const ip = 'ws://127.0.0.1';
@@ -14,14 +22,16 @@ let socket: WebSocket;
 let success = false;
 let auth = false;
 
-const onAuthSession = async (e: any, payload: string | UserCreds | null): Promise<string> => {
+const onAuthSession = async (e: any, token: string) => {
+
     return new Promise((resolve, reject) => {
 
-        console.log('authenticating...');
+        console.log('Authenticating...');
 
+        // Handle auth response from server.
         backgroundMitt.once('auth-res', (res: string) => {
 
-            if (res === 'locked') {
+            if (res == "locked") {
                 reject(res);
             } else {
                 console.log('Success!');
@@ -31,50 +41,75 @@ const onAuthSession = async (e: any, payload: string | UserCreds | null): Promis
 
         });
 
-        if (!payload) {
-            socket.send('no-token');
-        } else if (payload instanceof String || typeof payload === 'string') {
-            socket.send(payload);
+        if (token) {
+            socket.send(token);
         } else {
-            socket.send(JSON.stringify(payload));
+            socket.send("no-token");
         }
 
     });
 };
 
-const onMessage = (messageStr: string): void => {
 
-    while (!auth) {
-        backgroundMitt.emit('auth-res', messageStr);
-        return;
+//---Message Handlers-----------------------------------------------
+
+const handleAuthMessage = (message: string) => {
+    backgroundMitt.emit('auth-res', message);
+}
+
+const handleProfileMessage = (message: Profile) => {
+    backgroundMitt.emit('ipc-renderer', {
+        endpoint: 'update-profile',
+        message: message 
+    });
+}
+
+const handleStandardMessage = (m: StandardMessage) => {
+
+    // Create a render message object.
+    const message = renderMessage(
+        m.content.text, m.content.audio, m.context, m.modifier);
+
+    // Play audio if any.
+    if (message.content.audio) {
+        const audioBytes = Buffer.from(m.content.audio as string, 'hex');
+        m.content.audio = true;
+        play(audioBytes);
     }
 
-    // Decode the message.
-    const m = JSON.parse(messageStr)
-    let message: RenderMessage | Annotation;
-
-    // Check to see if this is a Render Message.
-    if (m.content) {
-         message = renderMessage(m.content.text, m.content.audio, m.context, m.modifier);
-
-        // Play audio if any.
-        if (message.content.audio) {
-            const audioBytes = Buffer.from(m.content.audio as string, 'hex');
-            m.content.audio = true;
-            play(audioBytes);
-        }
-
-    }
-
-    else {
-        message = m // Annotation
-    }
-
-    // Send it to the frontend.
     backgroundMitt.emit('ipc-renderer', {
         endpoint: 'render-message',
         message: message 
     });
+}
+
+const handleAnnotationMessage = (message: Annotation) => {
+    backgroundMitt.emit('ipc-renderer', {
+        endpoint: 'annotate-message',
+        message: message 
+    });
+}
+
+//------------------------------------------------------------------
+
+const onMessage = (messageStr: string): void => {
+
+    // Auth messages are strings.
+    if (!auth) handleAuthMessage(messageStr)
+
+    const message = JSON.parse(messageStr)
+
+    if (message.content) {
+        handleStandardMessage(message)
+    }
+
+    else if (message.first) {
+        handleProfileMessage(message)
+    }
+
+    else {
+        handleAnnotationMessage(message)
+    }
 
 };
 
@@ -151,7 +186,6 @@ export function initSession(): void {
     socket.on("message", onMessage);
 }
 
-
 export function sendAudio(audio: string, uid: string): void {
     const m = clientMessage("", audio, uid);
     socket.send(JSON.stringify(m));

src/components/inputItem/inputItem.vue

@@ -5,7 +5,8 @@
     :class="{ playing: recording }"
     :style="{ top: `${elementY}px`, left: `${elementX}px` }"
   >
-    AG
+    <div>{{ initials }}</div>
+    
 
     <!-- Recording animation on space bar -->
     <span v-if="recording" class="play"></span>
@@ -22,14 +23,16 @@
 
 <script lang="ts">
 
-import { defineComponent } from "vue";
+import { defineComponent, ref, onMounted } from "vue";
 import draggify from "@/modules/draggify";
 
-import TextInput from "@/components/inputItem/textInput.vue"
+import { Profile } from "@/types/message/index";
+
+import TextInput from "@/components/inputItem/textInput.vue";
 import useTextInputController from 
-  "@/components/inputItem/controllers/textCtrl"
+  "@/components/inputItem/controllers/textCtrl";
 import useAudioInputController from 
-  "@/components/inputItem/controllers/audioCtrl"
+  "@/components/inputItem/controllers/audioCtrl";
 
 export default defineComponent({
   name: "InputItem",
@@ -38,6 +41,10 @@ export default defineComponent({
   },
   setup() {
 
+    // Mark input item with user's initials.
+    let initials = ref("")
+    initials.value = "IN";
+
     // Initial position.
     const xStart = 15;
     const yStart = window.innerHeight - 200;
@@ -52,6 +59,16 @@ export default defineComponent({
     const { typing } = useTextInputController(elementX)
     const { recording } = useAudioInputController(typing)
 
+    // Update profile functionality.
+    const onUpdateProfile = (_event: any, payload: Profile) => {
+      window.localStorage.setItem("profile", JSON.stringify(payload));
+      initials.value = payload.first[0] + payload.last[0]
+    }
+
+    onMounted(() => {
+      window.ipcRenderer.on("update-profile", onUpdateProfile);
+    }) 
+
     return {
       elementX,
       elementY,

src/types/message/index.ts

@@ -1,8 +1,3 @@
-export interface UserCreds {
-    email: string;
-    password: string;
-}
-
 export interface RenderMessage {
     content: {
         text: boolean | string;
@@ -21,8 +16,28 @@ export interface ClientMessage {
     uid: string;
 }
 
+// Possible messages from server:
+
+export interface AuthMessage {
+    key: string;
+}
+
+export interface Profile {
+    first: string;
+    last: string;
+}
+
 export interface Annotation {
     text: string;
     context: string;
     uid: string;
+}
+
+export interface StandardMessage {
+    content: {
+        text: boolean | string;
+        audio: boolean | string;
+    };
+    context: string;
+    modifier: string;
 }