imshvc/noxious_client
1
0
Fork 0
forked from noxious/client
Code Pull Requests Activity

Finish functionality back to top button on asset list

Browse Source
This commit is contained in:
Colin Kallemein 2024-06-23 14:24:10 +02:00
parent 6215b19b20
commit 7a45145921
1 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/utilities/assetManager/AssetManager.vue
View File

@ -19,7 +19,7 @@
<div class="divider categories"></div>
<!-- Assets -->
<div class="assets active" @scroll="onScroll">
<div class="assets active" ref="elementToScroll" @scroll="onScroll">
<div class="asset">
<input class="input-cyan search-field" placeholder="Search..." />
</div>
@ -48,7 +48,7 @@
<div class="assets">
</div>
<button class="back-to-top" v-show="hasScrolled">
<button class="back-to-top" v-show="hasScrolled" @click="toTop">
<img src="/assets/icons/zoneEditor/chevron.svg" />
</button>
<div class="divider assets-list"></div>
@ -83,6 +83,7 @@ const socket = useSocketStore()
const tileUploadField = ref(null)
const tiles = ref()
const hasScrolled = ref(false)
const elementToScroll = ref()
const onScroll = (e: Event) => {
let scrollTop = (e.target as HTMLBodyElement).scrollTop
@ -94,6 +95,15 @@ const onScroll = (e: Event) => {
}
}
function toTop() {
elementToScroll.value.scrollTo({
top: 0,
left: 0,
behavior: "smooth",
});
}
const handleFileUpload = (e: Event) => {
const files = (e.target as HTMLInputElement).files
if (!files) return