Skip to content

Instantly share code, notes, and snippets.

@suissa

suissa/html5.geolocation.suissa.html

Created April 4, 2017 23:25
Show Gist options
  • Save suissa/12559e932c49829fcc1c29051c469701 to your computer and use it in GitHub Desktop.
Save suissa/12559e932c49829fcc1c29051c469701 to your computer and use it in GitHub Desktop.
Download ZIP
Refatorei um exemplo de geolocation da w3schools: https://www.w3schools.com/html/tryit.asp?filename=tryhtml5_geolocation
Raw
html5.geolocation.suissa.html
<!DOCTYPE html>
<html>
<body>
<p>Click the button to get your coordinates.</p>
<button id ='getCoordinates'>Try It</button>
<p id='coordinates'></p>
<script>
const addClickInGetCoordinates = () =>
document.getElementById( 'getCoordinates' )
.addEventListener( 'click',
showLocationIn( 'coordinates' ),
false);
const notExistsGeolocation = ( window ) =>
!( window.navigator.geolocation )
const geolocationIsntSupported = ( el ) =>
el.innerHTML = 'Geolocation is not supported by this browser.'
const getCurrentPosition = ( geolocation, andShow, here ) =>
geolocation.getCurrentPosition( andShow( here ) )
const showPositionIn = ( el ) => ( position ) =>
document.getElementById( el ).innerHTML =
'Latitude: ' + position.coords.latitude + '<br>' +
'Longitude: ' + position.coords.longitude
const showLocationIn = ( here ) =>
notExistsGeolocation( window )
? geolocationIsntSupported( here )
: getCurrentPosition( navigator.geolocation, showPositionIn, here )
const load = addClickInGetCoordinates
document.addEventListener('DOMContentLoaded', load, false);
</script>
</body>
</html>
Raw
html5.geolocation.w3.html
<!DOCTYPE html>
<html>
<body>
<p>Click the button to get your coordinates.</p>
<button onclick="getLocation()">Try It</button>
<p id="demo"></p>
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
</body>
</html>
@eduardonunesp
Copy link

eduardonunesp commented Apr 5, 2017 •
edited
Loading

A função notExistsGeolocation pergunta se a propriedade existe no objeto window certo ? então pq não chamar isGeolocationSupported e inverter o boolean, em minhas experiências usar o is para provar a veracidade é mais brainable que o contrário. A função geolocationIsntSupported gera uma confusão, ela deveria ser chamar algo do tipo warnGeolocationIsntSupported. A função showLocationIn pode ser showLocationInElementId

@eduardonunesp
Copy link

Nada mal o refactor, apesar de ter um apelo funcional q ficou duca!, eu ainda acho a versão anterior bem mais legível, pq não precisou ser quebrada em vários fragmentos. Curto pacas funcional, no entanto observei q para pequenos exemplos ou POCs é boilerplate demais :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment