From bf50194a101812d2959633a082af73836fe40a80 Mon Sep 17 00:00:00 2001 From: Keith Irwin Date: Thu, 21 Feb 2019 19:41:33 -0500 Subject: [PATCH 1/2] Moved javascript to own file --- index.html | 16 +--------------- main.js | 16 ++++++++++++++++ 2 files changed, 17 insertions(+), 15 deletions(-) create mode 100644 main.js diff --git a/index.html b/index.html index 56cf527..3d45b6a 100644 --- a/index.html +++ b/index.html @@ -8,21 +8,7 @@ - + diff --git a/main.js b/main.js new file mode 100644 index 0000000..9210dc5 --- /dev/null +++ b/main.js @@ -0,0 +1,16 @@ +'use strict'; + +const speedometer = document.getElementById('speedometer') +const speedSpan = document.getElementById('speed') + +// Check for API +if (!'geolocation' in navigator) { + alert('No geolocation API available') + speedometer.innerHTML = 'No API' +} else { + const WID = navigator.geolocation.watchPosition( function(loc) { + console.log(JSON.stringify(loc.coords.speed)) + //alert('speed:',loc.coords.speed) + if (loc.coords.speed) speedSpan.innerHTML = loc.coords.speed + }) +} From 1c22e87acd4f305c45570557ae8694d5e12276fb Mon Sep 17 00:00:00 2001 From: Keith Irwin Date: Thu, 21 Feb 2019 20:07:06 -0500 Subject: [PATCH 2/2] Added style, units as mph --- index.html | 6 +++--- main.js | 18 +++++++++++------- style.css | 16 ++++++++++++++++ 3 files changed, 30 insertions(+), 10 deletions(-) create mode 100644 style.css diff --git a/index.html b/index.html index 3d45b6a..225d193 100644 --- a/index.html +++ b/index.html @@ -1,12 +1,12 @@ Spedometer + -
- -
+
0.0
+
m.p.h.
diff --git a/main.js b/main.js index 9210dc5..6137965 100644 --- a/main.js +++ b/main.js @@ -1,16 +1,20 @@ 'use strict'; -const speedometer = document.getElementById('speedometer') -const speedSpan = document.getElementById('speed') +const speedDiv = document.getElementById('speed') // Check for API if (!'geolocation' in navigator) { alert('No geolocation API available') - speedometer.innerHTML = 'No API' + speedDiv.innerHTML = 'No API' } else { - const WID = navigator.geolocation.watchPosition( function(loc) { - console.log(JSON.stringify(loc.coords.speed)) - //alert('speed:',loc.coords.speed) - if (loc.coords.speed) speedSpan.innerHTML = loc.coords.speed + + const WID = navigator.geolocation.watchPosition( function (loc) { + // got speed + if (loc.coords.speed) { + // convert to mph and display + speedDiv.innerHTML = (2.23693629205*loc.coords.speed).toFixed(1) + } else { + speedDiv.innerHTML = '0.0' + } }) } diff --git a/style.css b/style.css new file mode 100644 index 0000000..011a452 --- /dev/null +++ b/style.css @@ -0,0 +1,16 @@ +body { + margin: 0; + background: #080808; + color: #FFF; +} + +#speed, #units { + font-family: 'sans'; + text-align: center; +} +#units { + font-size: 10vw; +} +#speed { + font-size: 30vw; +}