2020-04-07 21:44:46 +02:00
|
|
|
class Player {
|
|
|
|
async init() {
|
2020-08-01 21:51:54 +02:00
|
|
|
this.playlist = new Playlist();
|
|
|
|
}
|
|
|
|
|
|
|
|
nextSong() {
|
|
|
|
let next = this.playlist.getNext();
|
|
|
|
audioHandler.loadSong(next.file);
|
|
|
|
}
|
|
|
|
|
|
|
|
prevSong() {
|
|
|
|
let next = this.playlist.getPrevious();
|
|
|
|
audioHandler.loadSong(next.file);
|
|
|
|
}
|
|
|
|
|
|
|
|
playStop() {
|
|
|
|
if (!audioHandler.lastSong) {
|
|
|
|
let next = this.playlist.getCurrent();
|
|
|
|
audioHandler.loadSong(next.file);
|
2020-08-05 11:24:59 +02:00
|
|
|
return;
|
2020-08-01 21:51:54 +02:00
|
|
|
}
|
|
|
|
let audioFile = audioHandler.audioFile;
|
|
|
|
if (audioFile.paused) {
|
|
|
|
audioFile.play();
|
|
|
|
} else {
|
|
|
|
audioFile.pause();
|
|
|
|
}
|
2020-08-05 11:24:59 +02:00
|
|
|
window.dispatchEvent(new CustomEvent('playSong'));
|
2020-08-01 21:51:54 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
playByID(number) {
|
2020-08-05 11:24:59 +02:00
|
|
|
this.playlist.index = number;
|
|
|
|
let next = this.playlist.getCurrent();
|
2020-08-01 21:51:54 +02:00
|
|
|
audioHandler.loadSong(next.file);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
const PAGINATIONLIMIT = 50;
|
|
|
|
|
|
|
|
class Playlist {
|
|
|
|
constructor() {
|
|
|
|
this.list = [];
|
|
|
|
this.shuffled = [];
|
|
|
|
this.index = 0;
|
|
|
|
this.page = 0;
|
|
|
|
this.isShuffle = false;
|
|
|
|
$('body').addDelegatedEventListener('change', 'input[type="file"]', this.changeFiles.bind(this));
|
|
|
|
$('body').addDelegatedEventListener('click', '.pagination .item', this.handlePagination.bind(this));
|
|
|
|
}
|
|
|
|
|
|
|
|
shuffle() {
|
|
|
|
// only shuffle if more then 2 elements are in
|
|
|
|
let len = this.list.length;
|
|
|
|
if (len < 3) {
|
|
|
|
this.shuffled = this.list;
|
|
|
|
}
|
|
|
|
// the current-list need to be shuffled...
|
|
|
|
for (let i = 0; i < len; i++) {
|
|
|
|
let random = VTUtils.randomInt(0, len - 1);
|
|
|
|
this.swap(i, random);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
swap(a, b) {
|
|
|
|
this.shuffled[a] = this.list[b];
|
|
|
|
this.shuffled[b] = this.list[a];
|
|
|
|
}
|
|
|
|
|
|
|
|
getNext() {
|
|
|
|
let items = this.isShuffle ? this.shuffled : this.list,
|
|
|
|
len = items.length - 1,
|
|
|
|
next = this.index + 1;
|
|
|
|
if (next > len) {
|
|
|
|
next = 0;
|
|
|
|
}
|
|
|
|
this.index = next;
|
|
|
|
return items[next];
|
|
|
|
}
|
|
|
|
|
|
|
|
getPrevious() {
|
|
|
|
let items = this.isShuffle ? this.shuffled : this.list,
|
|
|
|
len = items.length - 1,
|
|
|
|
next = this.index - 1;
|
|
|
|
if (next < 0) {
|
|
|
|
next = len;
|
|
|
|
}
|
|
|
|
this.index = next;
|
|
|
|
return items[next];
|
|
|
|
}
|
|
|
|
|
|
|
|
getCurrent() {
|
|
|
|
let items = this.isShuffle ? this.shuffled : this.list;
|
|
|
|
return items[this.index];
|
|
|
|
}
|
|
|
|
|
|
|
|
// on new upload... this has to be an array!
|
|
|
|
setPlaylist(files) {
|
|
|
|
this.index = 0;
|
|
|
|
this.list = files;
|
|
|
|
this.shuffle();
|
|
|
|
}
|
|
|
|
|
|
|
|
handlePagination(event, el) {
|
|
|
|
if (el.hasClass('inactive')) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if (el.hasClass('next-site')) {
|
|
|
|
this.renderPagination(this.page + 1);
|
|
|
|
} else {
|
|
|
|
this.renderPagination(this.page - 1);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
renderPagination(page) {
|
|
|
|
let length = this.list.length,
|
|
|
|
maxSite = Math.ceil(length / PAGINATIONLIMIT) - 1;
|
|
|
|
if (page < 0) {
|
|
|
|
page = 0;
|
|
|
|
}
|
|
|
|
if (page > maxSite) {
|
|
|
|
page = maxSite;
|
|
|
|
}
|
|
|
|
let s = page * PAGINATIONLIMIT,
|
|
|
|
e = s + PAGINATIONLIMIT,
|
|
|
|
data = "";
|
|
|
|
this.page = page;
|
|
|
|
if (e >= length) {
|
|
|
|
e = length;
|
|
|
|
}
|
|
|
|
if (length > 0) {
|
|
|
|
let items = this.isShuffle ? this.shuffled : this.list;
|
|
|
|
for (let i = s; i < e; i++) {
|
|
|
|
let obj = {
|
2020-08-05 11:24:59 +02:00
|
|
|
index: i.toString(),
|
2020-08-01 21:51:54 +02:00
|
|
|
nr: i + 1,
|
2020-08-05 11:24:59 +02:00
|
|
|
title: items[i].name,
|
|
|
|
active: !audioHandler.audioFile.paused && i === this.index ? 'active' : ''
|
2020-08-01 21:51:54 +02:00
|
|
|
}
|
|
|
|
data += template.parseTemplate("playlist-item", obj);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
data = "<h1>No Songs uploaded!</h1>";
|
|
|
|
}
|
|
|
|
let hasNext = maxSite > 1 && page < maxSite;
|
|
|
|
gui.modal.renderModal(
|
|
|
|
"Playlist",
|
|
|
|
template.parseTemplate("playlist", {
|
|
|
|
content: data,
|
|
|
|
}),
|
|
|
|
template.parseTemplate('playlist-footer', {
|
|
|
|
prevActive: page > 0 ? 'active' : 'inactive',
|
|
|
|
nextActive: hasNext ? 'active' : 'inactive',
|
|
|
|
page: (page + 1) + ' / ' + parseInt(maxSite + 1),
|
|
|
|
})
|
|
|
|
);
|
|
|
|
}
|
2020-04-07 21:44:46 +02:00
|
|
|
|
2020-08-01 21:51:54 +02:00
|
|
|
//playlist handler for file input!
|
|
|
|
changeFiles(e, el) {
|
2020-08-05 11:24:59 +02:00
|
|
|
|
|
|
|
if (el.id !== 'upload-dir') {
|
|
|
|
return;
|
|
|
|
}
|
2020-08-01 21:51:54 +02:00
|
|
|
let files = [];
|
|
|
|
let i = 0;
|
|
|
|
for (let file of el.files) {
|
|
|
|
if (file && file.type.indexOf('audio') !== -1 && file.name.match(".m3u") === null) {
|
|
|
|
let name = file.name.split(".");
|
|
|
|
name.pop();
|
|
|
|
name = name.join(".");
|
|
|
|
files.push({
|
|
|
|
file: file,
|
|
|
|
name: name,
|
|
|
|
index: i++
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.setPlaylist(files);
|
|
|
|
if (files.length > 0) {
|
|
|
|
this.renderPagination(0);
|
|
|
|
} else {
|
|
|
|
alert("No Valid AudioFiles found!");
|
|
|
|
}
|
2020-04-07 21:44:46 +02:00
|
|
|
}
|
|
|
|
}
|