The sleekest looking WEBUI for qBittorrent made with Vuejs!

Overview

VueTorrent

The sleekest looking WebUI for qBittorrent made with Vue.js!

Vue, qBitorrent, Vuetify

Screenshots

Desktop screenshot

Mobile screenshot

Installation

Manual

  • Visit the Releases page!
  • Download the latest vuetorrent.zip
  • Unzip the downloaded file
  • Point your alternate WebUI location to the vuetorrent folder in qBittorrent settings

From Source

  • Head to the latest-release branch
  • Clone branch using
    • git clone --single-branch --branch latest-release https://github.com/WDaan/VueTorrent.git
  • Pull changes every once in a while, using git pull

Alternative methods - May work for older QBit versions

Development

  • Clone the repo
  • npm install
  • npm run serve
  • npm run lint (to format the code)
  • docker-compose up -d (to start qbittorrent docker => optional, you can edit vue.config.js as well)

Features

  • Torrents
    • add / remove / pause / resume / rename torrents
    • selectively download files
    • view info / trackers / peers / content / tags & categories
    • search for new torrents straight from the WebUI!
    • search filtering powered by Fuse.js!
  • Keyboard shortcuts!
    • select all torrents with Ctrl-A
    • delete selected torrents with delete
    • select with Ctrl+click
    • Shift-click to select from one torrent
  • System
    • see session stats (down / upload speed, session uploaded / downloaded, free space)
    • beautiful transfer graphs
    • change the most common settings
  • Extra features the default WebUI doesn't have
    • mobile friendly! (can be installed as a PWA)
    • Configureable Dashboard: choose which torrent properties are shown for both busy and completed torrents
  • works with qBittorrent v4.2 and later

Contributing

I'll gladly accept help/pull requests & advice!

FAQ

Support

Open up an issue 😛

but before you do that:

  • confirm you're on the latest version of VueTorrent
  • confirm there is no other issue mentioning the same problem

Credits

Comments
  • Possible UI tweaks

    Possible UI tweaks

    I think the following should be implemented specifically so that navigation and usability on mobile devices is improved:

    • Added On removed
    • Torrent title/Done label text removed
    • Seeds and Peers side-by-side
    • show entire torrent name
    • adjust text spacing...
      • less space between text label and text
    • Auto dark mode (w/ header color)
    Idea 
    opened by agneevX 44
  • Fix layout issues and more

    Fix layout issues and more

    Fixes

    • Fix layout issues
    • Fixes an issue where 'torrent details' modal does not work properly on iOS
    • 'Vue2-perfect-scrollbar' is no longer dependent
    • A few pixels at the end of the modal's rounded corners no longer show the background color
    • When more than one modal is open, it prevents keyboard input from the dashboard

    Improvements

    • You can adjust the roundness of the entire modal through the 'form' and 'formtop' elements in 'src/styles/variables.scss'.
    • 'formtop' must be defined as a larger size than 'form'. This is how to solve the problem of displaying the background color by overlapping the rendering alpha value.
    • The entire 'dashboard' and the entire 'add modal' area now respond to file drag and drop.
    • now can add files by dropping them in the entire area with splash screen.
    opened by m4ximuel 27
  • feature: replicate default webui copy name / hash context menu functions

    feature: replicate default webui copy name / hash context menu functions

    I select torrents and use the context menu to copy the torrent names with the default webui, can't do it with vuetorrent.

    Also can't select to copy any text in the info panel.

    opened by beyondmeat 19
  • Problems with cache busting on new release

    Problems with cache busting on new release

    When updating to a newer release of VueTorrent (BTW I really dig the new black style 🥳 GJ!)
    I always have the issue described here: https://github.com/vuejs-templates/pwa/issues/177

    There is a valid workaround explained here https://github.com/stetrevor/vuejs-pwa-demo

    I will be more thorough: ServiceWorkers only work over HTTPS (recent change), so the PWA part of vue-cli only affects the small amount of users that publish their qbittorrent webUI protected by SSL, this includes me.

    What happens then, the basic implementation of the @vue/cli-plugin-pwa does indeed cache the app, but TOO MUCH, the website never gets updated, when I update with a new release, except if used shift+ctrl+r

    Bug 
    opened by colthreepv 19
  • Unacceptable file type, only regular file is allowed

    Unacceptable file type, only regular file is allowed

    Hello,

    I followed the instructions for this which are pretty straightforward, but once I pointed QB to it, I get the error of

    Unacceptable file type, only regular file is allowed
    

    I am on v4.2.1, which had some fixes in it regarding the public/index.html but I still get the same error

    I saw previously in issue #5 that it was a separate app, is this still the case? The instructions just have you point the alt webui in qb, but that didn't work here.

    Thanks!

    Installing 
    opened by Treverr 18
  • Getting 'Unacceptable file type, only regular file is allowed' after a while

    Getting 'Unacceptable file type, only regular file is allowed' after a while

    Hi, I'm running qbittorrent-nox 4.1.5 on a Raspberry pi 4 ( Raspbian 10) and I can download VueTorrent and apply the alterate webUI without problems and for some time it works fine. But after some time (about one hour more or less) with the system at idle, when I try to access it again the webUI, I get a blank screen with 'Unacceptable file type, only regular file is allowed' message.

    After this happens the only way for me to solve it is to edit qbittorrent.conf and remove the flag for AlteranteWebUI to false, restart qbittorrent and then it can load again on the default web interface.

    Any ideas of what could be going wrong and how I can solve it? Thanks!

    Installing 
    opened by toniR15 16
  • Paused and Seeding colors are very similar

    Paused and Seeding colors are very similar

    Paused and Seeding colors are very similar When using a dark theme and lowering the brightness of the laptop screen it is hard to distinguish Paused and Seeding torrents because of very similar colors. I guess we need to change them to be much more distinguishable. 2021-02-21__23-33-01

    opened by IevgenSobko 16
  • Mention QBitTorrent

    Mention QBitTorrent

    You do a great job with this alternative UI for QBitTorrent, but it deserves to be mentioned, and prominently. Perhaps "QBitTorrent w/Vue" or something like this, instead of just "VueTorrent" in the title and dashboard. As it is now, it's a bit unfair: you're taking credit for something that is 85% someone else's work. I could not find any obvious mention of QBitTorrent on the UI currently, and it's barely mentioned here on GitHub, for example missing from the "Credits" section.

    opened by andrisi 14
  • feat: auto releasing ci

    feat: auto releasing ci

    Description

    I know there are a lot of changes and may warrant a bit of speculation, but I will try elaborate on what's going on here in a list below.

    • Introduces new action google-github-actions/release-please-action
      • I love this action because it manages releases for you.
      • Keeps a CHANGELOG based on Conventional Commits. This isn't necessary, but is cool feature.
      • Auto updates PR for next version.
      • You merge the PR when you're ready for release.
      • This means you push to master every commit and only when you merge the PR, it creates release assets and pushes to your latest-release branch (more on this later).
      • This includes auto updating the version in package.json.
    • Uploading release assets
      • Nothing really new here, but removes unnecessary zip action.
      • Changes zip name to be vuetorrent.zip rather than release.zip.
    • Pushes release automatically to latest-release
      • This part is sort of deceiving in the code because of the action name (JamesIves/github-pages-deploy-action). I have used this action in the past for GitHub pages, but this a great action for this use case.
      • What will happen is when we merge the release please PR, this action will build the project and publish to the branch, as it current is now (without a README). But we can easily update the project's README, to show how to use branch.
    • Changed when tests run
      • Nothing too crazy here, basically the same thing. But it makes sense to only run tests during pushes to master and pull requests to master in my opinion.

    Kind of did this on a whim, but figured it would be really good to have something easier to manage!

    Take a look at one of my repos and see how it publishes:

    • https://github.com/jef/streetmerchant (quite a bit of CHANGELOG and other things in this one)
    • https://github.com/jef/stargazer-vanity (shows how release asset is used)

    Feel free to ask any questions!

    opened by jef 13
  • PWA / mobile app

    PWA / mobile app

    VueTorrent is great but it seems it is lacking info about PWA ability. When using mobile browser you can't create a PWA shortcuts. It doesn't matter when using a chrome browser as it would still treat it as a web app -> When using shortcut it won't show you browser interface but this not the case with Android Firefox.

    So Firefox (and probably other non chrome browser) does not recognize VueTorrent as a web app. It would only allow you to have a shortcut which will open VueTorrent in browser without hiding browser UI. It would be really nice if it was possible to implement what is missing to make it recognized as a PWA.

    opened by Matth7878 12
  • Torrent Search Not Displaying Correctly On Mobile

    Torrent Search Not Displaying Correctly On Mobile

    Torrent search doesn't seem to work as it should on mobile. The torrent name will be cut off and the sort text does not appear. I have attached an image. I'm not sure what the best UI solution would be, I did see this design.

    IMG_20210216_220201

    images (14)

    Let me know if I can help in any design or testing way.

    opened by LukePrior 12
  • Content page on mobile truncates file names

    Content page on mobile truncates file names

    When using VueTorrent on mobile, the file names on the content page are truncated if they are too long for the display. It would be nice if these could either word wrap, or at least be able to scroll to the right to read the entire file name. Otherwise it can be impossible to know what files you are enabling/disabling for download within a particular torrent.

    opened by kaywhy1 0
  • Unchecking create subfolder option still creates subfolder on adding a torrent

    Unchecking create subfolder option still creates subfolder on adding a torrent

    pretty much what the heading says. if possible add the option to change content layout: original, create subfolder, don't create subfolder like the default qbit ui Thanks!

    Bug 
    opened by hansari97 1
  • chore(master): release 1.2.0

    chore(master): release 1.2.0

    :robot: I have created a release beep boop

    1.2.0 (2023-01-05)

    Features

    • Add support for "autorun on torrent added" option (#580) @Larsluph (19bf989)

    Bug Fixes

    • Default change location not prefilling (#583) @Larsluph (b53c331)

    Improvements

    • Add "Completed On" to dashboard customization settings (#578) (02db288)
    • Add scroll support in TorrentRightClickMenu (#589) @Larsluph (cd2f764)
    • Add toast when renameFile and renameFolder returns 409 Conflict (#588) @Larsluph (e01d9a0)

    This PR was generated with Release Please. See documentation.

    autorelease: pending 
    opened by github-actions[bot] 0
  • Login Touch ID

    Login Touch ID

    After logging in with Touch ID, Screenshot 2022-11-30 at 12 13 53 the dashboard loads. However, a new prompt is being displayed. This prompt can be canceled as one is already correctly logged into the dashboard. Screenshot 2022-11-30 at 12 14 01

    Not sure if this is a VueTorrent or Safari issue. This behaviour could be noted on other "apps" such as Filebrowser but not anymore - not sure how it was fixed.

    opened by Kajover 0
  • Strange order of files under the

    Strange order of files under the "Content" tab

    Currently files under torrent "Content" tab are listed in some seemingly arbitrary order. While it would be more logical to list them, say, alphabetically A-Z. It would make finding file so much easier!

    Thank you!

    opened by svecol 1
Releases(v1.1.0)
Owner
Daan Wijns
Daan Wijns
Vuejs-dashboard - A dashboard template with VueJS and Fastify

VueJS dashboard template (api & client) A simple dashboard template using MongoD

DEVIOO 6 Jul 13, 2022
A Simple , Minimalist And Responsive User List Made With Vue 3 And Tailwind CSS

USER LIST WITH VUE 3 Simple , minimalist and responsive User list made with VUE 3 and TAILWIND ! LINK DEMO : https://userlist-khangltm.netlify.app SOU

null 8 Dec 10, 2022
SImple todo app made with Vue 3 and bootstrap 5

todo-list Simple todo list with 3 components just practicing vue basics live preview https://vuesimpletodo.netlify.app/ Project setup npm install Com

Zackaria S. 0 Apr 11, 2022
Admin Panel created with VueJS + Vite + Tailwind

Admin Panel Created with VueJS + Vite + Tailwind Hi, this project is still in progress. I just begin my journey with Tailwind CSS, so I want to make s

Nur Muhammad 67 Oct 11, 2022
Vuejs 3 - Quasar Framework UI Design E-commerce Admin

Vuejs 3 - Quasar Framework UI Design E-commerce Admin

null 9 Dec 17, 2022
Vuetify Material Dashboard is a beautiful resource built over Vuetify, Vuex and Vuejs.

Vuetify Material Dashboard is a beautiful resource built over Vuetify, Vuex and Vuejs.

Sanam Hamza 2 Jun 6, 2022
Vuejs - Vuetify UI, Music Application Dashboard

music Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run build Lints and

null 7 Aug 18, 2022
Sample Admin Template based on Vuejs & Vuetify.

Vue Admin Template Sample Admin Template based on Vuejs & Vuetify. Introduction Vue Admin Template is a Vue.js Based Admin Template. This template use

Fatih Ünlü 265 Jan 9, 2023
VueJS-App to optimize weight loss and track calories

minska-ui VueJS-App to optimize weight loss and track calories. Minska means to lose weight in Swedish. And that's exactly what you can do with Minska

Elia 16 Jan 4, 2023
Nueva App - Dashboard VueJS

dashboard_vue Project setup yarn install Compiles and hot-reloads for development yarn serve Compiles and minifies for production yarn build Lints

Sergio Escobales 1 Feb 8, 2022
Vuejs-quran-web - A Beautiful Quran Web App Built Using Vue.js

vuejs quran الاصدار الجديد من تطبيق الويب القرآن الكريم مشاهدة التطبيق تعديل مسا

null 17 Oct 25, 2022
Kui-dashboard-vue - Admin dashboard template built with Tailwind CSS & vuejs 3

K UI Admin Dashboard Template (Vue 3) This template is not finished yet and stil

Kamona-UI 114 Dec 22, 2022
Vuetify Material Dashboard Free - A beautiful resource built over Vuetify, Vuex and Vuejs

Vuetify Material Dashboard Free - A beautiful resource built over Vuetify, Vuex and Vuejs

null 1 Mar 24, 2022
A Simple Portfolio Template built with VueJS (Vite) + TailwindCss

Welcome to Designer-portfolio ?? Spacial Credit goes to : @salmanwap A Simple Portfolio Template built with VueJS (Vite) + TailwindCss click here to s

Md Rathik 17 Nov 21, 2022
A incubator project for pc basic vuejs

A Incubator Project For PC Technology Stack javascript: vuejs + vue-router + vuex css preprocess: scss basic ui components: element-ui build: webpack

null 1 Nov 3, 2019
Falcosidekick - A simple WebUI with latest events from Falco

Falcosidekick-ui Description A simple WebUI for displaying latest events from Falco. It works as output for Falcosidekick. Usage Options -a string

Falco 64 Dec 16, 2022
A qBittorrent Web UI, write in TypeScript+Vue.

qb-web Info Features Keywords: SPA, RSS, Search, Responsive Design, Modern Design, i18n Languages: English, 中文, Русский, Türkçe TODO How to use see: W

CzBiX 1.2k Dec 30, 2022
Smart route search to make intelligent looking apps with Vue.js.

Make your users dynamically navigate routes, make smart commands and queries with a single directive. Vue Smart Route allows you to create a query sys

Fatih Kadir Akın 315 Nov 25, 2022
Viconly - Vue.js component wrapper for a free and nice-looking icon pack, Iconly

Viconly Vue.js component wrapper for a free and nice-looking icon pack, Iconly. You can see all the styles and names here Installation (add to the pro

Mohammad Momeni 0 Jul 22, 2022
Markwhen is a text-to-timeline tool. You write markdown-ish text and it gets converted into a nice looking cascading timeline.

Make a cascading timeline from markdown-like text. Supports simple American/European date styles, ISO8601, images, links, locations, and more.

Rob Koch 2.1k Dec 27, 2022