search

CDrummond / lms-material

Material skin for LMS (Lyrion Music Server)
MIT License
317 stars 74 forks source link

Mobile interface not selected except when embedded #379

Closed magicus closed 3 years ago

magicus commented 3 years ago

Something happened a number of versions before, were my iPhone suddenly does not use the mobile friendly version with the three tab buttons below, but instead gets a crammed version of the tablet layout, which is more or less unusable. :-(

This only happens when I connect directly to the web UI from Mobile Safari. When it is embedded, for instance as a separate tab in Home Assistant, I get a usable mobile UI.

magicus commented 3 years ago

DC0FDDBD-B534-4B65-B90F-D8553490131A Example from non-embedded access.

magicus commented 3 years ago

A7215BF3-B51F-4D9B-AF44-A28EC1BBDB03 Example from embedded within Home Assisstant.

magicus commented 3 years ago

Let me know if you need more information! I’ll be happy to assist with adding information about the difference in environments. It was just a bit too out of reach for me to figure out and submit a patch all by myself.

CDrummond commented 3 years ago

If you use "http://SERVER:9000/material" Material will select desktop if width>=750px Looking at apple's site that appears to be the case. However, that is the screen pixels which should not be the HTML pixels (if that makes sense). Why Safari is (I assume) reporting the device pixels and the embedded home assistant not, I'm unsure. Which iOS version is this?

As a work-around, you can force mobile layout - use "http://SERVER:9000/material/mobile"

magicus commented 3 years ago

Thanks for the workaround! I did not know about it.

Actually, this seems to be some kind of user error. Possibly some bad cookie that had been set. When I tried with the workaround, and then tried again with just SERVER:9000/material, I got the correct mobile interface. I had to delete and re-create the home screen web app as well, and then it worked there as well.

Is there a way in Material Skin to toggle between desktop and mobile layout? I did not find it, at any rate.

CDrummond commented 3 years ago

Top right of Material is a 3 dotted buton which shows a menu. Select 'Settings' from there, and within this settings dialog is an option to choose the layout. However, this option is hidden if you have forced desktop or mobile - via http://SERVER:9000/material/desktop, etc.