2014-11-17 10:44:55 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
<!-- Meta -->
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > these-3-words Map< / title >
<!-- Style -->
< link rel = "stylesheet" href = "//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" >
2014-11-17 15:49:06 +00:00
< style >
body {
padding-top: 40px;
}
< / style >
2014-11-17 10:44:55 +00:00
< / head >
< body >
< div class = "container" >
% if err:
< aside class = "alert alert-danger" role = "alert" > Error: {{ err }}< / aside >
% end
< main class = "jumbotron" >
< h1 > These3Words Map< / h1 >
< p class = "lead" >
2014-11-17 13:45:04 +00:00
Find a location anywhere in the world identified by three simple words.
2014-11-17 10:44:55 +00:00
< / p >
2014-11-17 15:49:06 +00:00
< p class = "text-warning" > This is a very early pre-alpha release. Don't expect anything to work properly or reproducible. Especially since the underlying word-list will most likely change soon.< / p >
2014-11-17 10:44:55 +00:00
< p id = "input3wordsContainer" >
2014-11-17 15:40:58 +00:00
< input type = "text" class = "form-control" id = "input3words" placeholder = "zeljka-worry-suhai" >
2014-11-17 10:44:55 +00:00
< / p >
< p >
< button id = "button3words" class = "btn btn-lg btn-primary" > Find on Map< / button >
< / p >
< / main >
< script >
(function() {
2014-11-17 15:40:58 +00:00
var default3words = 'zeljka-worry-suhai';
2014-11-17 10:44:55 +00:00
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 >
< / body >
< / html >
