forked from Simnation/Main
Update script.js
This commit is contained in:
Nordi98
parent
d6480dfebd
commit
ab48cbdd05
1 changed files with 18 additions and 271 deletions
|
|
@ -1679,289 +1679,36 @@ function stopAllAudioAndCloseInterface() {
|
|||
});
|
||||
}
|
||||
|
||||
function showDJInterface() {
|
||||
console.log('DJ System: Showing interface');
|
||||
|
||||
// Playlist-Verwaltung
|
||||
let playlists = [];
|
||||
let currentPlaylist = null;
|
||||
let currentPlaylistIndex = 0;
|
||||
|
||||
// Playlist laden
|
||||
function loadPlaylists() {
|
||||
// Lade Playlists vom Server
|
||||
notifyFiveM('getPlaylists', {}, function(response) {
|
||||
if (response.success && response.playlists) {
|
||||
playlists = response.playlists;
|
||||
updatePlaylistDisplay();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Playlist-Anzeige aktualisieren
|
||||
function updatePlaylistDisplay() {
|
||||
const playlistContainer = document.getElementById('playlist-container');
|
||||
if (!playlistContainer) return;
|
||||
|
||||
playlistContainer.innerHTML = '';
|
||||
|
||||
if (playlists.length === 0) {
|
||||
playlistContainer.innerHTML = '<div class="no-playlists">Keine Playlists gefunden</div>';
|
||||
const djInterfaceElement = document.getElementById('dj-interface');
|
||||
if (!djInterfaceElement) {
|
||||
console.error('DJ System: Interface element not found!');
|
||||
notifyFiveM('error', {error: 'Interface element not found'});
|
||||
return;
|
||||
}
|
||||
|
||||
// Erstelle Playlist-Elemente
|
||||
playlists.forEach((playlist, index) => {
|
||||
const playlistElement = document.createElement('div');
|
||||
playlistElement.className = 'playlist-item';
|
||||
if (currentPlaylist && currentPlaylist.id === playlist.id) {
|
||||
playlistElement.classList.add('active');
|
||||
}
|
||||
// Entferne hidden-Klasse
|
||||
djInterfaceElement.classList.remove('hidden');
|
||||
|
||||
playlistElement.innerHTML = `
|
||||
<div class="playlist-header">
|
||||
<span class="playlist-name">${playlist.name}</span>
|
||||
<span class="playlist-count">${playlist.songs.length} Songs</span>
|
||||
</div>
|
||||
<div class="playlist-actions">
|
||||
<button class="playlist-play-btn" title="Play"><i class="fas fa-play"></i></button>
|
||||
<button class="playlist-edit-btn" title="Edit"><i class="fas fa-edit"></i></button>
|
||||
${playlist.isOwner ? '<button class="playlist-delete-btn" title="Delete"><i class="fas fa-trash"></i></button>' : ''}
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Event-Listener für Playlist-Aktionen
|
||||
const playBtn = playlistElement.querySelector('.playlist-play-btn');
|
||||
if (playBtn) {
|
||||
playBtn.addEventListener('click', () => playPlaylist(playlist));
|
||||
}
|
||||
|
||||
const editBtn = playlistElement.querySelector('.playlist-edit-btn');
|
||||
if (editBtn) {
|
||||
editBtn.addEventListener('click', () => editPlaylist(playlist));
|
||||
}
|
||||
|
||||
const deleteBtn = playlistElement.querySelector('.playlist-delete-btn');
|
||||
if (deleteBtn) {
|
||||
deleteBtn.addEventListener('click', () => deletePlaylist(playlist));
|
||||
}
|
||||
|
||||
playlistContainer.appendChild(playlistElement);
|
||||
});
|
||||
}
|
||||
|
||||
// Playlist abspielen
|
||||
function playPlaylist(playlist) {
|
||||
if (!playlist || !playlist.songs || playlist.songs.length === 0) {
|
||||
showNotification('Diese Playlist enthält keine Songs', 'warning');
|
||||
return;
|
||||
// Position weiter rechts und unten, falls keine gespeicherte Position
|
||||
if (!localStorage.getItem('djInterfacePosition')) {
|
||||
interfacePosition = {
|
||||
x: (window.innerWidth - interfaceSize.width) / 2,
|
||||
y: (window.innerHeight - interfaceSize.height) / 2
|
||||
};
|
||||
}
|
||||
|
||||
currentPlaylist = playlist;
|
||||
currentPlaylistIndex = 0;
|
||||
// Wende gespeicherte Einstellungen an
|
||||
applyInterfaceSettings();
|
||||
|
||||
// Ersten Song abspielen
|
||||
playPlaylistSong(currentPlaylistIndex);
|
||||
console.log('DJ System: Interface shown');
|
||||
}
|
||||
|
||||
// Playlist-Song abspielen
|
||||
function playPlaylistSong(index) {
|
||||
if (!currentPlaylist || !currentPlaylist.songs || index >= currentPlaylist.songs.length) {
|
||||
showNotification('Playlist beendet', 'info');
|
||||
currentPlaylist = null;
|
||||
return;
|
||||
}
|
||||
|
||||
const song = currentPlaylist.songs[index];
|
||||
|
||||
// Lade Song in Deck A
|
||||
const trackData = {
|
||||
title: song.title,
|
||||
artist: song.artist || '',
|
||||
url: song.url
|
||||
};
|
||||
|
||||
loadTrackToPlayer('A', trackData);
|
||||
|
||||
// Starte Wiedergabe
|
||||
if (!djInterface.decks.A.isPlaying) {
|
||||
togglePlay('A');
|
||||
}
|
||||
|
||||
showNotification(`Playlist: ${currentPlaylist.name} - Song ${index + 1}/${currentPlaylist.songs.length}`, 'info');
|
||||
}
|
||||
|
||||
// Nächster Song in Playlist
|
||||
function playNextSong() {
|
||||
if (!currentPlaylist) return;
|
||||
|
||||
currentPlaylistIndex++;
|
||||
if (currentPlaylistIndex < currentPlaylist.songs.length) {
|
||||
playPlaylistSong(currentPlaylistIndex);
|
||||
} else {
|
||||
showNotification('Playlist beendet', 'info');
|
||||
currentPlaylist = null;
|
||||
}
|
||||
}
|
||||
|
||||
// Playlist bearbeiten
|
||||
function editPlaylist(playlist) {
|
||||
openPlaylistEditor(playlist);
|
||||
}
|
||||
|
||||
// Playlist löschen
|
||||
function deletePlaylist(playlist) {
|
||||
if (confirm(`Möchtest du die Playlist "${playlist.name}" wirklich löschen?`)) {
|
||||
notifyFiveM('deletePlaylist', { playlistId: playlist.id }, function(response) {
|
||||
if (response.success) {
|
||||
showNotification('Playlist gelöscht', 'success');
|
||||
loadPlaylists(); // Playlists neu laden
|
||||
} else {
|
||||
showNotification('Fehler beim Löschen der Playlist', 'error');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Neue Playlist erstellen
|
||||
function createNewPlaylist() {
|
||||
const playlistName = prompt('Name der neuen Playlist:');
|
||||
if (!playlistName) return;
|
||||
|
||||
notifyFiveM('createPlaylist', {
|
||||
name: playlistName,
|
||||
isPublic: confirm('Soll die Playlist öffentlich sein?')
|
||||
}, function(response) {
|
||||
if (response.success) {
|
||||
showNotification('Playlist erstellt', 'success');
|
||||
loadPlaylists(); // Playlists neu laden
|
||||
} else {
|
||||
showNotification('Fehler beim Erstellen der Playlist', 'error');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Song zu Playlist hinzufügen
|
||||
function addSongToPlaylist(song, playlistId) {
|
||||
notifyFiveM('addToPlaylist', {
|
||||
playlistId: playlistId,
|
||||
track: song
|
||||
}, function(response) {
|
||||
if (response.success) {
|
||||
showNotification('Song zur Playlist hinzugefügt', 'success');
|
||||
loadPlaylists(); // Playlists neu laden
|
||||
} else {
|
||||
showNotification('Fehler beim Hinzufügen des Songs', 'error');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Playlist-Editor öffnen
|
||||
function openPlaylistEditor(playlist) {
|
||||
// Implementiere einen Playlist-Editor
|
||||
// Dies könnte ein Modal sein, in dem Songs hinzugefügt/entfernt werden können
|
||||
console.log('Playlist Editor für:', playlist);
|
||||
|
||||
// Beispiel für ein einfaches Modal
|
||||
const modal = document.createElement('div');
|
||||
modal.className = 'modal';
|
||||
modal.innerHTML = `
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h3>Playlist bearbeiten: ${playlist.name}</h3>
|
||||
<button class="close-modal">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="playlist-songs">
|
||||
${playlist.songs.map((song, idx) => `
|
||||
<div class="playlist-song">
|
||||
<span>${idx + 1}. ${song.title}</span>
|
||||
<button class="remove-song" data-index="${idx}">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
`).join('')}
|
||||
</div>
|
||||
<div class="add-song-form">
|
||||
<h4>Song hinzufügen</h4>
|
||||
<div class="input-group">
|
||||
<input type="text" id="song-title" placeholder="Titel">
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<input type="text" id="song-artist" placeholder="Künstler (optional)">
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<input type="text" id="song-url" placeholder="URL (YouTube oder direkt)">
|
||||
</div>
|
||||
<button id="add-song-btn">Song hinzufügen</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.body.appendChild(modal);
|
||||
|
||||
// Event-Listener für Modal
|
||||
const closeBtn = modal.querySelector('.close-modal');
|
||||
if (closeBtn) {
|
||||
closeBtn.addEventListener('click', () => {
|
||||
document.body.removeChild(modal);
|
||||
});
|
||||
}
|
||||
|
||||
// Event-Listener für Song-Entfernung
|
||||
const removeBtns = modal.querySelectorAll('.remove-song');
|
||||
removeBtns.forEach(btn => {
|
||||
btn.addEventListener('click', () => {
|
||||
const index = parseInt(btn.dataset.index);
|
||||
removeSongFromPlaylist(playlist.id, playlist.songs[index].id);
|
||||
});
|
||||
});
|
||||
|
||||
// Event-Listener für Song-Hinzufügung
|
||||
const addBtn = modal.querySelector('#add-song-btn');
|
||||
if (addBtn) {
|
||||
addBtn.addEventListener('click', () => {
|
||||
const title = modal.querySelector('#song-title').value;
|
||||
const artist = modal.querySelector('#song-artist').value;
|
||||
const url = modal.querySelector('#song-url').value;
|
||||
|
||||
if (!title || !url) {
|
||||
showNotification('Titel und URL sind erforderlich', 'error');
|
||||
return;
|
||||
}
|
||||
|
||||
addSongToPlaylist({
|
||||
title: title,
|
||||
artist: artist,
|
||||
url: url
|
||||
}, playlist.id);
|
||||
|
||||
// Modal schließen
|
||||
document.body.removeChild(modal);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Song aus Playlist entfernen
|
||||
function removeSongFromPlaylist(playlistId, songId) {
|
||||
notifyFiveM('removeSongFromPlaylist', {
|
||||
playlistId: playlistId,
|
||||
songId: songId
|
||||
}, function(response) {
|
||||
if (response.success) {
|
||||
showNotification('Song aus Playlist entfernt', 'success');
|
||||
loadPlaylists(); // Playlists neu laden
|
||||
} else {
|
||||
showNotification('Fehler beim Entfernen des Songs', 'error');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Event-Listener für Song-Ende (für Playlist-Fortsetzung)
|
||||
function setupPlaylistEventListeners() {
|
||||
// Wenn ein Song endet, spiele den nächsten in der Playlist
|
||||
document.addEventListener('songEnded', function(e) {
|
||||
if (currentPlaylist) {
|
||||
playNextSong();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue