0
Fork 0
mirror of https://codeberg.org/SafeTwitch/safetwitch.git synced 2024-12-22 13:22:58 -05:00

Implement infinite scroll

This commit is contained in:
dragongoose 2023-03-29 10:02:04 -04:00
parent 8ed8fe4065
commit 6ec6280fd5
2 changed files with 25 additions and 4 deletions

View file

@ -7,8 +7,6 @@ export default {
const game = route.params.game
const res = await fetch(`${import.meta.env.VITE_BACKEND_URL}/api/discover/${game}`)
const data = await res.json()
console.log(import.meta.env)
let frontend_url = import.meta.env.VITE_INSTANCE_URL
return {
data,

View file

@ -1,12 +1,16 @@
<script lang="ts">
import { ref, type Ref } from 'vue'
export default {
async setup() {
const res = await fetch(`${import.meta.env.VITE_BACKEND_URL}/api/discover`)
console.log(import.meta.env)
let data: Ref<any[] | undefined> = ref()
let frontend_url = import.meta.env.VITE_INSTANCE_URL
data.value = await res.json()
return {
data: await res.json(),
data,
frontend_url,
filterTags: ''
}
@ -47,7 +51,26 @@ export default {
category.style.display = "none"
}
}
},
getNextCategory() {
window.onscroll = async () => {
let bottomOfWindow = document.documentElement.scrollTop + window.innerHeight === document.documentElement.offsetHeight;
if (bottomOfWindow && this.data) {
const cursor = this.data[this.data.length - 1].cursor
if(!cursor) return
const res = await fetch(`${import.meta.env.VITE_BACKEND_URL}/api/discover/?cursor=${cursor}`)
const data = await res.json()
for (let category of data) {
this.data.push(category)
}
}
}
}
},
mounted() {
this.getNextCategory()
}
}
</script>