diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 238 |
1 files changed, 238 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..b1a03db --- /dev/null +++ b/index.html @@ -0,0 +1,238 @@ +<!DOCTYPE html> +<html lang="en"> + <head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width"> + <meta name="mobile-web-app-capable" content="yes"> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta name="description" content=""> + <meta name="author" content="Christopher Baines <cb15g11@soton.ac.uk>"> + <title>Map - University of Southampton</title> + + <link rel="stylesheet" href="css/style.css"> + </head> + + <body> + <div class="navbar-inverse navbar-fixed-top" role="navigation"> + <div class="navbar-header"> + <button type="button" class="navbar-toggle visible-xs" onclick="$('.navbar-collapse').collapse('toggle'); return false;"> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + </button> + <a class="navbar-brand" href="#">Map<span class="hidden-xs"> - University of Southampton</span></a> + </div> + <div class="navbar-collapse collapse"> + <form class="navbar-form navbar-right" role="search"> + <div class="form-group has-feedback navbar-right"> + <input id="searchbox" type="text" placeholder="Search" class="form-control"> + <span id="searchicon" class="glyphicon glyphicon-search form-control-feedback"></span> + </div> + </form> + <ul class="nav navbar-nav"> + <li> + <a href="#" data-toggle="collapse" + data-target=".navbar-collapse.in" + onclick="$('#linksModal').modal('show'); + return false;"> + More Maps + </a> + </li> + <li> + <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" onclick="$('#aboutModal').modal('show'); return false;"> + About + </a> + </li> + <li id="navBuildingsLi"> + <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="buildingsSidebarLink"> + Buildings + </a> + </li> + <li id="navSitesLi"> + <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="sitesSidebarLink"> + Sites + </a> + </li> + </ul> + </div><!--/.navbar-collapse --> + </div> + + <div id="container"> + <div id="buildingsSidebar" style="display: none;"> + <div class="sidebar-wrapper"> + <div class="panel panel-default" style="margin: 0px; border: none; + border-radius: 0px; -webkit-box-shadow: none; box-shadow: none;" + id="buildings"> + <div class="panel-heading"> + <h3 class="panel-title">Buildings + <button id="buildingsSidebarHideButton" + type="button" + class="btn btn-xs btn-default pull-right" + style="margin-top: -2px;" > + <i class="glyphicon glyphicon-chevron-left"></i> + </button> + </h3> + </div> + <div class="panel-body"> + <div class="row"> + <div class="col-xs-8 col-md-8"> + <input type="text" class="form-control search" placeholder="Filter" /> + </div> + <div class="col-xs-4 col-md-4"> + <button + type="button" + class="btn btn-primary pull-right sort" + data-sort="feature-name" + id="sort-btn"> + <i class="glyphicon glyphicon-sort"></i> + Sort + </button> + </div> + </div> + </div> + <div class="sidebar-table"> + <table class="table table-hover" id="buildingsList"> + <thead class="hidden"> + <tr> + <th>Ref</th> + <tr> + <tr> + <th>Name</th> + <tr> + <tr> + <th>Chevron</th> + <tr> + </thead> + <tbody class="list"></tbody> + </table> + </div> + </div> + </div> + </div> + <div id="sitesSidebar" style="display: none;"> + <div class="sidebar-wrapper"> + <div class="panel panel-default" style="margin: 0px; border: none; + border-radius: 0px; -webkit-box-shadow: none; box-shadow: none;" + id="sites"> + <div class="panel-heading"> + <h3 class="panel-title">Sites + <button id="sitesSidebarHideButton" + type="button" + class="btn btn-xs btn-default pull-right" + style="margin-top: -2px;" > + <i class="glyphicon glyphicon-chevron-left"></i> + </button> + </h3> + </div> + <div class="panel-body"> + <div class="row"> + <div class="col-xs-8 col-md-8"> + <input type="text" class="form-control search" placeholder="Filter" /> + </div> + <div class="col-xs-4 col-md-4"> + <button + type="button" + class="btn btn-primary pull-right sort" + data-sort="feature-name" + id="sort-btn"> + <i class="glyphicon glyphicon-sort"></i> + Sort + </button> + </div> + </div> + </div> + <div class="sidebar-table"> + <table class="table table-hover" id="sitesList"> + <thead class="hidden"> + <tr> + <th>Ref</th> + <tr> + <tr> + <th>Name</th> + <tr> + <tr> + <th>Chevron</th> + <tr> + </thead> + <tbody class="list"></tbody> + </table> + </div> + </div> + </div> + </div> + + <div id="map"></div> + </div> + + <div class="modal fade" id="aboutModal" tabindex="-1" role="dialog"> + <div class="modal-dialog modal-lg"> + <div class="modal-content"> + <div class="modal-header"> + <button class="close" type="button" data-dismiss="modal" aria-hidden="true">×</button> + <h4 class="modal-title">About</h4> + </div> + <div class="modal-body"> + This application uses the following libraries and datasets. + + <h5>Libraries</h5> + <ul> + <li>leaflet</li> + <li>leaflet-locatecontrol</li> + <li>leaflet-markercluster</li> + </ul> + + <h5>Data</h5> + <ul> + <li>OpenStreetMap</li> + <li>University of Southampton</li> + <li>mfd-location</li> + <li>library data</li> + </ul> + </li> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> + </div> + </div><!-- /.modal-content --> + </div><!-- /.modal-dialog --> + </div><!-- /.modal --> + + <div class="modal fade" id="linksModal" tabindex="-1" role="dialog"> + <div class="modal-dialog modal-lg"> + <div class="modal-content"> + <div class="modal-header"> + <button class="close" type="button" data-dismiss="modal" aria-hidden="true">×</button> + <h4 class="modal-title">More Maps</h4> + </div> + <div class="modal-body"> + <p>The University currently has no 'official' digital mapping system. However, there are several systems produced by various people within the organisation.</p> + <p><a href="http://opendatamap.ecs.soton.ac.uk/">Open Data Map</a> by Colin Williams</p> + <p>Additionally, we have official printed maps available from our central website.</p> + <p><a href="http://www.southampton.ac.uk/visitus/campuses/">http://www.southampton.ac.uk/visitus/campuses/</a></p> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> + </div> + </div><!-- /.modal-content --> + </div><!-- /.modal-dialog --> + </div><!-- /.modal --> + + <div class="modal fade" id="featureModal" tabindex="-1" role="dialog"> + <div class="modal-dialog modal-lg"> + <div class="modal-content"> + <div class="modal-header"> + <button class="close" type="button" data-dismiss="modal" aria-hidden="true">×</button> + <h4 class="modal-title text-primary" id="feature-title"></h4> + </div> + <div class="modal-body" id="feature-info"></div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> + </div> + </div><!-- /.modal-content --> + </div><!-- /.modal-dialog --> + </div><!-- /.modal --> + + <script src="scripts.js"></script> + </body> +</html> |