From: riqo <hernandeze2@xavier.edu>
Date: Sun, 6 Dec 2020 22:38:02 +0000 (-0600)
Subject: center renderer + add min build config
X-Git-Tag: v0.9~132^2
X-Git-Url: https://andrewgundersen.net/repos?a=commitdiff_plain;h=5cc44f1c2a180ca6bbf252e77fa9d3a4b7ea180d;p=mime-chat

center renderer + add min build config
---

diff --git a/package.json b/package.json
index 03c6669..41a8d77 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,12 @@
 {
   "name": "crimata-messenger",
+  "productName": "crimata-messenger",
+  "description": "Cross-platform messenger application built with electron, vue3, and TS.",
   "version": "0.1.0",
   "private": true,
+  "author": {
+    "name": "Enrique Hernandez"
+  },
   "scripts": {
     "dev": "yarn electron:serve",
     "serve": "vue-cli-service serve",
diff --git a/src/components/UI/UIDetails/messageRenderer.vue b/src/components/UI/UIDetails/messageRenderer.vue
index a07459e..761b347 100644
--- a/src/components/UI/UIDetails/messageRenderer.vue
+++ b/src/components/UI/UIDetails/messageRenderer.vue
@@ -5,12 +5,14 @@
     xmlns:xlink="http://www.w3.org/1999/xlink"
     :viewBox="scrollView"
   >
-    <g id="messageRenderer">
+    <g id="messageRenderer" transform="translate(0, 5)">
       <g
         v-for="(item, index) in renderArr"
         :key="index"
         class="messageList"
-        transform="translate(0, 0)"
+        transform="translate(0, 25)"
+        preserverAspectRatio="none"
+
       >
         <transition
           appear
@@ -65,3 +67,13 @@ export default defineComponent({
   },
 });
 </script>
+
+<style lang="scss" scoped>
+svg {
+  height: 1%;
+  overflow: hidden;
+}
+#messageRenderer {
+  margin: 0;
+}
+</style>
diff --git a/src/composables/messageRenderer/useMessageRenderer.ts b/src/composables/messageRenderer/useMessageRenderer.ts
index 052788a..a916f5c 100644
--- a/src/composables/messageRenderer/useMessageRenderer.ts
+++ b/src/composables/messageRenderer/useMessageRenderer.ts
@@ -14,7 +14,7 @@ export default function useMessageRenderer() {
     function animateMessage(el: SVGGElement): void {
         const transform = {
             initialTranslate: `translate(${messageOffset.x} ${messageOffset.y})`,
-            finalTranslate: `translate(${messageOffset.x} ${messageOffset.y + 5})`
+            finalTranslate: `translate(${messageOffset.x} ${messageOffset.y})`
         }
         shift ? shiftAnimate(el, transform, shiftValue, messageList) : stackAnimate(el, transform);
     }
@@ -29,11 +29,11 @@ export default function useMessageRenderer() {
     }
 
     function afterEnter(el: SVGGElement) {
-        const messagePadding = 10;
+        const messagePadding = 15;
 
         if (message) {
             messageOffset = calculateMessageOffsets(message);
-            shift = messageOffset.y > 450 ? true : false;
+            shift = messageOffset.y > 445 ? true : false;
         }
         if (shift) {
             shiftValue -= el.getBBox().height + messagePadding;
diff --git a/src/composables/messageRenderer/useOffsetCalculator.ts b/src/composables/messageRenderer/useOffsetCalculator.ts
index 5efad53..b8e2451 100644
--- a/src/composables/messageRenderer/useOffsetCalculator.ts
+++ b/src/composables/messageRenderer/useOffsetCalculator.ts
@@ -2,9 +2,9 @@ import { ref } from "vue";
 export default function useOffsetCalculator() {
     const xOffset = ref(0);
     const yOffset = ref(0);
-    const firstChildMarginTop = 40;
+    const firstChildMarginTop = 0;
     let previousMessageHeight = 0;
-    const messagePadding = 10;
+    const messagePadding = 15;
 
     function setXoffset(message: HTMLElement): void {
         const computedQuery = window.getComputedStyle(message)
diff --git a/src/composables/messageRenderer/useRendererAnims.ts b/src/composables/messageRenderer/useRendererAnims.ts
index f780281..8a2acb9 100644
--- a/src/composables/messageRenderer/useRendererAnims.ts
+++ b/src/composables/messageRenderer/useRendererAnims.ts
@@ -37,6 +37,8 @@ export default function useRendererAnims() {
                 anime({
                     targets: el,
                     transform: transform.finalTranslate,
+                    easing: "easeInOutQuad",
+                    duration: 500,
                     offset: 1000
                 });
             }
diff --git a/src/composables/scroller/useScroller.ts b/src/composables/scroller/useScroller.ts
index 6bf195e..510c88f 100644
--- a/src/composables/scroller/useScroller.ts
+++ b/src/composables/scroller/useScroller.ts
@@ -8,7 +8,7 @@ export default function useScroller({ targetId }: {targetId: string}) {
 
     const clampedScroll = computed(() => {
       if (targetHeight.value === 0) { return 0; }
-      topBound = -targetHeight.value + 440;
+      topBound = -targetHeight.value + 450;
       return Math.max(topBound, Math.min(scroll.value, 0)) as number;
     })
 
diff --git a/src/router/index.ts b/src/router/index.ts
index 0042003..be6cd4b 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,4 +1,4 @@
-import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
+import { createRouter, createWebHistory, createWebHashHistory, RouteRecordRaw } from "vue-router";
 import HomeIndex from "../views/home/index.vue";
 
 const routes: Array<RouteRecordRaw> = [
@@ -10,7 +10,7 @@ const routes: Array<RouteRecordRaw> = [
 ];
 
 const router = createRouter({
-  history: createWebHistory(process.env.BASE_URL),
+  history: process.env.IS_ELECTRON ? createWebHashHistory() : createWebHistory(process.env.BASE_URL),
   routes
 });
 
diff --git a/src/views/user/login.vue b/src/views/user/login.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/user/register.vue b/src/views/user/register.vue
new file mode 100644
index 0000000..e69de29
diff --git a/vue.config.js b/vue.config.js
index c1f4170..8a7dde9 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -21,7 +21,7 @@ module.exports = {
       builderOptions: {
         // TODO electron-builder config https://www.electron.build/configuration/configuration
         appId: "com.crimata.messenger",
-        name: "CrimataMessenger"
+        productName: "Crimata-Messenger"
       },
       preload: "src/preload.ts"
     }