iridium/neko-custom
Archived
2
0
Fork 0
Code Pull Requests Activity

abort in progress transfers on cancel (updated axios too)

Browse Source
This commit is contained in:
William Harrell 2022-11-13 11:27:04 -05:00
parent e3963736ad
commit 5ba4019e36
2 changed files with 17 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/package.json
View File

@ -22,7 +22,7 @@
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-free": "^6.2.0", "@fortawesome/fontawesome-free": "^6.2.0",
"animejs": "^3.2.0", "animejs": "^3.2.0",
"axios": "^0.21.4", "axios": "^0.24.0",
"date-fns": "^2.29.3", "date-fns": "^2.29.3",
"emoji-datasource": "^6.0.1", "emoji-datasource": "^6.0.1",
"eventemitter3": "^4.0.7", "eventemitter3": "^4.0.7",

25
client/src/components/files.vue
View File

@ -19,7 +19,7 @@
<div v-for="download in downloads" :key="download.name" class="transfers-list-item"> <div v-for="download in downloads" :key="download.name" class="transfers-list-item">
<div class="transfer-info"> <div class="transfer-info">
<p>{{ download.name }}</p> <p>{{ download.name }}</p>
<p class="file-size">{{ Math.max(100, Math.round(download.progress / download.size * 100))}}%</p> <p class="file-size">{{ Math.min(100, Math.round(download.progress / download.size * 100))}}%</p>
<i class="fas fa-xmark remove-transfer" @click="() => removeTransfer(download)"></i> <i class="fas fa-xmark remove-transfer" @click="() => removeTransfer(download)"></i>
</div> </div>
<progress class="transfer-progress" :aria-label="download.name + ' progress'" :value="download.progress" <progress class="transfer-progress" :aria-label="download.name + ' progress'" :value="download.progress"
@ -199,6 +199,10 @@ import { FileTransfer } from '~/neko/types'
} }
download(item: any) { download(item: any) {
if (this.downloads.map((t) => t.name).includes(item.name)) {
return
}
const url = `/file?pwd=${this.$accessor.password}&filename=${item.name}` const url = `/file?pwd=${this.$accessor.password}&filename=${item.name}`
let transfer: FileTransfer = { let transfer: FileTransfer = {
id: Math.round(Math.random() * 10000), id: Math.round(Math.random() * 10000),
@ -210,15 +214,16 @@ import { FileTransfer } from '~/neko/types'
progress: 0, progress: 0,
status: 'pending', status: 'pending',
axios: null, axios: null,
// TODO add support for aborting in progress requests, requires axios >=0.22
abortController: null abortController: null
} }
transfer.abortController = new AbortController()
transfer.axios = this.$http.get(url, { transfer.axios = this.$http.get(url, {
responseType: 'blob', responseType: 'blob',
signal: transfer.abortController.signal,
onDownloadProgress: (x) => { onDownloadProgress: (x) => {
transfer.progress = x.loaded transfer.progress = x.loaded
if (x.lengthComputable) { if (x.lengthComputable && transfer.size !== x.total) {
transfer.size = x.total transfer.size = x.total
} }
if (transfer.progress === transfer.size) { if (transfer.progress === transfer.size) {
@ -240,9 +245,11 @@ import { FileTransfer } from '~/neko/types'
this.$accessor.files.addTransfer(transfer) this.$accessor.files.addTransfer(transfer)
} }
removeTransfer(item: FileTransfer) { removeTransfer(transfer: FileTransfer) {
console.log(item) if (transfer.status !== 'completed') {
this.$accessor.files.removeTransfer(item) transfer.abortController?.abort()
}
this.$accessor.files.removeTransfer(transfer)
} }
fileIcon(file: any) { fileIcon(file: any) {
@ -261,16 +268,16 @@ import { FileTransfer } from '~/neko/types'
case 'mp3': case 'mp3':
case 'flac': case 'flac':
className += 'fa-music' className += 'fa-music'
break; break
case 'webm': case 'webm':
case 'mp4': case 'mp4':
case 'mkv': case 'mkv':
className += 'fa-film' className += 'fa-film'
break; break
default: default:
className += 'fa-file' className += 'fa-file'
} }
return className; return className
} }
fileSize(size: number) { fileSize(size: number) {