client: lay some groundwork for jump to message
This commit is contained in:
parent
283ef445e5
commit
e6856a9e7d
6
.gitignore
vendored
6
.gitignore
vendored
@ -1,3 +1,9 @@
|
||||
# Emacs/Vim turds
|
||||
.\#*\#
|
||||
\#*\#
|
||||
*~
|
||||
.tern-port
|
||||
|
||||
node_modules/
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
|
@ -90,7 +90,12 @@
|
||||
>
|
||||
<div class="scroll-down-arrow" />
|
||||
</div>
|
||||
<MessageList ref="messageList" :network="network" :channel="channel" />
|
||||
<MessageList
|
||||
ref="messageList"
|
||||
:network="network"
|
||||
:channel="channel"
|
||||
:focused="focused"
|
||||
/>
|
||||
<ChatUserList v-if="channel.type === 'channel'" :channel="channel" />
|
||||
</div>
|
||||
</div>
|
||||
@ -133,6 +138,7 @@ export default {
|
||||
props: {
|
||||
network: Object,
|
||||
channel: Object,
|
||||
focused: String,
|
||||
},
|
||||
computed: {
|
||||
specialComponent() {
|
||||
|
@ -17,6 +17,7 @@ export default {
|
||||
name: "DateMarker",
|
||||
props: {
|
||||
message: Object,
|
||||
focused: Boolean,
|
||||
},
|
||||
computed: {
|
||||
localeDate() {
|
||||
|
@ -3,7 +3,11 @@
|
||||
:id="'msg-' + message.id"
|
||||
:class="[
|
||||
'msg',
|
||||
{self: message.self, highlight: message.highlight, 'previous-source': isPreviousSource},
|
||||
{
|
||||
self: message.self,
|
||||
highlight: message.highlight || focused,
|
||||
'previous-source': isPreviousSource,
|
||||
},
|
||||
]"
|
||||
:data-type="message.type"
|
||||
:data-command="message.command"
|
||||
@ -110,6 +114,7 @@ export default {
|
||||
network: Object,
|
||||
keepScrollPosition: Function,
|
||||
isPreviousSource: Boolean,
|
||||
focused: Boolean,
|
||||
},
|
||||
computed: {
|
||||
timeFormat() {
|
||||
|
@ -30,6 +30,7 @@ export default {
|
||||
network: Object,
|
||||
messages: Array,
|
||||
keepScrollPosition: Function,
|
||||
focused: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
@ -23,6 +23,7 @@
|
||||
v-if="shouldDisplayDateMarker(message, id)"
|
||||
:key="message.id + '-date'"
|
||||
:message="message"
|
||||
:focused="message.id == focused"
|
||||
/>
|
||||
<div
|
||||
v-if="shouldDisplayUnreadMarker(message.id)"
|
||||
@ -38,6 +39,7 @@
|
||||
:network="network"
|
||||
:keep-scroll-position="keepScrollPosition"
|
||||
:messages="message.messages"
|
||||
:focused="message.id == focused"
|
||||
/>
|
||||
<Message
|
||||
v-else
|
||||
@ -47,6 +49,7 @@
|
||||
:message="message"
|
||||
:keep-scroll-position="keepScrollPosition"
|
||||
:is-previous-source="isPreviousSource(message, id)"
|
||||
:focused="message.id == focused"
|
||||
@toggle-link-preview="onLinkPreviewToggle"
|
||||
/>
|
||||
</template>
|
||||
@ -75,6 +78,7 @@ export default {
|
||||
props: {
|
||||
network: Object,
|
||||
channel: Object,
|
||||
focused: String,
|
||||
},
|
||||
computed: {
|
||||
condensedMessages() {
|
||||
|
@ -1,5 +1,10 @@
|
||||
<template>
|
||||
<Chat v-if="activeChannel" :network="activeChannel.network" :channel="activeChannel.channel" />
|
||||
<Chat
|
||||
v-if="activeChannel"
|
||||
:network="activeChannel.network"
|
||||
:channel="activeChannel.channel"
|
||||
:focused="this.$route.query.focused"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -56,18 +56,20 @@
|
||||
aria-relevant="additions"
|
||||
>
|
||||
<template v-for="(message, id) in messages">
|
||||
<DateMarker
|
||||
v-if="shouldDisplayDateMarker(message, id)"
|
||||
:key="message.date"
|
||||
:message="message"
|
||||
/>
|
||||
<Message
|
||||
:key="message.id"
|
||||
:channel="channel"
|
||||
:network="network"
|
||||
:message="message"
|
||||
:data-id="message.id"
|
||||
/>
|
||||
<div class="result" v-on:click="jump(message, id)">
|
||||
<DateMarker
|
||||
v-if="shouldDisplayDateMarker(message, id)"
|
||||
:key="message.date"
|
||||
:message="message"
|
||||
/>
|
||||
<Message
|
||||
:key="message.id"
|
||||
:channel="channel"
|
||||
:network="network"
|
||||
:message="message"
|
||||
:data-id="message.id"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
@ -210,6 +212,20 @@ export default {
|
||||
el.scrollTop = el.scrollHeight;
|
||||
});
|
||||
},
|
||||
jump(message, id) {
|
||||
// TODO: Implement jumping to messages!
|
||||
// This is difficult because it means client will need to handle a potentially nonlinear message set
|
||||
// (loading IntersectionObserver both before AND after the messages)
|
||||
// this.$router.push({
|
||||
// name: "MessageList",
|
||||
// params: {
|
||||
// id: this.chan.id,
|
||||
// },
|
||||
// query: {
|
||||
// focused: id
|
||||
// }
|
||||
// });
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
Loading…
Reference in New Issue
Block a user