-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathpopup.html
90 lines (87 loc) · 3.66 KB
/
popup.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
<!doctype html>
<html>
<head>
<title>YouQueue</title>
</head>
<body>
<meta charset='utf-8'>
<link href="StyleSheet.css" rel="stylesheet" type="text/css">
<!-- This is the now playing text -->
<div align="center" style="min-height: 25px;">
<div align="center" id="currenttabdiv" style="display: none; padding-top: 10px;width: 280px;">
<b id="currenttab" align="center" class="nowplaying">Nothing</b>
</div>
</div>
<br>
<!-- This is the queued videos -->
<div align="center" style="min-height:140px;">
<ul class="queue" id="queue" width="100%"></ul>
<div id="emptytext" style="user-select: none;display: flex;flex-direction: column;justify-content: center;height: 140px;">
<p style="opacity: 0.3;width: 240px;align-self: center;">
<b>Tip!</b>
<br>
<tip style="overflow-wrap: break-word;"></tip>
<br>
<br>
</p>
<button id="donationbutton">Buy me coffee ☕</button>
</div>
</div>
<!-- This is the control buttons for the queue -->
<table align="center" width="100%">
<tr>
<td class="btnbg" width="33%" align="center">
<span class="trash" id="removeQueue">
<span></span>
<i></i>
</span>
</td>
<td class="btnbg" width="33%" align="center">
<img id="playpause" class="playpause" align="center" src="images/pause.png" width="30" height="30">
</td>
<td class="btnbg" width="33%" align="center">
<img id="nextQueue" class="next" align="center" src="images/nexticon.png" width="30" height="30">
</td>
</tr>
</table>
<!-- This is the searchbar -->
<div class="input_container">
<input id="searchbar" type="text" class="awsome_input" placeholder="search videos here!" />
<div id="searchresults" align="center">
</div>
</div>
<!-- Chatrelated -->
<div id="chat" style="display: none;">
<div id="chatboxholder">
<div id="chatbox" align="center"></div>
</div>
<!-- Chat input -->
<table align="center">
<tr align="center" style="height: 3em;">
<td width="70" style="vertical-align: middle;">
<input id="username" type="text" class="awesome_chatinput" placeholder="username" />
</td>
<td style="vertical-align: middle;">
<input id="chatinput" type="text" class="awesome_chatinput" placeholder="Chat" style="text-align: left;width: 100%;" />
</td>
<td width="25" style="vertical-align: middle;">
<button id="musicbutton" class="astext">🎵</button>
</td>
</tr>
</table>
</div>
<div align="center">
<button id="chatbutton" class="chatbutton">
<img class="clickrotate" align="center" src="images/downarrow.png" width="10" height="10">
</button>
</div>
<!-- Scripts -->
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"> </script>
<script src="html5sortable.min.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.0.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.0.2/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.0.2/firebase-firestore.js"></script>
<script type="text/javascript" src="helperfunctions.js"></script>
<script type="text/javascript" src="popup.js"></script>
</body>
</html>