-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
166 lines (140 loc) · 7.54 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
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
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,visualization"></script>-->
<script src="js/main.js"></script>
</head>
<body>
<!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-bran" href="#">Bike<span style=" font-weight: 800;
">SafeTO</span></a>
</div>
<div class="navbar-collapse collapse">
<form class="navbar-form navbar-right" role="form">
<div class="form-group">
<input id="input-from" type="text" placeholder="From" class="form-control">
</div>
<div class="form-group">
<input id="input-to" type="text" placeholder="To" class="form-control">
</div>
<button id="input-go" type="submit" class="btn btn-succes">Go</button>
</form>
</div><!--/.navbar-collapse -->
</div>
</div>
<div class="container">
<!-- TEXTUAL DIRECTIONS PANEL -->
<div id="map_canvas"></div>
<button onClick="calcRoute();">Route</button>
<div id="wrapper_directions" style="position:absolute; right: 20px; bottom: 100px; width: 25%; height: 200px; overflow-x: hidden; display: none; z-index: 99;">
<div id="directions_panel" class="panel panel-body"> </div>
</div>
<div class="row">
<button class="btn btn-dange btn-lg bot-left col-md-2 col-sm-2 col-md-push-3" data-toggle="modal" data-target="#myModal">
Report Accident
</button>
<button class="btn btn-dangea btn-lg bot-right col-md-2 col-sm-2 col-md-push-3" data-toggle="modal" data-target="#Modal">
User Comments
</button>
</div>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Report an Accident.</h4>
</div>
<div class="modal-body">
<div class="form-group">
<input type="text" placeholder="Name" class="form-control"><br>
<input type="text" placeholder="Location; e.g. King and University Intersection" class="form-control"><br>
<div class="btn-group btn-input clearfix">
<button type="button" class="btn btn-default dropdown-toggle form-control col-lg-12" data-toggle="dropdown">
<span data-bind="label">Type of Accident</span> <span class="caret"></span><br>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Dooring</a></li>
<li><a href="#">Sideswiped</a></li>
<li><a href="#">Cyclist without Right of Way</a></li>
<li><a href="#">Motorist without Right of Way</a></li>
</ul>
</div> <br>
<br>
<textarea name="More Information" id="form-control" cols="50" rows="10"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-defaul" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primar">Submit</button>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="modal fade" id="Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Recent Accidents</h4>
</div>
<div class="modal-body">
<div class="row">
<img src="picture.jpg" alt="" class="col-md-3">
<h4>Jane Doe</h4>
<p class="col-md-6">I love cheese, especially airedale queso. Cheese and biscuits halloumi cauliflower cheese cottage cheese swiss boursin fondue caerphilly. Cow port-salut camembert de normandie macaroni cheese feta who moved my cheese babybel boursin. Red leicester roquefort boursin squirty cheese jarlsberg blue castello caerphilly chalk and cheese. Lancashire.</p>
</div>
<hr>
<div class="row">
<img src="picture2.jpg" alt="" class="col-md-3">
<h4>Rob Ford</h4>
<p class="col-md-6"><strong>Accident Type:</strong> Cyclist Fault <br> <strong>Location:</strong> Main and Queen <br>I got into an accident at main and queen. I was riding a bike down king street when a car hit me. I was 100% sober. Ok maybe I was in a drunken stupor, but i'm doing good at the gym</p>
</div>
<hr>
<div class="row">
<img src="picture3.jpg" alt="" class="col-md-3">
<h4>Obama</h4>
<p class="col-md-6">My fellow Americans...Cheese and biscuits halloumi cauliflower cheese cottage cheese swiss boursin fondue caerphilly. Cow port-salut camembert de normandie macaroni cheese feta who moved my cheese babybel boursin. Red leicester roquefort boursin squirty cheese jarlsberg blue castello caerphilly chalk and cheese.</p>
</div>
<hr>
<h3>Submit a Accident</h3>
<textarea name="More Information" id="form-control" cols="50" rows="10"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-defaul" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primar">Save changes</button>
</div>
<button type="button" class="btn btn-primar">Save changes</button>
</div>
<footer>
© Aaron Lo
</footer>
</div> <!-- /container -->
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
</body>
</html>