perf(Torrent Card): Highlight torrent card when TRC menu is showed (#966)

This commit is contained in:
Rémi Marseault 2023-07-16 22:03:21 +02:00 committed by GitHub
parent b2edc3274d
commit 1ba088163c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 48 additions and 30 deletions

View file

@ -366,7 +366,7 @@ export default {
hashes() {
if (this.multiple) return this.selected_torrents
return [this.torrent.hash]
return [this.hash]
},
multiple() {
return this.selected_torrents.length > 1
@ -394,10 +394,10 @@ export default {
await qbit.pauseTorrents(this.hashes)
},
location() {
this.createModal('ChangeLocationModal', { hashes: this.multiple ? this.selected_torrents : [this.torrent.hash] })
this.createModal('ChangeLocationModal', { hashes: this.multiple ? this.selected_torrents : [this.hash] })
},
rename() {
this.createModal('RenameTorrentModal', { hash: this.torrent.hash })
this.createModal('RenameTorrentModal', { hash: this.hash })
},
async reannounce() {
await qbit.reannounceTorrents(this.hashes)
@ -411,16 +411,16 @@ export default {
await qbit.recheckTorrents(this.hashes)
},
showInfo() {
this.$router.push({ name: 'torrentDetail', params: { hash: this.torrent.hash } })
this.$router.push({ name: 'torrentDetail', params: { hash: this.hash } })
},
async setPriority(priority) {
await qbit.setTorrentPriority(this.hashes, priority)
},
setLimit(mode) {
this.createModal('SpeedLimitModal', { hash: this.torrent.hash, mode })
this.createModal('SpeedLimitModal', { hash: this.hash, mode })
},
setShareLimit() {
this.createModal('ShareLimitModal', { hash: this.torrent.hash })
this.createModal('ShareLimitModal', { hash: this.hash })
},
async forceResume() {
await qbit.forceStartTorrents(this.hashes)

View file

@ -1,20 +1,27 @@
import { Component, Vue } from 'vue-property-decorator'
import { defineComponent } from 'vue'
import { mapGetters, mapState } from 'vuex'
@Component
export default class TorrentSelect extends Vue {
isAlreadySelected(hash: string) {
return this.$store.getters.containsTorrent(hash)
}
selectTorrent(hash: string) {
if (!this.$store.state.selectMode) this.$store.state.selectMode = true
if (this.isAlreadySelected(hash)) {
this.$store.commit('SET_SELECTED', { type: 'remove', hash })
} else {
this.$store.commit('SET_SELECTED', { type: 'add', hash })
export default defineComponent({
name: 'TorrentSelect',
computed: {
...mapState(['selectMode']),
...mapGetters(['containsTorrent'])
},
methods: {
isAlreadySelected(hash: string) {
return this.containsTorrent(hash)
},
selectTorrent(hash: string) {
if (!this.selectMode) this.selectMode = true
if (this.isAlreadySelected(hash)) {
this.$store.commit('SET_SELECTED', {type: 'remove', hash})
} else {
this.$store.commit('SET_SELECTED', {type: 'add', hash})
}
},
selectUntil(hash: string, index: number) {
if (!this.selectMode) return
this.$store.commit('SET_SELECTED', {type: 'until', hash, index})
}
}
selectUntil(hash: string, index: number) {
if (!this.$store.state.selectMode) return
this.$store.commit('SET_SELECTED', { type: 'until', hash, index })
}
}
})

View file

@ -110,7 +110,7 @@
:key="torrent.hash"
class="pa-0"
:class="isMobile ? 'mb-1' : 'mb-2'"
@mousedown="trcMenu.show = false"
@mousedown="hideTorrentRightClickMenu"
@touchstart="strTouchStart($event, { torrent })"
@touchmove="strTouchMove($event)"
@touchend="strTouchEnd($event)"
@ -135,7 +135,7 @@
<v-pagination v-if="pageCount > 1 && !hasSearchFilter" v-model="pageNumber" :length="pageCount" :total-visible="7" @input="toTop" />
</div>
</div>
<v-menu v-model="trcMenu.show" transition="slide-y-transition" :position-x="trcMenu.X" :position-y="trcMenu.Y" absolute>
<v-menu v-model="trcMenu.show" transition="slide-y-transition" :position-x="trcMenu.X" :position-y="trcMenu.Y" absolute @input="hideTorrentRightClickMenu">
<TorrentRightClickMenu v-if="data" :hash="data.torrent.hash" :touchmode="tmCalc.TouchMode" :x="trcMenu.X" />
</v-menu>
</div>
@ -355,7 +355,7 @@ export default {
methods: {
strTouchStart(e, data) {
this.trcMoveTick = 0
this.trcMenu.show = false
this.hideTorrentRightClickMenu(e)
clearTimeout(this.tmCalc.TouchTimer)
if (e.touches.length === 1) {
// one finger only
@ -377,7 +377,7 @@ export default {
if (this.trcMenu.show === true && e.touches.length > 1) {
e.preventDefault()
} else if (this.trcMoveTick > 1 && e.touches.length === 1) {
if (this.tmCalc.LastFinger === 1) this.trcMenu.show = false
if (this.tmCalc.LastFinger === 1) this.hideTorrentRightClickMenu(e)
clearTimeout(this.tmCalc.TouchTimer)
}
},
@ -389,6 +389,11 @@ export default {
if (this.trcMenu.show) return false
this.data = data
if (e.preventDefault) e.preventDefault()
if (!this.selectMode) {
this.$store.commit('SET_SELECTED', {type: 'add', hash: data.torrent.hash})
}
this.tmCalc.TouchMode = touchmode
this.trcMenu.X = e.clientX + (touchmode ? 12 : 6)
this.trcMenu.Y = e.clientY + (touchmode ? 12 : 6)
@ -396,6 +401,15 @@ export default {
this.trcMenu.show = true
})
},
hideTorrentRightClickMenu(e) {
if (!this.selectMode) {
this.resetSelected()
}
this.$nextTick(() => {
this.trcMenu.show = false
})
},
detectDragEnter() {
if (this.selected_torrents.length === 0 && this.$store.state.modals.length < 1) {
this.createModal('AddModal', { openSuddenly: true })
@ -423,9 +437,6 @@ export default {
}
this.$store.state.selectMode = true
},
addModal(name) {
this.createModal(name)
},
selectAllTorrents() {
if (this.allTorrentsSelected) {
return (this.$store.state.selected_torrents = [])