ngn/safetwitch
1
0
Fork 0
Code Issues 1 Pull Requests 10 Actions Packages Activity

Format files

Browse Source
This commit is contained in:
dragongoose
2024-02-12 22:11:38 -05:00
parent 2a519d9b15
commit 3867756fef
6 changed files with 46 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/HomepageView.vue
View File

@ -68,14 +68,14 @@ export default {
},
async handleFollowingScroll(event: UIEvent) {
let el = event.target as HTMLUListElement
let fullyScrolled = el.scrollLeft === (el.scrollWidth - el.clientWidth)
let fullyScrolled = el.scrollLeft === el.scrollWidth - el.clientWidth
console.log(el)
if (!fullyScrolled) return;
if (!fullyScrolled) return
if (!this.following) return;
if (!this.following) return
let offset = this.following.length / 35
let newFollowers = await followersStreaming(getFollows(), offset)
this.following = [ ...this.following, ...newFollowers]
this.following = [...this.following, ...newFollowers]
}
},
async mounted() {
@ -90,7 +90,7 @@ export default {
this.data = data
})
this.following = await followersStreaming(getFollows(), 0)
this.following = await followersStreaming(getFollows(), 0)
},
components: {
StreamPreviewVue,
@ -107,9 +107,12 @@ export default {
<div v-show="data" class="max-w-5xl mx-auto">
<div v-if="following && following.length > 0" class="p-2 text-contrast">
<h1 class="font-bold text-5xl">{{ $t("home.following") }}</h1>
<p class="text-xl">{{ $t("home.streamersYouFollow") }}</p>
<ul class="flex flex-nowrap justify-begin overflow-x-scroll overflow-y-hidden space-x-2 mt-1 h-[19rem] items-center" @scroll="handleFollowingScroll">
<h1 class="font-bold text-5xl">{{ $t('home.following') }}</h1>
<p class="text-xl">{{ $t('home.streamersYouFollow') }}</p>
<ul
class="flex flex-nowrap justify-begin overflow-x-scroll overflow-y-hidden space-x-2 mt-1 h-[19rem] items-center"
@scroll="handleFollowingScroll"
>
<li v-for="streamer in following" :key="streamer" class="inline-block">
<stream-preview-vue :name="streamer"></stream-preview-vue>
</li>