From: Enrique Hernandez <hernandeze2@xavier.edu>
Date: Tue, 16 Feb 2021 18:37:39 +0000 (-0600)
Subject: refactor messageView transitions
X-Git-Tag: v0.9~82^2~3
X-Git-Url: https://andrewgundersen.net/repos?a=commitdiff_plain;h=c27dd5ca958cb34c15109ea66fea6be1847864ef;p=mime-chat

refactor messageView transitions
---

diff --git a/src/components/messageView/index.vue b/src/components/messageView/index.vue
index 3447b35..9a31f27 100644
--- a/src/components/messageView/index.vue
+++ b/src/components/messageView/index.vue
@@ -7,11 +7,7 @@
     id="test"
   >
     <g id="messageView" transform="translate(0, 20)">
-      <g
-        v-for="(item, index) in renderArr"
-        :key="index"
-        preserverAspectRatio="none"
-      >
+      <g v-for="(item, index) in renderArr" :key="index" preserverAspectRatio="none">
         <transition
           appear
           v-on:before-appear="beforeEnter"
@@ -26,11 +22,11 @@
 </template>
 
 <script lang="ts">
-import useMessageView from "./viewDetails/visualizer";
+import useTransitions from "./viewDetails/transitions";
 import useScrollView from "@/modules/scrollView";
 import TextBubble from "@/components/textBubble/index.vue";
 import { Message } from "@/types/message/index";
-import { defineComponent, reactive, onMounted, onUnmounted, watch, ref, computed } from "vue";
+import { defineComponent, reactive, onMounted, onUnmounted } from "vue";
 import useMitt from "@/modules/mitt";
 import { useIpc } from "@/modules/ipc";
 
@@ -64,7 +60,7 @@ export default defineComponent({
       emitter.all.clear();
     });
 
-    const { beforeEnter, enter, afterEnter } = useMessageView();
+    const { beforeEnter, enter, afterEnter } = useTransitions();
     const { scrollView } = useScrollView({
       targetId: "messageView",
     });
diff --git a/src/components/messageView/viewDetails/visualizer.ts b/src/components/messageView/viewDetails/transitions.ts
similarity index 96%
rename from src/components/messageView/viewDetails/visualizer.ts
rename to src/components/messageView/viewDetails/transitions.ts
index 5f82c61..2562dac 100644
--- a/src/components/messageView/viewDetails/visualizer.ts
+++ b/src/components/messageView/viewDetails/transitions.ts
@@ -19,7 +19,7 @@ let shift = false;
 let beforeEnterVH: number;
 let messageView: SVGGElement;
 
-export default function useMessageView() {
+export default function useTransitions() {
     const { calculateMessageOffsets } = useOffsetCalculator();
     const { shiftAnimate, stackAnimate } = useMessageViewAnims();
 
@@ -40,7 +40,7 @@ export default function useMessageView() {
         // query DOM for messageView element
         const messageViewQuery = document.querySelectorAll("#messageView");
         messageView = messageViewQuery[0] as SVGGElement;
-        if (messageViewQuery){
+        if (messageViewQuery) {
             beforeEnterVH = messageView.getBBox().height;
         }
     }