-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html.bak
128 lines (103 loc) · 6.53 KB
/
index.html.bak
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
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Modern Voyeur</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<!-- CSS file -->
<link rel="stylesheet" href="./assets/EasyAutocomplete-1.3.5/easy-autocomplete.min.css">
<link rel="stylesheet" type="text/css" href="./assets/css/style.css" />
</head>
<body class="bg-success">
<!--navbar-->
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
<a class="navbar-brand" href="https://rnorton12.github.io/modern-voyeur-project/"><i class="fa fa-globe" aria-hidden="true"></i> Modern Voyeur</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item dropdown active">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-video-camera" aria-hidden="true"></i> Country Options</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a id="list" class="dropdown-item" href="#"></a>
</div>
</li>
</ul>
<button id="instructions" type="button" class="btn btn-success" data-toggle="popover" data-placement="bottom" title="Instructions" data-content="Modern Voyeur provides users with the ability to view webcams throughout the world, anytime, anywhere. A minimum of ten webcams are displayed on each page. You can utilize the navigation buttons, Next or Back, to move through the list of available webcams.
The Replay button allows for viewing of 24 hours, 30 days, 12 months, and a lifetime view. The Live button allows you to view your desired location in real time. The location of each available webcam is displayed on a google map with a
location marker.">Click to toggle instructions</button>
<!--<form class="form-inline my-2 my-lg-0">
<input id="searchInput" class="form-control mr-sm-2" type="search" placeholder="Search Countries" aria-label="Search">
</form>-->
</div>
</nav>
<!--end of navbar-->
<div class="wrapper">
<div class="container-fluid text-center">]
<h6 class="text-center" id="pageDescription">
Welcome to Modern Voyeur! Our website provides users with the ability to view livestreaming webcams throughout the world, anytime, anywhere. The Replay button allows for viewing of the past 24 hours, 30 days, 12 months, and lifetime. The Live button allows you to view your desired location in real time. If creeping on strangers in foreign lands is what you like to do, we are here for you!
</h6>
<!-- page heading goes here -->
<div class="row my-5">
<div class="col-md-12 text-center">
<span id="heading"></span>
</div>
</div>
<!-- item buttons go here -->
<div class="row mb-5">
<div class="col-md-12 text-left">
<div class="mx-auto d-block" id="embedded-video">
</div>
<div id="buttons">
</div>
</div>
</div>
<!-- "back" and "next" button go here -->
<!--<div class="row my-5">
<div class="col-md-12 text-center">
<button class="btn btn-info back" id="back-button" type="button">
Back</button>
<button class="btn btn-info next" id="next-button" type="button">
Next</button>
</div>
</div>-->
<div class="row my-5">
<div class="col-md-12">
<div id="table-summary">
</div>
<br>
<div id="table-details">
</div>
</div>
</div>
<!-- "back" and "next" button go here -->
<div class="row my-5">
<div class="col-md-12 text-center">
<button class="btn btn-info back" id="back-button" type="button"><i class="fa fa-arrow-circle-o-left" aria-hidden="true"></i>
Back</button>
<button class="btn btn-info next" id="next-button" type="button">
Next <i class="fa fa-arrow-circle-o-right" aria-hidden="true"></i></button>
</div>
</div>
<!-- the page footer goes here -->
<div class="row">
<div id="footer" class="col-md-12 footer bg-muted text-center text-muted fixed-bottom">
<span>© 2017: Kelly | Roy | David | Ernesto</span>
</div>
</div>
</div>
</div>
<!-- javascripts go here -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD1sbW_gnhRRv0w750EZ070APTX7Rv6NME"></script>
<!-- JS file -->
<script src="./assets/javascript/jquery.easy-autocomplete.min.js"></script>
<script src="./assets/javascript/apps.js"></script>
</body>
</html>