JSFiddle - React, Tailwind, and code Playground

by somya_kashyap3

HTML

<button type="button" id="bt">
Hey, there!
</button>
<iframe src="https://jsfiddle.net/somya_kashyap3/hw83jy0n/3/"></iframe>

JavaScript

/*var arr = [1,2,3,4,5,6];
var arr1 = arr.map(x => x*2);
console.log(arr1);

var elements = [
  'Hydrogen',
  'Helium',
  'Lithium',
  'Beryllium'
];

elements.map(function(element ) { 
  return element.length; 
}); // [8, 6, 7, 9]

elements.map(element => {
  return element.length;
}); // [8, 6, 7, 9]

var a = elements.map(element => element.length); // [8, 6, 7, 9]
console.log(a);
var arr = [1,2,3,4,5,6];
var arr1 = arr.map(function(x) {
	return x*2 ;
});

console.log(arr1);
arr.forEach(function(x){
	x = x*2;
});
console.log(arr);*/
var button = document.getElementById("bt");
button.onclick = function() {
  var startPos;
  var nudge = document.getElementById("nudge");

  var showNudgeBanner = function() {
    nudge.style.display = "block";
  };

  var hideNudgeBanner = function() {
    nudge.style.display = "none";
  };

  var nudgeTimeoutId = setTimeout(showNudgeBanner, 5000);

  var geoSuccess = function(position) {
    hideNudgeBanner();
    // We have the location, don't display banner
    clearTimeout(nudgeTimeoutId);

    // Do magic with location
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  var geoError = function(error) {
    switch(error.code) {
      case error.TIMEOUT:
        // The user didn't accept the callout
        showNudgeBanner();
        break;
    }
  };

  navigator.geolocation.getCurrentPosition(geoSuccess, geoError);
};