me/mime-chat
Watch
1
0
Fork
You've already forked mime-chat
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add microphone component

Browse source
This commit is contained in:
riqo 2020-10-10 18:26:04 -05:00
commit 37cb3d25b6
5 changed files with 151 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/components/UI/UIDetails/messageItem.vue
View file

@ -54,7 +54,7 @@
</template>
<script lang="ts">
import { defineComponent, computed, onMounted, ref, reactive, onBeforeMount } from 'vue';
import { defineComponent, computed, onMounted, ref, reactive } from 'vue';
export default defineComponent({
name: "MessageItem",
props: {
@ -70,8 +70,6 @@ import { defineComponent, computed, onMounted, ref, reactive, onBeforeMount } fr
const msgID = ref(props.item.id);
const bubbleTag = ref(`bubble${msgID.value}`);
const contentTag = ref(`content${msgID.value}`);
let bubble: any;
let content: any;
@ -133,10 +131,12 @@ import { defineComponent, computed, onMounted, ref, reactive, onBeforeMount } fr
bubble.setAttribute("width", bbox.width + 2 * padding);
bubble.setAttribute("height", bbox.height + 2 * padding);
}
// make textbox before mount
createTextBox(props.item.content, 32);
onMounted(async () => {
console.log(bubbleTag.value);
console.log(contentTag.value)
// update bubble and content for current message
bubble = bubbleTag.value;
content = contentTag.value;
await adjustRect();
@ -144,7 +144,6 @@ import { defineComponent, computed, onMounted, ref, reactive, onBeforeMount } fr
})
return {
bubble,
textFill,
bubbleFill,
startingOffset,

64
src/components/UI/UIDetails/messages.ts
View file

@ -23,38 +23,38 @@ const Messages: Message[] = [
modifier: "fr",
imgURL: "@/assets/logo.png",
id: "2"
},
{
content: "Hey Anna, did you get the paper done?",
signature: "Tommy McConville",
outgoing: false,
modifier: "fr",
imgURL: "@/assets/logo.png",
id: "3"
},
{
content: "Yes posting it online soon.",
signature: "Tommy McConville",
outgoing: true,
modifier: "sf",
imgURL: "../../assets/logo.png",
id: "4"
},
{
content: "Sweet, thanks!",
signature: "Tommy McConville",
outgoing: false,
modifier: "fr",
imgURL: "../../assets/logo.png",
id: "5"
},
{
content: "Hey do you know Enrique Hernandez?",
signature: "Crimata AI",
outgoing: false,
modifier: "ai",
imgURL: "../../assets/logo.png",
id: "6"
}
// {
// content: "Hey Anna, did you get the paper done?",
// signature: "Tommy McConville",
// outgoing: false,
// modifier: "fr",
// imgURL: "@/assets/logo.png",
// id: "3"
// },
// {
// content: "Yes posting it online soon.",
// signature: "Tommy McConville",
// outgoing: true,
// modifier: "sf",
// imgURL: "../../assets/logo.png",
// id: "4"
// },
// {
// content: "Sweet, thanks!",
// signature: "Tommy McConville",
// outgoing: false,
// modifier: "fr",
// imgURL: "../../assets/logo.png",
// id: "5"
// }
// {
// content: "Hey do you know Enrique Hernandez?",
// signature: "Crimata AI",
// outgoing: false,
// modifier: "ai",
// imgURL: "../../assets/logo.png",
// id: "6"
// }
];
export default Messages;