86 lines
2.1 KiB
JavaScript
86 lines
2.1 KiB
JavaScript
import onDrop from "./control/drop.js";
|
|
import initScroll from "./control/scroll.js";
|
|
|
|
import WS from "./ws.js";
|
|
import Input from "./input.js";
|
|
import Settings from "./settings.js";
|
|
import Message from "./message.js";
|
|
|
|
const Messenger = {
|
|
|
|
components: {
|
|
WS,
|
|
Settings,
|
|
Message,
|
|
Input
|
|
},
|
|
|
|
setup()
|
|
{
|
|
const person = Vue.ref("");
|
|
const messages = Vue.ref([]);
|
|
|
|
Vue.onMounted(() => {
|
|
|
|
window.mainApi.on("message", (update) => {
|
|
|
|
if (update.person)
|
|
{
|
|
person.value = update.person;
|
|
messages.value = update.messages;
|
|
}
|
|
else if (update.name)
|
|
{
|
|
person.value = update.name;
|
|
}
|
|
else if (update.modifier)
|
|
{
|
|
messages.value.push(update);
|
|
}
|
|
else if (update.category)
|
|
{
|
|
search(update.message).content.push(update);
|
|
}
|
|
else if (update.context)
|
|
{
|
|
search(update.message).context = update.context;
|
|
}
|
|
else if (update.text)
|
|
{
|
|
search(update.message).content.at(-1).text = update.text;
|
|
setTimeout(() => {
|
|
document.getElementById("messenger").dispatchEvent(new CustomEvent('adjust-scroll'))
|
|
}, 100);
|
|
}
|
|
|
|
});
|
|
|
|
initScroll("messenger");
|
|
window.mainApi.send("messenger");
|
|
});
|
|
|
|
const search = (id) => messages.value.find(m => m.id == id);
|
|
|
|
return { person, messages, onDrop };
|
|
},
|
|
|
|
template: `
|
|
<Settings />
|
|
<WS />
|
|
<Input :person="person" />
|
|
|
|
<div id="messenger"
|
|
@drop="onDrop($event)"
|
|
@dragover.prevent
|
|
@dragenter.prevent
|
|
>
|
|
|
|
<Message
|
|
v-for="message in messages"
|
|
v-bind="message"
|
|
/>
|
|
|
|
</div> `
|
|
}
|
|
|
|
export default Messenger;
|