-
Notifications
You must be signed in to change notification settings - Fork 6
/
plantrip.html
129 lines (108 loc) · 5.29 KB
/
plantrip.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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<html>
<head>
<meta charset="UTF-8">
<!-- Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
<link rel="stylesheet" href="vendor/css/leaflet-routing-machine.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css">
<link rel="stylesheet" href="vendor/awesome-markers/leaflet.awesome-markers.css">
<link rel="stylesheet" href="css/navbar.css">
<style>
#map {
height: 100%;
width: 100%;
}
body {
height: 100vh;
}
.container-fluid {
padding: 0px;
}
.arrows {
margin-top: 45px;
margin-left: 85px;
}
.left-box {
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="navbar navbar-inverse navbar-custom" style="margin: 0px;">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><i class="fa fa-map" aria-hidden="true"></i> GTFS Visualizer</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="index.html"><i class="fa fa-map-o" aria-hidden="true"></i> Map</a></li>
<li class="active"><a href="#"><i class="fa fa-map-marker" aria-hidden="true"></i> Plan a Trip</a></li>
<li><a href="documentation.html" data-toggle="collapse" data-target=".navbar-collapse.in"><i class="fa fa-book" aria-hidden="true"></i> Documentation</a></li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</div>
<br>
<div class="row">
<div class="col-md-2">
<div class="left-box">
<div class="form-group">
<div class="btn-group">
<button type="button" class="btn btn-primary"><i class="fa fa-car" aria-hidden="true"></i></button>
<button type="button" class="btn btn-primary"><i class="fa fa-bicycle" aria-hidden="true"></i></button>
<button type="button" class="btn btn-primary"><i class="fa fa-street-view" aria-hidden="true"></i></button>
</div>
<hr>
<form role="form">
<div class="form-group">
<label for="from"><i class="fa fa-location-arrow" aria-hidden="true"></i> From:</label>
<input style="color: #2ecc71" type="text" class="form-control" id="from">
</div>
<div class="form-group">
<label for="to"><i class="fa fa-circle-o" aria-hidden="true"></i> To:</label>
<input style="color: #e74c3c" type="text" class="form-control" id="to">
</div>
</form>
<hr>
<button type="button" class="btn btn-secondary"><i class="fa fa-arrows-v" aria-hidden="true"></i></button>
<button type="button" class="btn btn-primary">
Get Routes
</button>
</div>
<table id="melhoresLinhas" class="table table-bordered"></table>
</div>
</div>
<div class="col-md-9">
<div class="alert alert-info plantrip-message" style="margin: 5px;">
<strong>Info!</strong> <i class="fa fa-map-marker" aria-hidden="true"></i>
</div>
<div id='map' style="height: 80%;"></div>
</div>
</div>
</div>
</body>
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<script src="vendor/js/leaflet-routing-machine.min.js"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="vendor/js/easy-button.js"></script>
<script src="js/settings.js"></script>
<script src="vendor/awesome-markers/leaflet.awesome-markers.min.js"></script>
<script src="js/icons.js"></script>
<script src="js/get-api.js"></script>
<script src="js/generator.js"></script>
<script src="js/plantrip.js"></script>
<script src="vendor/js/bootbox.min.js"></script>
</html>