BillyBlaze / OctoPrint-TouchUI

A touch friendly interface for a small TFT module or phone
https://billyblaze.github.io/OctoPrint-TouchUI/
GNU Affero General Public License v3.0
274 stars 92 forks source link

Can't select menu items below the viewport #500

Closed leanazulyoro closed 3 years ago

leanazulyoro commented 3 years ago

Hi! I noticed difficulties selecting elements in the menu that I need to scroll in order to reach.

Here, a video is worth a million words: https://user-images.githubusercontent.com/1864435/123491568-5a119800-d5ed-11eb-8c26-9c7b3c363c88.mov

This happens to me on any smartphone I have (all android devices), as well as desktop emulating a mobile device with touch events. It does not happen however without touch emulation: https://user-images.githubusercontent.com/1864435/123491703-bd032f00-d5ed-11eb-855b-eed3ffc8067a.mov

BillyBlaze commented 3 years ago

Hi! Thanks for reporting. I have looked at the video's and I have tried to reproduce the same. However I am unable to get the same issue with both the Firefox emulation and my android device.

My suspicion is that a plugin is causing a conflict (e.g. preventing the event from bubbling up). Could you perhaps share your installed plugins? or you could disable them to see which one is the culprit and report the issue over there.

leanazulyoro commented 3 years ago

I tried disabling all my plugins, and it worked ok, but I suspect it's only because having them disabled makes the menu shorter, and that way it actually fits in the viewport. I then installed plug-ins a few at a time until they populated the menu enought so it needs scrolling to reach the last items. At that moment the elements that are outside the first scroll are not tappable.

Here I need to scroll in order to reach the logout and system items, and indeed, they present the bug. Screenshot_20210704-180428_Chrome.jpg

leanazulyoro commented 3 years ago

I can even force the bug to occur on landscape mode, and that way it happens on higher items, since there are fewer that fit in the menu.

I can tap all those items visible Screenshot_20210704-181109_Chrome.jpg

But I cannot tap the ones under the first scroll Screenshot_20210704-181121_Chrome.jpg

leanazulyoro commented 3 years ago

Ok, I'm pretty confident the spool manager plugin is the culprit. Please let me know if you can reproduce it by enabling that plugin! Screenshot_20210704-193859_Chrome.jpg

gobbledygoober commented 3 years ago

I encountered this as well.

OctoPrint 1.6.1 Python 3.7.3 OctoPi 0.18.0 TouchUI 0.3.17 SpoolManager 1.4.3

@leanazulyoro - nice find! Your workaround of disabling SpoolManager worked for me as well.

It should be noted that I only installed SpoolManager because it is listed as an optional/recommended plug-in when installing PrintJobHistory (1.14.0).

BillyBlaze commented 3 years ago

Thanks for the information. I am able to reproduce the issue too now.

The good news: I have tracked down the code that is interfering. Inside SpoolManager there is a plugin named 'pick-a-color.js'. This piece of code called executeUnlessScrolled (its even in the name) is preventing the items to be clicked after scrolling on a touch device. All I can say is 'bad plugin'!

The bad news: I cannot do anything about it. It needs to be fixed inside the code base of SpoolManager. The authors of SpoolManager might even need to report this to 'pick-a-color.js'.


As there is nothing I can do inside TouchUI I am therefor closing this issue. Please feel free to create an issue in SpoolManager and refer to this issue for some more technical details.

leanazulyoro commented 3 years ago

@BillyBlaze thanks for the help! I will report to spoolmanager developers, as I did want to use it to track my spools.

gobbledygoober commented 3 years ago

@leanazulyoro are you planning on posting on https://github.com/OllisGit/OctoPrint-SpoolManager/issues?

gobbledygoober commented 3 years ago

@leanazulyoro are you planning on posting on https://github.com/OllisGit/OctoPrint-SpoolManager/issues?

Since you logged this issue, I logged the SpoolManager one here:

https://github.com/OllisGit/OctoPrint-SpoolManager/issues/188

Thanks!

leanazulyoro commented 3 years ago

@leanazulyoro are you planning on posting on https://github.com/OllisGit/OctoPrint-SpoolManager/issues?

Since you logged this issue, I logged the SpoolManager one here:

https://github.com/OllisGit/OctoPrint-SpoolManager/issues/188

Thanks!

That's perfect, yes I was gonna post it there, feel free to tag me there if you need anything that would help solve the issue.

github-actions[bot] commented 3 years ago

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.