app/public/index.html

   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.1.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="deezloader-black 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 class="input-field col s12">
  43                                         <input type="text" id="modal_login_input_username"/>
  44                                         <label for="modal_login_input_username">Email</label>
  45                                 </div>
  46                                 <div class="input-field col s12">
  47                                         <input type="password" id="modal_login_input_password"/>
  48                                         <label for="modal_login_input_password">Password</label>
  49                                 </div>
  50                         </div>
  51                         <div class="card-action row">
  52         <div class="col s12 m2 right center" id="modal_login_autologin">
  53           <label>
  54             <input type="checkbox" class="filled-in" id="modal_login_input_autologin"/>
  55             <span>Remember me</span>
  56           </label>
  57                                 </div>
  58                                 <a href="#" class="deezloader-primary col s12 m2 waves-effect waves-light btn" id="modal_login_btn_login">Log in</a>
  59                                 <a href="#" class="deezloader-secondary col s12 m2 waves-effect waves-light btn" id="modal_login_btn_signup">Sign up</a>
  60                         </div>
  61                 </div>
  62         </div>
  63 </div>
  64
  65 <!--#############################################MODAL_SETTINGS############################################-->
  66 <div id="modal_settings" class="modal modal-fixed-footer">
  67         <div class="modal-content">
  68                 <div class="row">
  69                         <h4 class="col s12">Settings</h4>
  70                 </div>
  71                 <div class="row">
  72                         <div class="input-field col s12 m6">
  73                                 <i class="material-icons prefix">label</i>
  74                                 <input type="text" id="modal_settings_input_trackNameTemplate"/>
  75                                 <label for="modal_settings_input_trackNameTemplate">Track names <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
  76           data-tooltip="Supported variables are: %number%, %year%, %artist%, %title%, %album%, %explicit% and %label%">info_outline</i></label>
  77                         </div>
  78                         <div class="input-field col s12 m6">
  79                                 <i class="material-icons prefix">label</i>
  80                                 <input type="text" id="modal_settings_input_playlistTrackNameTemplate"/>
  81                                 <label for="modal_settings_input_playlistTrackNameTemplate">Playlist track names <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
  82           data-tooltip="Supported variables are: %number%, %year%, %artist%, %title%, %album%, %explicit% and %label%">info_outline</i></label>
  83                         </div>
  84                 </div>
  85     <div class="row">
  86                         <div class="input-field col s12 m6">
  87                                 <i class="material-icons prefix">label</i>
  88                                 <input type="text" id="modal_settings_input_albumTrackNameTemplate"/>
  89                                 <label for="modal_settings_input_albumTrackNameTemplate">Album track names <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
  90           data-tooltip="Supported variables are: %number%, %year%, %artist%, %title%, %album%, %explicit% and %label%">info_outline</i></label>
  91                         </div>
  92                         <div class="input-field col s12 m6">
  93                                 <i class="material-icons prefix">label</i>
  94                                 <input type="text" id="modal_settings_input_albumNameTemplate"/>
  95                                 <label for="modal_settings_input_albumNameTemplate">Album names <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
  96           data-tooltip="Supported variables are: %year%, %artist%, %type%, %album%, %explicit% and %label%">info_outline</i></label>
  97                         </div>
  98                 </div>
  99     <div class="row">
 100                         <div class="input-field col s12 m6">
 101                                 <i class="material-icons prefix">label</i>
 102                                 <input type="text" id="modal_settings_input_coverImageTemplate"/>
 103                                 <label for="modal_settings_input_albumTrackNameTemplate">Cover Image name <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
 104           data-tooltip="Supported variables are: %artist% and %name%">info_outline</i></label>
 105                         </div>
 106                         <div class="input-field col s12 m6">
 107                                 <i class="material-icons prefix">label</i>
 108                                 <input type="text" id="modal_settings_input_artistImageTemplate"/>
 109                                 <label for="modal_settings_input_albumNameTemplate">Artist Image name <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
 110           data-tooltip="Supported variables are: %artist%">info_outline</i></label>
 111                         </div>
 112                 </div>
 113                 <div class="row">
 114                         <div class="input-field col s12 m6">
 115                                 <i class="material-icons prefix">label</i>
 116                                 <select name="artworkSize" id="modal_settings_select_artworkSize">
 117           <option value="1400">1400x1400</option>
 118           <option value="1200">1200x1200</option>
 119           <option value="1000">1000x1000</option>
 120           <option value="800">800x800</option>
 121           <option value="500">500x500</option>
 122           <option value="250">250x250</option>
 123                                 </select>
 124                                 <label for="modal_settings_select_artworkSize">Artwork size</label>
 125                         </div>
 126       <div class="input-field col s12 m6">
 127                                 <i class="material-icons prefix">label</i>
 128                                 <select name="maxBitrate" id="modal_settings_select_maxBitrate">
 129           <option value="9">FLAC 1411kbps</option>
 130           <option value="3">MP3 320kbps</option>
 131           <option value="1">MP3 128kbps</option>
 132                                 </select>
 133                                 <label for="modal_settings_select_maxBitrate">Downloaded bitrate</label>
 134                         </div>
 135                 </div>
 136     <div class="row">
 137                         <div class="input-field col s12 m6">
 138                                 <i class="material-icons prefix">label</i>
 139                                 <select name="chartsCountry" id="modal_settings_select_chartsCounrty">
 140                                 </select>
 141                                 <label for="modal_settings_select_chartsCounrty">Default Country for Charts</label>
 142                         </div>
 143       <div class="input-field col s12 m6">
 144                                 <i class="material-icons prefix">label</i>
 145                                 <select name="multitagSeparator" id="modal_settings_select_multitagSeparator">
 146                                         <option value="null">Null Character</option>
 147           <option value=",">,</option>
 148           <option value=", ">, with space</option>
 149                                         <option value="/">/</option>
 150           <option value=" / ">/ with space</option>
 151                                         <option value=";">;</option>
 152           <option value="; ">; with space</option>
 153                                 </select>
 154                                 <label for="modal_settings_select_multitagSeparator">Multitag Separator</label>
 155                         </div>
 156                 </div>
 157     <div class="row">
 158                         <div class="input-field col s12 m6">
 159                                 <i class="material-icons prefix">label</i>
 160                                 <select name="dateFormat" id="modal_settings_select_dateFormat">
 161           <option value="0">YMD</option>
 162                                         <option value="1">DMY</option>
 163                                         <option value="2">MDY</option>
 164           <option value="3">YDM</option>
 165                                 </select>
 166                                 <label for="modal_settings_select_dateFormat">Date Format</label>
 167                         </div>
 168       <div class="input-field col s12 m6">
 169                                 <i class="material-icons prefix">label</i>
 170                                 <select name="dateFormatYear" id="modal_settings_select_dateFormatYear">
 171           <option value="2">2</option>
 172                                         <option value="4">4</option>
 173                                 </select>
 174                                 <label for="modal_settings_select_dateFormatYear">Number of digits for the year (only in date tag)</label>
 175                         </div>
 176                 </div>
 177                 <div class="row">
 178                         <div class="input-field col s12">
 179                                 <i class="material-icons prefix">label</i>
 180                                 <input type="text" id="modal_settings_input_downloadTracksLocation"/>
 181                                 <label for="modal_settings_input_downloadTracksLocation">Download location</label>
 182                         </div>
 183                 </div>
 184     <div class="row">
 185                         <div class="input-field col s12 m6">
 186                                 <i class="material-icons prefix">label</i>
 187                                 <input type="number" id="modal_settings_number_queueConcurrency" min="1"/>
 188                                 <label for="modal_settings_number_queueConcurrency">Queue Concurrency</label>
 189                         </div>
 190                         <div class="input-field col s12 m6">
 191                                 <i class="material-icons prefix">label</i>
 192                                 <input type="text" id="modal_settings_input_spotifyUser"/>
 193                                 <label for="modal_settings_input_spotifyUser">Spotify Username</label>
 194                         </div>
 195                 </div>
 196                 <div class="row">
 197                         <p class="col s12 m4">
 198         <label>
 199                                 <input type="checkbox" id="modal_settings_cbox_createM3UFile" class="filled-in"/>
 200                                 <span>Create M3U (Playlist) file</span>
 201         </label>
 202                         </p>
 203       <p class="col s12 m4">
 204         <label>
 205                                 <input type="checkbox" id="modal_settings_cbox_syncedlyrics" class="filled-in"/>
 206                                 <span class="tooltipped" data-position="top" data-delay="500"
 207             data-tooltip="Downloads lyrics .lyr file">Download synced lyrics file</span>
 208         </label>
 209       </p>
 210       <p class="col s12 m4">
 211         <label>
 212                                 <input type="checkbox" id="modal_settings_cbox_numplaylistbyalbum" class="filled-in"/>
 213                                 <span class="tooltipped" data-position="top" data-delay="500"
 214             data-tooltip="Track numbers when downloading a Playlist will be the original ones">Number playlist by album</span>
 215         </label>
 216       </p>
 217                         <p class="col s12 m4">
 218         <label>
 219                                 <input type="checkbox" id="modal_settings_cbox_createArtistFolder" class="filled-in"/>
 220                                 <span>Create folder for artists</span>
 221         </label>
 222                         </p>
 223                         <p class="col s12 m4">
 224         <label>
 225                                 <input type="checkbox" id="modal_settings_cbox_createAlbumFolder" class="filled-in"/>
 226                                 <span>Create folder for albums</span>
 227         </label>
 228                         </p>
 229       <p class="col s12 m4">
 230         <label>
 231                                 <input type="checkbox" id="modal_settings_cbox_createCDFolder" class="filled-in"/>
 232                                 <span>Create folder for CDs</span>
 233         </label>
 234       </p>
 235                         <p class="col s12 m4">
 236         <label>
 237                                 <input type="checkbox" id="modal_settings_cbox_padtrck" class="filled-in"/>
 238                                 <span class="tooltipped" data-position="top" data-delay="500"
 239             data-tooltip="Adds 0s before %number% to have the same character length">Pad track numbers</span>
 240         </label>
 241       </p>
 242       <p class="col s12 m4">
 243         <label>
 244                                 <input type="checkbox" id="modal_settings_cbox_logErrors" class="filled-in"/>
 245                                 <span>Create log file for Errors</span>
 246         </label>
 247       </p>
 248       <p class="col s12 m4">
 249         <label>
 250                                 <input type="checkbox" id="modal_settings_cbox_logSearched" class="filled-in"/>
 251                                 <span>Create log file for alternatives</span>
 252         </label>
 253       </p>
 254       <p class="col s12 m4">
 255         <label>
 256                                 <input type="checkbox" id="modal_settings_cbox_saveArtwork" class="filled-in"/>
 257                                 <span>Save Album Artwork</span>
 258         </label>
 259       </p>
 260       <p class="col s12 m4">
 261         <label>
 262                                 <input type="checkbox" id="modal_settings_cbox_saveArtworkArtist" class="filled-in"/>
 263                                 <span>Save Artist Artwork</span>
 264         </label>
 265       </p>
 266       <p class="col s12 m4">
 267         <label>
 268                                 <input type="checkbox" id="modal_settings_cbox_PNGcovers" class="filled-in"/>
 269                                 <span>Download images as PNGs</span>
 270         </label>
 271                         </p>
 272       <p class="col s12 m4">
 273         <label>
 274                                 <input type="checkbox" id="modal_settings_cbox_removeAlbumVersion" class="filled-in"/>
 275                                 <span>Remove "(Album Version)" from track title</span>
 276         </label>
 277                         </p>
 278       <p class="col s12 m4">
 279         <label>
 280                                 <input type="checkbox" id="modal_settings_cbox_fallbackBitrate" class="filled-in"/>
 281                                 <span>Fallback to lower bitrates</span>
 282         </label>
 283                         </p>
 284                 </div>
 285     <div class="row">
 286       <div class="col s12">
 287         <a href="#modal_tags" class="modal-trigger waves-effect waves-light btn btn-large" style="width:100%;">Choose which tags to Save</a>
 288       </div>
 289     </div>
 290                 <div class="row">
 291                         <div class="col s12">
 292         <img id="modal_settings_picture" src="" alt="Profile Picture" class="circle left" style="height:125px; margin-right: 12px;"/>
 293                                 <p>You are logged in as <b id="modal_settings_username"></b></p>
 294                                 <a href="#" class="modal-close waves-effect waves-light btn" id="modal_settings_btn_logout">Logout</a>
 295                         </div>
 296                 </div>
 297         </div>
 298         <div class="modal-footer">
 299                 <a href="#" class="modal-close waves-effect waves-light deezloader-primary btn" id="modal_settings_btn_saveSettings"><i
 300                                                 class="material-icons right">save</i>Save</a>
 301                 <a href="#" class="waves-effect btn-flat" id="modal_settings_btn_defaultSettings"><i
 302                                                 class="material-icons right">settings_backup_restore</i>Default Settings</a>
 303                 <a href="#" class="modal-close waves-effect btn-flat">Close</a>
 304         </div>
 305 </div>
 306
 307 <!--#############################################MODAL_TAGS############################################-->
 308 <div id="modal_tags" class="modal modal-fixed-footer">
 309         <div class="modal-content">
 310                 <div class="row">
 311                         <h4 class="col s12">Saved Tags</h4>
 312                 </div>
 313                 <div class="row">
 314                         <p class="col s12 m4">
 315         <label>
 316                                 <input type="checkbox" id="modal_tags_title" class="filled-in"/>
 317                                 <span>Title</span>
 318         </label>
 319                         </p>
 320       <p class="col s12 m4">
 321         <label>
 322                                 <input type="checkbox" id="modal_tags_artist" class="filled-in"/>
 323                                 <span>Artist</span>
 324         </label>
 325                         </p>
 326       <p class="col s12 m4">
 327         <label>
 328                                 <input type="checkbox" id="modal_tags_album" class="filled-in"/>
 329                                 <span>Album</span>
 330         </label>
 331                         </p>
 332       <p class="col s12 m4">
 333         <label>
 334                                 <input type="checkbox" id="modal_tags_cover" class="filled-in"/>
 335                                 <span>Cover</span>
 336         </label>
 337                         </p>
 338       <p class="col s12 m4">
 339         <label>
 340                                 <input type="checkbox" id="modal_tags_trackNumber" class="filled-in"/>
 341                                 <span>Track Number</span>
 342         </label>
 343                         </p>
 344       <p class="col s12 m4">
 345         <label>
 346                                 <input type="checkbox" id="modal_tags_trackTotal" class="filled-in"/>
 347                                 <span>Track Total</span>
 348         </label>
 349                         </p>
 350       <p class="col s12 m4">
 351         <label>
 352                                 <input type="checkbox" id="modal_tags_discNumber" class="filled-in"/>
 353                                 <span>Disc Number</span>
 354         </label>
 355                         </p>
 356       <p class="col s12 m4">
 357         <label>
 358                                 <input type="checkbox" id="modal_tags_discTotal" class="filled-in"/>
 359                                 <span>Disc Total</span>
 360         </label>
 361                         </p>
 362       <p class="col s12 m4">
 363         <label>
 364                                 <input type="checkbox" id="modal_tags_albumArtist" class="filled-in"/>
 365                                 <span>Album Artist</span>
 366         </label>
 367                         </p>
 368       <p class="col s12 m4">
 369         <label>
 370                                 <input type="checkbox" id="modal_tags_genre" class="filled-in"/>
 371                                 <span>Genre</span>
 372         </label>
 373                         </p>
 374       <p class="col s12 m4">
 375         <label>
 376                                 <input type="checkbox" id="modal_tags_year" class="filled-in"/>
 377                                 <span>Year</span>
 378         </label>
 379                         </p>
 380       <p class="col s12 m4">
 381         <label>
 382                                 <input type="checkbox" id="modal_tags_date" class="filled-in"/>
 383                                 <span>Date</span>
 384         </label>
 385                         </p>
 386       <p class="col s12 m4">
 387         <label>
 388                                 <input type="checkbox" id="modal_tags_explicit" class="filled-in"/>
 389                                 <span>Explicit</span>
 390         </label>
 391                         </p>
 392       <p class="col s12 m4">
 393         <label>
 394                                 <input type="checkbox" id="modal_tags_isrc" class="filled-in"/>
 395                                 <span>ISRC</span>
 396         </label>
 397                         </p>
 398       <p class="col s12 m4">
 399         <label>
 400                                 <input type="checkbox" id="modal_tags_length" class="filled-in"/>
 401                                 <span>Length</span>
 402         </label>
 403                         </p>
 404       <p class="col s12 m4">
 405         <label>
 406                                 <input type="checkbox" id="modal_tags_barcode" class="filled-in"/>
 407                                 <span>Barcode</span>
 408         </label>
 409                         </p>
 410       <p class="col s12 m4">
 411         <label>
 412                                 <input type="checkbox" id="modal_tags_bpm" class="filled-in"/>
 413                                 <span>BPM</span>
 414         </label>
 415                         </p>
 416       <p class="col s12 m4">
 417         <label>
 418                                 <input type="checkbox" id="modal_tags_replayGain" class="filled-in"/>
 419                                 <span>Replay Gain</span>
 420         </label>
 421                         </p>
 422       <p class="col s12 m4">
 423         <label>
 424                                 <input type="checkbox" id="modal_tags_publisher" class="filled-in"/>
 425                                 <span>Label</span>
 426         </label>
 427                         </p>
 428       <p class="col s12 m4">
 429         <label>
 430                                 <input type="checkbox" id="modal_tags_unsynchronisedLyrics" class="filled-in"/>
 431                                 <span>Unsynchronised Lyrics</span>
 432         </label>
 433                         </p>
 434       <p class="col s12 m4">
 435         <label>
 436                                 <input type="checkbox" id="modal_tags_copyright" class="filled-in"/>
 437                                 <span>Copyright</span>
 438         </label>
 439                         </p>
 440       <p class="col s12 m4">
 441         <label>
 442                                 <input type="checkbox" id="modal_tags_musicpublisher" class="filled-in"/>
 443                                 <span>Publisher</span>
 444         </label>
 445                         </p>
 446       <p class="col s12 m4">
 447         <label>
 448                                 <input type="checkbox" id="modal_tags_composer" class="filled-in"/>
 449                                 <span>Composer</span>
 450         </label>
 451                         </p>
 452       <p class="col s12 m4">
 453         <label>
 454                                 <input type="checkbox" id="modal_tags_mixer" class="filled-in"/>
 455                                 <span>Mixer</span>
 456         </label>
 457                         </p>
 458       <p class="col s12 m4">
 459         <label>
 460                                 <input type="checkbox" id="modal_tags_author" class="filled-in"/>
 461                                 <span>Author</span>
 462         </label>
 463                         </p>
 464       <p class="col s12 m4">
 465         <label>
 466                                 <input type="checkbox" id="modal_tags_writer" class="filled-in"/>
 467                                 <span>Writer</span>
 468         </label>
 469                         </p>
 470       <p class="col s12 m4">
 471         <label>
 472                                 <input type="checkbox" id="modal_tags_engineer" class="filled-in"/>
 473                                 <span>Engineer</span>
 474         </label>
 475                         </p>
 476       <p class="col s12 m4">
 477         <label>
 478                                 <input type="checkbox" id="modal_tags_producer" class="filled-in"/>
 479                                 <span>Producer</span>
 480         </label>
 481                         </p>
 482                 </div>
 483         </div>
 484         <div class="modal-footer">
 485                 <a href="#" class="modal-close waves-effect btn-flat">Close</a>
 486         </div>
 487 </div>
 488
 489 <!--#############################################MODAL_ABOUT############################################-->
 490 <div id="modal_about" class="modal modal-fixed-footer">
 491         <div class="modal-content">
 492                 <h4>More</h4>
 493                 <div class="row">
 494                         <ul class="collapsible" data-collapsible="accordion">
 495                                 <li>
 496                                         <div class="collapsible-header waves-effect"><i class="material-icons">info</i>About</div>
 497                                         <div class="collapsible-body">
 498                                                 <p>
 499               <b>Branch: </b>Remix</br>
 500                                                         <b>Version:</b> <span id="application_version_about"></span><br/>
 501                                                         <b>Original Programmer:</b> <a href="https://boerse.to/members/zzmtv.3378614/">ZzMTV</a><br/>
 502                                                         <b>Former Maintainers:</b> <a href="https://www.reddit.com/user/ParadoxalManiak/">ParadoxalManiak</a>, <a href="https://www.reddit.com/user/_snwflake/">snwflake</a>, <a href="https://www.reddit.com/user/ExtendLord/">ExtendLord</a><br>
 503               <b>Current Maintainer:</b> RemixDevs<br/>
 504               <b>Repo: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix">Official Repo</a><br/>
 505               <b>Interface:</b> <a href="http://materializecss.com/">materializecss</a><br/>
 506               <b>Based on: </b>Deezloader Reborn</br>
 507                                                 </p>
 508                                         </div>
 509                                 </li>
 510                                 <li>
 511                                         <div class="collapsible-header waves-effect"><i class="material-icons">feedback</i>Feedback</div>
 512                                         <div class="collapsible-body">
 513                                                 <p>
 514                                                         Do you have some feedback or want to ask for some new features? Open a <a href="https://notabug.org/RemixDevs/DeezloaderRemix/issues/new">New Issue</a> and add the Feature label.
 515                                                 </p>
 516                                         </div>
 517                                 </li>
 518                                 <li>
 519                                         <div class="collapsible-header waves-effect"><i class="material-icons">bug_report</i>Bugs</div>
 520                                         <div class="collapsible-body">
 521                                                 <p>
 522                                                         If you experience any bugs, open a <a href="https://notabug.org/RemixDevs/DeezloaderRemix/issues/new">New Issue</a> and send the bug report there, thankyou.
 523                                                 </p>
 524                                         </div>
 525                                 </li>
 526         <li>
 527           <div class="collapsible-header waves-effect"><i class="material-icons">group</i>Contacts</div>
 528           <div class="collapsible-body">
 529             <p>
 530               If you want to talk about the app and help you can do that in this <a href="https://t.me/joinchat/BJf2dUoyFbSZFV-kQIe_LQ">Telegram Group</a>!
 531             </p>
 532           </div>
 533         </li>
 534                                 <li>
 535                                         <div class="collapsible-header waves-effect"><i class="material-icons">warning</i>Attention!</div>
 536                                         <div class="collapsible-body">
 537                                                 <p>
 538                                                         The authors don't call to commit crimes.<br/>
 539                                                         The usage of this tool may be illegal in your country! Please inform yourself.<br/>
 540                                                         The authors give no guarantee at all and aren't responsible for damages of all kinds!
 541                                                 </p>
 542                                         </div>
 543                                 </li>
 544                                 <li>
 545                                         <div class="collapsible-header waves-effect"><i class="material-icons">history</i>Changelog</div>
 546                                         <div class="collapsible-body">
 547                                                 <p>
 548               <b>Version 4.1.3</b><br/>
 549               - Playlist and Album tracks now have fallback support<br/>
 550               - M3U files now works correctly<br/>
 551               - Fixed problems with tags<br/>
 552               - Added option %explicit% for Track and Album names (Will add "(Explicit)" in that position if it's explicit)<br/>
 553               - Added option to remove "(Album Version)" from track title<br/>
 554               - Added options to select which format should the date tag have<br/>
 555               - Added option to not fallback if desired bitrate is not aviable<br/>
 556               - Logging enhancements<br/>
 557               - Other minor bug-fixing<br/>
 558               <br/>
 559                           <b>Version 4.1.2</b><br/>
 560                           - Fixed Login Problem (for real this time)<br/>
 561                           - Fixed Login after refresh<br/>
 562                           - Regionlock free download<br/>
 563                           - Added support for download of User Uploaded tracks<br/>
 564                           - Now you can select which tags your songs has<br/>
 565                           - Fixed selecting problem<br/>
 566                           - Tracks without preview will display a disabled play button<br/>
 567                           - Previews inside modal will stop with modal close<br/>
 568                           - New %label% field for tracks and albums<br/>
 569                           - Added option to create folder for CDs<br/>
 570                           - Added rename option for cover file<br/>
 571                           - Added option to download Artist artwork<br/>
 572                           - Added option do log downloaded alternative tracks<br/>
 573                           - Fixed some minor bugs
 574                           <br/>
 575               <b>Version 4.1.1</b><br/>
 576               - Fixed Login Problem (again)<br/>
 577               - Added Dark Mode<br/>
 578               - Added smaller cover option<br/>
 579               - Added support for lower bitrates<br/>
 580               - Added "Stop All Downloads" button<br/>
 581               - Added support for Spotify Playlist preview<br/>
 582               - Added support for PNG covers<br/>
 583               - Re-Added Date Tag<br/>
 584               - Fixed same cover for same track in different albums bug<br/>
 585               - Fixed login issue from repository build<br/>
 586               <br/>
 587               <b>Version 4.1.0</b><br/>
 588               - New UI (not completly optimized for small screens)<br/>
 589               - Fixed login problems<br/>
 590               - Fixed %type% parameter not working<br/>
 591               - Fixed year tagging problem<br/>
 592               - Fixed playlist file not containing tracks<br/>
 593               - More precision in Spotify Playlist conversion<br/>
 594               <br/>
 595               <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Changelog">Full Changelog Here</a>
 596                                                 </p>
 597                                         </div>
 598                                 </li>
 599                                 <li>
 600                                         <div class="collapsible-header waves-effect"><i class="material-icons">build</i>Contributors</div>
 601                                         <div class="collapsible-body">
 602                                                 <p>Thanks to the following contributors for fixing bugs and improving this application.<br>
 603               <br>
 604                                                         <a href="https://www.reddit.com/user/Blind-Mute">Blind-Mute</a> <br>
 605                                                         <a href="https://gitlab.com/Persei08">Persei08</a> <br>
 606                                                         <a href="https://github.com/Uukrull">Uukrull</a> <br>
 607                                                 </p>
 608                                         </div>
 609                                 </li>
 610                                 <li>
 611                                         <div class="collapsible-header waves-effect"><i class="material-icons">copyright</i>License</div>
 612                                         <div class="collapsible-body">
 613                                                 <p>
 614                                                         <a rel="license" href="https://www.gnu.org/licenses/gpl-3.0.en.html">
 615                                                                 <img alt="GNU General Public License" style="border-width:0"
 616                                                                                  src="https://www.gnu.org/graphics/gplv3-127x51.png"/>
 617                                                         </a><br/>
 618                                                         This work is licensed under a <a rel="license" href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU General Public License 3.0</a>.
 619                                                 </p>
 620                                         </div>
 621                                 </li>
 622                         </ul>
 623                 </div>
 624         </div>
 625         <div class="modal-footer">
 626                 <a href="#" class="modal-close waves-effect btn-flat">Close</a>
 627         </div>
 628 </div>
 629
 630 <!--##########################################MODAL_TRACKLIST###########################################-->
 631 <div id="modal_trackList" class="modal modal-fixed-footer">
 632         <div class="modal-content">
 633                 <div class="row">
 634                         <h4 class="col s12">{{ title }}</h4>
 635                 </div>
 636                 <div class="row">
 637                         <table class="highlight col s12">
 638                                 <thead>
 639                                 <tr>
 640                                         <td v-for="data in head" v-html="data.title"></td>
 641                                 </tr>
 642                                 </thead>
 643                                 <tbody id="modal_trackList_table_trackList_tbody_loadingIndicator" class="hide">
 644                                 <tr>
 645                                         <td class="center" colspan="4">
 646                                                 <div class="preloader-wrapper big active">
 647                                                         <div class="spinner-layer">
 648                                                                 <div class="circle-clipper left">
 649                                                                         <div class="circle"></div>
 650                                                                 </div>
 651                                                                 <div class="gap-patch">
 652                                                                         <div class="circle"></div>
 653                                                                 </div>
 654                                                                 <div class="circle-clipper right">
 655                                                                         <div class="circle"></div>
 656                                                                 </div>
 657                                                         </div>
 658                                                 </div>
 659                                         </td>
 660                                 </tr>
 661                                 </tbody>
 662                                 <tbody id="modal_trackList_table_trackList_tbody_trackList" class="hide">
 663                                 </tbody>
 664                         </table>
 665                 </div>
 666         </div>
 667         <div class="modal-footer">
 668                 <a href="#" class="modal-close waves-effect btn-flat">Close</a>
 669         </div>
 670 </div>
 671
 672 <!--##########################################MODAL_TRACKLISTALBUM###########################################-->
 673 <div id="modal_trackListSelective" class="modal modal-fixed-footer">
 674         <div class="modal-content">
 675                 <div class="row">
 676                         <h4 class="col s12">{{ title }}</h4>
 677                 </div>
 678                 <div class="row">
 679                         <table class="highlight col s12">
 680                                 <thead>
 681                                 <tr>
 682                                         <td v-for="data in head" v-html="data.title"></td>
 683                                 </tr>
 684                                 </thead>
 685                                 <tbody id="modal_trackListSelective_table_trackList_tbody_loadingIndicator" class="hide">
 686                                 <tr>
 687                                         <td class="center" colspan="4">
 688                                                 <div class="preloader-wrapper big active">
 689                                                         <div class="spinner-layer">
 690                                                                 <div class="circle-clipper left">
 691                                                                         <div class="circle"></div>
 692                                                                 </div>
 693                                                                 <div class="gap-patch">
 694                                                                         <div class="circle"></div>
 695                                                                 </div>
 696                                                                 <div class="circle-clipper right">
 697                                                                         <div class="circle"></div>
 698                                                                 </div>
 699                                                         </div>
 700                                                 </div>
 701                                         </td>
 702                                 </tr>
 703                                 </tbody>
 704                                 <tbody id="modal_trackListSelective_table_trackListSelective_tbody_trackListSelective" class="hide">
 705                                 </tbody>
 706                         </table>
 707                 </div>
 708         </div>
 709         <div class="modal-footer">
 710                 <a href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text right">Download selection<i class="material-icons right">file_download</i></a>
 711                 <a href="#" class="modal-close waves-effect btn-flat">Close</a>
 712         </div>
 713 </div>
 714
 715 <!--##########################################MODAL_MSG###########################################-->
 716 <div id="modal_msg" class="modal">
 717         <div class="modal-content">
 718                 <div class="row">
 719                         <h4 class="col s12" id="modal_msg_title"></h4>
 720                 </div>
 721                 <div class="row">
 722                         <p class="col s12" id="modal_msg_message"></p>
 723                 </div>
 724         </div>
 725         <div class="modal-footer">
 726                 <a href="#" class="modal-close waves-effect waves-light btn">I got it!</a>
 727         </div>
 728 </div>
 729
 730 <!--********************************************MAIN-CONTENT********************************************-->
 731 <nav>
 732   <div class="nav-wrapper">
 733     <div class="brand-logo center hide-on-small-only">Deezloader <b>Remix</b></div>
 734     <ul class="left hide-on-small-only">
 735       <li>
 736         <div class="switch">
 737           <label>
 738             <i class="material-icons left white-text" style="margin-right: 0px; margin-left: 15px;">brightness_2</i>
 739             <input id="nightTimeSwitcher" type="checkbox">
 740             <span class="lever"></span>
 741           </label>
 742         </div>
 743       </li>
 744     </ul>
 745     <a href="#" data-target="slide-out" class="sidenav-trigger hide-on-med-and-up right"><i class="material-icons">menu</i></a>
 746     <ul id="nav-mobile" class="right hide-on-small-only">
 747       <li>
 748                                 <a href="#modal_settings" id="nav_btn_openSettingsModal" class="waves-effect waves-light modal-trigger">
 749                                         <i class="material-icons left">settings</i> <span class="hide-on-med-and-down">Settings</span>
 750                                 </a>
 751                         </li>
 752                         <li>
 753                                 <a href="#modal_about" class="waves-effect waves-light modal-trigger">
 754                                         <i class="material-icons left">star</i> <span class="hide-on-med-and-down">More</span>
 755                                 </a>
 756                         </li>
 757     </ul>
 758   </div>
 759 </nav>
 760
 761 <img src="img/icon.svg" class="circle" id="main_icon"></img>
 762
 763 <ul id="slide-out" class="sidenav">
 764   <li><div class="user-view">
 765     <div class="background"></div>
 766     <a href="#user"><img class="circle" id="side_avatar"></a>
 767     <a href="#name"><span class="white-text name" id="side_user"></span></a>
 768     <a href="#email"><span class="white-text email" id="side_email"></span></a>
 769   </div></li>
 770   <li><a href="#!" tab-id="tab_search" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">search</i>Search</a></li>
 771   <li><a href="#!" tab-id="tab_charts" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">bubble_chart</i>Charts</a></li>
 772   <li><a href="#!" tab-id="tab_playlists" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">playlist_play</i>Playlists</a></li>
 773   <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>
 774   <li><a href="#!" tab-id="tab_downloads" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">get_app</i>Downloads</a></li>
 775   <li><div class="divider"></div></li>
 776   <li><a href="#modal_settings" class="waves-effect sidenav-close modal-trigger"><i class="material-icons">settings</i>Settings</a></li>
 777   <li><a href="#modal_about" class="waves-effect sidenav-close modal-trigger"><i class="material-icons">star</i>About</a></li>
 778   <li><a href="#!" id="nightModeSwitch2"><i class="material-icons">brightness_2</i>Enable Night Mode</a>
 779   </li>
 780 </ul>
 781
 782 <main class="container">
 783   <ul id="tab-nav" class="row tabs tabs-fixed-width hide-on-small-only">
 784     <li class="tab"><a class="active" href="#tab_search">Search</a></li>
 785     <li class="tab"><a href="#tab_charts">Charts</a></li>
 786     <li class="tab"><a href="#tab_playlists">Playlists</a></li>
 787     <li class="tab"><a href="#tab_url">Download from URL</a></li>
 788     <li class="tab"><a href="#tab_downloads">Downloads</a></li>
 789   </ul>
 790
 791   <div id="main-content" class="row">
 792
 793     <div id="tab_search">
 794       <form id="tab_search_form_search">
 795         <div class="inline-input-group col s12">
 796           <input id="tab_search_form_search_input_searchString" type="text" class="input" placeholder="Start searching ...">
 797           <button class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">search</i></button>
 798         </div>
 799         <div class="row center">
 800           <p class="col s3">
 801             <label>
 802             <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_song" value="track" checked/>
 803             <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>
 804             </label>
 805           </p>
 806           <p class="col s3">
 807             <label>
 808             <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_album" value="album"/>
 809             <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>
 810             </label>
 811           </p>
 812           <p class="col s3">
 813             <label>
 814             <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_artist" value="artist"/>
 815             <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>
 816             </label>
 817           </p>
 818           <p class="col s3">
 819             <label>
 820               <input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_playlist" value="playlist"/>
 821               <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>
 822             </label>
 823           </p>
 824         </div>
 825       </form>
 826       <div id="tab_search_results">
 827                                 <table id="tab_search_table_results" class="striped col s12">
 828                                         <thead class="hide-on-small-only">
 829                                         <tr class="animated fadeInUp hide" id="tab_search_table_results_thead_track">
 830                                                 <th style="width: 56px;"><!--cover--></th>
 831                                                 <th>Song</th>
 832                                                 <th>Artist</th>
 833                                                 <th>Album</th>
 834                                                 <th><i class="material-icons">timer</i></th>
 835                                                 <th style="width: 56px;"><!--download_link--></th>
 836                                         </tr>
 837                                         <tr class="animated fadeInUp hide" id="tab_search_table_results_thead_album">
 838                                                 <th style="width: 56px;"><!--cover--></th>
 839                                                 <th>Album</th>
 840                                                 <th>Artist</th>
 841                                                 <th>Songs</th>
 842                                                 <th>Type</th>
 843                                                 <th><!--space--></th>
 844                                                 <th style="width: 56px;"><!--download_link--></th>
 845                                         </tr>
 846                                         <tr class="animated fadeInUp hide" id="tab_search_table_results_thead_artist">
 847                                                 <th style="width: 56px;"><!--cover--></th>
 848                                                 <th>Artist</th>
 849                                                 <th>Albums</th>
 850                                                 <th><!--space--></th>
 851                                                 <th style="width: 56px;"><!--download_link--></th>
 852                                         </tr>
 853                                         <tr class="animated fadeInUp hide" id="tab_search_table_results_thead_playlist">
 854                                                 <th style="width: 56px;"><!--cover--></th>
 855                                                 <th>Name</th>
 856                                                 <th>Songs</th>
 857               <th style="width: 56px;"><!--space--></th>
 858                                                 <th style="width: 56px;"><!--download_link--></th>
 859                                         </tr>
 860                                         </thead>
 861                                         <tbody id="tab_search_table_results_tbody_loadingIndicator" class="hide loadingTab">
 862                                         <tr>
 863                                                 <td class="center">
 864                                                           <div class="preloader-wrapper big active">
 865                                                             <div class="spinner-layer spinner-blue-only">
 866                                                               <!-- Spinner Code -->
 867                                                               <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>
 868                                                             </div>
 869                                                           </div>
 870                                                 </td>
 871                                         </tr>
 872                                         </tbody>
 873                                         <tbody id="tab_search_table_results_tbody_results" class="animated fadeInUp"></tbody>
 874                                         <tbody id="tab_search_table_results_tbody_noResults" class="animated fadeInUp hide">
 875                                         <tr>
 876                                                 <td class="center">Nothing found!</td>
 877                                         </tr>
 878                                         </tbody>
 879                                 </table>
 880                         </div>
 881     </div>
 882
 883     <div id="tab_charts">
 884       <div class="input-field col s12">
 885         <select id="tab_charts_select_country" class="icons">
 886           <!--All country selects have to be like the following example:
 887           <option value="example" data-icon="images/sample.jpg" class="left circle">Example</option>
 888           -->
 889         </select>
 890         <label>Country</label>
 891       </div>
 892       <button id="downloadChartPlaylist" class="col s12 btn btn-input btn-flat deezloader-primary white-text" style="margin-bottom:8px;">Download Playlist</button>
 893       <table id="tab_charts_table_charts" class="striped">
 894         <thead class="hide-on-small-only">
 895           <tr>
 896             <th>#</th>
 897             <th style="width: 56px;"><!--cover--></th>
 898             <th>Song</th>
 899             <th>Artist</th>
 900             <th>Album</th>
 901             <th><i class="material-icons">timer</i></th>
 902             <th style="width: 56px;"><!--download_link--></th>
 903           </tr>
 904         </thead>
 905         <tbody id="tab_charts_table_charts_tbody_loadingIndicator" class="loadingTab">
 906           <tr>
 907             <td colspan="7" class="center">
 908                                                         <div class="preloader-wrapper big active">
 909                                                           <div class="spinner-layer spinner-blue-only">
 910                                                             <!-- Spinner Code -->
 911                                                             <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>
 912                                                           </div>
 913                                                         </div>
 914             </td>
 915           </tr>
 916         </tbody>
 917         <tbody id="tab_charts_table_charts_tbody_charts"></tbody>
 918       </table>
 919     </div>
 920
 921     <div id="tab_playlists" class="row">
 922       <div class="col s12">
 923         <button class="btn-flat btn-large waves-effect" id="button_refresh_playlist_tab" style="width:100%;">Refresh Playlist List</button>
 924       </div>
 925       <div class="col s12">
 926         <table class="striped">
 927           <thead>
 928             <tr class="animated fadeInUp">
 929               <th style="width: 56px;"><!--cover--></th>
 930               <th>Name</th>
 931               <th>Songs</th>
 932               <th style="width: 56px;"><!--inspect_playlist--></th>
 933               <th style="width: 56px;"><!--download_link--></th>
 934             </tr>
 935           </thead>
 936           <tbody id="table_personal_playlists" class="animated fadeInUp">
 937           </tbody>
 938         </table>
 939       </div>
 940     </div>
 941
 942     <div id="tab_url">
 943       <form id="tab_url_form_url" class="row">
 944         <div class="inline-input-group">
 945           <input type="text" id="song_url" class="input" placeholder="Song/Playlist/Album/Artist URL, separated by ';'">
 946           <button class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">get_app</i></button>
 947         </div>
 948       </form>
 949     </div>
 950
 951     <div id="tab_downloads">
 952       <div class="row">
 953         <div class="col s12 m4">
 954           <button id="openDownloadsFolder" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
 955             Open Downloads Folder
 956           </button>
 957         </div>
 958         <div class="col s12 m4">
 959           <button id="cancelAllTable" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-secondary white-text">
 960             Cancel All Downloads
 961           </button>
 962         </div>
 963         <div class="col s12 m4">
 964           <button id="clearTracksTable" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-secondary white-text">
 965             Clear List
 966           </button>
 967         </div>
 968       </div>
 969       <table id="tab_downloads_table_downloads" class="row">
 970         <thead>
 971           <tr>
 972             <th>Name</th>
 973             <th>Size</th>
 974             <th>Downloaded</th>
 975             <th>Failed</th>
 976             <th style="width: 25%;"><!--progress--></th>
 977             <th style="width: 56px;"><!--event buttons--></th>
 978           </tr>
 979         </thead>
 980         <tbody></tbody>
 981       </table>
 982     </div>
 983
 984   </div>
 985 </main>
 986
 987 <div class="fixed-action-btn" id="btn_scrollToTop" style="bottom: 45px; right: 24px;">
 988   <a class="btn-floating btn-large deezloader-primary scale-transition scale-out">
 989     <i class="large material-icons">keyboard_arrow_up</i>
 990   </a>
 991 </div>
 992 <audio id="preview-track">
 993   <source id="preview-track_source" src="" type="audio/mpeg">
 994 </audio>
 995
 996 <footer class="deezloader-black darken-1 left page-footer hide-on-med-and-down valign-wrapper">
 997       <p><span style="position: relative;display: inline-block;transform: rotateY(180deg);">&copy;</span> Deezloader original code by <a class="white-text" href="https://boerse.to/members/zzmtv.3378614/">ZzMTV</a>.</p>
 998 </footer>
 999
1000 <script>if (typeof module === 'object') {
1001         window.module = module;
1002         module = undefined;
1003 }</script>
1004 <script type="text/javascript" src="js/socket.io.js"></script>
1005 <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
1006 <script type="text/javascript" src="js/materialize.min.js"></script>
1007 <script type="text/javascript" src="js/vue.min.js"></script>
1008 <script type="text/javascript" src="js/appBase.js"></script>
1009 <script type="text/javascript" src="js/main.js"></script>
1010 <script>if (window.module) module = window.module;</script>
1011 </body>
1012 </html>