Merge pull request #6 from betatim/landing
Rudimentary smart box on the landing page
This commit is contained in:
commit
1a445cdc0c
10
app.py
10
app.py
|
@ -31,6 +31,16 @@ def showMap(threewords):
|
|||
err="Could not find location {}".format(threewords))
|
||||
|
||||
|
||||
@get('/latlng/<lat:float>,<lng:float>')
|
||||
def showMapFromLatLng(lat, lng):
|
||||
try:
|
||||
threewords = these.three_words((lat, lng))
|
||||
return template('map', lat=lat, lng=lng, threewords=threewords)
|
||||
except:
|
||||
return template('index',
|
||||
err="Could not find location {}".format(threewords))
|
||||
|
||||
|
||||
# API
|
||||
@get('/api/<lat:float>,<lng:float>')
|
||||
def latLngToHash(lat, lng):
|
||||
|
|
|
@ -134,6 +134,8 @@ var These3Words = (function () {
|
|||
|
||||
|
||||
return {
|
||||
Map: Map
|
||||
Map: Map,
|
||||
apiGet: apiGet,
|
||||
apiGetFromLatLng: apiGetFromLatLng
|
||||
};
|
||||
}());
|
||||
|
|
|
@ -8,6 +8,8 @@
|
|||
<!-- Style -->
|
||||
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="/static/css/style.css">
|
||||
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
|
||||
<script src="/static/js/app.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
|
@ -30,23 +32,38 @@
|
|||
<footer>
|
||||
<p class="text-center text-muted">Made with ♥ by <a href="https://betatim.github.io/">Tim</a> and <a href="https://dun.gs">Kevin</a>. <a href="https://github.com/betatim/these-3-words">Fork it on GitHub</a>.
|
||||
</footer>
|
||||
<script>
|
||||
(function() {
|
||||
var default3words = 'spitting-ripple-fontanel';
|
||||
var threewordsField = document.getElementById('input3words');
|
||||
document.getElementById('button3words').addEventListener('click', function(evt) {
|
||||
var threewords = threewordsField.value;
|
||||
if (threewords.length === 0) {
|
||||
threewords = default3words;
|
||||
}
|
||||
if (/\w+-\w+-\w+/.test(threewords)) {
|
||||
window.location = '/' + threewords;
|
||||
} else {
|
||||
document.getElementById('input3wordsContainer').classList.add('has-error');
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</div>
|
||||
<script>
|
||||
(function () {
|
||||
var initialise = function () {
|
||||
// Create the autocomplete object, restricting the search
|
||||
// to geographical location types.
|
||||
var searchbox = new google.maps.places.SearchBox(
|
||||
(document.getElementById('input3words')));
|
||||
// When the user selects an address from the dropdown,
|
||||
// populate the address fields in the form.
|
||||
google.maps.event.addListener(searchbox, 'places_changed', function() {
|
||||
// Get the place details from the autocomplete object.
|
||||
var places = searchbox.getPlaces();
|
||||
console.log("HEllo");
|
||||
if (places.length > 0) {
|
||||
place = places[0];
|
||||
These3Words.apiGetFromLatLng(place.geometry.location,
|
||||
function(status, data) {
|
||||
if (status >= 200 && status < 400) {
|
||||
window.location = "/" + data.three;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var words = document.getElementById('input3words').value;
|
||||
if (/\w+-\w+-\w+/.test(words)) {
|
||||
window.location = '/' + words;
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
window.addEventListener('load', initialise);
|
||||
}());
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue