Added Apple mobile web app capable meta tag

[herbit]

Enable to run the website in full screen mode on iPhones. This is useful in combination when starting TeslaMate with an app icon from the home screen.

[adriankumpf]

I cannot see any difference with this meta tag enabled. A quick Google search only brought up this archive link on Apple's Developer Docs and a few references to it being deprected.

[herbit]

I guess apples documentation is really bad. It is recommended by google for full screen apps, though: https://developers.google.com/web/fundamentals/native-hardware/fullscreen/
Grafana also uses it and the TeslaMate Grafana page opens full screen on my iPhone when launched from an home screen icon. The TeslaMate main page opens in Safari when launched from an home screen icon.

[adriankumpf]

I guess apples documentation is really bad. It is recommended by google for full screen apps, though: https://developers.google.com/web/fundamentals/native-hardware/fullscreen/ Grafana also uses it and the TeslaMate Grafana page opens full screen on my iPhone when launched from an home screen icon. The TeslaMate main page opens in Safari when launched from an home screen icon.

I launch TeslaMate via a home screen icon since ages and it opens in full screen mode just fine 🤔 Did you test if these changes make a difference for you?

[herbit]

I don't have the toolchain installed. What I did for a quick PoC:

1. copy the html source of my running TeslaMate page and saving it as static .html file
2. make it available on a local web server
3. Accessing the URL with Mobile Safari on my iPhone and add it the home screen
4. Starting via the home screen icon
5. Outcome: opens in Safari

Now I've added "apple-mobile-web-app-capable" meta tag to the static html and repeated the steps 2-4. It now opens full screen.

Edit: Device is an iPhone 11 with iOS 15.1

[adriankumpf]

All right, thanks for testing. If it solves the problem, let's merge it.