From: Andrew Gundersen Date: Mon, 22 Mar 2021 14:12:09 +0000 (-0500) Subject: update grouping X-Git-Tag: v0.9~14 X-Git-Url: https://andrewgundersen.net/repos?a=commitdiff_plain;h=447a68e2deeaa771a775629982905e90f15e92ec;p=mime-chat update grouping --- diff --git a/src/App.vue b/src/App.vue index 116efb1..c60eb6c 100644 --- a/src/App.vue +++ b/src/App.vue @@ -34,6 +34,7 @@ export default defineComponent({ components: { Splash }, setup() { + // Show spash screen til true. const ready = ref(false); diff --git a/src/background/session.ts b/src/background/session.ts index 766df03..49ddb13 100644 --- a/src/background/session.ts +++ b/src/background/session.ts @@ -86,7 +86,7 @@ const handleStandardMessage = (m: StandardMessage) => { const handleAnnotationMessage = (message: Annotation) => { backgroundMitt.emit('ipc-renderer', { - endpoint: 'annotate-message', + endpoint: 'render-message', message: message }); } @@ -102,6 +102,7 @@ const onMessage = (messageStr: string): void => { } const message = JSON.parse(messageStr) + console.log("New message:") console.log(message) if (message.content) { @@ -159,7 +160,7 @@ export function initSession(): void { socket.on('open', () => { console.log('Connected to Crimata Servers.'); - // call auth renderer event on connection + // Try to authenticate token right away. backgroundMitt.emit('ipc-renderer', { endpoint: 'auth', message: null diff --git a/src/background/window.ts b/src/background/window.ts index f302746..cc669eb 100644 --- a/src/background/window.ts +++ b/src/background/window.ts @@ -54,7 +54,7 @@ const saveWindowState = () => { if (err) throw err; return; }); - } + } } // Do this on window mount. diff --git a/src/components/inputItem/inputItem.vue b/src/components/inputItem/inputItem.vue index 4dc3409..c2d2c90 100644 --- a/src/components/inputItem/inputItem.vue +++ b/src/components/inputItem/inputItem.vue @@ -42,6 +42,10 @@ export default defineComponent({ // Mark input item with user's initials. const initials = ref("") + // Set initials. + const initialData = window.localStorage.getItem("initials") + if (initialData) initials.value = initialData + // Default values for position. const xStart = 15; const yStart = window.innerHeight - 200; @@ -56,6 +60,7 @@ export default defineComponent({ // Update profile functionality. const onUpdateProfile = (_event: any, payload: any) => { initials.value = payload.message.first[0] + payload.message.last[0] + window.localStorage.setItem("initials", initials.value) } onMounted(() => { diff --git a/src/modules/auth.ts b/src/modules/auth.ts index 1baacda..f1481f2 100644 --- a/src/modules/auth.ts +++ b/src/modules/auth.ts @@ -21,8 +21,10 @@ if (token) { window.localStorage.setItem(AUTH_KEY, token); } +// Load key and invoke onAuthSession to try key-login. const authToken = async () => { - const { invoke } = useIpc(); + console.log("Calling auth token.") + const { invoke } = useIpc(); try { token = window.localStorage.getItem(AUTH_KEY); @@ -43,7 +45,7 @@ const authToken = async () => { } } -// authenticate on auth event +// Gets called on socket open. window.ipcRenderer.on("auth", async (_event, _arg) => { await authToken(); }); diff --git a/src/modules/messages.ts b/src/modules/messages.ts index c6e3a94..7f4d79c 100644 --- a/src/modules/messages.ts +++ b/src/modules/messages.ts @@ -2,121 +2,102 @@ import { ref } from 'vue'; import useScroll from "@/modules/scroll"; import { RenderMessage, Annotation } from "@/types/message/index"; -const messages = ref(new Map()); // ze messages. +const messages = ref(new Map()); -//---Message Grouping----------------------------------------------- +const addMessage = (message: RenderMessage) => { + messages.value.set(message.uid, message) +} -let prevRef: string; -let activeGroup = false; +const updateMessage = (annotation: Annotation) => { + const message = messages.value.get(annotation.uid) + message.context = annotation.context + message.content.text = annotation.text +} -const updateGrouping = (currentMessageRef: string) => { - if (prevRef) { +const loadMessages = () => { + const rawData = window.localStorage.getItem("crimata_messages"); + if (rawData) { + const messageData = JSON.parse(rawData) + messages.value = new Map(Object.entries(messageData)); + } +} - // Get references to the two most recent messages. - const prev = messages.value.get(prevRef) - const current = messages.value.get(currentMessageRef) +const saveMessages = () => { + const messageData = Object.fromEntries(messages.value); + window.localStorage.setItem("crimata_messages", JSON.stringify(messageData)); +} - // See if they should be grouped. - if (current.time < prev.time + 20000) { - if (prev.modifier === current.modifier) { - if (prev.context === current.context) { +const isSimmilar = (messageA: RenderMessage, messageB: RenderMessage) => { + if ((Math.abs(messageA.time - messageB.time) < 20000) && (messageA.modifier == messageB.modifier) && (messageA.context == messageB.context)) { + return true + } + return false +} - // Update grouping accordingly. - if (activeGroup) { - prev.isChild = "middle"; - } +const updateGrouping = () => { + console.log("updating grouping") + const refs = Array.from(messages.value.keys()) - else { - prev.isChild = "first"; - } + // Get the last three messages. + const first = messages.value.get(refs[refs.length - 1]) + const second = messages.value.get(refs[refs.length - 2]) + const third = messages.value.get(refs[refs.length - 3]) - current.isChild = "last"; - activeGroup = true; - } + // If messages are simmilar, update the classes. + if ((first) && (second)) { + if (isSimmilar(first, second)) { + first.isChild = "last" // i.e. last in group. + second.isChild = "first" - // If messages unrealated, reset activeGroup. - else { - activeGroup = false; + if (third) { + if ((third.isChild == "first") || (third.isChild == "middle")) { + second.isChild = "middle" } } } } - prevRef = currentMessageRef; } -//------------------------------------------------------------------ +const { setScroll, updateScrollRef, adjustScroll } = useScroll("messenger"); + +loadMessages() +setTimeout(setScroll, 1000); export default function useMessages() { - // Control the scrolling. - const { - setScroll, - updateScrollRef, - adjustScroll - } = useScroll("messenger"); - - // Save message to local storage. - const saveMessages = () => { - const messageData = Object.fromEntries(messages.value); - window.localStorage.setItem("crimata_messages", JSON.stringify(messageData)); - } + // Main function for updating the message view. + const updateMessageView = (message: RenderMessage | Annotation) => { - // Load messages from local storage. - const loadMessages = () => { - const rawData = window.localStorage.getItem("crimata_messages"); + // Step 1: See if user is scrolled down. + updateScrollRef() - if (rawData) { - const messageData = JSON.parse(rawData) - messages.value = new Map(Object.entries(messageData)); + // Step 2: Add the new content to the view. + if ("content" in message) { + addMessage(message) + } else { + updateMessage(message) } - } - - // Remove oldest message from the messages map. - function popMessage() { - const lastKey = Array.from(messages.value.keys()).shift(); - messages.value.delete(lastKey); - } - - // Add a new message to the view. - const addMessage = (message: RenderMessage) => { - updateScrollRef() - - // Size limit of 200. + // Step 3: Pop off oldest message (if > 200). if (messages.value.size >= 200) { - popMessage(); - } + const oldest = Array.from(messages.value.keys()).shift(); + messages.value.delete(oldest); + }; - messages.value.set(message.uid, message); + // Step 4: Update grouping. + updateGrouping() + // Setp 5: Scroll the view (if scrolled down). setTimeout(adjustScroll, 20); - updateGrouping(message.uid) - saveMessages() - } - - // Update an existing message in the view. - const updateMessage = (a: Annotation) => { - updateScrollRef() - // update message if in the map. - const message = messages.value.get(a.uid) - message.context = a.context - message.content.text = a.text + // Step 6: Save the view data. + saveMessages() - setTimeout(adjustScroll, 20); - saveMessages() } - loadMessages() - setTimeout(setScroll, 1000); - console.log("loaded messages") - return { messages, - saveMessages, - addMessage, - updateMessage, - loadMessages + updateMessageView } -} \ No newline at end of file +}; \ No newline at end of file diff --git a/src/views/messenger.vue b/src/views/messenger.vue index 5b7d515..318c5cf 100644 --- a/src/views/messenger.vue +++ b/src/views/messenger.vue @@ -32,30 +32,20 @@ export default defineComponent({ const { emitter } = useMitt(); // Handle messages in view. - const { - messages, - addMessage, - updateMessage, - } = useMessages(); - - // Alter existing message. - const onAnnotateMessage = (_event: any, payload: any) => { - updateMessage(payload.message); - } + const { messages, updateMessageView } = useMessages(); - // Render new message. - const onRenderMessage = (_event: any, payload: any) => { - addMessage(payload.message); + // Update message view on new content. + const onNewContent = (_event: any, payload: any) => { + updateMessageView(payload.message) } onMounted(() => { // Front end listener. - emitter.on('self-message', (message) => addMessage(message)); + emitter.on('self-message', (message) => updateMessageView(message)); // Back end listener. - window.ipcRenderer.on("render-message", onRenderMessage); - window.ipcRenderer.on("annotate-message", onAnnotateMessage); + window.ipcRenderer.on("render-message", onNewContent); }); diff --git a/windowState.json b/windowState.json index 8e8aa57..9b3dcc5 100644 --- a/windowState.json +++ b/windowState.json @@ -1 +1 @@ -{"w":350,"h":807,"x":1770,"y":453} \ No newline at end of file +{"w":735,"h":510,"x":1354,"y":513} \ No newline at end of file