GEOLOCATION <br/>navigator.geolocation.watchPosition(function(position) {<br/>addToMap(position);<br/>});<br/> Total Distance Total Elevation Gain Highest Elevation Max Speed 1.4 km 256 m 357 m 67 kmph
GEOLOCATION <br/>var id = navigator.geolocation.watchPosition(function(position) {<br/>document.write(position.coords.heading);<br/>});<br/>navigator.geolocation.clearWatch(id)<br/> <br/>var id = navigator.geolocation.watchPosition(success, error, {<br/>enableHighAccuracy: true,<br/>timeout: 5000,<br/>maximumAge: 0<br/>});<br/> Stop Watching Get High Accuracy, Control Cache
DEVICE ORIENTATION <br/>window.addEventListener('deviceorientation', function(orientation) {<br/>console.log(orientation.gamma);<br/>// gamma is the left-to-right tilt in degrees, where right is positive<br/>console.log(orientation.beta);<br/>// beta is the front-to-back tilt in degrees, where front is positive<br/>console.log(orientation.alpha);<br/>// alpha is the compass direction the device is facing in degrees<br/>});<br/>
DEVICE ORIENTATION <br/>window.addEventListener('deviceorientationabsolute', function(orientation) {<br/>console.log(orientation.alpha);<br/>// orientation is guaranteed to be absolute relative to the earth<br/>});<br/> Chrome/Android Only <br/>window.addEventListener('deviceorientation', function(orientation) {<br/>console.log(orientation.webkitCompassHeading);<br/>// orientation is guaranteed to be absolute relative to the earth<br/>});<br/> Safari/iOS Only
VIBRATION Android only <br/>window.navigator.vibrate(200);<br/>// vibrate for 200ms<br/>window.navigator.vibrate([100,30,100,30,100,200,200,30,200,30,200,200,100,30,100,30,100]);<br/>// Vibrate 'SOS' in Morse.<br/>
OFFLINE SUPPORT: SERVICE WORKERS <br/>navigator.serviceWorker.register('service-worker.js', {scope: ‘.'})<br/>.then(function(registration) {<br/>console.log('The service worker has been registered ', registration);<br/>});<br/> Register serviceWorker app.js
OFFLINE SUPPORT: SERVICE WORKERS <br/>var REQUIRED_FILES = [<br/>'random-1.png',<br/>'random-2.png',<br/>'random-3.png',<br/>'style.css',<br/>'index.html',<br/>'index.js',<br/>'app.js'<br/>];<br/>self.addEventListener('install', function(event) {<br/>event.waitUntil(<br/>caches.open('dependencies-cache')<br/>.then(function(cache) {<br/>// Caches opened, adding all core components to cache<br/>return cache.addAll(REQUIRED_FILES);<br/>})<br/>.then(function() {<br/>// All required resources have been cached.<br/>return self.skipWaiting();<br/>})<br/>);<br/>});<br/>Monitor cached status of resources<br/>service-worker.js<br/>
MORE RESOURCES ▸ Mozilla Developer Network https://developer.mozilla.org ▸ Can I Use https://caniuse.com ▸ AR.js https://github.com/jeromeetienne/AR.js