Documents not editable in Android 4.1 browser on small screen

[sathomas]

Trying to use beta.etherpad.org from a Huawei Prism II (320x480 screen resolution, Android 4.1) there are many problems:

• Tapping on the document area (to edit a document) brings up the keyboard which obscures the content area. It is not possible to scroll the content area into view as the page does not respond to scroll swipes.

• As also seen above, the right side of the toolbar shows up below the document instead of above it. Also, tapping these buttons has no effect.
• The auto-correct / spell check continually flashes on/off. To successfully type characters users must "synchronize" their typing with the auto-correct / spell check. That's a challenge worthy of the best video gamers.

[JohnMcLear]

You opening these issues so you can submit a fix or? Looks like you are, just don't wanna assign to anyone else if that's the case

[sathomas]

Alas, I'm not at all familiar with the etherpad codebase. Any patch I might submit would probably cause more harm than good.

[marcelklehr]

Can you reproduce these bugs in a commonly used browser like Firefox or
Chrome?

[sathomas]

Both Chrome and Firefox do a better job with the toolbar, but in neither case is Etherpad usable since the toolbar and keyboard obscure the content area:

(Not sure I'd refer to either as "commonly used". Most browser stats show Android is by far the most common browser on Android.)

[marcelklehr]

Oh. I didn't know most people use the default browser...

I see what you mean, though. However, the site you tested
(beta.etherpad.org) is not a reference instance (in fact it runs with
lots of plugins to show off etherpad's capabilities).

I think the biggest difference is probably the title bar, which kinda
blocks the whole screen estate on beta.etherpad.org, if your screen is
small. As an example for a "pure" etherpad instance, you could test with
pad.riseup.net; at least, they don't have that title bar plugin installed.

[marcelklehr]

I don't think we can do much about the default Android browser, since I
suspect it can't deal with etherpad, which might just be sloppiness
(considering etherpad works on virtually all major desktop browsers).
I'm not sure here, though.

Apart from that, how could mobile user experience be improved, in your
opinion?

The toolbars are a problem we have to figure out, I agree.

[JohnMcLear]

I didn't make beta.etherpad.org mobile friendly at all, some very basic responsive css would solve 99% of these issues but it's a case of finding the time to do it.. @0ip being my favorite etherpad designer but he is busy with studies..

[JohnMcLear]

On a side note, I actually think this issue needs closing here and opening on the individual plugin repos.. Or screen shots showing a non plugin enabled site should be used.. Afaik the only major issue EP faces is the overflow / layout of buttons on mobile..

On another side note, using cordova w/ a pad in an iframe is a semi decent app experience.. although ep_page_view needs some work on it's responsive CSS.. Again this is all CSS stuff so very low hanging..

[prtksxna]

I have added #2267 to fix the extended toolbar issue. #2254 will make the icons look sharp, even though this doesn't directly affect the experience I think it makes a large difference.

[JohnMcLear]

swipe editbar down from the top and swipable from the left-right to access different buttons would be the expected UX here.