-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
162 lines (143 loc) · 5.36 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<title>zer0.tv BETA baybee</title>
<script>
// Function to check if the user agent indicates a mobile device
function isMobileDevice() {
return /Mobi|Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
}
// Check if it's a mobile device and display a message if true
if (isMobileDevice()) {
alert("Please visit this site on a desktop for the best experience.");
}
</script>
</head>
<body>
<nav class="navbar navbar-expand-sm bg-dark" data-bs-theme="dark">
<div class="container-fluid ">
<span class="navbar-brand mb-0 h1">zer0.tv - a streamer discovery engine</span>
<form class="d-flex" role="search">
<input class="form-control me-2" type="text" placeholder="Login and then search for a game or category" aria-label="Search" id="search-input">
<button class="btn btn-outline-success btn-sm" type="submit" id="search-button">Search</button>
</form>
<div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent">
<ul class="navbar-nav ">
<li class="nav-item">
<img id="profile-image" src="" class="img-thumbnail float-end rounded-circle" width="50" height="50">
</li>
<li class="nav-item">
<a class="nav-link" aria-current="page" href="#"><button id="login-button" class="btn btn-light btn-sm">Log In</button>
<span class="navbar-text" role="currentUser" id="user-info">
<p id="user-login"></p>
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#exampleModal">
What?
</button>
</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container mt-4">
<div id="selected-stream-and-chat-container" class="mt-4">
<!-- Embedded stream and chat will be displayed here -->
</div>
<div id="category-search-results">
<h4>Search Results</h4>
<div id="category-search-result-list" class=categorySearch-pills data-toggle="popover">
<!-- Category search results will be added here -->
</div>
<div id="content">
<!-- Stream data will be displayed here -->
</div>
</div>
<div id="categories">
<h4>Top 50 Categories</h4>
<div id="category-list" class="category-pills" data-toggle="popover"></div>
</div>
</div>
<div class="container mt-4">
<div class=d-flex justify-content-evenly mb-3">
<div class=p2></div>
<div class="table-responsive p-3">
<table>
<tr>
<td id="boxArtCell"></td>
<td id="searchTerms"></td>
</tr>
<tr>
<button id="embedRandomStreamsAndChat" style="display: none;">Embed 3 Random Streams with Chat</button>
</tr>
</table>
<table class="table table-bordered table-hover" id="theTable">
<!-- Table header -->
<thead class="thead-dark">
<tr>
<th>Streamer</th>
<th>Age</th>
<th>Title</th>
<th>Mature</th>
<th>Viewers</th>
<th>Followers</th>
<th>Started</th>
<th>Tags</th>
</tr>
</thead>
<!-- Table body -->
<tbody id="search-result-list">
<!-- Table rows will be dynamically added here -->
</tbody>
</table>
</div>
</div>
<!-- Cards -->
<div class="container mt-4" id="card-search">
</div>
<!-- Add a container for pagination controls at the bottom -->
<div class="container mt-4">
<!-- Bootstrap pagination at the bottom -->
<nav>
<ul class="pagination justify-content-end" id="bottom-pagination-container">
<!-- Pagination buttons will be added here -->
</ul>
</nav>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">What?</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>zer0.tv aims to put the spotlight on smalltime streamers that have 4 or fewer viewers. Make their day!
<br>
<h3>How do I use it?</h3>
Login, search for your game, click the stream you want, ????, profit.
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script>
<script src="js/onemoretime.js"></script>
<script src="js/filter.js"></script>
<script src="js/misc.js"></script>
</body>
</html>