This repository has been archived by the owner on Jan 12, 2025. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathindex.html
142 lines (134 loc) · 5.76 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Herolution</title>
<!-- jquery link -->
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Exo+2:900" rel="stylesheet">
<!-- veiwport info for media query -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- boostrap jquery link -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- bootstrap link -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href="assets/css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<!-- load page image -->
<!-- <div class="titlePage">
<img src="assets/media/loadpage.jpg" alt="loadPage" id="loadPage">
</div> -->
<!-- main page, map, and menu -->
<div>
<nav class="navbar navbar-default navbar-fixed-top">
<!-- collapsing menu -->
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<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-brand"><img src="assets/images/logo_small.png" id="logoHeader" alt="logo"></a>
</div> <!-- navbar-header -->
<!-- collect nav links to toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="index.html" title="homepage">Home<span class="sr-only">(current)</span></a></li>
<li class="active"><a href="regHeroes.html" title="registered heros">Registered Heroes</a></li>
<li class="active"><a href="indexBio.html" title="about us">About Us</a></li>
</ul>
</div><!-- navbar-collapse -->
</div> <!-- close nav container -->
</nav>
</div>
<div class ="container fullWidth">
<!-- find a hero modal -->
<div class="modal fade" id="findHeroModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Find a Hero</h5>
</div>
<div class="modal-body">
<select id="heroList" name="simple">
</select>
<form class="name">
<br>
<input type="submit" value="Search" id="findHeroSearch">
</form>
</div>
<div class="modal-footer">
<p>Search for where your favorite registered Marvel hero lives, choose their name from the dropdown menu.</p>
</div> <!-- close modal footer -->
</div> <!-- close content -->
</div> <!-- close dialog -->
</div> <!-- close find hero modal -->
<!-- Be a Hero Modal -->
<div class="modal fade" id="beHeroModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Be a Hero</h5>
</div>
<div class="modal-body">
<select id="volunteerList" name="simple">
</select>
<input id ="heroZip" type="text" placeholder="Address" name="zip" class="form=control areaSearch">
<input type="submit" value="Search" id="beHeroSearch">
</form>
</div>
<div class="modal-footer">
<p>Find local places to you can be a hero and volunteer at, choose any option from the dropdown menu and add your address or zipcode to find local places. Use your passion to contribute to your community, if you love animals volunteer at a local animal shelter.</p>
<p>There are over <strong id = "volunteerMatchAPI">0</strong> opportunities available in the area you've searched!</p>
</div>
</div>
</div>
</div> <!-- close be hero modal -->
<!-- Adopt a sidekick modal -->
<div class="modal fade" id="adoptModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Adopt a Sidekick</h5>
</div>
<div class="modal-body">
<input id="adoptZip" type="text" placeholder="Address" name="zip" class="form=control areaSearch">
<input type="submit" value="Search" id="adoptSearch">
</div>
<div class="modal-footer">
<p>Adopt a sidekick from a local shelter, and give a loving animal a forever home.</p>
</div>
</div>
</div>
</div> <!-- close adopt modal -->
<div class ="container gmap">
<div class="col-lg-12">
<div class="row">
<!-- map -->
<div id="googleMap"></div>
</div>
</div>
</div> <!-- close map div -->
<footer class="footer">
<div class="container fullWidth">
<nav id="menu">
<button class="icons" id="findHero"><div id="fHero"></div></button>
<button class="icons" id="beHero"><div id="bHero"></button>
<button class="icons" id ="adopt"><div id="sKick"></div></button>
</nav>
</div>
</div>
</footer>
</div> <!-- close main container -->
<!-- firebase link -->
<script src="https://www.gstatic.com/firebasejs/3.7.2/firebase.js"></script>
<!-- googlemaps initialize map link -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCa49xtbdvX0TCjJZPn9jcAaJU8cujYhlc&libraries=places" async defer></script>
<!-- link to javscript -->
<script src="assets/javascript/regheroes.js" type="text/javascript"></script>
<script src="assets/javascript/script.js" type="text/javascript"></script>
</body>
</html>