Téléchargement xspf jukebox - Téléchargement du code source xspf jukebox Téléchargement

xspf jukebox

Code source FLASH

1.0.0

Télécharger

Un lecteur de médias flash skinnable et personnalisable.

Démo en direct du Jukebox XSPF

Vous devez faire installer Flash!

Le Jukebox XSPF est un lecteur de médias flash entièrement skinnable. Basé sur mes révisions de la création originale de Fabricio Zuardi. Un lecteur multimédia complet en vedette, le Jukebox prend en charge à la fois MP3 Audio et FLV vidéo analysé via une liste de lecture .xspf ou .xml externe. Des skins personnalisés combinés avec un résumé automatique et de nombreuses options personnalisables font du Jukebox XSPF un choix solide pour un lecteur multimédia basé sur Flash.

En 2014, ce projet n'est plus entretenu. Il est considéré comme dans un état stable et ne recevra aucune autre mise à jour.

Si vous souhaitez prendre le relais, veuillez déposer un problème.

Caractéristiques

Skins entièrement personnalisables
Résumer automatiquement lorsque l'utilisateur change de pages (allez-y, actualisez la page pour l'essayer!)
Prend en charge .mp3 Audio et .flv Vidéo
Playlist un support à piste unique
Remanier / répéter
Cache de playlist
De nombreuses options personnalisables
Id3 Track Meta Infomation Support
Minuscule empreinte - seulement 20 Ko!
Capacité à enregistrer les informations d'utilisation des joueurs
API JavaScript complet
Inclut xplay.php modifié pour générer automatiquement la liste de lecture

Table des matières

Installer
Options de juke-box
- Mode unique
- Paramètres facultatifs
- Format de playlist XSPF
- API JavaScript
Écorcher le juke-box
- Objets de peau
- Objets de fonction
- Étiquettes
- Attributs
Listes de lecture XSPF
Licence

Installer

1. Créez une liste de lecture XSPF pointant vers vos fichiers multimédias

(Facultatif) Générez automatiquement vos listes de lecture dans PHP, Python ou JS

Modifiez la première ligne du fichier xplay.php pour pointer vers votre répertoire multimédia:

$media = "media"

Modifiez toutes les options que vous souhaitez, la mise en cache de playlist est activée par défaut.

2. Incluez le code JavaScript swfObject dans votre page `<head>` :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>

3. Créez un `<div>` pour tenir votre contenu:

 < div id =" flashcontent " >
     <!-- this will be replaced -->
 </ div >

4. Invoquez le joueur via JavaScript:

 < script >
    var params = { } ;
    params.wmode="transparent";
    params.allowscriptaccess="always";
    
    var url = "xspf_jukebox.swf?playlist_url=xplay.php & skin_url = skins / iTunes & param1 = value " ;
    swfobject . embedSWF ( url , "flashcontent" , "skin width" , "skin height" , "7.0.0" , "" , { } , params , { } ) ;
< / script >

Remarquez les valeurs mises en évidence ci-dessus, vous devez spécifier des chemins de fichier valides pour la playlist_url et skin_url ainsi que la width et height de la peau. Vous pouvez également spécifier l'un des paramètres facultatifs suivant la playlist_url . Par exemple:

L'URL entière du .swf sur la page de démonstration est:

 xspf_jukebox . swf ? playlist_url = xplay . php & skin_url = skins / iTunes & autoplay = true & alphabetize = true & autoload = true & autoresume = true & main_image = images / artwork . jpg & shuffle = true & statsurl = stats . php

C'est ça! Le Jukebox XSPF est désormais installé.

Options

Le Jukebox XSPF peut être personnalisé pour presque tous les besoins de lire de l'audio ou de la vidéo sur le Web.

Mode unique

Vous pouvez également utiliser le juke-box pour lire un seul fichier .mp3 ou .flv, en utilisant les deux paramètres suivants à la place de PlayList_url:

track_title : étiquette de piste
track_url : URL de la piste

Paramètres facultatifs

playlist_url : L'URL du fichier xspf à charger
skin_url : URL du dossier de la peau
loadurl : URL liant à un fichier texte contenant toutes les variables. Réduit le codage HTML et les tailles de fichiers, un fichier peut être utilisé par de nombreux joueurs
activeDownload : valeur booléenne pour permettre ou interdire les téléchargements directs des pistes, la valeur par défaut est fausse
alphabetize : valeur booléenne pour alphabétiser la playlist, la valeur par défaut est fausse
autoload : valeur booléenne qui fait charger la liste de lecture sans le clic initial de l'utilisateur, la valeur par défaut est fausse
autoplay : valeur booléenne qui fait charger la liste de lecture et la musique commence sans le clic initial, la valeur par défaut est fausse
autoresume : valeur booléenne qui permet aux joueurs sur plusieurs pages de continuer de manière transparente de la musique en tant qu'utilisateur à parcourir les pages, la valeur par défaut est fausse
buffer : secondes pour précharger la vidéo avant de jouer, exclure pour automatiquement
crossFade : soit une valeur booléenne, qui lorsque le vrai est défini sur le temps par défaut, soit le nombre de secondes à s'estomper (1-12), la valeur par défaut est de 6 secondes
forceAlphabetize : valeur booléenne, force l'alphabétisation complète, y compris la précédente `` le titre de l'artiste, par défaut est faux
format : Text to Format Track Label, utilisez "-Creator" "-title," -Location et "-annotation pour insérer des valeurs respectives, la valeur par défaut est" -Creator: -Title
gotoany : Valeur booléenne qui force le voyage vers des URL inconnues, la valeur par défaut est fausse
image : URL pour une image JPG qui est affichée lorsque la lecture automatique est désactivée
infourl : URL d'informations globales pour toutes les chansons, remplit les URL d'information de la liste de lecture absente
load_message : Message affiché après Autoload
main_image : URL de l'image globale, remplit les images de playlist absent
mainurl : clic droit »" sur "URL
midChar : caractère placé pour séparer les valeurs du créateur et du titre pour les pistes, écrasées par format, la valeur par défaut est ":
no_continue : Valeur booléenne pour désactiver le changement automatique des chansons, la valeur par défaut est fausse
player_title : Texte du titre, la valeur par défaut est "XSPF Jukebox
repeat : valeur booléenne pour définir la répétition, la valeur par défaut est fausse
repeat_playlist : valeur booléenne pour répéter la playlist, la valeur par défaut est vraie
shuffle : valeur booléenne pour définir Shuffle, la valeur par défaut est fausse
start_track : numéro de piste pour la piste de départ, la valeur par défaut est 1
statsurl : URL vers un script externe qui peut collecter des valeurs de poste. Peut collecter le jeu et l'annotation
timedisplay : valeur numérique pour montrer le compteur de temps; 0: Off, 1: All, 2: écoulé, 3: durée, 4: compte à rebours
trackNumber : valeur booléenne qui ajoute des numéros de piste aux étiquettes, la valeur par défaut est fausse
useId3 : valeur booléenne qui force l'utilisation de la balise ID3, la valeur par défaut est fausse
volume_level : Démarrage de niveau de volume pour cent, par défaut est 100

Format de playlist

Le Jukebox XSPF utilise le format de playlist XSPF ('SPIFF') ouvert. Un bref exemple suit:

 <?xml version="1.0" encoding="UTF-8"?>
<playlist version="0" xmlns="http://xspf.org/ns/0/">
    <trackList>
        <track>
            <location>url of .mp3 audio or .flv video file</location>
            <creator>artist or creator of track</creator>
            <title>title of track</title>
            <annotation>used in place of creator/title if both are absent</annotation>
            <duration>number of milliseconds of track duration</duration>
            <info>url of info link</info>
            <image>url of image, overwrites main_image parameter</image>
            <purchase>url of purchase link</purchase>
        </track>
    </trackList>
</playlist>

Remarque: seul `<location>` est requis

API JavaScript

Une interface JavaScript a été ajoutée au lecteur pour permettre un contrôle prolongé sur le juke-box. Cette fonctionnalité s'applique uniquement à la version Flash 8. Les fonctions disponibles sont:

playTrack() : Play / Pause la piste
stopTrack() : Arrêtez la piste
nextTrack() : Passez à la piste suivante
prevTrack() : revenez à la piste précédente
shuffleToggle() : tourner / désactiver le shuffle / désactivation
repeatToggle() : activer / désactiver la répétition
gotoTrack(track number) : jouez une piste spécifiée
addTrack(track id, location, title, creator, info url, purchase url, image, annotation) : Ajoutez une piste à la playlist

Pour contrôler le juke-box à l'aide de JavaScript, assurez-vous d'avoir un ID défini dans l'objet et des balises intégrées pour le script intégré. Pour appeler une fonction, utilisez le format:

window.document.xspfJukebox.playTrack();

Par exemple:

<a href="javascript:window.document.xspfJukebox.playTrack();">Click to Play </a>

Documentation de la peau

Le Jukebox XSPF utilise un format XML personnalisé pour spécifier l'apparence du joueur. Les fichiers Skin.xml sont dans le format suivant:

 <?xml version="1.0" encoding="UTF-8"?>
<skin version="0" xmlns="http://xsml.org/ns/0/">
    <name>skin name</name>
    <width>skin width</width>
    <height>skin height</height>
    <author>skin author</author>
    <email>author?s email</email>
    <website>author?s website</website>
    <comment>author?s comments</comment>
    <object>
           all skin objects reside between the <object> tags
    </object>
</skin>

Objets de peau

<background x="" y="" width="" height="" scale="" image="" shape="" border="" color="" borderColor="" alpha="" />
<image x="" y="" z="" width="" height="" image="" alpha="" url="" target="" hoverMessage="" />
<shape x="" y="" z="" width="" height="" shape="" border="" color="" borderColor="" alpha="" url="" target="" hoverMessage="" />
<text x="" y="" z="" size="" color="" font="" text="" border="" bold="" italic="" underline="" alpha="" url="" target="" hoverMessage="" />
<playlist x="" y="" z="" width="" height="" size="" color="" font="" selectedColor="" bold="" italic="" underline="" alpha="" hoverMessage="" />
<badge x="" y="" width="" height="" />

Objets de fonction

Tous les objets de fonction commencent par une balise et se distinguent par un attribut label . La plupart des étiquettes ont des attributs similaires, mais il existe de légères différences.

<object label="playButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="playpauseButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="stopButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="prevButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="fwdButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="shuffleButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="repeatButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="scrollButton" x="" y="" z="" width="" height="" scale="" image="" color="" bgColor="" alpha="" bgAlpha="" hoverMessage="" />
<object label="scrollupButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="scrolldownButton" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="startButton" x="" y="" z="" width="" height="" scale="" color="" alpha="" hoverMessage="" />
<object label="infoButton" x="" y="" z="" size="" color="" font="" text="" bold="" italic="" underline="" target="" hoverMessage="" />
<object label="purchaseButton" x="" y="" z="" size="" color="" font="" text="" bold="" italic="" underline="" target="" hoverMessage="" />
<object label="downloadButton" x="" y="" z="" size="" color="" font="" text="" bold="" italic="" underline="" target="" hoverMessage="" />
<object label="playDisplay" x="" y="" z="" width="" height="" scale="" color="" alpha="" hoverMessage="" />
<object label="imageDisplay" x="" y="" z="" width="" height="" scale="" color="" alpha="" hoverMessage="" />
<object label="videoDisplay" x="" y="" z="" width="" height="" scale="" alpha="" hoverMessage="" />
<object label="trackDisplay" x="" y="" z="" width="" size="" color="" font="" text="" align="" bold="" italic="" underline="" hoverMessage="" />
<object label="timeDisplay" x="" y="" z="" size="" color="" font="" text="" bold="" italic="" underline="" hoverMessage="" />
<object label="fulltimeDisplay" x="" y="" z="" size="" color="" font="" text="" bold="" italic="" underline="" hoverMessage="" />
<object label="volumeDisplay" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="timeBar" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />
<object label="loadBar" x="" y="" z="" width="" height="" scale="" image="" color="" alpha="" hoverMessage="" />

Étiquettes

playButton : un bouton de lecture, bascule entre le jeu et la pause
playpauseButton : un bouton de pause de jeu statique, bascule entre le jeu et la pause
stopButton : un bouton d'arrêt, arrête la piste
prevButton : un bouton précédent, modifie la piste précédente
fwdButton : un bouton avant, change vers la piste suivante
shuffleButton : un bouton shuffle, bascule / désactivé
repeatButton : un bouton de répétition, bascule / désactivé
scrollButton : un bouton de défilement avec fond, Scrolls Playlist
scrollupButton : une liste de lecture de flèche vers le haut
scrolldownButton : A Down Arrow, Scrolls Playlist vers le bas
startButton : un rectangle pour indiquer l'emplacement de clic pour démarrer le chargement ou jouer, définissez Alpha sur 0
infoButton : bouton texte pour suivre le lien d'informations actuel dans une liste de lecture
purchaseButton : Bouton texte pour suivre le lien d'achat actuel dans une liste de lecture
downloadButton : Bouton texte pour lier directement le lien vers le MP3 actuellement en lecture
playDisplay : affiche des images de piste actuelles
imageDisplay : affiche des images de piste actuelles
videoDisplay : affiche des pistes vidéo
trackDisplay : Affiches en lecture de piste
timeDisplay : affiche le temps de piste actuel dans un format standard 00:00, bascule entre le temps, la durée et le temps restant
fulltimeDisplay : affiche le temps de piste actuel au format complet 00: 00/00: 00, affiche le temps et la durée
volumeDisplay : affiche une barre de volume pour modifier le volume de la piste
timeBar : affiche le pourcentage de piste actuel sous forme de barre, cliquez pour scanner la piste
loadBar : affiche le pourcentage chargé pour la piste actuelle sous forme de barre

Attributs

x : Numéro: la valeur X ou le pourcentage pour placer un objet
y : Numéro: la valeur Y ou le pourcentage pour placer un objet
z : Numéro: la valeur Z, ou profondeur d'un objet.
width : numéro: la largeur d'un objet
height : numéro: la hauteur d'un objet
scale : Numéro: utilisé à la place de la largeur / hauteur. Échelle l'objet tout en conservant le rapport d'aspect par défaut. 1 = pas de mise à l'échelle
size : Numéro: Taille de police. La taille doit être précédée par A + pour Infobutton, Buyerbutton et DownloadButton. Ex: +15
image : URL: Chargez une image à la place du symbole par défaut
shape : rectangle / rectrouillé / cercle / triangle: dessine une forme pour un objet
border : Numéro: définit la largeur de la bordure d'une forme
color : Code hexadécimal: définit la couleur d'un objet. Ex: FF0088
borderColor : Code hexadécimal: définit la couleur de la bordure d'une forme
bgColor : Code hexagonal: définit la couleur de l'arrière-plan d'un objet
selectedColor : Code hexagonal: définit la couleur de la piste actuelle de la liste de lecture
font : Nom de la police: Définit la police du texte
text : texte: texte affiché
align : gauche / centre / droite: utilisé uniquement pour TrackDisplay. Aligne le texte
bold : booléen: définit le texte en gras sur / désactivation
italic : booléen: définit le texte en italique activé / désactivé
underline : booléen: définit le texte souligne / désactivé
alpha : pourcentage: définit le canal alpha d'objet
bgAlpha : pourcentage: définit le canal alpha de l'arrière-plan d'un objet
url : URL: permet à un objet de créer un lien vers une page Web
hoverMessage : Texte: message affiché sur la souris