Jukebox mp3

Description

Petit jukebox permettant d'écouter ses mp3 à partir de son site internet.
Le jukebox fonctionne avec dewplayer qui est libre de droit tant que son usage n'est pas commercial.

Source / Exemple :


#############################################################
# INDEX.PHP
#############################################################
<?php
	// ==========================================================
	// On liste les mp3 contenus dans le dossier MUSIQUE/
	// $pasMp3 => exclut les fichiers qui ne sont pas des mp3
	// ==========================================================
	// NE PAS INCLURE LES FICHIERS SUIVANT DANS LA BOUCLE "MP3"
	$pasMp3 = array(".", "..", "index.html");
	// Lecture du répertoire MUSIQUE/
	$dir = opendir("MUSIQUE");
	while($f = readdir($dir)) {
		if(!in_array($f, $pasMp3)) {
			// C'est un mp3, on l'ajoute à la liste
			$MP3s[] = $f;
		}
	}
	closedir($dir);
	// On range les MP3s par titre
	if(!empty($MP3s))
		sort($MP3s);
	// On génére le HTML de la liste des mp3
	$listeMp3 = "";
	foreach($MP3s as $num=>$MP3) {
		$listeMp3 .= '
						<div><input type="checkbox" id="mp3'.$num.'" value="MUSIQUE/'.$MP3.'" onClick="playlist_modifier();" style="vertical-align: bottom;" title="Ajouter/retirer le mp3 dans la playlist" /> <a href="lecteur.php?mp3='.urlencode("MUSIQUE/".$MP3).'" class="mp3" target="lecteur">'.str_replace(".mp3", "", $MP3).'</a></div><div><a href="lecteur.php?mp3='.urlencode("MUSIQUE/".$MP3).'&options=autoreplay" class="mp3" style="margin-left: 28px; font-size: 10px;" target="lecteur">LIRE EN BOUCLE</a></div>';
	}
	// =====================
	// AFFICHAGE DU JUKEBOX
	// =====================
	echo '
	<html>
		<head>
			<title>Jukebox</title>
			<link rel="stylesheet" href="jukebox.css" type="text/css" media="screen" />
			<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
			<script language="javascript" type="text/javascript">
				<!--
				var playlist;
				// -------------------------------------------------
				// Ajouter ou retirer tout les mp3 dans la playlist
				// -------------------------------------------------
				function playlist_tout() {
					playlist = "";
					if(document.getElementById("tous").checked == true) {
						var cocher = 1;
					}
					else {
						var cocher = 0;
					}
					var n = 0;
					var idPiste = "mp3" + n;
					var piste;
					while(document.getElementById(idPiste)) {
						piste = document.getElementById(idPiste);
						piste.checked = cocher;
						if(cocher == 1) {
							if(playlist != "") {
								playlist += "|" + piste.value;
							}
							else {
								playlist = piste.value;
							}
						}
						n++;
						idPiste = "mp3" + n;
					}
				}
				// ----------------------------------------------------------------
				// Lance la lecture de la playlist
				// La playlist correspond aux chansons dont la checkbox est cochée
				// ----------------------------------------------------------------
				function playlist_lire() {
					// Options du lecteur
					var options;
					if(document.getElementById("aleatoire").checked == true) {
						options = "randomplay";
					}
					// On lance la playlist
					document.getElementById("lecteur").src = "lecteur.php?mp3=" + playlist + "&options=" + options;
				}
				-->
			</script>
		</head>
		<body>
			<table>
				<tr>
					<td valign="top" style="padding: 0 5px;">
						<p width="240px"><strong>Jukebox</strong></p>
						<iframe id="lecteur" name="lecteur" src="lecteur.php?mp3=" width="240px" height="20px" frameborder="0" style="overflow: hidden;"></iframe>
						<p>
							<input type="checkbox" id="aleatoire" /> lecture aléatoire<br /><br />
							<input type="button" value="Lancer la playlist" onClick="playlist_lire();" />
						</p>
					</td>
					<td valign="top" style="padding: 0 5px;">
						<iframe id="modifMp3" name="modifMp3" src="" width="500px" height="400px" frameborder="1px" style="position: absolute; display: none; z-index: 10; overflow: hidden;"></iframe>
						'.$listeMp3.'
						<p>
							<input type="checkbox" id="tous" onClick="playlist_tout();" style="vertical-align: bottom;" title="Ajouter/retirer tous les mp3 dans la playlist" /> <label for="tous">Tout ajouter/retirer</label>
						</p>
					</td>
				</tr>
			</table>
		</body>
	</html>';
?>

#############################################################
# LECTEUR.PHP
#############################################################
<?php
	// ==============
	// MP3(s) à lire
	// ==============
	$MP3 = stripslashes(urldecode($_GET['mp3']));
	// ===========================
	// Options de lecture
	// Deux options disponibles :
	// - lecture aléatoire
	// - lecture répétée
	// ===========================
	$randomplay = $autoreplay = "";
	if(isset($_GET['options']) && !empty($_GET['options'])) {
		$options = explode("|", $_GET['options']);
		foreach($options as $option) {
			switch($option) {
				case "randomplay":
					$randomplay = "&randomplay=1";
					break;
				case "autoreplay":
					$autoreplay = "&autoreplay=1";
					break;
				default:
					break;
			}
		}
	}
	// ======================================================================================
	// DEWPLAYER Version Multi
	// http://www.alsacreations.fr/mp3-dewplayer.html
	// Dewplayer est sous licence Creative Commons,
	// son utilisation est libre et gratuite même dans un cadre professionnel ou commercial.
	// ======================================================================================
	echo '
	<html>
		<head>
			<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		</head>
		<body style="margin: 0; padding: 0; background: #FFFFFF;">
			<object type="application/x-shockwave-flash" data="dewplayer-multi.swf?mp3='.$MP3.'&autoplay=1&showtime=1'.$randomplay.$autoreplay.'" width="240px" height="20px">
				<param name="wmode" value="transparent" />
				<param name="movie" value="dewplayer-multi.swf?mp3='.$MP3.'&autoplay=1&showtime=1'.$randomplay.$autoreplay.'" />
			</object>
		</body>
	</html>';
?>

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.