inputItem movement

diff --git a/src/components/helpers.ts b/src/components/helpers.ts
index 022acc5913c96fae4a1f7f5cf19abd03811a2429..ec57775d9ec885396ba3665bc3e65de0ddc5ca16 100644 (file)
--- a/src/components/helpers.ts
+++ b/src/components/helpers.ts
@@ -16,13 +16,13 @@ export function calcPosition (inputItemPosition: number, percent: number,
     short: number, win: number) {
 
     // Is it close to the right/left side?
-    if (percent > 0.85) { 
+    if (percent > 0.75) { 
         inputItemPosition = win - short
     }
 
     // Is it not close to a side?
-    if (percent < 0.85 && percent > 0.15) {
-        inputItemPosition = inputItemPosition / win
+    if (percent < 0.75 && percent > 0.25) {
+        inputItemPosition = win * percent
     }
 
     return inputItemPosition

diff --git a/src/components/inputItem.vue b/src/components/inputItem.vue
index 6f10ab2fb9857b2fc56ca74287e64314f4116635..99bc6e79b8f77bf7cf63528b47c46ad992c1b060 100644 (file)
--- a/src/components/inputItem.vue
+++ b/src/components/inputItem.vue
@@ -50,13 +50,13 @@ export default defineComponent({
 
     // Update position references when user is done moving inputItem.
     const onMouseUp = (e: any) => {
-      window.removeEventListener('mousemove');
+      window.removeEventListener('mousemove', onMouseMove, true);
 
       const winW = window.innerWidth
       const winH = window.innerHeight
       
       xShort = calcSideProximity(inputItemX.value, winW)
-      yShort = calcSideProximity(inputItemX.value, winW)
+      yShort = calcSideProximity(inputItemY.value, winH)
 
       percentX = inputItemX.value / winW
       percentY = inputItemY.value / winH

diff --git a/src/views/messenger.vue b/src/views/messenger.vue
index e9499b989e33ef8c21003905b3133cad60470ddc..e765719d70e3de23c7afa1c915ab11aff37293e7 100644 (file)
--- a/src/views/messenger.vue
+++ b/src/views/messenger.vue
@@ -1,8 +1,8 @@
 <template>
 
     <TextAudioInput />
-<!--     <InputItem />
- -->
+    <InputItem />
+
     <!-- List of message bubbles. -->
     <div id="messenger">
       <MessageItem v-for="message in messages" :message="message" :key="message.id"/>
@@ -16,7 +16,7 @@ import { defineComponent, reactive, onMounted, ref, onUnmounted } from "vue";
 import TextAudioInput from "@/components/taInput/index.vue";
 import { Message } from "@/types/message/index";
 import MessageItem from '@/components/messageItem.vue'
-// import InputItem from "@/components/inputItem.vue";
+import InputItem from "@/components/inputItem.vue";
 
 export default defineComponent({
   name: "Messenger",
@@ -24,7 +24,7 @@ export default defineComponent({
   components: {
     TextAudioInput,
     MessageItem,
-    // InputItem
+    InputItem
   },
 
   setup() {
@@ -72,8 +72,6 @@ export default defineComponent({
 
     overflow-y: scroll;
 
-    background-color: #EBEBEB;
-
     bottom: 0;
 
   }