155 lines
		
	
	
		
			6.9 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			155 lines
		
	
	
		
			6.9 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
<section class="section">
 | 
						|
    <div class="container">
 | 
						|
        <h1 class="title">Mes Playlists</h1>
 | 
						|
 | 
						|
        <?php if (isset($error)): ?>
 | 
						|
            <div class="notification is-danger">
 | 
						|
                <?= $error ?>
 | 
						|
            </div>
 | 
						|
        <?php endif; ?>
 | 
						|
 | 
						|
        <?php if ($playlists): ?>
 | 
						|
            <div class="columns is-multiline">
 | 
						|
                <?php foreach ($playlists as $playlist): ?>
 | 
						|
                    <div class="column is-one-third">
 | 
						|
                        <div class="card">
 | 
						|
                            <div class="card-content">
 | 
						|
                                <div class="media">
 | 
						|
                                    <div class="media-content">
 | 
						|
                                        <p class="title is-4"><?= anchor("playlist/view/{$playlist->id}", $playlist->name) ?></p>
 | 
						|
                                    </div>
 | 
						|
                                    <div class="media-right buttons-right">
 | 
						|
                                        <?= form_open('playlist/duplicate/'.$playlist->id, ['style' => 'display:inline;']) ?>
 | 
						|
                                            <button type="submit" class="button is-info is-small">Dupliquer</button>
 | 
						|
                                        <?= form_close() ?>
 | 
						|
                                        <button class="button is-warning is-small" onclick="showRenameModal('<?= $playlist->id ?>', '<?= $playlist->name ?>')">Renommer</button>
 | 
						|
                                    </div>
 | 
						|
                                </div>
 | 
						|
                            </div>
 | 
						|
                            <footer class="card-footer">
 | 
						|
                                <?= form_open('playlist/delete/'.$playlist->id, ['class' => 'card-footer-item']) ?>
 | 
						|
                                    <button type="submit" class="button is-danger is-small">Supprimer</button>
 | 
						|
                                <?= form_close() ?>
 | 
						|
                            </footer>
 | 
						|
                        </div>
 | 
						|
                    </div>
 | 
						|
                <?php endforeach; ?>
 | 
						|
            </div>
 | 
						|
        <?php else: ?>
 | 
						|
            <p>Vous n'avez pas encore de playlists.</p>
 | 
						|
        <?php endif; ?>
 | 
						|
 | 
						|
        <div class="box">
 | 
						|
            <form method="post" action="<?= site_url('playlist/add') ?>">
 | 
						|
                <div class="field">
 | 
						|
                    <label class="label">Nom de la playlist</label>
 | 
						|
                    <div class="control">
 | 
						|
                        <input type="text" name="name" class="input" placeholder="Nom de la playlist" required>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
                <div class="field">
 | 
						|
                    <label class="label">Type de Playlist</label>
 | 
						|
                    <div class="control">
 | 
						|
                        <div class="select">
 | 
						|
                            <select name="type" id="playlistType" onchange="toggleRandomOptions()">
 | 
						|
                                <option value="empty">Vide</option>
 | 
						|
                                <option value="random">Aléatoire</option>
 | 
						|
                            </select>
 | 
						|
                        </div>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
 | 
						|
                <div id="randomOptions" style="display: none;">
 | 
						|
                    <div class="field">
 | 
						|
                        <label class="label">Nombre de chansons</label>
 | 
						|
                        <div class="control">
 | 
						|
                            <input type="number" name="numSongs" class="input" placeholder="Nombre de chansons">
 | 
						|
                        </div>
 | 
						|
                    </div>
 | 
						|
                    <div class="field">
 | 
						|
                        <label class="label">Artiste</label>
 | 
						|
                        <div class="control">
 | 
						|
                            <div class="select">
 | 
						|
                                <select name="artist">
 | 
						|
                                    <option value="">Tous</option>
 | 
						|
                                    <?php foreach($artists as $artist): ?>
 | 
						|
                                        <option value="<?= $artist->name ?>"><?= $artist->name ?></option>
 | 
						|
                                    <?php endforeach; ?>
 | 
						|
                                </select>
 | 
						|
                            </div>
 | 
						|
                        </div>
 | 
						|
                    </div>
 | 
						|
                    <div class="field">
 | 
						|
                        <label class="label">Genre</label>
 | 
						|
                        <div class="control">
 | 
						|
                            <div class="select">
 | 
						|
                                <select name="genre">
 | 
						|
                                    <option value="">Tous</option>
 | 
						|
                                    <?php foreach($genres as $genre): ?>
 | 
						|
                                        <option value="<?= $genre->name ?>"><?= $genre->name ?></option>
 | 
						|
                                    <?php endforeach; ?>
 | 
						|
                                </select>
 | 
						|
                            </div>
 | 
						|
                        </div>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
 | 
						|
                <div class="field">
 | 
						|
                    <div class="control">
 | 
						|
                        <button type="submit" class="button is-link">Créer une playlist</button>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
            </form>
 | 
						|
        </div>
 | 
						|
    </div>
 | 
						|
</section>
 | 
						|
 | 
						|
<!-- Rename Modal -->
 | 
						|
<div id="renameModal" class="modal">
 | 
						|
    <div class="modal-background"></div>
 | 
						|
    <div class="modal-card">
 | 
						|
        <header class="modal-card-head">
 | 
						|
            <p class="modal-card-title">Renommer la Playlist</p>
 | 
						|
            <button class="delete" aria-label="close" onclick="closeRenameModal()"></button>
 | 
						|
        </header>
 | 
						|
        <section class="modal-card-body">
 | 
						|
            <form id="renameForm" method="post" action="<?= site_url('playlist/rename') ?>">
 | 
						|
                <div class="field">
 | 
						|
                    <label class="label">Nouveau Nom</label>
 | 
						|
                    <div class="control">
 | 
						|
                        <input type="hidden" name="playlistId" id="renamePlaylistId">
 | 
						|
                        <input type="text" name="newName" class="input" id="renameNewName" required>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
                <div class="field">
 | 
						|
                    <div class="control">
 | 
						|
                        <button type="submit" class="button is-link">Renommer</button>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
            </form>
 | 
						|
        </section>
 | 
						|
    </div>
 | 
						|
</div>
 | 
						|
 | 
						|
<script>
 | 
						|
    function toggleRandomOptions() {
 | 
						|
        var playlistType = document.getElementById('playlistType').value;
 | 
						|
        var randomOptions = document.getElementById('randomOptions');
 | 
						|
        if (playlistType === 'random') {
 | 
						|
            randomOptions.style.display = 'block';
 | 
						|
        } else {
 | 
						|
            randomOptions.style.display = 'none';
 | 
						|
        }
 | 
						|
    }
 | 
						|
 | 
						|
    function showRenameModal(playlistId, playlistName) {
 | 
						|
        document.getElementById('renamePlaylistId').value = playlistId;
 | 
						|
        document.getElementById('renameNewName').value = playlistName;
 | 
						|
        document.getElementById('renameModal').classList.add('is-active');
 | 
						|
    }
 | 
						|
 | 
						|
    function closeRenameModal() {
 | 
						|
        document.getElementById('renameModal').classList.remove('is-active');
 | 
						|
    }
 | 
						|
</script>
 |