forked from Zivi/FlattestRoute
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
102 lines (94 loc) · 4 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html>
<head>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/main.css?ver=3">
<script type="application/javascript" src="js/rainbowvis.js"></script>
<title>Flattest Route</title>
<meta name="description" content="Put in the start and destination of your route. View the steepness of the roads along the way. You can choose from walking, biking, or driving. As featured in Hacker News.">
<meta name="viewport" content="width=device-width, initial-scale=1"/>
</head>
<body>
<a href="https://github.com/Zivi/FlattestRoute"><img id="github" style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-8">
<h1>Flattest Route</h1>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-8">
<form id="routes">
<div id="target" class="place-inputs">
<div class="place-input">
<input id="from" type="text" placeholder="Type a place to start your journey">
</div>
<div id="from-to-switcher"></div>
<div class="place-input">
<input id="to" type="text" placeholder="Type your destination">
</div>
<div class="row place-input selector-wrapper">
<div class="col-xs-6">
<select class="form-control" id="travel-mode">
<option>Bicycling</option>
<option>Walking</option>
<option>Driving</option>
</select>
</div>
<div class="col-xs-6">
<select class="form-control" id="measurement-mode">
<option value="miles">Miles</option>
<option value="km">Kilometres</option>
</select>
</div>
<div class="col-xs-6">
<label for="useraw">Elevation sample size (m)</label>
<input id="sampleselect" type="number" value="20" name="quantity" min="1" max="512">
<label for="keepPaths">Keep paths drawn</label>
<input type="checkbox" name="keepPaths" id="maintainPath" checked />
</div>
</div>
<div class="place-input">
<button class="btn btn-primary" type="submit" id="go">Go</button>
</div>
</div>
</form>
</div>
<div class="col-xs-12 col-sm-4">
<div class="row travel-info">
Distance:
<span id="distance"></span>
</div>
<div class="row travel-info">
<div id="travel-label">
Travel Time:
<span id="travel-time"></span>
</div>
</div>
</div>
</div>
<div class="row">
<div>
<div class="col-md-12" id="map-canvas"></div>
</div>
<div class="col-xs-12 col-sm-12">
<div class="chart hide col-sm-6" id="elevation_chart"></div>
<div class="chart hide col-sm-6" id="slope_chart"></div>
</div>
</div>
<div id="directionsPanel"></div>
<div class="row" id="author">
<div class="col-md-6 .col-md-offset-4">
Forked by TimmyD from the original project by <a href="https://www.twitter.com/z1v1">Zivi Weinstock </a>
</div>
</div>
</div>
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyB_Di7CI1LbfKSk6xAWooJlF9scvwpkUsI"></script>
<!-- <script src="https://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script> -->
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="js/main.js?ver=2"></script>
</body>
</html>