<html manifest="html5/test.appcache">
<head>
<title>HTML5</title>
</head>
<body>

<h3>Geolocation Test</h3>
<div id="status">Location unknown</div>
<script language="javascript" type="text/javascript" src="html5/geolocation.js"></script>

<h3>Web SQL Database Test</h3>
<div id="logs"></div>
<script language="javascript" type="text/javascript" src="html5/database.js"></script>

<h3>Application Cache Test</h3>
<div id="images">
  <p>Current network status: <span id="state"></span></p>
  <script>
    var state = document.getElementById('state')
    setInterval(function () {
      state.className = navigator.onLine ? 'online' : 'offline';
      state.innerHTML = navigator.onLine ? 'online' : 'offline';
    }, 250);
  </script>
  <img id="red" src="html5/red.jpg">
  <img id="blue" src="html5/blue.jpg">
  <img id="green" src="html5/green.jpg">
  <img id="yellow" src="html5/yellow.jpg">
</div>

</body>
</html>