Make jslinux-mobile into a progressive web app

[nmcain]

Making this into a pwa would eliminate this need to download it by cacheing it offline and also eliminate the need to download an alternative browser, because pwas allow apps to run and look like native apps.

Add the following tags to the main index.html file in the head Also, create an icon named touch-icon-iphone.png, a 152x152 icon named touch-icon-ipad.png, a 180x180 icon named touch-icon-iphone-retina.png, and a 167x167 icon named touch-icon-ipad-retina.png,

<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="180x180" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="167x167" href="touch-icon-ipad-retina.png">
 

Then create a file named manifest.json with the following

{
  "name": "JS Linux",
  "short_name": "JS Linux Mobile",
  "start_url": "index.html",
  "display": "standalone",
 
  "background_color": "#fff",
  "theme_color": "#fff",
  "description": "Run Linux in your browser"

}

This should make it into a pwa, and you can direct users to install it to the homescreen using the share>add to home screen button

[jaromaz]

Thanks. I will try, but it may require separate files for each device.

[zaptrem]

Was there any progress in this area? Potentially super useful for developers on iPads.

[nmcain]

As soon as I finish my smart display software, I will get to work. Ill add a ui distinction between android and ios.

[jaromaz]

Everything from @nmcain post is already implemented. The new version will be released next week. iOS only - Android has several Linux solutions. Separate menu to select the iOS device - I will need help to set the appearance presets on different devices.

[nmcain]

Why not make it dynamic, or auto detect the device?

[zaptrem]

@jaromaz by implemented do you mean live on this repo? It looks like it hasn’t been changed for four months?

[jaromaz]

Yes - this repo and live demo on my blog. Not dynamically because the user will be able to choose the combination of: portrait or landscape and bluetooth keyboard or software keyboard (split screen in half permanently).

[zaptrem]

Many responsive web apps automatically detect screen size and resize themselves accordingly (e.g., when I drag Facebook into a Splitscreen configuration it automatically adjusts)

Otherwise, there are far too many screen configurations to design for (four modern iPhone sizes, 4 modern iPad sizes, countless Splitscreen configs, all multiplied by landscape vs portrait)

On Fri, Nov 2, 2018 at 3:51 PM Jaromaz [email protected] wrote:

Yes - this repo and live demo on my blog. Not dynamically because the user will be able to choose the combination of: portrait or landscape and bluetooth keyboard or software keyboard (split screen in half permanently).

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/jaromaz/jslinux-mobile/issues/1#issuecomment-435475799, or mute the thread https://github.com/notifications/unsubscribe-auth/ABiZxjH3wTvELV-8I4j8sRVrd4Qk8xWUks5urKIvgaJpZM4WWcfE .

[zaptrem]

I also tried adding the demo to my home screen as a web clip and the Safari UI didn’t disappear as expected. Is this a bug?

[nmcain]

I think he needs to set display to standalone. PWAs work better in chrome though.

[zaptrem]

On iOS? That’s surprising considering iOS Chrome is just reskinned Safari.

On Sat, Nov 3, 2018 at 9:11 PM Noah Cain [email protected] wrote:

I think he needs to set display to standalone. PWAs work better in chrome though.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/jaromaz/jslinux-mobile/issues/1#issuecomment-435633603, or mute the thread https://github.com/notifications/unsubscribe-auth/ABiZxotPK53eUzyTbbqonndWXpo6caOPks5urj7QgaJpZM4WWcfE .

[nmcain]

not really. ios chrome uses the rendering engine of safari, not much else

[zaptrem]

That’s exactly my point....

On Sat, Nov 3, 2018 at 9:15 PM Noah Cain [email protected] wrote:

not really. ios chrome uses the rendering engine of safari, not much else

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/jaromaz/jslinux-mobile/issues/1#issuecomment-435633746, or mute the thread https://github.com/notifications/unsubscribe-auth/ABiZxtWUppZPUCANWxu3IsPs5pQpmPKnks5urj-xgaJpZM4WWcfE .

[jaromaz]

Finished with a slight delay :) Every change of settings is stored in cookies, so you can freely change the appearance of the application already inside the Web App.

[nmcain]

Great.

[Gutem]

I can help on this one! Just need some days to finish some work before...