-
Notifications
You must be signed in to change notification settings - Fork 12
/
popup.html
239 lines (222 loc) · 9.54 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
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
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
<html>
<head>
<link href="css/main.css" rel="stylesheet">
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="author" content="Abhishek Deora"/>
<meta name="keywords" content="Youtube, Queue, Extension, Chrome">
<meta property="og:image" content="icon48.png"/>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<div class="row">
<div class="top-each" >
<span style="font-size:15px;">Youtube Queuing Extension</span>
</div>
<div id="controls">
<div class="control-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Previous" id="play_previous">
<img src="images/wprevious.png">
</div>
<div class="control-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Play/Pause" id="pause_play">
<img src="images/wplay_pause.png">
</div>
<div class="control-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Next" id="play_next">
<img src="images/wnext.png">
</div>
<div class="control-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Settings" id="settings">
<img src="images/settings.png">
</div>
<div class="control-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Shuffle Queue" id="shuffle">
<img src="images/shuffle.png">
</div>
<div class="control-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Empty Queue" id="empty">
<img src="images/empty.png">
</div>
</div>
<div class="col s12">
<ul class="tabs">
<li class="tab col s4"><a href="#test3">Store</a></li>
<li class="tab col s4"><a href="#test1">Playlists</a></li>
<li class="tab col s4"><a class="active" href="#test2">Queue(<span id="number">0</span>)</a></li>
</ul>
<div id="howToUse" class="tooltipped" data-position="bottom" data-delay="50" data-tooltip="How to use ?">
<img src="images/winfo1.png">
</div>
</div>
<div id="test3" class="col s12">
<div id="searchStore">
<input type="text" id="searchStoreName" placeholder="Search Playlists">
<input type="submit" value="Seach" id="searchStoreButton">
</div>
<div id="loadStore">
</div>
</div>
<div id="test1" class="col s12">
<div id="addPlaylist">
<input type="text" id="addPlaylistName">
<input type="submit" value="Add Playlist" id="addPlaylistButton">
</div>
<div id="loadBody">
</div>
</div>
<div id="test2" class="col s12">
<div id="yo">
</div>
<div id="a">
</div>
</div>
<div id="layer">
a
</div>
</div>
<div id="notifPopup">
hello world
</div>
<div id="editWindow">
<div id="editWindowHead">
PLAYLIST NAME
</div>
<div id="editWindowBody">
</div>
<div id="editWindowDone">
DONE
</div>
</div>
<div id="settingsWindow">
<div id="settingsWindowHead">
</div>
<div id="settingsWindowBody">
<div class="settingsOptionEach">
<div class="settingsOptionTitle">
Repeat All
</div>
<div class="settingsOptionButton">
<input type="checkbox" id="repeatAll">
</div>
</div>
<div class="settingsOptionEach">
<div class="settingsOptionTitle">
Show Add Icon on Thumbnails
</div>
<div class="settingsOptionButton">
<input type="checkbox" id="showIcons">
</div>
</div>
<div class="settingsOptionEach">
<div class="settingsOptionTitle">
Full-Screen Mode
</div>
<div class="settingsOptionButton">
<input type="checkbox" id="fullScreen" disabled>
</div>
</div>
<div class="settingsOptionEach">
<div class="settingsOptionTitle">
Dark Mode
</div>
<div class="settingsOptionButton">
<input type="checkbox" id="darkMode" disabled>
</div>
</div>
</div>
<div id="settingsWindowDone">
</div>
</div>
<div id="info">
<div id="infoHead">
<div id="infoHeadMessage">
Raising Funds for Server cost and Continued Development
</div>
<div id="infoHeadOptions">
<div class="infoHeadOptionsEach" title="PayPal">
<a href="https://www.paypal.me/adeora7" target="_blank"><img src="images/paypal.png"></a>
<span>Worldwide</span>
</div>
<div class="infoHeadOptionsEach" title="PayTM">
<a href="https://adeora7.github.io/paytm/" target="_blank"><img src="images/paytm.png"></a>
<span>India</span>
</div>
</div>
</div>
<ul>
<li>
<span class="number"></span>
<span>
<b>Please install
<a href="https://chrome.google.com/webstore/detail/adblock-plus/cfhdojbkjhnklbpkdaibdccddilifddb" target="_blank">AdblockPlus</a>
for this extension to work properly.</b>
</span>
</li>
<li>
<span class="number">1.</span>
<span>Show your support by staring on Github.
<a href="https://github.com/adeora7/youtube_queue_extension" target="_blank">
<img id="starGithub" src="images/star_github.png">
</a>
</span>
</li>
<li>
<span class="number">2.</span>
<span>If the video is currently playing <b>Double right click</b> on it, else <b>Right click</b> on a youtube video thumbnail to add video to the queue.
</span>.
</li>
<li>
<span class="number">3.</span>
<span>
Store is where playlists of all the users are saved. You can upload yours too. By default store shows featured videos. To add yours, email to <b>[email protected]</b>
</span>
</li>
<li>
<span class="number">4.</span>
<span>
Click on any video in Queue to play it. Queue is automatically saved when the browser closes and will resume playing the videos when you open your browser the next time.
</span>
</li>
<li>
<span class="number">5.</span>
<span>
Click on <b>'+'</b> icon of any video in queue and select the playlist you want the video to be added to.
</span>
</li>
<li>
<span class="number">6.</span>
<span>
Click on <b>"add playlist"</b> to add an empty playlist.
</span>
</li>
<li>
<span class="number">7.</span>
<span>
Click on a Playlist to show all the available options.
</span>
</li>
<li>
<span class="number">8.</span>
<span>
Click on Loop icon to toggle it. If turned on, it repeats all the songs in the queue.
</span>
</li>
<li>
<span class="number">9.</span>
<span>
Click on Empty icon to clear the queue.
</span>
</li>
<li>
<span class="number">10.</span>
<span>
Reorder Queue by dragging and dropping the videos in the Queue.
</span>
</li>
</ul>
<div id="infoClose">
Close
</div>
</div>
<script src="content.js"></script>
</body>
</html>