Jump to content

Mobile Web (small screen) GUI Looks pretty BAD


pir8radio

Recommended Posts

pir8radio

The images for the web gui, on mobile or very small screen sizes, look horrible..   They used to look great, this happened quite a few versions ago, I was hoping it was a test..   Can the settings for smaller screens not use as highly compressed images, please?  

 

 

 

57059fdeb414d_IMG_0226.png

Edited by pir8radio
  • Like 1
Link to comment
Share on other sites

pir8radio

Soooooo.....  Just to be clear...   When browsing my emby server via any small screened web browser device, the images USED to look like this, but they now look like the previous post, which are unreadable, unless you kinda' know what the cover looks like....

 

5709549071bb2_IMG_0230.png

Edited by pir8radio
Link to comment
Share on other sites

bfir3

Wow, that's a crazy difference. It's been so long since I've updated Emby but I really want to do it soon as there's a lot of nice database and playback improvements in newer builds.

Link to comment
Share on other sites

  • 2 weeks later...
shorty1483

So basically, you want the name of the item to appear under the item?

 

No, in latest server version the images look blurry and unsharp.

  • Like 1
Link to comment
Share on other sites

CBers

So web client on mobile, or the Emby (Android) App ??

 

I don't have an issue on either.

 

What quality are the images on the server ??

 

I have 1920 x 1080 images set to download on the server.

Link to comment
Share on other sites

pir8radio

So web client on mobile, or the Emby (Android) App ??

 

I don't have an issue on either.

 

What quality are the images on the server ??

 

I have 1920 x 1080 images set to download on the server.

 

Web Client on mobile...    they look fine on web browser large screens..  there is some logic in emby server compressing or shrinking the images for smaller web browsers.. its over doing it for very small (mobile) screens...     

 

Here is a proof that it is over shrinking the images based on screen size,  The first image was a screenshot with my phone in the vertical position..   I then rotated my phone reloaded emby, then tilted the phone back vertical for the second image..  The wider format allowed better images to load...  If i keep the phone in vertical position and reload, the images go to $hit again.  All i'm asking is there to be a limit on how small emby will shrink the images for small browser windows, its shrinking to the point where it looks like crap..     I am testing on Iphone using safari browser if someone wants to confirm this..

 

Normal vertical screen shot:

571e993b13df0_IMG_0272.png

 

This screen shot was taken when i loaded emby with my phone sideways (horizontal) then tipped back vertical. With loading emby up on the larger horizontal starting point it doesn't shrink the images as much, its a noticeable difference between the two.. Look at the star wars cover....

 

571e99a40c3e3_IMG_0273.png

 

So my request is to limit how small emby is allowed to shrink the server images when serving to a small screen.  This wasn't always like this..

Edited by pir8radio
Link to comment
Share on other sites

pir8radio

Here is a better example, showing that emby resizes images based on screen size.. two browser windows on the same screen, one smaller than the other, I am receiving two different image sizes from the server...    This is fine, works great, Its just shrinking them too much on ios web browsers.

 

571e9e2f52cb7_Capture.png

  • Like 1
Link to comment
Share on other sites

So, the actual issue here is that the images are not re-retrieved when you change orientation on the device...?

Link to comment
Share on other sites

pir8radio

So, the actual issue here is that the images are not re-retrieved when you change orientation on the device...?

 

No the issue is that on a very small screen emby is serving TOO small of an image, making it practically un-readable.   By turning the display sideways and reloading, emby serves slightly larger images, then when i rotate back vertical the images are readable.  So the actual issue is that emby is allowed to serve too small of images to the iphone web browser making them unreadable.  If that isn't as clear as mud...  :-)   

 

in post http://emby.media/community/index.php?/topic/33588-mobile-web-small-screen-gui-looks-pretty-bad/&do=findComment&comment=324543 you can not read the top line in the mocking jay poster,  But by tricking emby into thinking i have a larger browser window (by loading sideways first) the images get sent to the browser slightly larger, just enough to make that top line readable (second image in that post).    So my request is can we put a CAP on how small those images are allowed to be shrunk, so the GUI looks pretty and clear..  maybe no smaller than 200px on the smallest side of the image will be served no matter how small the screen is?..

Link to comment
Share on other sites

  • 1 month later...
pir8radio

So still an issue in the latest beta.....      movie posters look bad in safari on the iphone.

Link to comment
Share on other sites

pir8radio

Can someone at least point me to the JS file that is calculating the image size/quality for the safari browser, based on screen size for the movie posters, so I can change it?

 

Changing the safari quality from 50 to 80 to match the native app helped a bit, but the images are still being scaled too small for the smaller screens.

 

 

 

getDefaultImageQuality: function (imageType) {

var quality = 90;
var isBackdrop = imageType.toLowerCase() == 'backdrop';

if (isBackdrop) {
quality -= 10;
}

if (AppInfo.hasLowImageBandwidth) {

// The native app can handle a little bit more than safari
if (AppInfo.isNativeApp) {

quality -= 10;

} else {

quality -= 40;  // changed to -10 to match above, looks better still too blurry, larger images would help.
}
}

return quality;
}

 

 

Edited by pir8radio
Link to comment
Share on other sites

chef

Funny I found this post because I was just thinking about this today when I pulled the web client up in my iPhone.

 

Low resolution images load into the UI.

 

But, that isn't my biggest problem, what about the fact that the wrong cover images for movies are being loaded into the UI when loading the small column for small devices?

 

The link is proper, but the image is wrong :)

Link to comment
Share on other sites

Funny I found this post because I was just thinking about this today when I pulled the web client up in my iPhone.

 

Low resolution images load into the UI.

 

But, that isn't my biggest problem, what about the fact that the wrong cover images for movies are being loaded into the UI when loading the small column for small devices?

 

The link is proper, but the image is wrong :)

 

This has been answered in other threads. The more we increase image quality the more that problem is going to occur. Apple has very strict memory consumption limits, so strict that the only solution is to build customized layouts solely for Safari that put less images on screen at once. I do not know when we might be able to do that, as I'd rather just see future updates to safari improve the situation. Right now the solution is use the iOS app.

Link to comment
Share on other sites

chef

This has been answered in other threads. The more we increase image quality the more that problem is going to occur. Apple has very strict memory consumption limits, so strict that the only solution is to build customized layouts solely for Safari that put less images on screen at once. I do not know when we might be able to do that, as I'd rather just see future updates to safari improve the situation. Right now the solution is use the iOS app.

That was my next suggestion to pirate, to use the iPhone app.

 

I have just reinstalled it myself and it is a very pretty app, all images are right and the resolution is spot on to. :)

Link to comment
Share on other sites

pir8radio

That was my next suggestion to pirate, to use the iPhone app.

 

I have just reinstalled it myself and it is a very pretty app, all images are right and the resolution is spot on to. :)

 

Yea I had the app, but my users can not use the app without paying, even though i'm a lifetime...  My users are not on the same network...  I mean i could setup a vpn for them to activate the app... but it shouldn't be that hard..     

 

 

Can someone post a link to these other threads... I didn't see anything obvious. 

 

 

why does everything work fine when i load the page horizontal then flip vertical just so i can use the higher res images loaded when in horizontal mode? I guess I don't get the difference???.....   flip horz reload emby flip back vert images look fine.

Edited by pir8radio
Link to comment
Share on other sites

  • 1 month later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...