Fixed turkish and added uwu (i'm brain ded right now)
[DeezloaderRemix.git] / app / views / index.ejs
1 <!DOCTYPE html>
2 <html>
3 <head>
4         <title>Deezloader Remix</title>
5         <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6         <link rel="stylesheet" type="text/css" href="css/material-icons.css"/>
7         <link rel="stylesheet" type="text/css" href="css/materialize.min.css"/>
8         <link rel="stylesheet" type="text/css" href="css/animate.css">
9         <link rel="stylesheet" type="text/css" href="css/style.css"/>
10         <link rel="stylesheet" type="text/css" href="css/darkMode.css" name="darkMode" disabled/>
11         <script type='text/javascript'>
12                 if (eval(localStorage.darkMode)){
13                         document.getElementsByName("darkMode")[0].removeAttribute("disabled");
14                 }
15         </script>
16         <meta charset="utf-8"/>
17 </head>
18 <body>
19 <span id="appVersionFallback" hidden>4.2.3</span>
20
21 <div id="title-bar" class="deezloader-black">
22         <div class="resize-padding" style="width: 100%; height: 3px;"></div>
23         <div class="resize-padding" style="width: 3px; height: 31px;"></div>
24         <div id="title">Deezloader Remix v<span id="application_version"></span></div>
25
26         <div id="title-bar-btns">
27                 <button id="min-btn"><i class="material-icons">remove</i></button>
28                 <button id="max-btn"><i class="material-icons">add</i></button>
29                 <button id="close-btn"><i class="material-icons">close</i></button>
30         </div>
31
32         <div class="resize-padding" style="position: absolute; top:0; right:0px; width: 3px; height: 31px;"></div>
33 </div>
34
35 <!--#############################################INITIALIZING-SCREEN############################################-->
36 <div id="initializing" class="valign-wrapper">
37         <div class="modal-content container" id="login-page">
38                 <div class="card">
39                         <div class="card-content">
40                                 <span class="card-title"><%= __('Please login to your deezer account')%>.</span>
41                                 <h6 class="red-text" id="login-res-text"></h6>
42                                 <div id="login-form-client-mode">
43                                         <div class="input-field col s12">
44                                                 <input autocomplete="off" type="text" id="modal_login_input_username"/>
45                                                 <label for="modal_login_input_username"><%= __('Email')%></label>
46                                         </div>
47                                         <div class="input-field col s12">
48                                                 <input autocomplete="off" type="password" id="modal_login_input_password"/>
49                                                 <label for="modal_login_input_password"><%= __('Password')%></label>
50                                         </div>
51                                         <input id="modal_login_input_captchaResponse" type="hidden" value=""/>
52                                         <!--<iframe id="modal_login_iframe_captcha" src="cap://deezer.com/"></iframe>-->
53                                 </div>
54                                 <div id="login-form-server-mode">
55                                         <div class="input-field col s12">
56                                                 <input autocomplete="off" type="password" id="modal_login_input_userToken"/>
57                                                 <label for="modal_login_input_userToken"><%= __('userToken')%></label>
58                                         </div>
59                                         <p><a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Login+via+userToken" target="_blank"><%= __('How do I get my userToken?')%></a></p>
60                                 </div>
61                         </div>
62                         <div class="card-action row">
63                                 <a href="#" class="deezloader-primary col s12 m2 waves-effect waves-light btn" id="modal_login_btn_login"><%= __('Log in')%></a>
64                                 <a href="#" class="deezloader-secondary col s12 m2 waves-effect waves-light btn" id="modal_login_btn_signup"><%= __('Sign up')%></a>
65                         </div>
66                 </div>
67         </div>
68 </div>
69
70 <!--#############################################MODAL_SETTINGS############################################-->
71 <div id="modal_settings" class="modal modal-fixed-footer">
72         <div class="modal-content">
73                 <h4 class="col s12"><%= __('Settings')%></h4>
74
75                 <h6 class="col s12 secondary-text"><%= __('Path Settings')%></h6><hr>
76                 <div class="row">
77                         <div class="input-field col s12">
78                                 <input autocomplete="off" type="text" id="modal_settings_input_downloadTracksLocation"/>
79                                 <label for="modal_settings_input_downloadTracksLocation"><%= __('Download folder path')%></label>
80                         </div>
81                 </div>
82
83                 <div class="row">
84                         <div class="input-field col s12">
85                                 <input autocomplete="off" type="text" id="modal_settings_input_trackNameTemplate"/>
86                                 <label for="modal_settings_input_trackNameTemplate"><%= __('Tracknames template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
87                                         data-tooltip="<%= __('Supported variables are')%>: %title%, %album%, %artist%, %year%, %date%, %label%, %number%, %disc%, %isrc%, %explicit%, %genre%">info_outline</i></label>
88                         </div>
89                 </div>
90
91                 <div class="row">
92                         <div class="input-field col s12 m6">
93                                 <input autocomplete="off" type="text" id="modal_settings_input_albumTrackNameTemplate"/>
94                                 <label for="modal_settings_input_albumTrackNameTemplate"><%= __('Album tracknames template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
95                                         data-tooltip="<%= __('Supported variables are')%>: %title%, %album%, %artist%, %year%, %date%, %label%, %number%, %disc%, %isrc%, %explicit%, %genre%">info_outline</i></label>
96                         </div>
97                         <div class="input-field col s12 m6">
98                                 <input autocomplete="off" type="text" id="modal_settings_input_albumNameTemplate"/>
99                                 <label for="modal_settings_input_albumNameTemplate"><%= __('Album names template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
100                                         data-tooltip="<%= __('Supported variables are')%>: %album%, %artist%, %year%, %date%, %bitrate%, %type%, %label%, %album_id%, %upc%, %explicit%, %genre%">info_outline</i></label>
101                         </div>
102                 </div>
103
104                 <div class="row">
105                         <div class="input-field col s12">
106                                 <input autocomplete="off" type="text" id="modal_settings_input_playlistTrackNameTemplate"/>
107                                 <label for="modal_settings_input_playlistTrackNameTemplate"><%= __('Playlist tracknames template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
108                                         data-tooltip="<%= __('Supported variables are')%>: %title%, %album%, %artist%, %year%, %date%, %label%, %number%, %position%, %disc%, %isrc%, %explicit%, %genre%">info_outline</i></label>
109                         </div>
110                 </div>
111
112                 <h6 class="col s12 secondary-text"><%= __('More Path Settings')%></h6><hr>
113                 <div class="row">
114                         <div class="col s12 switch settings_switch">
115                                 <span><%= __('Create folders for Artists')%></span>
116                                 <label>
117                                         <input type="checkbox" id="modal_settings_cbox_createArtistFolder"/>
118                                         <span class="lever"></span>
119                                 </label>
120                         </div>
121                         <div class="col s12 switch settings_switch">
122                                 <span><%= __('Create folders for Albums')%></span>
123                                 <label>
124                                         <input type="checkbox" id="modal_settings_cbox_createAlbumFolder"/>
125                                         <span class="lever"></span>
126                                 </label>
127                         </div>
128                         <div class="col s12 switch settings_switch">
129                                 <span><%= __('Create folders for CDs')%></span>
130                                 <label>
131                                         <input type="checkbox" id="modal_settings_cbox_createCDFolder" class="filled-in"/>
132                                         <span class="lever"></span>
133                                 </label>
134                         </div>
135                         <div class="col s12 switch settings_switch">
136                                 <span><%= __('Create Artist, Albums and CDs folders for Playlists too')%></span>
137                                 <label>
138                                         <input type="checkbox" id="modal_settings_cbox_createFoldersPlaylist" class="filled-in"/>
139                                         <span class="lever"></span>
140                                 </label>
141                         </div>
142                         <div class="col s12 switch settings_switch">
143                                 <span><%= __('Write all Artists in track filename')%></span>
144                                 <label>
145                                         <input type="checkbox" id="modal_settings_cbox_saveFullArtists" class="filled-in"/>
146                                         <span class="lever"></span>
147                                 </label>
148                         </div>
149                         <div class="col s12 switch settings_switch">
150                                 <span class="tooltipped" data-position="top" data-delay="500"
151                                         data-tooltip="<%= __('Adds 0s before %number% to have the same character length')%>"><%= __('Add padding to track numbers')%></span>
152                                 <label>
153                                         <input type="checkbox" id="modal_settings_cbox_padtrck" class="filled-in"/>
154                                         <span class="lever"></span>
155                                 </label>
156                         </div>
157                         <div class="input-field col s12">
158                                 <input autocomplete="off" type="number" id="modal_settings_number_paddingSize" min="0"/>
159                                 <label for="modal_settings_number_paddingSize"><%= __('Overwrite padding size')%></label>
160                         </div>
161                 </div>
162
163                 <h6 class="col s12 secondary-text"><%= __('App Settings')%></h6><hr>
164                 <div class="row">
165                         <div class="input-field col s12 m6">
166                                 <input autocomplete="off" type="number" id="modal_settings_number_queueConcurrency" min="1"/>
167                                 <label for="modal_settings_number_queueConcurrency"><%= __('Concurrent download limit')%></label>
168                         </div>
169                         <div class="input-field col s12 m6">
170                                 <select name="maxBitrate" id="modal_settings_select_maxBitrate">
171                                         <option value="9">FLAC 1411kbps</option>
172                                         <option value="3">MP3 320kbps</option>
173                                         <option value="1">MP3 128kbps</option>
174                                 </select>
175                                 <label for="modal_settings_select_maxBitrate"><%= __('Preferred bitrate')%></label>
176                         </div>
177                         <div class="input-field col s12 m6">
178                                 <select name="lang" id="modal_settings_select_lang">
179                                         <option value="en">English</option>
180                                         <option value="it">Italiano</option>
181                                         <option value="de">Deutsch</option>
182                                         <option value="es">Español</option>
183                                         <option value="tr">Türkçe</option>
184                                         <option value="uwu">engwish uwu</option>
185                                         <option value="pt-BR">Português do Brasil</option>
186                                 </select>
187                                 <label for="modal_settings_select_lang"><%= __('Language')%></label>
188                         </div>
189                         <div class="col s12 switch settings_switch">
190                                 <span><%= __('Fallback to lower bitrates if preferred is not available')%></span>
191                                 <label>
192                                         <input type="checkbox" id="modal_settings_cbox_fallbackBitrate" class="filled-in"/>
193                                         <span class="lever"></span>
194                                 </label>
195                         </div>
196                         <div class="col s12 switch settings_switch">
197                                 <span><%= __('Fallback to search if song is not available')%></span>
198                                 <label>
199                                         <input type="checkbox" id="modal_settings_cbox_fallbackSearch" class="filled-in"/>
200                                         <span class="lever"></span>
201                                 </label>
202                         </div>
203                         <div class="col s12 switch settings_switch">
204                                 <span><%= __('Download albums with one track as a single track')%></span>
205                                 <label>
206                                         <input type="checkbox" id="modal_settings_cbox_downloadSinglesAsTracks" class="filled-in"/>
207                                         <span class="lever"></span>
208                                 </label>
209                         </div>
210                         <div class="col s12 switch settings_switch">
211                                 <span><%= __('Create log file for Errors inside download folder')%></span>
212                                 <label>
213                                         <input type="checkbox" id="modal_settings_cbox_logErrors" class="filled-in"/>
214                                         <span class="lever"></span>
215                                 </label>
216                         </div>
217                         <div class="col s12 switch settings_switch">
218                                 <span><%= __('Create log file for Alternatives inside download folder')%></span>
219                                 <label>
220                                         <input type="checkbox" id="modal_settings_cbox_logSearched" class="filled-in"/>
221                                         <span class="lever"></span>
222                                 </label>
223                         </div><div class="col s12 switch settings_switch">
224                                 <span><%= __('Create M3U8 (Playlist) File')%></span>
225                                 <label>
226                                         <input type="checkbox" id="modal_settings_cbox_createM3UFile" class="filled-in"/>
227                                         <span class="lever"></span>
228                                 </label>
229                         </div>
230                         <div class="col s12 switch settings_switch">
231                                 <span><%= __('Download Synced Lyrics File (.lrc)')%></span>
232                                 <label>
233                                         <input type="checkbox" id="modal_settings_cbox_syncedlyrics" class="filled-in"/>
234                                         <span class="lever"></span>
235                                 </label>
236                         </div>
237                         <div class="col s12 switch settings_switch">
238                                 <span><%= __('Minimize to system tray')%></span>
239                                 <label>
240                                         <input type="checkbox" id="modal_settings_cbox_minimizeToTray" class="filled-in"/>
241                                         <span class="lever"></span>
242                                 </label>
243                         </div>
244                 </div>
245
246                 <h6 class="col s12 secondary-text"><%= __('Artworks')%></h6><hr>
247                 <div class="row">
248                         <div class="input-field col s12">
249                                 <select name="artworkSize" id="modal_settings_select_artworkSize">
250                                         <option value="2000">2000x2000</option>
251                                         <option value="1400">1400x1400</option>
252                                         <option value="1200">1200x1200</option>
253                                         <option value="1000">1000x1000</option>
254                                         <option value="800">800x800</option>
255                                         <option value="500">500x500</option>
256                                         <option value="250">250x250</option>
257                                 </select>
258                                 <label for="modal_settings_select_artworkSize"><%= __('Artwork Size')%></label>
259                         </div>
260                         <div class="col s12 switch settings_switch">
261                                 <span><%= __('Save Album Artwork')%></span>
262                                 <label>
263                                         <input type="checkbox" id="modal_settings_cbox_saveArtwork" class="filled-in"/>
264                                         <span class="lever"></span>
265                                 </label>
266                         </div>
267                         <div class="input-field col s12">
268                                 <input autocomplete="off" type="text" id="modal_settings_input_coverImageTemplate"/>
269                                 <label for="modal_settings_input_albumTrackNameTemplate"><%= __('Album Artwork Name Template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
270                                         data-tooltip="<%= __('Supported variables are')%>: %artist% and %name%">info_outline</i></label>
271                         </div>
272                         <div class="col s12 switch settings_switch">
273                                 <span><%= __('Save Artist Artwork')%></span>
274                                 <label>
275                                         <input type="checkbox" id="modal_settings_cbox_saveArtworkArtist" class="filled-in"/>
276                                         <span class="lever"></span>
277                                 </label>
278                         </div>
279                         <div class="input-field col s12">
280                                 <input autocomplete="off" type="text" id="modal_settings_input_artistImageTemplate"/>
281                                 <label for="modal_settings_input_albumNameTemplate"><%= __('Artist Artwork Name Template')%><i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
282                                         data-tooltip="<%= __('Supported variables are')%>: %artist%">info_outline</i></label>
283                         </div>
284                         <div class="col s12 switch settings_switch">
285                                 <span><%= __('Download images as PNGs')%></span>
286                                 <label>
287                                         <input type="checkbox" id="modal_settings_cbox_PNGcovers" class="filled-in"/>
288                                         <span class="lever"></span>
289                                 </label>
290                         </div>
291                 </div>
292
293                 <h6 class="col s12 secondary-text"><%= __('Tags')%></h6><hr>
294                 <div class="row">
295                         <div class="input-field col s12">
296                                 <select name="multitagSeparator" id="modal_settings_select_multitagSeparator">
297                                         <option value="null"><%= __('Null Character')%></option>
298                                         <option value=",">,</option>
299                                         <option value=", ">, <%= __('with space')%></option>
300                                         <option value="/">/</option>
301                                         <option value=" / ">/ <%= __('with space')%></option>
302                                         <option value=";">;</option>
303                                         <option value="; ">; <%= __('with space')%></option>
304                                 </select>
305                                 <label for="modal_settings_select_multitagSeparator"><%= __('Multitag Separator')%></label>
306                         </div>
307                         <div class="input-field col s12 m6">
308                                 <select name="dateFormat" id="modal_settings_select_dateFormat">
309                                         <option value="0"><%= __('YY')%>/<%= __('MM')%>/<%= __('DD')%></option>
310                                         <option value="1"><%= __('DD')%>/<%= __('MM')%>/<%= __('YY')%></option>
311                                         <option value="2"><%= __('MM')%>/<%= __('DD')%>/<%= __('YY')%></option>
312                                         <option value="3"><%= __('YY')%>/<%= __('DD')%>/<%= __('MM')%></option>
313                                 </select>
314                                 <label for="modal_settings_select_dateFormat"><%= __('Date Format')%></label>
315                         </div>
316                         <div class="input-field col s12 m6">
317                                 <select name="dateFormatYear" id="modal_settings_select_dateFormatYear">
318                                         <option value="2">2 <%= __('digit')%></option>
319                                         <option value="4">4 <%= __('digit')%></option>
320                                 </select>
321                                 <label for="modal_settings_select_dateFormatYear"><%= __('Year Format')%></label>
322                         </div>
323                         <div class="col s12 switch settings_switch">
324                                 <span class="tooltipped" data-position="top" data-delay="500"
325                                         data-tooltip="<%= __('Replaces albums tags with the playlist ones')%>"><%= __('Save Playlist as Compilation')%></span>
326                                 <label>
327                                         <input type="checkbox" id="modal_settings_cbox_savePlaylistAsCompilation" class="filled-in"/>
328                                         <span class="lever"></span>
329                                 </label>
330                         </div>
331                         <div class="col s12 switch settings_switch">
332                                 <span><%= __('Remove \"(Album Version)\" from tracknames')%></span>
333                                 <label>
334                                         <input type="checkbox" id="modal_settings_cbox_removeAlbumVersion" class="filled-in"/>
335                                         <span class="lever"></span>
336                                 </label>
337                         </div>
338                         <div class="col s12 switch settings_switch">
339                                 <span><%= __('Save ID3v1 tags as well')%></span>
340                                 <label>
341                                         <input type="checkbox" id="modal_settings_cbox_saveID3v1" class="filled-in"/>
342                                         <span class="lever"></span>
343                                 </label>
344                         </div>
345                 </div>
346
347                 <div class="row">
348                         <div class="col s12">
349                                 <a href="#modal_tags" class="modal-trigger waves-effect waves-light btn btn-large" style="width:100%;"><%= __('Choose Which Tags To Save')%></a>
350                         </div>
351                 </div>
352
353                 <h6 class="col s12 secondary-text"><%= __('Spotify Features')%></h6><hr>
354                 <p class="secondary-text"><%- __('SpotifyFeatures_Info')%></p>
355                 <div class="row">
356                         <div class="input-field col s12 m6">
357                                 <input autocomplete="off" type="text" id="modal_settings_input_spotifyClientID"/>
358                                 <label for="modal_settings_input_spotifyClientID"><%= __('Client ID')%></label>
359                         </div>
360                         <div class="input-field col s12 m6">
361                                 <input autocomplete="off" type="password" id="modal_settings_input_spotifyClientSecret"/>
362                                 <label for="modal_settings_input_spotifyClientSecret"><%= __('Client Secret')%></label>
363                         </div>
364                         <div class="input-field col s12 m6">
365                                 <input autocomplete="off" type="text" id="modal_settings_input_spotifyUser"/>
366                                 <label for="modal_settings_input_spotifyUser"><%= __('Spotify Username (for the Playlists Tab)')%></label>
367                         </div>
368                 </div>
369
370                 <div class="row">
371                         <div class="col s12">
372                                 <img id="modal_settings_picture" src="" alt="Profile Picture" class="circle left" style="height:125px; margin-right: 12px;"/>
373                                 <p><%= __('You are logged in as')%> <b id="modal_settings_username"></b></p>
374                                 <a href="#" class="modal-close waves-effect waves-light btn" id="modal_settings_btn_logout"><%= __('Logout')%></a>
375                         </div>
376                 </div>
377
378         </div>
379         <div class="modal-footer">
380                 <a href="#" class="modal-close waves-effect waves-light deezloader-primary btn" id="modal_settings_btn_saveSettings"><i
381                         class="material-icons right">save</i><%= __('Save')%></a>
382                 <a href="#" class="waves-effect btn-flat" id="modal_settings_btn_defaultSettings"><i
383                         class="material-icons right">settings_backup_restore</i><%= __('Default Settings')%></a>
384                 <a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
385         </div>
386 </div>
387
388 <!--#############################################MODAL_TAGS############################################-->
389 <div id="modal_tags" class="modal modal-fixed-footer">
390         <div class="modal-content">
391                 <div class="row">
392                         <h4 class="col s12"><%= __('Saved Tags')%></h4>
393                 </div>
394                 <div class="row">
395                         <p class="col s12 m4">
396                                 <label>
397                                         <input type="checkbox" id="modal_tags_title" class="filled-in"/>
398                                         <span><%= __('Title')%></span>
399                                 </label>
400                         </p>
401                         <p class="col s12 m4">
402                                 <label>
403                                         <input type="checkbox" id="modal_tags_artist" class="filled-in"/>
404                                         <span><%= __('Artist')%></span>
405                                 </label>
406                         </p>
407                         <p class="col s12 m4">
408                                 <label>
409                                         <input type="checkbox" id="modal_tags_album" class="filled-in"/>
410                                         <span><%= __('Album')%></span>
411                                 </label>
412                         </p>
413                         <p class="col s12 m4">
414                                 <label>
415                                         <input type="checkbox" id="modal_tags_cover" class="filled-in"/>
416                                         <span><%= __('Cover')%></span>
417                                 </label>
418                         </p>
419                         <p class="col s12 m4">
420                                 <label>
421                                         <input type="checkbox" id="modal_tags_trackNumber" class="filled-in"/>
422                                         <span><%= __('Track Number')%></span>
423                                 </label>
424                         </p>
425                         <p class="col s12 m4">
426                                 <label>
427                                         <input type="checkbox" id="modal_tags_trackTotal" class="filled-in"/>
428                                         <span><%= __('Track Total')%></span>
429                                 </label>
430                         </p>
431                         <p class="col s12 m4">
432                                 <label>
433                                         <input type="checkbox" id="modal_tags_discNumber" class="filled-in"/>
434                                         <span><%= __('Disc Number')%></span>
435                                 </label>
436                         </p>
437                         <p class="col s12 m4">
438                                 <label>
439                                         <input type="checkbox" id="modal_tags_discTotal" class="filled-in"/>
440                                         <span><%= __('Disc Total')%></span>
441                                 </label>
442                         </p>
443                         <p class="col s12 m4">
444                                 <label>
445                                         <input type="checkbox" id="modal_tags_albumArtist" class="filled-in"/>
446                                         <span><%= __('Album Artist')%></span>
447                                 </label>
448                         </p>
449                         <p class="col s12 m4">
450                                 <label>
451                                         <input type="checkbox" id="modal_tags_genre" class="filled-in"/>
452                                         <span><%= __('Genre')%></span>
453                                 </label>
454                         </p>
455                         <p class="col s12 m4">
456                                 <label>
457                                         <input type="checkbox" id="modal_tags_year" class="filled-in"/>
458                                         <span><%= __('Year')%></span>
459                                 </label>
460                         </p>
461                         <p class="col s12 m4">
462                                 <label>
463                                         <input type="checkbox" id="modal_tags_date" class="filled-in"/>
464                                         <span><%= __('Date')%></span>
465                                 </label>
466                         </p>
467                         <p class="col s12 m4">
468                                 <label>
469                                         <input type="checkbox" id="modal_tags_explicit" class="filled-in"/>
470                                         <span><%= __('Explicit')%></span>
471                                 </label>
472                         </p>
473                         <p class="col s12 m4">
474                                 <label>
475                                         <input type="checkbox" id="modal_tags_isrc" class="filled-in"/>
476                                         <span>ISRC</span>
477                                 </label>
478                         </p>
479                         <p class="col s12 m4">
480                                 <label>
481                                         <input type="checkbox" id="modal_tags_length" class="filled-in"/>
482                                         <span><%= __('Length')%></span>
483                                 </label>
484                         </p>
485                         <p class="col s12 m4">
486                                 <label>
487                                         <input type="checkbox" id="modal_tags_barcode" class="filled-in"/>
488                                         <span><%= __('Barcode')%></span>
489                                 </label>
490                         </p>
491                         <p class="col s12 m4">
492                                 <label>
493                                         <input type="checkbox" id="modal_tags_bpm" class="filled-in"/>
494                                         <span>BPM</span>
495                                 </label>
496                         </p>
497                         <p class="col s12 m4">
498                                 <label>
499                                         <input type="checkbox" id="modal_tags_replayGain" class="filled-in"/>
500                                         <span><%= __('Replay Gain')%></span>
501                                 </label>
502                         </p>
503                         <p class="col s12 m4">
504                                 <label>
505                                         <input type="checkbox" id="modal_tags_publisher" class="filled-in"/>
506                                         <span><%= __('Label')%></span>
507                                 </label>
508                         </p>
509                         <p class="col s12 m4">
510                                 <label>
511                                         <input type="checkbox" id="modal_tags_unsynchronisedLyrics" class="filled-in"/>
512                                         <span><%= __('Unsynchronised Lyrics')%></span>
513                                 </label>
514                         </p>
515                         <p class="col s12 m4">
516                                 <label>
517                                         <input type="checkbox" id="modal_tags_copyright" class="filled-in"/>
518                                         <span><%= __('Copyright')%></span>
519                                 </label>
520                         </p>
521                         <p class="col s12 m4">
522                                 <label>
523                                         <input type="checkbox" id="modal_tags_musicpublisher" class="filled-in"/>
524                                         <span><%= __('Publisher')%></span>
525                                 </label>
526                         </p>
527                         <p class="col s12 m4">
528                                 <label>
529                                         <input type="checkbox" id="modal_tags_composer" class="filled-in"/>
530                                         <span><%= __('Composer')%></span>
531                                 </label>
532                         </p>
533                         <p class="col s12 m4">
534                                 <label>
535                                         <input type="checkbox" id="modal_tags_mixer" class="filled-in"/>
536                                         <span><%= __('Mixer')%></span>
537                                 </label>
538                         </p>
539                         <p class="col s12 m4">
540                                 <label>
541                                         <input type="checkbox" id="modal_tags_author" class="filled-in"/>
542                                         <span><%= __('Author')%></span>
543                                 </label>
544                         </p>
545                         <p class="col s12 m4">
546                                 <label>
547                                         <input type="checkbox" id="modal_tags_writer" class="filled-in"/>
548                                         <span><%= __('Writer')%></span>
549                                 </label>
550                         </p>
551                         <p class="col s12 m4">
552                                 <label>
553                                         <input type="checkbox" id="modal_tags_engineer" class="filled-in"/>
554                                         <span><%= __('Engineer')%></span>
555                                 </label>
556                         </p>
557                         <p class="col s12 m4">
558                                 <label>
559                                         <input type="checkbox" id="modal_tags_producer" class="filled-in"/>
560                                         <span><%= __('Producer')%></span>
561                                 </label>
562                         </p>
563                 </div>
564         </div>
565         <div class="modal-footer">
566                 <a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
567         </div>
568 </div>
569
570 <!--#############################################MODAL_ABOUT############################################-->
571 <div id="modal_about" class="modal modal-fixed-footer">
572         <div class="modal-content">
573                 <div class="row">
574                         <h4 class="col s12"><%= __('About the App')%></h4>
575                 </div>
576                 <div class="row">
577                         <ul class="collapsible" data-collapsible="accordion">
578                                 <li>
579                                         <div class="collapsible-header waves-effect"><i class="material-icons">info</i><%= __('About')%></div>
580                                         <div class="collapsible-body">
581                                                 <p>
582                                                         <b><%= __('Branch')%>: </b>Remix</br>
583                                                         <b><%= __('Version')%>:</b> <span id="application_version_about"></span><br/>
584                                                         <b><%= __('Based on')%>: </b>Deezloader Reborn</br>
585                                                         <b><%= __('Maintainers')%>:</b> RemixDevs Group<br/>
586                                                         <b><%= __('Repo')%>: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix" target="_blank">Official Repo</a><br/>
587                                                         <b><%= __('FAQ')%>: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/FAQ" target="_blank">Link</a><br/>
588                                                         <b><%= __('Official mirrors')%>: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Downloads" target="_blank">Link</a><br/>
589                                                         <b><%= __('Interface')%>:</b> <a href="http://materializecss.com/" target="_blank">Materialize CSS</a><br/>
590                                                         <br/>
591                                                         <b><%= __('Telegram Contacts')%></b><br/>
592                                                         <b><a href="https://t.me/RemixDevs" target="_blank"><%= __('News Channel')%></a></b><br/>
593                                                         <b><a href="https://t.me/DeezloaderRemixBeta" target="_blank"><%= __('Betas Channel')%></a></b><br/>
594                                                         <b><a href="https://t.me/DeezloaderRemix" target="_blank"><%= __('Stable Releases Channel')%></a></b><br/>
595                                                         <br>
596                                                         <b><%= __('Special Thanks to')%>:</b><br>
597                                                         BasCurtiz for the app UI Design<br>
598                                                         ZzMTV for the original Deezloader code<br>
599                                                         ParadoxalManiak, snwflake and ExtendLord for maintaining the previous branches<br>
600                                                         <br>
601                                                         <b>Translations:</b><br>
602                                                         Italian: RemixDev
603                                                         German: lollilol, Tobs<br>
604                                                         Spanish: Wanamingo<br>
605                                                         Turkish: Metep<br>
606                                                         Brazilian Portuguese: C4RLETH<br>
607                                                 </p>
608                                         </div>
609                                 </li>
610                                 <li>
611                                         <div class="collapsible-header waves-effect"><i class="material-icons">feedback</i><%= __('Feedback')%></div>
612                                         <div class="collapsible-body">
613                                                 <p>
614                                                         <%- __('Feedback_Text')%>
615                                                 </p>
616                                         </div>
617                                 </li>
618                                 <li>
619                                         <div class="collapsible-header waves-effect"><i class="material-icons">bug_report</i><%= __('Reporting Bugs')%></div>
620                                         <div class="collapsible-body">
621                                                 <p>
622                                                         <%- __('Bugs_Text')%>
623                                                 </p>
624                                         </div>
625                                 </li>
626                                 <li>
627                                         <div class="collapsible-header waves-effect"><i class="material-icons">group</i><%= __('Contacts')%></div>
628                                         <div class="collapsible-body">
629                                                 <p>
630                                                         <%- __('Contacts_Text')%><br>
631                                                         <ul>
632                                                                 <li><a href="https://t.me/DeezloaderItalia">Gruppo in Italiano</a></li>
633                                                                 <li><a href="https://t.me/joinchat/Ed1JxEn3_Bx1et6SCeLurg">Grupo en español</a></li>
634                                                                 <li><a href="https://t.me/deezloaderpt">Grupo em Português</a></li>
635                                                 </ul>
636                                                 </p>
637                                         </div>
638                                 </li>
639                                 <li>
640                                         <div class="collapsible-header waves-effect"><i class="material-icons">warning</i><%= __('Attention!')%></div>
641                                         <div class="collapsible-body">
642                                                 <p><%- __('Attention_Text')%></p>
643                                         </div>
644                                 </li>
645                                 <li>
646                                         <div class="collapsible-header waves-effect"><i class="material-icons">history</i><%= __('Changelog')%></div>
647                                         <div class="collapsible-body">
648                                                 <p>
649                                                         <b>Version 4.2.2</b><br/>
650                                                         - Re-added login with email / password with captcha popup (Doesn't work on Server Mode)<br/>
651                                                         - Reorganized Settings<br/>
652                                                         - ID3 default is now the only option for MP3 date format (If you had that selected you should change that or do a clean install)<br/>
653                                                         - Added link analyzer<br/>
654                                                         - Added support for spotify tracks and albums via urls and uri<br/>
655                                                         - Added %bitrate% and %date% to album folder name<br/>
656                                                         - Added %date% to tracknames<br/>
657                                                         - Added %position% for playlist tracknames<br/>
658                                                         - Added %isrc%, %upc% and %album_id%<br/>
659                                                         - Added option to enable or disable search fallback<br/>
660                                                         - Added option to create album/artist/cd folders for playlists as well<br/>
661                                                         - Added option to save playlist as a compilation (it overwrites original tags with the playlist one)<br/>
662                                                         - Added more UI elements to display errors<br/>
663                                                         - Added error log when clicking on error sign in the Download Tab<br/>
664                                                         - Added quality selection to remaining download buttons<br/>
665                                                         - Fixed certificate error while looking for updates<br/>
666                                                         - Fixed spotify playlist conversion problems<br/>
667                                                         - Fixed tags problems<br/>
668                                                         - Other Minor improvments<br/>
669                                                         <br/>
670                                                         <b>Version 4.2.1</b><br/>
671                                                         - Downloads are binded to the server on server mode<br/>
672                                                         - Downloading playlists wont create artist and album folders if options are selected<br/>
673                                                         - Date tag is now enabled by default on new installations<br/>
674                                                         - Now users without propic will have a default one in the settings<br/>
675                                                         - Update message only nags once per client<br/>
676                                                         - Added space after %explicit% if there is text after the tag<br/>
677                                                         - Added label at the end of album viewin the modal<br/>
678                                                         - Fixed forEach error when downloading tracks<br/>
679                                                         - Fixed problem where %type% could be empty<br/>
680                                                         - Fixed macOS copy-paste problem<br/>
681                                                         - Fixed duplicate detection when downloading tracks<br/>
682                                                         - Fixed null separator for multitags on FLACs<br/>
683                                                         - Fixed problem where m3u file on multidisc albums was wrong<br/>
684                                                         <br/>
685                                                         <b>Version 4.2.0</b><br/>
686                                                         - New login workflow<br/>
687                                                         - Improved UI<br/>
688                                                         - Revamped album, artists and playlist modals<br/>
689                                                         - Added option to download the track in a different quality over the one selected (right click on d/l button)<br/>
690                                                         - Added autologin by default to fix re-connection problems<br/>
691                                                         - Re-added fallback on track errors<br/>
692                                                         - Fixed Default Settings button<br/>
693                                                         - Fixed links not working in server mode<br/>
694                                                         - Fixed UI problems when on mobile view (responsive site)<br/>
695                                                         - Fixed Settings menu not being populated on mobile view<br/>
696                                                         - Fixed problem with the artist tag when downloading playlists and albums<br/>
697                                                         - Fixed playlist numbering on files (now it doesn't override the trackNumber tag)<br/>
698                                                         - Fixed aritst artwork not saving<br/>
699                                                         <br/>
700                                                         <b>Version 4.1.8</b><br/>
701                                                         - Fix the issue where some people wasn't able to log in from the Netherlands<br/>
702                                                         <br/>
703                                                         <b>Version 4.1.7</b><br/>
704                                                         - Partial rewrite of the app (4.2.0 will have the other half)<br/>
705                                                         - Fixed login security issue<br/>
706                                                         - Better Spotify integration (now conversion uses ISRC if found)<br/>
707                                                         - Fixed France Charts not showing up<br/>
708                                                         - Albums with only one track will download as a single track<br/>
709                                                         - Added option %genre% for Track and Album names<br/>
710                                                         - Added support for subfolders in Album name<br/>
711                                                         - Minor changes to the UI<br/>
712                                                         <br/>
713                                                         <b>Version 4.1.6</b><br/>
714                                                         - Fixed Spotify Playlist problem<br/>
715                                                         - Fixed security issue where Client Secret is exposed in Compiled binaries<br/>
716                                                         - Now to use Spotify Features you need to follow <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Spotify+Features" target="_blank">this guide</a> first<br/>
717                                                         - Minor bugfixes and improvments<br/>
718                                                         <br/>
719                                                         <b>Version 4.1.5</b><br/>
720                                                         - Fixed %explicit% for album names<br/>
721                                                         - Added Contributions page<br/>
722                                                         - Fixed some spelling issues<br/>
723                                                         <br/>
724                                                         <b>Version 4.1.4</b><br/>
725                                                         - Improved Privacy in Server Mode<br/>
726                                                         - Cleaned up some files<br/>
727                                                         - Fixed Day Month position in DATE tag<br/>
728                                                         - Fixed %explicit% in name templates<br/>
729                                                         - Fixed artist download<br/>
730                                                         - Fixed FLAC Problems (not all of them)<br/>
731                                                         - Fixed select folder cancel bug<br/>
732                                                         - Added Update Notification<br/>
733                                                         - Added default ID3 DATE tag format<br/>
734                                                         - Added minimize to system tray<br/>
735                                                         - Added multitag separator for FLACS<br/>
736                                                         - Added hyperlinks to artist & album<br/>
737                                                         - Added option to better remove duplicates in the artist tag (Still in BETA)<br/>
738                                                         - Added option to save the track with the full list of artist in the filename<br/>
739                                                         - Added option to overwrite padding size<br/>
740                                                         - Added "Download All" button in modals<br/>
741                                                         - Removed ReplayGain as default setting<br/>
742                                                         <br/>
743                                                         <b>Version 4.1.3</b><br/>
744                                                         - Playlist and Album tracks now have fallback support<br/>
745                                                         - M3U files now works correctly<br/>
746                                                         - Fixed problems with tags<br/>
747                                                         - Added option %explicit% for Track and Album names (Will add "(Explicit)" in that position if it's explicit)<br/>
748                                                         - Added option to remove "(Album Version)" from track title<br/>
749                                                         - Added options to select which format should the date tag have<br/>
750                                                         - Added option to not fallback if desired bitrate is not available<br/>
751                                                         - Logging enhancements<br/>
752                                                         - Other minor bug-fixing<br/>
753                                                         <br/>
754                                                         <b>Version 4.1.2</b><br/>
755                                                         - Fixed Login Problem (for real this time)<br/>
756                                                         - Fixed Login after refresh<br/>
757                                                         - Regionlock free download<br/>
758                                                         - Added support for download of User Uploaded tracks<br/>
759                                                         - Now you can select which tags your songs has<br/>
760                                                         - Fixed selecting problem<br/>
761                                                         - Tracks without preview will display a disabled play button<br/>
762                                                         - Previews inside modal will stop with modal close<br/>
763                                                         - New %label% field for tracks and albums<br/>
764                                                         - Added option to create folder for CDs<br/>
765                                                         - Added rename option for cover file<br/>
766                                                         - Added option to download Artist artwork<br/>
767                                                         - Added option do log downloaded alternative tracks<br/>
768                                                         - Fixed some minor bugs<br/>
769                                                         <br/>
770                                                         <b>Version 4.1.1</b><br/>
771                                                         - Fixed Login Problem (again)<br/>
772                                                         - Added Dark Mode<br/>
773                                                         - Added smaller cover option<br/>
774                                                         - Added support for lower bitrates<br/>
775                                                         - Added "Stop All Downloads" button<br/>
776                                                         - Added support for Spotify Playlist preview<br/>
777                                                         - Added support for PNG covers<br/>
778                                                         - Re-Added Date Tag<br/>
779                                                         - Fixed same cover for same track in different albums bug<br/>
780                                                         - Fixed login issue from repository build<br/>
781                                                         <br/>
782                                                         <b>Version 4.1.0</b><br/>
783                                                         - New UI (not completly optimized for small screens)<br/>
784                                                         - Fixed login problems<br/>
785                                                         - Fixed %type% parameter not working<br/>
786                                                         - Fixed year tagging problem<br/>
787                                                         - Fixed playlist file not containing tracks<br/>
788                                                         - More precision in Spotify Playlist conversion<br/>
789                                                         <br/>
790                                                         <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Changelog" target="_blank"><%= __('Full Changelog Here')%></a>
791                                                 </p>
792                                         </div>
793                                 </li>
794                                 <li>
795                                         <div class="collapsible-header waves-effect"><i class="material-icons">copyright</i><%= __('License')%></div>
796                                         <div class="collapsible-body">
797                                                 <p>
798                                                         <a rel="license" href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">
799                                                                 <img alt="GNU General Public License" style="border-width:0"
800                                                                                  src="https://www.gnu.org/graphics/gplv3-127x51.png"/>
801                                                         </a><br/>
802                                                         This work is licensed under a <a rel="license" href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">GNU General Public License 3.0</a>.
803                                                 </p>
804                                         </div>
805                                 </li>
806                                 <li>
807                                         <div class="collapsible-header waves-effect"><i class="material-icons">favorite</i><%= __('Contributions')%></div>
808                                         <div class="collapsible-body">
809                                                 <%- __('Contributions_Text')%>
810                                                 <p>
811                                                         PayPal: <a href="https://paypal.me/RemixDev" target="_blank">PayPal.me/RemixDev</a><br>
812                                                         Bitcoin: 1sdNymSJrMBWyHM4u2m9uco5nv6uV4Qs1<br>
813                                                         Ethereum: 0x1d2aa67e671485CD4062289772B662e0A6Ff976c
814                                                 </p>
815                                         </div>
816                                 </li>
817                         </ul>
818                 </div>
819         </div>
820         <div class="modal-footer">
821                 <a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
822         </div>
823 </div>
824
825 <!--##########################################MODAL_TRACKLIST###########################################-->
826 <div id="modal_trackList" class="modal modal-fixed-footer modal-custom-header">
827         <div class="modal-content">
828                 <div class="trackList-header" v-bind:style="{ 'background-image': `linear-gradient(to bottom, transparent 0%, var(--main-modal-background) 100%), url('${image}')` }">
829                         <h4>{{ title }}</h4>
830                         <h6 v-if="metadata" style="display: inline;">{{ metadata }}</h6>
831                         <span class="right hide-on-small-only" v-if="release_date"> {{ release_date }} </span>
832                 </div>
833                 <div class="modal-container">
834                         <table class="highlight col s12">
835                                 <thead>
836                                 <tr>
837                                         <td v-for="data in head" v-html="data.title" v-bind:style = "{ 'width': `${data.width ? data.width : 'auto'}`}" v-bind:class="{ 'hide-on-med-and-up' : data.smallonly, 'hide-on-small-only': data.hideonsmall }"></td>
838                                 </tr>
839                                 </thead>
840                                 <tbody id="modal_trackList_table_trackList_tbody_loadingIndicator" class="hide">
841                                 <tr>
842                                         <td class="center" colspan="6">
843                                                 <div class="preloader-wrapper big active">
844                                                         <div class="spinner-layer">
845                                                                 <div class="circle-clipper left">
846                                                                         <div class="circle"></div>
847                                                                 </div>
848                                                                 <div class="gap-patch">
849                                                                         <div class="circle"></div>
850                                                                 </div>
851                                                                 <div class="circle-clipper right">
852                                                                         <div class="circle"></div>
853                                                                 </div>
854                                                         </div>
855                                                 </div>
856                                         </td>
857                                 </tr>
858                                 </tbody>
859                                 <tbody id="modal_trackList_table_trackList_tbody_trackList" class="hide">
860                                 </tbody>
861                         </table>
862                 </div>
863         </div>
864         <div class="modal-footer">
865                 <a href="#" id="download_all_tracks" v-bind:data-link="link" class="btn btn-flat waves-effect waves-light left">Download {{ type }}</a>
866                 <a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
867         </div>
868 </div>
869
870 <!--##########################################MODAL_TRACKLISTALBUM###########################################-->
871 <div id="modal_trackListSelective" class="modal modal-fixed-footer modal-custom-header">
872         <div class="modal-content">
873                 <div class="trackList-header" v-bind:style="{ 'background-image': `linear-gradient(to bottom, transparent 0%, var(--main-modal-background) 100%), url('${image}')` }">
874                         <h4>{{ title }} <i v-if="explicit" class="material-icons valignicon materialize-red-text tooltipped" data-tooltip="Explicit">explicit</i></h4>
875                         <h6 v-if="metadata" style="display: inline;">{{ metadata }}</h6>
876                         <span class="right hide-on-small-only" v-if="release_date">{{ release_date }}</span>
877                 </div>
878                 <div class="modal-container">
879                         <table class="highlight col s12">
880                                 <thead>
881                                 <tr>
882                                         <td v-for="data in head" v-html="data.title" v-bind:style = "{ 'width': `${data.width ? data.width : 'auto'}`}" v-bind:class="{ 'hide-on-med-and-up' : data.smallonly, 'hide-on-small-only': data.hideonsmall }"></td>
883                                 </tr>
884                                 </thead>
885                                 <tbody id="modal_trackListSelective_table_trackListSelective_tbody_loadingIndicator" class="hide">
886                                 <tr>
887                                         <td class="center" colspan="6">
888                                                 <div class="preloader-wrapper big active">
889                                                         <div class="spinner-layer">
890                                                                 <div class="circle-clipper left">
891                                                                         <div class="circle"></div>
892                                                                 </div>
893                                                                 <div class="gap-patch">
894                                                                         <div class="circle"></div>
895                                                                 </div>
896                                                                 <div class="circle-clipper right">
897                                                                         <div class="circle"></div>
898                                                                 </div>
899                                                         </div>
900                                                 </div>
901                                         </td>
902                                 </tr>
903                                 </tbody>
904                                 <tbody id="modal_trackListSelective_table_trackListSelective_tbody_trackListSelective" class="hide">
905                                 </tbody>
906                         </table>
907                         <span v-if="label" style="opacity: 0.40;margin-top: 8px;display: inline-block;font-size: 13px;">{{ label }}</span>
908                 </div>
909         </div>
910         <div class="modal-footer">
911                 <a href="#" id="download_all_tracks_selective" v-bind:data-link="link" class="btn btn-flat waves-effect waves-light left">Download {{ type }}</a>
912                 <a href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text"><span class="hide-on-small-only"><%= __('Download selection')%><i class="material-icons right">file_download</i></span><i class="material-icons hide-on-med-and-up">file_download</i></a>
913                 <a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
914         </div>
915 </div>
916
917 <!--##########################################MODAL_MSG###########################################-->
918 <div id="modal_msg" class="modal">
919         <div class="modal-content">
920                 <div class="row">
921                         <h4 class="col s12" id="modal_msg_title"></h4>
922                 </div>
923                 <div class="row">
924                         <p style="white-space: pre-line" class="col s12" id="modal_msg_message"></p>
925                 </div>
926         </div>
927         <div class="modal-footer">
928                 <a href="#" class="modal-close waves-effect waves-light btn"><%= __('I got it!')%></a>
929         </div>
930 </div>
931
932 <!--##########################################MODAL_ANALYZER_COUNTRY###########################################-->
933 <div id="modal_link_analyzer_country" class="modal modal-fixed-footer">
934         <div class="modal-content">
935                 <h4 class="col s12"><%= __('Available Countries for')%> {{ title }}</h4>
936                 <table class="striped col s12">
937                         <thead>
938                                 <tr>
939                                         <th style="width:24px;"></th>
940                                         <th><%= __('Country')%></th>
941                                 </tr>
942                         </thead>
943                         <tbody>
944                                 <tr v-for="cc in countries">
945                                         <td v-for="val in cc">{{ val }}</td>
946                                 </tr>
947                         </tbody>
948                 </table>
949         </div>
950         <div class="modal-footer">
951                 <a href="#" class="modal-close waves-effect waves-light btn"><%= __('Close')%></a>
952         </div>
953 </div>
954
955 <!--********************************************MAIN-CONTENT********************************************-->
956 <nav>
957         <div class="nav-wrapper">
958                 <div class="brand-logo center hide-on-small-only">Deezloader <b>Remix</b></div>
959                 <ul class="left hide-on-small-only">
960                         <li>
961                                 <div class="switch">
962                                         <label>
963                                                 <i class="material-icons left white-text" style="margin-right: 0px; margin-left: 15px;">brightness_2</i>
964                                                 <input id="nightTimeSwitcher" type="checkbox">
965                                                 <span class="lever"></span>
966                                         </label>
967                                 </div>
968                         </li>
969                 </ul>
970                 <a href="#" data-target="slide-out" class="sidenav-trigger hide-on-med-and-up right"><i class="material-icons">menu</i></a>
971                 <ul id="nav-mobile" class="right hide-on-small-only">
972                         <li>
973                                 <a href="#modal_settings" id="nav_btn_openSettingsModal" class="waves-effect waves-light modal-trigger">
974                                         <i class="material-icons left">settings</i> <span class="hide-on-med-and-down"><%= __('Settings')%></span>
975                                 </a>
976                         </li>
977                         <li>
978                                 <a href="#modal_about" class="waves-effect waves-light modal-trigger">
979                                         <i class="material-icons left">info</i> <span class="hide-on-med-and-down"><%= __('About')%></span>
980                                 </a>
981                         </li>
982                 </ul>
983         </div>
984 </nav>
985
986 <img src="img/icon.svg" class="circle" id="main_icon"></img>
987
988 <ul id="slide-out" class="sidenav">
989         <li><div class="user-view">
990                 <div class="background"></div>
991                 <a href="#user"><img class="circle" id="side_avatar"></a>
992                 <a href="#name"><span class="white-text name" id="side_user"></span></a>
993                 <a href="#email"><span class="white-text email" id="side_email"></span></a>
994         </div></li>
995         <li><a href="#!" tab-id="tab_search" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">search</i><%= __('Search')%></a></li>
996         <li><a href="#!" tab-id="tab_charts" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">bubble_chart</i><%= __('Charts')%></a></li>
997         <li><a href="#!" tab-id="tab_playlists" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">playlist_play</i><%= __('Playlists')%></a></li>
998         <li><a href="#!" tab-id="tab_link" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">link</i><%= __('Link Analyzer')%></a></li>
999         <li><a href="#!" tab-id="tab_url" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">link</i><%= __('Download from URL')%></a></li>
1000         <li><a href="#!" tab-id="tab_downloads" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">get_app</i><%= __('Downloads')%></a></li>
1001         <li><div class="divider"></div></li>
1002         <li><a href="#modal_settings" id="sidenav_settings" class="waves-effect sidenav-close modal-trigger"><i class="material-icons">settings</i><%= __('Settings')%></a></li>
1003         <li><a href="#modal_about" class="waves-effect sidenav-close modal-trigger"><i class="material-icons">info</i><%= __('About')%></a></li>
1004         <li><a href="#!" id="nightModeSwitch2"><i class="material-icons">brightness_2</i><%= __('Enable Night Mode')%></a>
1005         </li>
1006 </ul>
1007
1008 <main class="container">
1009         <ul id="tab-nav" class="row tabs tabs-fixed-width hide-on-small-only">
1010                 <li class="tab"><a class="active" href="#tab_search"><%= __('Search')%></a></li>
1011                 <li class="tab"><a href="#tab_charts"><%= __('Charts')%></a></li>
1012                 <li class="tab"><a href="#tab_playlists"><%= __('Playlists')%></a></li>
1013                 <li class="tab"><a href="#tab_link"><%= __('Link Analyzer')%></a></li>
1014                 <li class="tab"><a href="#tab_url"><%= __('Download from URL')%></a></li>
1015                 <li class="tab"><a href="#tab_downloads"><%= __('Downloads')%></a></li>
1016         </ul>
1017
1018         <div id="main-content" class="row">
1019
1020                 <div id="tab_search">
1021                         <form id="tab_search_form_search">
1022                                 <div class="inline-input-group col s12">
1023                                         <input autocomplete="off" id="tab_search_form_search_input_searchString" type="search" class="input" placeholder="<%= __('Start searching...')%>">
1024                                         <button class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">search</i></button>
1025                                 </div>
1026                                 <div class="row center">
1027                                         <p class="col s3">
1028                                                 <label>
1029                                                 <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_song" value="track" checked/>
1030                                                 <span><i class="material-icons show-on-small-only left deezloader-primary-text">music_note</i><span class="hide-on-med-and-down"><%= __('Song')%></span></span>
1031                                                 </label>
1032                                         </p>
1033                                         <p class="col s3">
1034                                                 <label>
1035                                                 <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_album" value="album"/>
1036                                                 <span><i class="material-icons show-on-small-only left deezloader-primary-text">album</i><span class="hide-on-med-and-down"><%= __('Album')%></span></span>
1037                                                 </label>
1038                                         </p>
1039                                         <p class="col s3">
1040                                                 <label>
1041                                                 <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_artist" value="artist"/>
1042                                                 <span><i class="material-icons show-on-small-only left deezloader-primary-text">person</i><span class="hide-on-med-and-down"><%= __('Artist')%></span></span>
1043                                                 </label>
1044                                         </p>
1045                                         <p class="col s3">
1046                                                 <label>
1047                                                         <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_playlist" value="playlist"/>
1048                                                         <span><i class="material-icons show-on-small-only left deezloader-primary-text">playlist_play</i><span class="hide-on-med-and-down"><%= __('Playlist')%></span></span>
1049                                                 </label>
1050                                         </p>
1051                                 </div>
1052                         </form>
1053                         <div id="tab_search_results">
1054                                 <table id="tab_search_table_results" class="striped col s12">
1055                                         <thead class="hide-on-small-only">
1056                                                 <tr class="hide" id="tab_search_table_results_thead_track">
1057                                                         <th style="width: 56px;"><!--cover--></th>
1058                                                         <th><%= __('Song')%></th>
1059                                                         <th><%= __('Artist')%></th>
1060                                                         <th><%= __('Album')%></th>
1061                                                         <th><i class="material-icons">timer</i></th>
1062                                                         <th style="width: 56px;"><!--download_link--></th>
1063                                                 </tr>
1064                                                 <tr class="hide" id="tab_search_table_results_thead_album">
1065                                                         <th style="width: 56px;"><!--cover--></th>
1066                                                         <th><%= __('Album')%></th>
1067                                                         <th><%= __('Artist')%></th>
1068                                                         <th><%= __('Songs')%></th>
1069                                                         <th><%= __('Type')%></th>
1070                                                         <th><!--space--></th>
1071                                                         <th style="width: 56px;"><!--download_link--></th>
1072                                                 </tr>
1073                                                 <tr class="hide" id="tab_search_table_results_thead_artist">
1074                                                         <th style="width: 56px;"><!--cover--></th>
1075                                                         <th><%= __('Artist')%></th>
1076                                                         <th><%= __('Albums')%></th>
1077                                                         <th><!--space--></th>
1078                                                         <th style="width: 56px;"><!--download_link--></th>
1079                                                 </tr>
1080                                                 <tr class="hide" id="tab_search_table_results_thead_playlist">
1081                                                         <th style="width: 56px;"><!--cover--></th>
1082                                                         <th><%= __('Name')%></th>
1083                                                         <th><%= __('Songs')%></th>
1084                                                         <th style="width: 56px;"><!--space--></th>
1085                                                         <th style="width: 56px;"><!--download_link--></th>
1086                                                 </tr>
1087                                         </thead>
1088                                         <tbody id="tab_search_table_results_tbody_loadingIndicator" class="hide loadingTab">
1089                                                 <tr>
1090                                                         <td class="center">
1091                                                                 <div class="preloader-wrapper big active">
1092                                                                         <div class="spinner-layer spinner-blue-only">
1093                                                                                 <!-- Spinner Code -->
1094                                                                                 <div class="circle-clipper left"><div class="circle"></div></div><div class="gap-patch"><div class="circle"></div></div><div class="circle-clipper right"><div class="circle"></div></div>
1095                                                                         </div>
1096                                                                 </div>
1097                                                         </td>
1098                                                 </tr>
1099                                         </tbody>
1100                                         <tbody id="tab_search_table_results_tbody_results"></tbody>
1101                                         <tbody id="tab_search_table_results_tbody_noResults" class="hide">
1102                                                 <tr>
1103                                                         <td class="center"><%= __('Nothing found!')%></td>
1104                                                 </tr>
1105                                         </tbody>
1106                                 </table>
1107                         </div>
1108                 </div>
1109
1110                 <div id="tab_charts">
1111                         <div class="input-field col s12">
1112                                 <select id="tab_charts_select_country" class="icons">
1113                                         <!--All country selects have to be like the following example:
1114                                         <option value="example" data-icon="images/sample.jpg" class="left circle">Example</option>
1115                                         -->
1116                                 </select>
1117                                 <label><%= __('Country')%></label>
1118                         </div>
1119                         <button id="downloadChartPlaylist" class="col s12 btn btn-input btn-flat deezloader-primary white-text" style="margin-bottom:8px;"><%= __('Download Playlist')%></button>
1120                         <table id="tab_charts_table_charts" class="striped">
1121                                 <thead class="hide-on-small-only">
1122                                         <tr>
1123                                                 <th>#</th>
1124                                                 <th style="width: 56px;"><!--cover--></th>
1125                                                 <th><%= __('Song')%></th>
1126                                                 <th><%= __('Artist')%></th>
1127                                                 <th><%= __('Album')%></th>
1128                                                 <th><i class="material-icons">timer</i></th>
1129                                                 <th style="width: 56px;"><!--download_link--></th>
1130                                         </tr>
1131                                 </thead>
1132                                 <tbody id="tab_charts_table_charts_tbody_loadingIndicator" class="loadingTab">
1133                                         <tr>
1134                                                 <td colspan="7" class="center">
1135                                                         <div class="preloader-wrapper big active">
1136                                                                 <div class="spinner-layer spinner-blue-only">
1137                                                                         <!-- Spinner Code -->
1138                                                                         <div class="circle-clipper left"><div class="circle"></div></div><div class="gap-patch"><div class="circle"></div></div><div class="circle-clipper right"><div class="circle"></div></div>
1139                                                                 </div>
1140                                                         </div>
1141                                                 </td>
1142                                         </tr>
1143                                 </tbody>
1144                                 <tbody id="tab_charts_table_charts_tbody_charts"></tbody>
1145                         </table>
1146                 </div>
1147
1148                 <div id="tab_playlists" class="row">
1149                         <div class="col s12">
1150                                 <button class="btn-flat btn-large waves-effect deezloader-primary white-text" id="button_refresh_playlist_tab" style="width:100%;"><%= __('Refresh Playlists')%></button>
1151                         </div>
1152                         <div class="col s12">
1153                                 <table class="striped">
1154                                         <thead>
1155                                                 <tr>
1156                                                         <th style="width: 56px;"><!--cover--></th>
1157                                                         <th><%= __('Name')%></th>
1158                                                         <th><%= __('Songs')%></th>
1159                                                         <th style="width: 56px;"><!--inspect_playlist--></th>
1160                                                         <th style="width: 56px;"><!--download_link--></th>
1161                                                 </tr>
1162                                         </thead>
1163                                         <tbody id="table_personal_playlists">
1164                                         </tbody>
1165                                 </table>
1166                         </div>
1167                 </div>
1168
1169                 <div id="tab_link">
1170                         <div class="inline-input-group">
1171                                 <input autocomplete="off" type="search" id="link_analyzer_url" class="input" placeholder="<%= __('Song/Album URL')%>">
1172                                 <button id="link_analyzer_go" class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">search</i></button>
1173                         </div>
1174
1175                         <div id="link_analyzer_loading" class="center" hidden>
1176                                 <div class="preloader-wrapper big active">
1177                                         <div class="spinner-layer spinner-blue-only">
1178                                                 <!-- Spinner Code -->
1179                                                 <div class="circle-clipper left"><div class="circle"></div></div><div class="gap-patch"><div class="circle"></div></div><div class="circle-clipper right"><div class="circle"></div></div>
1180                                         </div>
1181                                 </div>
1182                         </div>
1183
1184                         <div id="link_analyzer_start">
1185                                 <p class="secondary-text center"><%- __('LinkAnalyzer_Info')%></p>
1186                         </div>
1187
1188                         <div v-if="d.title" id="link_analyzer_song" class="link_analyzer_info">
1189                                 <div id="link_analyzer_song_sideinfo" class="hide-on-small-only link_analyzer_sideinfo">
1190                                         <img v-bind:src=" d.album.cover_medium "/>
1191                                         <a href="#modal_link_analyzer_country" class="modal-trigger waves-effect waves-light btn" style="width:100%;"><%= __('See Available Countries')%></a>
1192                                 </div>
1193                                 <div id="link_analyzer_song_maininfo" class="link_analyzer_maininfo">
1194                                         <h5 style="margin-bottom:8px; margin-top:0px;">{{ d.title }} {{ d.version }}<i v-if="d.explicit_lyrics" class="material-icons valignicon materialize-red-text tooltipped" data-tooltip="Explicit">explicit</i></h5>
1195                                         <p style="margin-top:0px;">by <b>{{ d.artist.name }}</b></br>
1196                                         in <b>{{ d.album.title }}</b></p>
1197                                         <hr class="hide-on-small-only">
1198                                         <a v-if="d.alternative" v-bind:href="'d.alternative.link'"><b><%= __('Alternative Link')%></b></a>
1199                                         <table class="striped">
1200                                                 <tbody>
1201                                                         <tr v-if="d.isrc"><td><b>ISRC</b></td><td>{{ d.isrc }}</td></tr>
1202                                                         <tr v-if="d.duration"><td><b><%= __('Duration')%></b></td><td>{{ d.duration_string }}</td></tr>
1203                                                         <tr v-if="d.disk_number"><td><b><%= __('Disc Number')%></b></td><td>{{ d.disk_number }}</td></tr>
1204                                                         <tr v-if="d.track_position"><td><b><%= __('Track Number')%></b></td><td>{{ d.track_position }}</td></tr>
1205                                                         <tr v-if="d.release_date"><td><b><%= __('Release Date')%></b></td><td>{{ d.release_date }}</td></tr>
1206                                                         <tr v-if="d.bpm"><td><b>BPM</b></td><td>{{ d.bpm }}</td></tr>
1207                                                 </tbody>
1208                                         </table>
1209                                         <a href="#modal_link_analyzer_country" class="modal-trigger waves-effect waves-light btn hide-on-med-and-up" style="width:100%;"><%= __('See Available Countries')%></a>
1210                                 </div>
1211                         </div>
1212
1213                         <div v-if="d.title" id="link_analyzer_album" class="link_analyzer_info">
1214                                 <div id="link_analyzer_album_sideinfo" class="hide-on-small-only link_analyzer_sideinfo">
1215                                         <img v-bind:src=" d.cover_medium "/>
1216                                         <a v-on:click="showTrackListSelective(d.link)" class="waves-effect waves-light btn" style="width:100%;"><%= __('Show Tracklist')%></a>
1217                                 </div>
1218                                 <div id="link_analyzer_album_maininfo" class="link_analyzer_maininfo">
1219                                         <h5 style="margin-bottom:8px; margin-top:0px;">{{ d.title }} <i v-if="d.explicit_lyrics" class="material-icons valignicon materialize-red-text tooltipped" data-tooltip="Explicit">explicit</i></h5>
1220                                         <p style="margin-top:0px;">by <b>{{ d.artist.name }}</b></br>
1221                                         <b>{{ d.nb_tracks }}</b> {{ d.nb_tracks==1 ? 'track' : 'tracks' }}</p>
1222                                         <hr class="hide-on-small-only">
1223                                         <a v-if="d.alternative" v-bind:href="'d.alternative.link'"><b><%= __('Alternative Link')%></b></a>
1224                                         <table class="striped">
1225                                                 <tbody>
1226                                                         <tr v-if="d.upc"><td><b>UPC</b></td><td>{{ d.upc }}</td></tr>
1227                                                         <tr v-if="d.duration"><td><b><%= __('Duration')%></b></td><td>{{ d.duration_string }}</td></tr>
1228                                                         <tr v-if="d.release_date"><td><b><%= __('Release Date')%></b></td><td>{{ d.release_date }}</td></tr>
1229                                                         <tr v-if="d.label"><td><b><%= __('Label')%></b></td><td>{{ d.label }}</td></tr>
1230                                                         <tr v-if="d.record_type"><td><b><%= __('Record Type')%></b></td><td>{{ d.record_type.substring(0,1).toUpperCase()+ d.record_type.substring(1) }}</td></tr>
1231                                                         <tr v-if="d.genres_string"><td><b><%= __('Genres')%></b></td><td>{{ d.genres_string }}</td></tr>
1232                                                 </tbody>
1233                                         </table>
1234                                         <a v-on:click="showTrackListSelective(d.link)" class="waves-effect waves-light btn hide-on-med-and-up" style="width:100%;"><%= __('Show Tracklist')%></a>
1235                                 </div>
1236                         </div>
1237                 </div>
1238
1239                 <div id="tab_url">
1240                         <div class="inline-input-group">
1241                                 <input autocomplete="off" type="search" id="song_url" class="input" placeholder="<%= __('DownloadURL_Info')%>">
1242                                 <button id="download_from_url_button" class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">get_app</i></button>
1243                         </div>
1244                 </div>
1245
1246                 <div id="tab_downloads">
1247                         <div class="row">
1248                                 <div class="col s12 m4">
1249                                         <button id="openDownloadsFolder" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
1250                                                 <%= __('Open Downloads Folder')%>
1251                                         </button>
1252                                 </div>
1253                                 <div class="col s12 m4">
1254                                         <button id="cancelAllTable" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
1255                                                 <%= __('Cancel All Downloads')%>
1256                                         </button>
1257                                 </div>
1258                                 <div class="col s12 m4">
1259                                         <button id="clearTracksTable" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
1260                                                 <%= __('Clear List')%>
1261                                         </button>
1262                                 </div>
1263                         </div>
1264                         <table id="tab_downloads_table_downloads" class="row">
1265                                 <thead>
1266                                         <tr>
1267                                                 <th><%= __('Name')%></th>
1268                                                 <th><%= __('Size')%></th>
1269                                                 <th><%= __('Downloaded')%></th>
1270                                                 <th><%= __('Failed')%></th>
1271                                                 <th style="width: 25%;"><!--progress--></th>
1272                                                 <th style="width: 56px;"><!--event buttons--></th>
1273                                         </tr>
1274                                 </thead>
1275                                 <tbody></tbody>
1276                         </table>
1277                 </div>
1278
1279         </div>
1280 </main>
1281
1282 <div class="fixed-action-btn" id="btn_scrollToTop" style="bottom: 45px; right: 24px;">
1283         <a class="btn-floating btn-large deezloader-primary scale-transition scale-out">
1284                 <i class="large material-icons">keyboard_arrow_up</i>
1285         </a>
1286 </div>
1287 <audio id="preview-track">
1288         <source id="preview-track_source" src="" type="audio/mpeg">
1289 </audio>
1290
1291 <div id="modal_quality" class="smallmodal">
1292         <!-- Modal content -->
1293         <div class="smallmodal-content">
1294                 <a onclick="modalQualityButton(9)" href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text">Download FLAC</a><br>
1295                 <a onclick="modalQualityButton(3)" href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text">Download MP3 320kbps</a><br>
1296                 <a onclick="modalQualityButton(1)" href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text">Download MP3 128kbps</a><br>
1297         </div>
1298 </div>
1299
1300 <footer id="page_footer" class="darken-1 left page-footer hide-on-med-and-down valign-wrapper">
1301                         <p><span style="position: relative;display: inline-block;transform: rotateY(180deg);">&copy;</span> Deezloader <%= __('original code by ZzMTV')%>.</p>
1302 </footer>
1303
1304 <script>if (typeof module === 'object') {
1305         window.module = module;
1306         module = undefined;
1307 }</script>
1308
1309 <script type="text/javascript" src="js/socket.io.js"></script>
1310 <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
1311 <script type="text/javascript" src="js/materialize.min.js"></script>
1312 <script type="text/javascript" src="js/i18n.min.js"></script>
1313 <script type="text/javascript" src="js/vue.min.js"></script>
1314 <script type="text/javascript" src="js/appBase.js"></script>
1315 <script type="text/javascript" src="js/frontend.js"></script>
1316 <script>if (window.module) module = window.module;</script>
1317 </body>
1318 </html>