ruTorrent v5.1 - Beta (Please reply here for feedback)

[stickz]

What would you like changed about the web client?

I would like the legend not to overlap with text when scrolling on mobile.

Describe the solution you'd like and propose possible alternatives.

Implementing appropriate CSS style changes to avoid the undesired behavior.

Provide information and resources about the environment hosting the web client.

Server: ruTorrent v5.0-Beta 1 on Ubuntu 24.04 LTS
Web Client: Google Chrome 129.0.6668.59
Installation Method: zip source from version release

Additional context

I believe @jevenski is able to resolve this problem. Here is a screenshot to provide additional context.

[jevenski]

Can we preserve the sticky feature of the legend text, that sticks to the viewport until the cobtaining box is scrolled completely outside the viewport? I like this one, as it's cool and helpful for long fieldsets blocks. We can define the background color of the legend text to prevent the overlapping.

[stickz]

Can we preserve the sticky feature of the legend text, that sticks to the viewport until the cobtaining box is scrolled completely outside the viewport? I like this one, as it's cool and helpful for long fieldsets blocks. We can define the background color of the legend text to prevent the overlapping.

I think that is a great idea, as long as we're able to clean it up properly. Can we still keep the elements inside the div group (with the legend) while we scroll?

[jevenski]

Yes, we can have the elements inside the group. We just add a non-transparent background to the legend text to cover the elements underneath to prevent overlapping. I've created a new pull request here (with a screenshot inside):

#2722

[Airman8]

What would you like changed about the web client?

1: On mobile, the side menu accessed by the "..." button takes up the entire width of the viewport, resulting in there being no room beside the menu to touch and close out of it. If I switch my phone to landscape mode and then back to portrait mode again, the menu width is correct (the same as on my PC). Refreshing the page after switching orientation results in the menu again expanding to the full viewport width.

2: Another minor thing is the tabs in the lower torrent info section (General, Files, Trackers, etc.). When I press a tab, it slowly expands the tab bar vertically and pushes down the content of the tab below. It also results in the tab quickly snapping up and then sagging down again every time I press a different tab.

Describe the solution you'd like and propose possible alternatives.

1: Probably needs a CSS fix to force the menu not to expand all the way, or perhaps a way to properly detect the media width on first load? Otherwise, a button could be added to the left of the "ruTorrent v5.B.1" label to close the side menu. Another option would be to shift the vertical position of the side menu down so as not to cover the button on the main page.

2: I think the tab pop-out behaviour would be okay if it were faster and if the tab bar had a fixed height; however, I personally would prefer no transition at all, since the content of the tab loads immediately without transition anyway.

Provide information and resources about the environment hosting the web client

OS: Raspberry Pi OS (Debian Bookworm)
Server: nginx
Installation method: tarball source from version release
Web browser:

• Chrome for Android version 129.0.6668.71
• Firefox for Android version 130.0.1
  Device: Samsung Galaxy S9

Thank you for all the effort on this UI rewrite. It's looking great so far :)

[jevenski]

Hi, @Airman8 , thank you for testing and the all feedback!

1: On mobile, the side menu accessed by the "..." button takes up the entire width of the viewport, resulting in there being no room beside the menu to touch and close out of it. If I switch my phone to landscape mode and then back to portrait mode again, the menu width is correct (the same as on my PC). Refreshing the page after switching orientation results in the menu again expanding to the full viewport width.

There is a close button on the top-right corner of the panel. I realize that it might not be easy enough to spot, especially in dark themes. We'll adjust the color schemes if that's the problem. As for the side panel width, the current version won't set the width of the side panel for mobile screens (< 768px), so it would take the default value of the Bootstrap framework. We can adjust the process to set the width of the side panel for any screen size.

2: Another minor thing is the tabs in the lower torrent info section (General, Files, Trackers, etc.). When I press a tab, it slowly expands the tab bar vertically and pushes down the content of the tab below. It also results in the tab quickly snapping up and then sagging down again every time I press a different tab.

I didn't see the slow transition on the tab list and the tab detail page. Have you tried disabling the "iPad" plugin? This plugin simulates mouse events on touch events, and causes strange behaviors. It's going to be remove in the final stable release. For now, just disabling it should be fine.

[stickz]

@Airman8 Thank you for your feedback. We have addressed it and tagged ruTorrent v5.0-Beta-2 with 10 bug fixes. Would you like to test it (with the ipad plugin deleted) and let us know what you think?

[Airman8]

@Airman8 Thank you for your feedback. We have addressed it and tagged ruTorrent v5.0-Beta-2 with 10 bug fixes. Would you like to test it (with the ipad plugin deleted) and let us know what you think?

@stickz Sure, I installed v5.0-beta2 and have been looking at all the themes.

There is a close button on the top-right corner of the panel. I realize that it might not be easy enough to spot, especially in dark themes. We'll adjust the color schemes if that's the problem.

@jevenski I realize I had neglected to mention that I was using the MaterialDesign theme. I edited my comment for brevity and accidentally cut that part out - my apologies. I turned up the brightness on my phone and did see the button.

I didn't see the slow transition on the tab list and the tab detail page. Have you tried disabling the "iPad" plugin? This plugin simulates mouse events on touch events, and causes strange behaviors. It's going to be remove in the final stable release. For now, just disabling it should be fine.

I checked that the ipad plugin was disabled in my previous installation, and it has been removed in v5.0-beta2 as well.

For v5.0-beta2, I tried all the other themes on both desktop and mobile. I noticed that this particular issue with the tab bar growing downward is only happening with the MaterialDesign theme.

I also found that clicking on certain tabs in all the other themes causes the whole bottom section to grow vertically by 1 or 2 pixels. The tabs that do this the most often are the history and plugins tabs, but it happens with others depending on the theme. (Incidentally, this doesn't happen in the MaterialDesign theme.) I thought that it might be caused by the content of the active tab having x-overflow content, which could cause the scrollbar to appear and maybe bump the tab upward. But it happens even if I make the various fields in each tab narrower so that everything fits on the screen, so I'm not sure what's really making it happen. This isn't a big usability issue or anything. It's just a quirky UI thing where I can see the tab bar moving slightly up and down as I click through the tabs.

As for the X button in the side menu, it does look like just a matter of dark themes vs light themes. The X is always black, so it doesn't show up well in dark themes. Is it possible to get the colour of the X to match the colour of the other menu buttons? (for example, grey in the dark theme and blue in the MaterialDesign theme)

In the "DarkBetter" theme, the triangle icon on the side menu which indicates whether sections are visible or folded gets bigger for folded sections. This does not happen in the "Dark" theme though.

I was messing around in the right-click shortcut menu to see how it felt to navigate, and I accidentally removed a torrent because I touched "remove" when I meant to press "set channel". This could be a fatal "off-by-one error" if someone were to accidentally remove a whole label or tracker worth of torrents. In case anyone else has fat fingers like me, would it be possible to increase the vertical padding of the menu items on the mobile layout?

Looking forward to the full release!

[koblack]

1. js error when trying to add or remove icon for label

webui.js?v=5b2:2461 Uncaught TypeError: catlist.refreshTorrentLabelTree is not a function from TypeError: catlist.refreshTorrentLabelTree is not a function
    at request.onloadend (<anonymous>:7119:15)

2. plugin: rssurlrewrite: Unable to add new rules. The OK button doesn't seem to work. Unable to save changes.

3. plugin: rss: Unable to add new RSS group. The OK button doesn't seem to work. Unable to save changes.

4. Allow to make the bottom panel bigger. This is especially useful when browsing torrents containing thousands of files. Version v4.3.6 allowed to enlarge it to the maximum.

5. On mobile when you open a window from the side panel you can't enter text. For example, try changing the name of a view.

6. plugin: screenshots: When you turn on the slide show, the PLAY button is still displayed instead of STOP.

[jevenski]

1: On mobile, the side menu accessed by the "..." button takes up the entire width of the viewport, resulting in there being no room beside the menu to touch and close out of it. If I switch my phone to landscape mode and then back to portrait mode again, the menu width is correct (the same as on my PC). Refreshing the page after switching orientation results in the menu again expanding to the full viewport width.

Hi, @Airman8 , I adjusted the resize function of side panel to skip resizing on mobile, Now the side panel should always be of default width of Bootstrap's offcanvas panel.

Hi, @koblack , here's some fixes according to your feedback. The others were probably introduced by some earlier commits, and I'm still on the way of getting familiar with them, and not 100% sure how to fix them properly. Perhaps someone can fix those before I figure out how those features work.

2. plugin: rssurlrewrite: Unable to add new rules. The OK button doesn't seem to work. Unable to save changes.
3. plugin: rss: Unable to add new RSS group. The OK button doesn't seem to work. Unable to save changes.
6. plugin: screenshots: When you turn on the slide show, the PLAY button is still displayed instead of STOP.

These three bugs were fixed.

4. Allow to make the bottom panel bigger. This is especially useful when browsing torrents containing thousands of files. Version v4.3.6 allowed to enlarge it to the maximum.

Options were added to the General UI settings to allow setting the min width of the side panel and the min height of the list table. You can set the values as per your need.

Related PR: #2723

[jevenski]

For v5.0-beta2, I tried all the other themes on both desktop and mobile. I noticed that this particular issue with the tab bar growing downward is only happening with the MaterialDesign theme.

I also found that clicking on certain tabs in all the other themes causes the whole bottom section to grow vertically by 1 or 2 pixels. The tabs that do this the most often are the history and plugins tabs, but it happens with others depending on the theme. (Incidentally, this doesn't happen in the MaterialDesign theme.) I thought that it might be caused by the content of the active tab having x-overflow content, which could cause the scrollbar to appear and maybe bump the tab upward. But it happens even if I make the various fields in each tab narrower so that everything fits on the screen, so I'm not sure what's really making it happen. This isn't a big usability issue or anything. It's just a quirky UI thing where I can see the tab bar moving slightly up and down as I click through the tabs.

These minor issues are less urgent than the other issues below, but could take longer time to diagnose, so I think we can let them go now and come back to them after the stable release and fix them in v5.1.

As for the X button in the side menu, it does look like just a matter of dark themes vs light themes. The X is always black, so it doesn't show up well in dark themes. Is it possible to get the colour of the X to match the colour of the other menu buttons? (for example, grey in the dark theme and blue in the MaterialDesign theme)

It's very likely that the X button wasn't adapted to different themes when first introduced. I can look into this one.
Edit: Fixed!

In the "DarkBetter" theme, the triangle icon on the side menu which indicates whether sections are visible or folded gets bigger for folded sections. This does not happen in the "Dark" theme though.

This could be related to the image files themselves that are being used as the background images. I can look into this one, too.
Edit: Fixed!

I was messing around in the right-click shortcut menu to see how it felt to navigate, and I accidentally removed a torrent because I touched "remove" when I meant to press "set channel". This could be a fatal "off-by-one error" if someone were to accidentally remove a whole label or tracker worth of torrents. In case anyone else has fat fingers like me, would it be possible to increase the vertical padding of the menu items on the mobile layout?

I'm thinking about increasing the font size of the entire page to 16px on mobile, as it's the recommended font size for mobile apps. That would also reduce the likability of those fatal off-by-one errors happening (I made an exactly same error of deleting a torrent myself.) This change, however, requires more fine tuning as it affects the entire page, so more tests need to be done before I push this one.

[jevenski]

What would you like changed about the web client?

Removing the iPad plugin did leave a side-effect on iOS devices. A major regression is that the contextmenu event is not supported on iOS browsers Source: MDN, so we are unable to bring up any context menus by long pressing.

Describe the solution you'd like and propose possible alternatives.

I'm thinking about defining a custom event for iOS devices to respond to long pressing actions and bring up the context menus.

Provide information and resources about the environment hosting the web client.

Server: ruTorrent v5.0-Beta 2 on Ubuntu 22.04 LTS
Web Client: Latest Safari on iPhone Xs running iOS 17.6.1, and technically any browser on iOS because they all run with the same core on iOS.
Installation Method: zip source from version release

Additional context

None.

[stickz]

@jevenski I've brought back the iPad plugin and only enabled it for Safari. This should resolve that problem. feac220

[stickz]

@Airman8 @koblack @jevenski Thanks so much for your help! You've helped us eliminate 20 bugs before posting a stable release of ruTorrent! We've addressed your feedback! I've posted one final beta version of v5.0. Could you give it a try and give your thoughts about posting a stable version of ruTorrent? https://github.com/Novik/ruTorrent/releases/tag/v5.0-beta3

@jevenski and I would like to get started on ruTorrent v5.1. We can most certainly adjust font sizes, the torrent information layout, make sub menu improvements etc. in this minor release. My plan was to delay that until ruTorrent v5.1. We've made a lot of changes in ruTorrent v5.0. We need to start anther development cycle, to effectively resolve any potential problems.

[Airman8]

I looked at the themes again in v5.0-beta3

Side menu width is now consistent when I rotate to landscape orientation and then back to portrait again. On my Galaxy S9 the menu fills (edit: almost) the whole viewport width, but I can navigate away with the X button so no worries.

Another very minor thing, maybe for a later version: The background colour of the X button seems to be getting affected by the backdrop fader while the side menu is open, so it looks darkened in the same way as the inactive buttons. In the Oblivion theme it's a bit low contrast, but it's still visible enough.

[koblack]

1. Oblivion - side panel on mobile

2. On all tabs cannot scroll content to the bottom. The content at the bottom cannot be displayed. In the Files tab, percentages are also displayed on the bottom bar.

4. MaterialDesign / Oblivion - settings top right corner

5. RSS Manager - maybe it's an intentional change, but the reset button changes its position

6. just to check that it looks as it should

[stickz]

Great job testing everyone! Keep up the good work! We are getting very close to tagging the stable v5.1 release!

[jevenski]

Originally posted by @koblack in #2748 (comment)

Screenshots on mobile has overflow flaws. Submitting a PR to address this issue: #2773

[stickz]

@koblack @jevenski @castillo92 I've posted ruTorrent v5.1-beta4. Your help testing would be greatly appreciated. I've decided to delay ruTorrent v5.1 stable by 1 week to test more. https://github.com/Novik/ruTorrent/releases/tag/v5.1-beta4

[Airman8]

I can't vertically scroll the RSS Manager on mobile, so everything below the heading "RatioGroup" is invisible. This includes the RatioGroup selection box, the Channel heading and selection box, as well as the Reset, OK, and Cancel buttons.

Very minor UI thing I also noticed with the left menu. The X button is shaded to look like it's in the background even though it's in the foreground.

Other than that, I haven't noticed any major issues.

[adapowers]

Hi! Love this feedback thread, and love the 5.1 beta. Some enhancements that would go a long way for me on mobile: (Safari, iPhone 14 Pro)

• +1 to the long-press issues; to avoid activating context menu on a row, I basically have to tap and flick, which also makes me run into:
• The elasticity on the table is set to infinite, so while scrolling you constantly have to tap to “catch it”.
• No way to multi-select rows! This is currently the biggest pain point for me.
• Adjustable row sizing. It’s currently desktop-parity, but having the option to make the rows chunkier would be so great.

Thank you!

[koblack]

Side panel comparison v4.3 (left) vs v 5.1 (right)
Minor issues with MaterialDesign and Oblivion

• MaterialDesign

• Oblivion

• Acid

• Blue

• DarkBetter

• Excel

• Standard

[koblack]

Menu comparison v4.3 (top) vs v 5.1 (bottom)
There are some color changes here and there, Oblivion and DarkBetter most significantly.

• MaterialDesign

• Oblivion

• Acid

• Blue

• DarkBetter

• Excel

• Standard

[koblack]

General tab comparison v4.3 (top) vs v 5.1 (bottom)

• MaterialDesign

• Oblivion

• Acid

• Blue

• DarkBetter

• Excel

• Standard

[jevenski]

I can't vertically scroll the RSS Manager on mobile, so everything below the heading "RatioGroup" is invisible. This includes the RatioGroup selection box, the Channel heading and selection box, as well as the Reset, OK, and Cancel buttons.

Submitting a PR for this one: #2778. It was previously planned for v5.2, but now it seems more urgent that we'd better include this in v5.1 stable.

[stickz]

I can't vertically scroll the RSS Manager on mobile, so everything below the heading "RatioGroup" is invisible. This includes the RatioGroup selection box, the Channel heading and selection box, as well as the Reset, OK, and Cancel buttons.

Submitting a PR for this one: #2778. It was previously planned for v5.2, but now it seems more urgent that we'd better include this in v5.1 stable.

@Airman8 Thanks so much for reporting this issue! We've now resolved it! Could you confirm a successful resolution by trying the latest master zip file? https://github.com/Novik/ruTorrent/archive/refs/heads/master.zip

[stickz]

Hi! Love this feedback thread, and love the 5.1 beta. Some enhancements that would go a long way for me on mobile: (Safari, iPhone 14 Pro)

• +1 to the long-press issues; to avoid activating context menu on a row, I basically have to tap and flick, which also makes me run into:
• The elasticity on the table is set to infinite, so while scrolling you constantly have to tap to “catch it”.
• No way to multi-select rows! This is currently the biggest pain point for me.
• Adjustable row sizing. It’s currently desktop-parity, but having the option to make the rows chunkier would be so great.

Thank you!

Thanks for the feedback @adapowers. Could you try downloading the Google Chrome application on your iPhone 14 Pro and report back how much easier it is to operate ruTorrent? Safari has known item selection issues, which can't be addressed in v5.1.

Also, we plan to make more improvements like font and row sizing in v5.2.

[castillo92]

Hello @stickz

In general, I didn't found important issues in iOS 18.1, only this two litte things, for me low priority and importance:

1. If you try to add a torrent and then press [X] button to close the window, lot of times is also pressed "Create torrent" button behind it.

5.1b4.mp4

2. This not woks as i liked or expected: the priority menu is popped outside-left screen when you click on a file inside a multiple files torrent, preventing user to read the list (high, medium, low, no priority) and do not know what are you clicking.

5.1b4_2.mp4

[Airman8]

@Airman8 Thanks so much for reporting this issue! We've now resolved it! Could you confirm a successful resolution by trying the latest master zip file? https://github.com/Novik/ruTorrent/archive/refs/heads/master.zip

@stickz We're closer to resolution, but there's one remaining issue. The content of the dialogue box scrolls properly, but the position of the three buttons is fixed and partially hidden behind the soft keys of my phone's UI.

Phone is a Samsung Galaxy S9 running LineageOS (old and completely lacking a back plate, but still hanging on).

This is as much as I can see of the buttons:

[gijsyo]

I am now running 5.1.B4 and I've noticed that the diskspace graphic and the port status indicater images do not load. I did recently switch from single user to multi user though. Any pointers as to where I might start to look? I cleared my browsers cache but to no avail. AFAIK, Apache isn't caching anything.

Edit: this is when connecting over http. The https version works fine. Strange!

[jevenski]

ruTorrent/css/style.css

Lines 149 to 150 in a1c7969

	max-width: 95vw;
	max-height: 95vh;

I'm thinking the dynamic viewport height could be the culprit. The dialog window now takes 95% of viewport height which is what the 95vh rule do, and the bottom part of the viewport is taken by the system navigation bar, and hence the overlapping. Changing the units of vh and vw to dvh and dvw in these lines might solve the problem, like we did for the height of the main content. Judging from the screenshot, the height of the main content and the position of the status bar is correct, and we have already applied dvh rules on that part.
However, I don't have such a device to verify the solution. The mobile interface on a desktop browser's DevTools always has a fixed viewport height. My android phone doesn't have such a display issue. Maybe you could do such a modification on your server and see how it turns out, rather than I submitting an untested PR? If it does solve the problem, you can file a PR and become a contributor yourself!

[koblack]

Quick test of both units. It seems that dvh fixing the problem. Screenshots below.

  max-width: 95vw;
  max-height: 95vh;

  max-width: 95dvw;
  max-height: 95dvh;

[Airman8]

Quick test of both units. It seems that dvh fixing the problem. Screenshots below.

This fix worked for me as well, with the same results as @koblack had.

I tested the other windows as well, and nothing changed from before, so they all work still too.

If it does solve the problem, you can file a PR and become a contributor yourself!

@jevenski Sure thing! I have submitted a PR for this fix. Oops, I just saw that @koblack already had this PR open, so I closed mine.

[koblack]

Something is wrong with the default group setting for plugins ratio and throttle.
For example, setting the default channel to 5 in the settings causes new torents to be added with group No. 4.
This works as expected in v4.3.9 so this is a regression in v5

[stickz]

We've released Beta 5 to address everyone's feedback! Are we ready now for the stable release?
https://github.com/Novik/ruTorrent/releases/tag/v5.1-beta5

[Airman8]

The issue with the RSS downloader remains resolved in Beta 5, and I've found no other issues so far.

[castillo92]

Hello Stickz, testing 5.1B5. At first sight, no bugs.

But I ask you a question... I allways make an update of ruTorrent, I lost the list of limits od DL an UP Speeds.

Where is stored to make it backupeable?

This is my procedure to update ruTorrent.

# Backup
	sudo mv /var/www/rutorrent /home/my_user/Desktop/BackUps/rutorrent_2024_11_18

# Update
	sudo git clone https://github.com/Novik/ruTorrent.git /var/www/rutorrent/

# Restore configs and user/password login
	sudo cp /home/my_user/Desktop/BackUps/rutorrent_2024_11_18/conf/config.php /var/www/rutorrent/conf
	sudo cp /home/my_user/Desktop/BackUps/rutorrent_2024_11_18/.htaccess /var/www/rutorrent/
	sudo cp /home/my_user/Desktop/BackUps/rutorrent_2024_11_18/.htpasswd /var/www/rutorrent/

# Permissions:
	sudo chown -R www-data:www-data /var/www/rutorrent

[jevenski]

Hello Stickz, testing 5.1B5. At first sight, no bugs.

But I ask you a question... I allways make an update of ruTorrent, I lost the list of limits od DL an UP Speeds.

Where is stored to make it backupeable?

User settings and uploaded torrent files (if set to be saved) are stored in share/. You should copy this folder to the new installation as well as the conf/ folder.

[ranirahn]

I found very interesting bug and I dont even understand how is this possible.
What i did
Add Torrent->Select directory (example NEW MOVIES)->paste magnet link to Torrent URL box->Click Add URL

Now I have 2 folders named NEW MOVIES. I did not think i even could greate 2 folders with exactly the same name. I am so confused. Now old movies are in old folder and new movies are in new folder.