mirrors/VueTorrent
1
0
Fork 0
mirror of https://github.com/VueTorrent/VueTorrent.git synced 2025-02-26 12:21:00 +03:00
Code Issues Projects Releases Packages Wiki Activity

0.4.4 (#65)

Browse source
This commit is contained in:
Daan Wijns 2020-10-30 18:02:10 +01:00 • committed by GitHub
parent e509d3b4a5
commit 80d1c1f6a0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 103 additions and 73 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

98
README.md
View file

@ -6,80 +6,58 @@ The sleekest looking WEBUI for qBittorrent made with Vuejs!
## Screenshots ## Screenshots
<p align="center"> ![Desktop screenshot](https://imgur.com/hpjuVYb.png)
<a href="https://imgur.com/hpjuVYb.png"><img src="https://imgur.com/hpjuVYb.png" title="Desktop" alt="Desktop Screenshot" ></a> | | | |
| :--------------------------------: | :--------------------------------: | :--------------------------------: |
| ![](https://imgur.com/Zcm98H3.png) | ![](https://imgur.com/OujrH0f.png) | ![](https://imgur.com/OkukwYY.png) |
| ![](https://imgur.com/QYpNCXs.png) | ![](https://imgur.com/6j5wxhl.png) | ![](https://imgur.com/jnzDKjW.png) |
<p align="center">
<img src="https://imgur.com/U3mes8r.png" width="300" alt="Mobile screenshot">
</p> </p>
| | | |
| :------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------: |
| <img width="1604" alt="screen shot 2017-08-07 at 12 18 15 pm" src="https://imgur.com/Zcm98H3.png"> | <img width="1604" alt="screen shot 2017-08-07 at 12 18 15 pm" src="https://imgur.com/OujrH0f.png"> | <img width="1604" alt="screen shot 2017-08-07 at 12 18 15 pm" src="https://imgur.com/OkukwYY.png"> |
| <img width="1604" alt="screen shot 2017-015 pm" src="https://imgur.com/QYpNCXs.png"> | <img width="1604" alt="screen shot 2017-08-07 at 12 18 15 pm" src="https://imgur.com/6j5wxhl.png"> | <img width="1604" alt="screen shot 2017-08-07 at 12 18 15 pm" src="https://imgur.com/jnzDKjW.png"> |
<p align="center">
<a href="https://imgur.com/U3mes8r.png"><img src="https://imgur.com/U3mes8r.png" title="Desktop" width="300" alt="Mobile" >
</a>
</p>
## Installation ## Installation
- ### manual ### manual
- Visit the releases page! - Visit the releases page!
- Download the latest release.zip
- Unzip this folder
- Point your Alternate WEBUI location to the 'vuetorrent' folder
- Download the latest release.zip ### 'automatic'
- Unzip this folder - head over to the 'latest_release' branch
- clone it
- Point your Alternate WEBUI location to the 'vuetorrent' folder - `git clone --single-branch --branch latest-release https://github.com/WDaan/VueTorrent.git`
- pull every once in a while
- ### 'automatic'
- head over to the 'latest_release' branch
- clone it
- pull every once in a while
## Development ## Development
- clone the repo - clone the repo
- npm install
- npm install - npm run serve
- docker-compose up -d (to start qbittorrent docker)
- npm run serve
- docker-compose up -d (to start qbittorrent docker)
## Features ## Features
- viewing sessions status ( down / upload speed, session uploaded / downloaded ) - viewing sessions status ( down / upload speed, session uploaded / downloaded )
- adding / removing / pausing / resuming / renaming torrents
- adding / removing / pausing / resuming / renaming torrents - selectively downloading torrents
- filtering powered by Fuse.js!
- selectively downloading torrents - mobile friendly! (can be installed as a PWA)
- torrent info / trackers / peers / content
- filtering powered by Fuse.js! - searching for new torrents straight from the WEBUI!
- changing the most common settings
- mobile friendly! (can be installed as a PWA) - tag & category support
- torrent info / trackers / peers / content
- searching for new torrents straight from the WEBUI!
- changing the most common settings
- tag & category support
- Keyboard shortcuts! - Keyboard shortcuts!
- select all torrents with ctrl+A - select all torrents with ctrl+A
- delete selected with delete button - delete selected with delete button
- select with ctrl+click or from right-click-menu (regular tap on mobile still works) - select with ctrl+click or from right-click-menu (regular tap on mobile still works)
- shift + click to select from one torrent until another - shift + click to select from one torrent until another
- Which torrent properties are shown is configurable in the dashboard (for both busy and completed torrents) - Which torrent properties are shown is configurable in the dashboard (for both busy and completed torrents)
- works on QBittorrent V4.2 and later
- works on QBittorrent V4.2 and later
## Contributing ## Contributing
@ -87,14 +65,12 @@ I'll gladly accept help/pull requests & advice!
## Support ## Support
* Open up an issue 😛 - Open up an issue 😛
[<img src="https://cdn.buymeacoffee.com/buttons/lato-blue.png" alt="drawing" width="180"/>](https://www.buymeacoffee.com/wdaan 'Buy me a coffee') <a href="https://www.buymeacoffee.com/wdaan"><img src="https://img.buymeacoffee.com/button-api/?text=Buy me a coffee&emoji=&slug=wdaan&button_colour=FFDD00&font_colour=000000&font_family=Arial&outline_colour=000000&coffee_colour=ffffff"></a>
## Credits ## Credits
- Dashboard design heavily inspired by: '[Net Ninja - Vuetify](https://github.com/iamshaunjp/vuetify-playlist)'. - Dashboard design heavily inspired by: '[Net Ninja - Vuetify](https://github.com/iamshaunjp/vuetify-playlist)'.
- This repo '[CzBiX qb-web ](https://github.com/CzBiX/qb-web)' - This repo '[CzBiX qb-web ](https://github.com/CzBiX/qb-web)'
- Muertocaloh's [fork](https://github.com/muertocaloh/VueTorrent) - Muertocaloh's [fork](https://github.com/muertocaloh/VueTorrent)

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "vuetorrent", "name": "vuetorrent",
"version": "0.4.3", "version": "0.4.4",
"private": true, "private": true,
"scripts": { "scripts": {
"start" : "npm run serve", "start" : "npm run serve",

17
src/assets/styles.scss
View file

@ -45,6 +45,9 @@
.sideborder.metadata { .sideborder.metadata {
border-left: 4px solid #{$torrent-metadata}; border-left: 4px solid #{$torrent-metadata};
} }
.sideborder.moving {
border-left: 4px solid #{$torrent-moving};
}
.v-chip.done { .v-chip.done {
background: #{$torrent-done} !important; background: #{$torrent-done} !important;
} }
@ -72,6 +75,9 @@
.v-chip.metadata { .v-chip.metadata {
background: #{$torrent-metadata} !important; background: #{$torrent-metadata} !important;
} }
.v-chip.moving {
background: #{$torrent-moving} !important;
}
.noselect { .noselect {
-webkit-touch-callout: none; /* iOS Safari */ -webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */ -webkit-user-select: none; /* Safari */
@ -100,3 +106,14 @@
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
body {
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-thumb {
background: #E2E8F0;
border-radius: 20px;
}
}

5
src/components/Modals/AddModal.vue
View file

@ -131,7 +131,10 @@ export default {
skip_checking: false, skip_checking: false,
fileInputRules: [ fileInputRules: [
v => { v => {
const result = v.every(f => f.type === 'application/x-bittorrent' ) const result = v.every(f => {
if (f.type) return f.type === 'application/x-bittorrent'
else return /^.*\.torrent$/.test(f.name)
})
return result ? result : 'One or more files is not a valid torrent' return result ? result : 'One or more files is not a valid torrent'
} }
], ],

20
src/components/Modals/SettingsModal/Tabs/Vuetorrent/General.vue
View file

@ -82,6 +82,14 @@
<p class="mb-2">{{ version }}</p> <p class="mb-2">{{ version }}</p>
</v-col> </v-col>
</v-row> </v-row>
<v-row dense>
<v-col cols="10" sm="10" md="11">
<p class="subtitle-1">QBittorrent Version:</p>
</v-col>
<v-col cols="2" sm="2" md="1">
<p class="mb-2">{{ Qbitversion }}</p>
</v-col>
</v-row>
</v-container> </v-container>
</v-form> </v-form>
</div> </div>
@ -92,11 +100,13 @@
<script> <script>
import { mapState, mapGetters } from 'vuex' import { mapState, mapGetters } from 'vuex'
import qbit from '@/services/qbit'
export default { export default {
name: 'General', name: 'General',
data() { data() {
return { return {
paginationSizes: [5, 15, 30, 50] paginationSizes: [5, 15, 30, 50],
Qbitversion: 0
} }
}, },
computed: { computed: {
@ -161,6 +171,14 @@ export default {
version() { version() {
return this.getAppVersion() return this.getAppVersion()
} }
},
methods : {
async fetchQbitVersion(){
this.Qbitversion = await qbit.getAppVersion()
}
},
created() {
this.fetchQbitVersion()
} }
} }
</script> </script>

2
src/components/Modals/TorrentDetailModal/Tabs/Content.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<v-card flat> <v-card flat>
<perfect-scrollbar> <perfect-scrollbar>
<v-card-text :style="{ minHeight: phoneLayout ? '' : '75vh'}"> <v-card-text :style="{ minHeight: phoneLayout ? '' : '75vh', maxHeight: '75vh'}">
<v-treeview <v-treeview
v-model="selected" v-model="selected"
:items="fileTree" :items="fileTree"

2
src/components/Modals/TorrentDetailModal/Tabs/Info.vue
View file

@ -3,7 +3,7 @@
<perfect-scrollbar> <perfect-scrollbar>
<v-card-text <v-card-text
style="font-size: 1.1em" style="font-size: 1.1em"
:style="{ minHeight: phoneLayout ? '' : '75vh'}" :style="{ minHeight: phoneLayout ? '' : '75vh', maxHeight: '75vh'}"
> >
<v-simple-table> <v-simple-table>
<tbody> <tbody>

2
src/components/Modals/TorrentDetailModal/Tabs/Peers.vue
View file

@ -6,7 +6,7 @@
:items="peers" :items="peers"
:items-per-page="-1" :items-per-page="-1"
:hide-default-footer="true" :hide-default-footer="true"
:style="{ minHeight: phoneLayout ? '' : '75vh'}" :style="{ minHeight: phoneLayout ? '' : '75vh', maxHeight: '75vh'}"
> >
<template v-slot:item="row"> <template v-slot:item="row">
<tr> <tr>

2
src/components/Modals/TorrentDetailModal/Tabs/Trackers.vue
View file

@ -5,7 +5,7 @@
:headers="headers" :headers="headers"
:items="trackers" :items="trackers"
:hide-default-footer="true" :hide-default-footer="true"
:style="{ minHeight: phoneLayout ? '' : '75vh'}" :style="{ minHeight: phoneLayout ? '' : '75vh', maxHeight: '75vh'}"
> >
<template v-slot:item="row"> <template v-slot:item="row">
<tr> <tr>

2
src/components/Navbar/FilterSelect.vue
View file

@ -62,7 +62,7 @@ export default {
{ value: 'stalled', name: 'Stalled' }, { value: 'stalled', name: 'Stalled' },
{ value: 'stalled_uploading', name: 'Stalled Uploading' }, { value: 'stalled_uploading', name: 'Stalled Uploading' },
{ value: 'stalled_downloading', name: 'Stalled Downloading' }, { value: 'stalled_downloading', name: 'Stalled Downloading' },
{ value: 'errored', name: 'Erorred' } { value: 'errored', name: 'Errored' }
], ],
selectedState: { value: 'all', name: 'All' }, selectedState: { value: 'all', name: 'All' },
selectedCategory: null selectedCategory: null

16
src/components/Navbar/Navbar.vue
View file

@ -25,11 +25,10 @@
<v-navigation-drawer <v-navigation-drawer
app app
v-model="drawer" v-model="drawer"
class="primary" class="primary drawer"
style="position: fixed; height: 100%" style="position: fixed; height: 100%"
disable-resize-watcher disable-resize-watcher
> >
<!--current download speeds -->
<v-flex class="mt-3" v-if="status"> <v-flex class="mt-3" v-if="status">
<CurrentSpeed <CurrentSpeed
v-if="webuiSettings.showCurrentSpeed" v-if="webuiSettings.showCurrentSpeed"
@ -105,3 +104,16 @@ export default {
} }
} }
</script> </script>
<style lang="scss">
#app > div > nav > nav > div.v-navigation-drawer__content {
height: 95%;
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-thumb {
background: #56718c;
border-radius: 20px;
}
}
</style>

3
src/models/torrent.js
View file

@ -47,8 +47,9 @@ export default class Torrent {
case 'checkingDL': case 'checkingDL':
case 'checkingUP': case 'checkingUP':
case 'checkingResumeData': case 'checkingResumeData':
case 'moving':
return 'Checking' return 'Checking'
case 'moving':
return 'Moving'
case 'unknown': case 'unknown':
case 'missingFiles': case 'missingFiles':
return 'Fail' return 'Fail'

1
src/services/qbit.js
View file

@ -12,6 +12,7 @@ class Qbit {
getAppVersion() { getAppVersion() {
return this.axios.get('/app/version') return this.axios.get('/app/version')
.then(res => res.data)
} }
getApiVersion() { getApiVersion() {

2
src/styles/variables.scss
View file

@ -7,6 +7,7 @@ $torrent-seeding: #26a69a;
$torrent-checking: #ff7043; $torrent-checking: #ff7043;
$torrent-stalled: #81c784; $torrent-stalled: #81c784;
$torrent-metadata: #7e57c2; $torrent-metadata: #7e57c2;
$torrent-moving: #ffaa2c;
:export { :export {
torrent-done-color: $torrent-done; torrent-done-color: $torrent-done;
@ -18,4 +19,5 @@ $torrent-metadata: #7e57c2;
torrent-checking-color: $torrent-checking; torrent-checking-color: $torrent-checking;
torrent-stalled-color: $torrent-stalled; torrent-stalled-color: $torrent-stalled;
torrent-metadata-color: $torrent-metadata; torrent-metadata-color: $torrent-metadata;
torrent-moving-color: $torrent-moving;
} }