Skip to content

Instantly share code, notes, and snippets.

@janeygcode
Created May 22, 2016 14:46
Show Gist options
  • Save janeygcode/61e53a7a09ac07a4b28f1cda843c1a93 to your computer and use it in GitHub Desktop.
Save janeygcode/61e53a7a09ac07a4b28f1cda843c1a93 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>GigAware</title>
<meta name="viewport" content="initial-scale=1.0">
<meta charset="utf-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<style>
html, body {
background: url(phone.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<!-- Google maps API -->
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 33.54, lng: 35.32},
zoom: 8
});
}
</script>
<!-- End Google Maps API -->
<div class="container-fluid">
<div class="row">
<!-- Native browser geolocation finder -->
<label for="cLocation">Use Your Current Location?</label>
<input type="checkbox" id="useLocation" name="cLocation">Yes
</div>
<div class="row" style="background-color: rgba(122, 130, 136, 0.4);">
<!-- find work (left) column -->
<div class="col-lg-6 col-md-6">
<div class="text-center">
<h2>I am looking to hire</h2>
<button type="button" class="btn btn-success">
Register to hire
</button>
<h5>
Post a gig and find the perfect person to get the job done.
</h5>
</div>
</div>
<!-- get hired (right) column -->
<div class="col-lg-6 col-md-6">
<div class="text-center">
<h2>I want to get hired!</h2>
<button type="button" class="btn btn-success">Register for Work</button>
<h5>Find a gig and get paid.</h5>
</div>
</div>
<!-- closing div for registrations row -->
</div>
</div>
<script>
$("#useLocation").click(function(){
if (navigator.geolocation) {
var myLat = null;
var myLng = null;
navigator.geolocation.getCurrentPosition(
function (position) {
// Assign coordinates to variables
myLat = position.coords.latitude;
myLng = position.coords.longitude;
console.log(myLat, myLng);
}
);
}
}
);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment