Support full screen mode on iOS and enable "click to toggle fullscreen" in standard browsers

This commit is contained in:
Flo
2017-03-21 20:56:11 +01:00
parent 611bc26685
commit 09c03e8ca7
3 changed files with 167 additions and 1 deletions

View File

@@ -4,6 +4,12 @@
<title>Magic Mirror</title>
<meta name="google" content="notranslate" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="mobile-web-app-capable" content="yes">
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="fonts/roboto.css">
@@ -12,8 +18,17 @@
<script type="text/javascript">
var version = "#VERSION#";
</script>
<!-- Using https://github.com/sindresorhus/screenfull.js -->
<script type="text/javascript" src="js/screenfull.js"></script>
<script type="text/javascript">
var b = document.getElementById("fullscreen");
document.addEventListener("click", function() {
screenfull.toggle(b);
window.dispatchEvent(new Event('resize'));
});
</script>
</head>
<body>
<body id="fullscreen">
<div class="region fullscreen below"><div class="container"></div></div>
<div class="region top bar">
<div class="container"></div>