mirror of
https://github.com/styppo/hamstr.git
synced 2024-10-18 05:23:28 +00:00
Thread: improve scroll to highlight a bit
This commit is contained in:
parent
84c772d443
commit
6e1be091fa
@ -40,7 +40,7 @@
|
||||
|
||||
<script>
|
||||
import {defineComponent} from 'vue'
|
||||
import {createMetaMixin, scroll} from 'quasar'
|
||||
import {createMetaMixin} from 'quasar'
|
||||
import PageHeader from 'components/PageHeader.vue'
|
||||
import Thread from 'components/Post/Thread.vue'
|
||||
import HeroPost from 'components/Post/HeroPost.vue'
|
||||
@ -82,6 +82,9 @@ export default defineComponent({
|
||||
childrenSet: new Set(),
|
||||
sub: {},
|
||||
profilesUsed: new Set(),
|
||||
|
||||
resizeObserver: null,
|
||||
scrollTimeout: null,
|
||||
}
|
||||
},
|
||||
|
||||
@ -98,10 +101,17 @@ export default defineComponent({
|
||||
|
||||
mounted() {
|
||||
this.start()
|
||||
|
||||
this.resizeObserver = new ResizeObserver(() => {
|
||||
this.scrollToMainEvent()
|
||||
})
|
||||
this.resizeObserver.observe(this.$refs.page.$el)
|
||||
},
|
||||
|
||||
beforeUnmount() {
|
||||
this.stop()
|
||||
|
||||
this.resizeObserver.disconnect()
|
||||
},
|
||||
|
||||
methods: {
|
||||
@ -139,15 +149,17 @@ export default defineComponent({
|
||||
async subAncestorsChildren() {
|
||||
let tags = this.event?.interpolated?.replyEvents?.length ? [this.$route.params.eventId, this.event.interpolated.replyEvents[0]] : [this.$route.params.eventId]
|
||||
|
||||
if (this.sub.ancestorsChildren) this.sub.ancestorsChildren.update('e', tags, 1)
|
||||
else this.sub.ancestorsChildren = await dbStreamTagKind('e', tags, 1, event => {
|
||||
if (this.event && event.created_at < this.event.created_at) {
|
||||
this.processAncestorEvent(event)
|
||||
return
|
||||
}
|
||||
this.processChildEvent(event)
|
||||
return
|
||||
})
|
||||
if (this.sub.ancestorsChildren) {
|
||||
this.sub.ancestorsChildren.update('e', tags, 1)
|
||||
} else {
|
||||
this.sub.ancestorsChildren = await dbStreamTagKind('e', tags, 1, event => {
|
||||
if (this.event && event.created_at < this.event.created_at) {
|
||||
this.processAncestorEvent(event)
|
||||
return
|
||||
}
|
||||
this.processChildEvent(event)
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
processAncestorEvent(event) {
|
||||
@ -172,8 +184,6 @@ export default defineComponent({
|
||||
prevAncestor = this.ancestorsSeen.get(prevAncestorId)
|
||||
}
|
||||
}
|
||||
|
||||
this.scrollToMainEvent()
|
||||
},
|
||||
|
||||
processChildEvent(event) {
|
||||
@ -187,10 +197,15 @@ export default defineComponent({
|
||||
},
|
||||
|
||||
scrollToMainEvent() {
|
||||
setTimeout(() => {
|
||||
const offset = this.$refs.main?.$el.getBoundingClientRect().top - 78
|
||||
scroll.setVerticalScrollPosition(document.scrollingElement, offset, 0)
|
||||
}, 500)
|
||||
const el = this.$refs.main?.$el
|
||||
if (!el) return
|
||||
|
||||
const offset = Math.max(el.offsetTop - 78, 0)
|
||||
|
||||
if (this.scrollTimeout) {
|
||||
clearTimeout(this.scrollTimeout)
|
||||
}
|
||||
this.scrollTimeout = setTimeout(() => window.scrollTo(0, offset), 100)
|
||||
},
|
||||
|
||||
addEventAncestors(event) {
|
||||
|
Loading…
Reference in New Issue
Block a user