<< Retour au sommaire

 

Le lecteur FLASH

 

 

 

Le sommaire :

1.      Introduction.

2.      Téléchargement du lecteur.

3.      Le code XHTML du lecteur.

4.      Un exemple en pure XHTML.

5.      Élaboration d’un Juke-Box vidéo, mise en application :

5.1  Présentation,

5.2  Découverte de la récursivité,

5.3  Le schéma de Clips-Box, Exécuter le code du lecteur en PHP,

5.4  Le code des pages,

5.5  Test & téléchargement.

 

 

Introduction

 

Le FLASH est une technique en ligne qui permet d’afficher un lecteur vidéo dans une page WEB afin de lire un fichier au format « FLV ».

 

Le format « FLV » est donc un fichier de type vidéo !

Avec certains logiciels tels que « FLV-Converter », vous pouvez très facilement créer un fichier FLV depuis des vidéos de formats plus classiques, tels que les formats « MPG », « AVI », « WMV » etc.

 

Le principe global de la lecture d’une vidéo en ligne est relativement simple !

Vous placez un lecteur « FLV » en ligne dans votre site, puis vous copiez la vidéo au format FLV et ensuite, vous introduisez le code du lecteur dans une page WEB, celle qui affichera la vidéo.

Le code de la mise en route du lecteur est du XHTML.

Le lecteur que je vais vous présenter ici dans ce manuel est le lecteur FLV-PLAYER-VIDEO.

 

Téléchargement

 

Vous devez bien sûr commencer par télécharger le lecteur !

 

Télécharger FLV-PLAYER-VIDEO >>

 

Le fichier que vous allez télécharger est compressé en archive « rar », alors, décompressez-le afin d’extraire le dossier du lecteur.

 

Dans ce dossier, vous trouverez les fichiers suivants :

1.      FLVPlayer.swf

C’est le lecteur.

2.      Skin.swf

C’est un module complémentaire qui accompagne le lecteur.

3.      index.html

C’est une page WEB « exemple » qui affiche le lecteur.

4.      video.flv

C’est une mini vidéo « exemple » qui est joué par la page « index.html ».

5.      Le code XHTML du lecteur FLV-Player.txt

C’est un fichier de type texte qui contient le code XHTML du lecteur, c’est le code qu’il faudra insérer dans vos pages WEB…

 


Le code XHTML du lecteur

 

Les pages qui auront le rôle d’afficher une vidéo devront contenir le code XHTML suivant :

 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="342" height="291" id="FLVPlayer">

  <param name="movie" value="FLVPlayer.swf" />

  <param name="salign" value="lt" />

  <param name="quality" value="high" />

  <param name="scale" value="noscale" />

  <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Skin&streamName=test&autoPlay=false&autoRewind=false" />

  <embed src="FLVPlayer.swf" flashvars="&MM_ComponentVersion=1&skinName=Skin&streamName=test&autoPlay=false&autoRewind=false" quality="high" scale="noscale" width="342" height="291" name="FLVPlayer" salign="LT" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>

 

Dans ce code, vous avez les informations suivantes :

test&autoPlay=false

 

Test a été placé ici pour représenter le nom de votre fichier vidéo à jouer.

Bien sûr, il faudra remplacer « test » par le nom de votre vidéo !

Attention toutefois à ne pas écrire l’extension « FLV », ok ?

Quant à l’attribut « autoPlay” qui suit le nom du fichier vidéo et séparé par un « et commercial », vous devez lui affecter la propriété « false » si vous souhaitez que le lecteur s’affiche mais ne démarre pas la vidéo, par contre, pour que la vidéo démarre automatiquement, la propriété a spécifier est « true ».

 

A titre d’exemple, pour afficher le lecteur en démarrant automatiquement la lecture du fichier « Voyage-au-centre-de-la-terre.flv » :

Voyage-au-centre-de-la-terre&AutoPlay=true

 

Un autre exemple, pour afficher le lecteur avec le documentaire

« Le-mirage »2000.flv » mais sans le démarrer :

Le-mirage-2000&AutoPlay=false

 

Je rappelle que « true » signifie « vrai » et que « false » signifie « faux ».

 

Remarque :

Attention, le nom du fichier vidéo doit répondre aux mêmes normes que les autres fichiers du NET, donc pas de caractères accentués et pas d’espace !

 

Dans le code, vous avez également les attributs « width » et « height » qui permettent de définir les dimensions de la largeur et de la hauteur du lecteur à l’écran. Les valeurs à leur affecter doivent être un nombre qui désigne des pixels.

 


Un exemple en pure XHTML

 

Dans ce chapitre, nous allons juste tenter d’avoir un regard global sur ce que l’on vient d’étudier…

 

Voici donc un exemple.

 

La page index.php propose l’exécution de 2 pages :

  1. la page autoplay-faux.php , qui ouvre le lecteur sans démarrer la vidéo intitulée « video.flv ». c’et donc à l’utilisateur de valider ou de cliquer sur le premier bouton du lecteur pour que la vidéo débute.
  2. La page autoplay-vrai.php, qui affiche le lecteur en débutant automatiquement la lecture de la vidéo.

 

Le code de l’index :

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>Page d'accueil</title>

</head>

<body>

<h1>Le code XHTML du lecteur FLV-Player sans PHP</h1>

<table border="1">

<tr><td>

<a href="autoplay-faux.php">

Exécuter le lecteur FLV-Player sans déclenchement de lecture &gt;&gt;

</a></td></tr>

<tr><td>

<a href="autoplay-vrai.php">

Exécuter le lecteur FLV-Player avec déclenchement de lecture &gt;&gt;

</a></td></tr>

</table>

</body>

</html>

 

Le code de autoplay-faux :

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>Lecteur FLV-Player</title>

</head>

<body>

<p><em>

Dans cette page, le lecteur FLV-Player est naturellement exécuté en XHTML et l'attribut<strong>autoplay</strong> est à "faux".<br />

Vous devez donc démarrer vous-mêmes la vidéo !

</em></p>

<h1>Vidéo</h1>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="342" height="291" id="FLVPlayer">

  <param name="movie" value="FLVPlayer.swf" />

  <param name="salign" value="lt" />

  <param name="quality" value="high" />

  <param name="scale" value="noscale" />

  <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Skin&streamName=LaVideo&autoPlay=false&autoRewind=false" />

  <embed src="FLVPlayer.swf" flashvars="&MM_ComponentVersion=1&skinName=Skin&streamName=video&autoPlay=false&autoRewind=false" quality="high" scale="noscale" width="342" height="291" name="FLVPlayer" salign="LT" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>

<hr />

</body>

</html>

 

Le code de autoplay-vrai :

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>Lecteur FLV-Player</title>

</head>

<body>

<p><em>

Dans cette page, le lecteur FLV-Player est naturellement exécuté en XHTML et l'attribut<strong>autoplay</strong> est à "vrai".<br />

La vidéo démarre donc automatiquement !

</em></p>

<h1>Vidéo</h1>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="342" height="291" id="FLVPlayer">

  <param name="movie" value="FLVPlayer.swf" />

  <param name="salign" value="lt" />

  <param name="quality" value="high" />

  <param name="scale" value="noscale" />

  <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Skin&streamName=LaVideo&autoPlay=true&autoRewind=false" />

  <embed src="FLVPlayer.swf" flashvars="&MM_ComponentVersion=1&skinName=Skin&streamName=video&autoPlay=false&autoRewind=false" quality="high" scale="noscale" width="342" height="291" name="FLVPlayer" salign="LT" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>

<hr />

</body>

</html>

 

Pour essayer les 2 pages en ligne ?

 

 

Pour télécharger l’exemple ?


Exécuter le code du lecteur en PHP

 

Vous l’avez compris, on peut placer le code XHTML du lecteur dans une instruction PHP, et cette instruction est « echo ».

 

Mais comme le code du lecteur contient énormément de guillemets, l’instruction « echo » devra utiliser des apostrophes pour encadrer le tout !

 

Je vous propose maintenant de reprendre l’exemple du chapitre précédent et d’y intégrer un « echo » pour exécuter le flash…

(Je ne vous remets pas l’intégralité du code !)

 

Voici uniquement la modification de la page AutoPlay-faux.php :

 

<h1>Vidéo</h1>

<!-- exécution du code du lecteur dans le PHP -->

<?php

echo '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="342" height="291" id="FLVPlayer">

  <param name="movie" value="FLVPlayer.swf" />

  <param name="salign" value="lt" />

  <param name="quality" value="high" />

  <param name="scale" value="noscale" />

  <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Skin&streamName=LaVideo&autoPlay=false&autoRewind=false" />

  <embed src="FLVPlayer.swf" flashvars="&MM_ComponentVersion=1&skinName=Skin&streamName=video&autoPlay=false&autoRewind=false" quality="high" scale="noscale" width="342" height="291" name="FLVPlayer" salign="LT" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>'; ?>

<!-- Fin du paragraphe PHP -->

<hr />

 

Pour essayer en ligne ?

 

Pour télécharger le tout une fois modifié ?

 


L’élaboration d’un JUKEBOX vidéo

 

Présentation

 

Bon, maintenant passons aux choses sérieuses…

Puisque nous savons exécuter le code du lecteur à partir de l’instruction PHP « echo », nous pouvons enfin nous amuser !

 

Ensembles, nous allons élaborer un JUKEBOX vidéo que je vais baptiser « Clips-Box ».

 

« Clips-Box » va utiliser le principe de la récursivité.

En programmation, « la récursivité », c’est un morceau de programme qui s’exécute lui-même…

 

Dans « Clips-Box », on ne va avoir qu’une seule page comme interface utilisateurs, c’est la page « index.php ».

 

Cette page va utiliser la « récursivité », c’est-à-dire qu’elle va parfois s’appeler elle-même, mais pourquoi ?

 

Vous savez bien qu’une page peut en appeler une autre en lui passant un certain nombre de paramètres, soit par la méthode « get », soit par la méthode « post ».

Eh bien, une page peut très bien s’appeler elle-même en se passant des paramètres afin de lui indiquer des précisions sur le nouvel état qu’elle doit prendre !

Du coup, la page réexécutée apparaît sous une nouvelle forme…

 

Avant de commencer l’élaboration de « Clips-Box », voulez-vous que l’on illustre l’introduction à la récursivité ?

Ok, j’accepte…

 


Découverte de la récursivité

 

Je vous propose de réaliser une page qui souhaite la bienvenue à l’utilisateur, un petit texte, c’est tout.

Enfin presque, puisque nous allons aussi afficher un lien qui permet de relancer la page.

Puis, lors de la seconde ouverture de la page, en plus du texte, nous afficherons une image, une plume de paon !

 

Première difficulté, la page doit donc savoir qu’elle a déjà été ouverte au moins une fois.

 

On y va ?

La page, on l’appelle index.php, et on lui colle le code minimal XHTML :

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<title> mon titre </title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>

<body>

 

</body>

</html>

 

Désormais, je ne afficherai que les modifications de la page, je ne la remets plus dans son intégralité.

 

Alors commençons par mettre un titre à cette page…

<title>Accueil</title>

 

Dans le <body>, saisissons un petit texte instructif à l’intérieur d’un paragraphe.

 

<p>

Eh, salut toi !<br />

ça va ?<br />

Merci d'avoir fais l'effort d'être venus sur cette page minable...

</p>

 

En dessous du texte, ça vous dirait de créer le lien ?

Eh bien, comme la page s’intitule index.php, nous n’avons qu’à faire un lien qui pointe sur index.php !

Ah oui, mais la page à son ouverture, comment va-t-elle savoir si elle est ouverte pour la seconde fois ?

Bon, j’ai une idée !

 

Nous n’avons qu’à utiliser une variable de session comme témoin !

Le contenu de cette variable ne nous intéressera pas, seule son existence aura un sens.

 

Lors du premier chargement de la page, la variable n’existera pas, alors nous n’afficherons pas l’image et par contre, on créera la variable.

Du coup, lors des chargements suivants, la page aura une variable qui existera belle et bien, alors, conséquence, nous afficherons l’image.

 

Plaçons immédiatement une image dans le dossier de travail et intitulons là « plume.jpg ».

 

Avant notre paragraphe de « bienvenue », dans le <body>, créons le lien hypertexte qui pointe sur lui-même, enfin, je veux dire sur la page qui le contient, « index.php ».

 

<p>

<a href="index.php">

Recharger la page !

</a></p> 

 

Dans l’entête du code de notre page, comme nous allons utiliser une variable de session, nous devons penser à le spécifier par l’intermédiaire de la fonction « SESSION_START ».

Voici le code :

 

<?php

// Déclaration de l'emploi des variables de session

SESSION_START (); ?>

 

Dans le <body>, juste après le texte de « bienvenue », nous pouvons maintenant réaliser le traitement concernant l’affichage de l’image.

 

2 cas de figure se présenteront alors :

Premier cas de figure, la variable de session intitulée « ok » n’existe pas, nous la créons, mais nous n’affichons pas l’image.

Deuxième cas de figure, la variable « ok » existe, on affiche l’image.

 

Au fait, la fonction PHP qui permet de vérifier l’existence d’une variable de session est « isset ».

 

Voici le code :

 

<?php

if (isset($_SESSION["ok"]))

{ // La variable existe, affichage de l'image

 ?> <p>

 <img src="plume.jpg" alt="une plume de paon" border="2" />

 </p> <? }

else

{ // La variable n'existe pas, il faut la créer

 $_SESSION["ok"] = ""; } ?>

 


Voici maintenant le code au complet après les modifications  que l’on vient d’y apporter.

 

<?php

// Déclaration de l'emploi des variables de session

SESSION_START (); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<title>Accueil</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>

<body>

<p>

<a href="index.php">

Recharger la page !

</a></p>

<p>

Eh, salut toi !<br />

ça va ?<br />

Merci d'avoir fais l'effort d'être venus sur cette page minable...

</p>

<?php

if (isset($_SESSION["ok"]))

{ // La variable existe, affichage de l'image

 ?> <p>

 <img src="plume.jpg" alt="une plume de paon" border="2" />

 </p> <? }

else

{ // La variable n'existe pas, il faut la créer

 $_SESSION["ok"] = ""; } ?>

</body>

</html>

 

Pour essayer la page en ligne ?

 

Pour télécharger l’exercice ?


Le schéma de Clips-Box

 

Nous devons maintenant analyser la structure de « clips-box »…

 

Une page principale, index.php.

(Cette page sera l’unique interface visible par l’utilisateur.)

 

Nous avons besoin d’un fichier de fonctions, appelons-le « fonctions.inc ».

 

La première fonction s’intitulera « ControleInitialisation », elle devra donc vérifier l’existence de la variable de session :

$_SESSION["départ"]

Si cette variable n’existe pas, c’est qu’il s’agit du premier chargement de « Clips-Box », la fonction dans ce cas retourne 0.

Sinon, si la variable existe, la fonction retourne 1.

 

Concernant l’aspect de la page index.php, donc de « clips-Box », la page est divisée en 2 calques, 2 divisions.

 

Le premier calque occupe le Thiers supérieur de la page, il affiche la liste des vidéos présentent dans le dossier intitulé « videos ».

Dès lors qu’au-moins une vidéo a été exécutée, un bouton intitulé « Stop » s’affiche au-dessus de la liste.

Il permet d’arrêter l’exécution de la vidéo et de réinitialiser

« Clips-Box » à 0, comme s’il s’agissait de son premier chargement.

 

Le deuxième calque quant à lui, lors du premier chargement de

« Clips-Box », affiche un message d’aide. Ensuite, dès lors que l’utilisateur exécute une vidéo, le message disparaît pour laisser la place au lecteur FLV-Player-Video.

Toutefois, la validation du bouton « Stop » fera réapparaître le message d’aide à la place du lecteur…

 

Lorsque « Clips-Box » est chargé pour la première fois, ou qu’il est réinitialisé par la validation du bouton « Stop », un son de basse est joué en boucle.

Par contre, lorsqu’une vidéo est lancée, le son de basse est arrêté et un son de lancement est joué avant l’exécution de la vidéo.

 

Concrètement

 

Concrètement !

Eh bien, pour commencer, lorsque le Webmaster voudra ajouter une vidéo à « Clips-Box », il devra copier la vidéo dans le dossier intitulé « videos ».

Dans ce dossier, dans le fichier texte intitulé « liste.txt », il devra rajouter une ligne d’identification de la nouvelle vidéo.

Cette ligne est composée de 3 données :

1.      Le nom du fichier sans son extension,

2.      L’interprète,

3.      Le titre.

 

Ces 3 données doivent être séparées par un point virgule, ce caractère est dit « séparateur ».

Ce petit fichier texte est dit « fichier de données ».

 

3, 2, 1, go !

C’est parti, la page index.php est chargée !

La vérification de la variable de session indique que la page est chargée pour la première fois. En effet, la variable $_SESSION["départ"] n’existe pas, mais elle est créée.

Voici les conséquences :

1.      Le son « basse.wav » est joué en boucle.

2.      Dans le premier calque, le bouton « Stop » n’est pas affiché.

3.      Toujours dans le premier calque, grâce à une extraction du contenu de liste.txt, les vidéos sont affichées sous forme de liens dans un tableau.

4.      Dans le deuxième calque, le message d’aide est affiché.

 

Mais soudain, l’utilisateur clique sur l’un des liens, il veut se distraire !

Il faut donc jouer la vidéo correspondante au lien sur lequel il a cliqué.

C’est simple, le lien qui relance la page expédie en paramètres le nom de la vidéo, l’interprète et le titre. Il s’agit donc d’une expédition de données par le biais de la méthode « get ».

 

La page est donc rechargée, mais cette fois, la variable $_SESSION["départ"] existe.

 

Conséquences :

  1. Le son « voice.wav » est joué.
  2. Dans le premier calque, le bouton « Stop » est affiché. 
  3. Toujours dans le premier calque, la liste des vidéos est affichée à nouveau.
  4. Dans le deuxième calque, l’interprète et le titre de la vidéo à sélectionnée sont affichées.
  5. Toujours dans le deuxième calque, le lecteur est affiché et la lecture de la vidéo débute.

 

Quelques précisions

 

Quant au rôle du bouton « Stop », concrètement, lorsqu’il est sollicité, le fichier script appelé, stop.php, détruit la variable de session $_SESSION[«départ»] par l’intermédiaire de la fonction « unregister », puis réexécute index.php qui est chargée comme s’il s’agissait de sa première apparition…

 

Au niveau de l’organisation des fichiers, les 2 fichiers audio sont placés dans le dossier « audio ».

Le fichier de styles CSS intitulé « comp1111.css » est placé dans le dossier « images ».

Le texte d’aide affiche une image, cette image s’intitule « note.jpg », elle est stockée dans le dossier « images ».

Les vidéos ainsi que le petit fichier texte liste.txt sont placés dans le dossier « videos ».

Le contenu du sommaire, c’est-à-dire le contenu du premier calque, se trouve dans le fichier texte « cathalogue.txt », il est dans le dossier « pages ».

Le message d’aide, celui qui est affiché dans le deuxième calque lorsque la page vient d’être réinitialisée ou chargée pour la première fois, se trouve dans le fichier « accueil.txt » dans le dossier « pages ».

Les fonctions sont écrites dans le fichier externe de fonctions intitulé « fonctions.inc », et il est dans la racine du dossier principal.

On vient de le dire, le traitement de l’activation du bouton « Stop » est dans le fichier script « Stop.php ».

Le fichier index.php, le lecteur FLVPlayer.swf  et son module complémentaire Skin.swf sont dans la racine du dossier principal.

 


Le code des pages

 

La page index.php

 

<?php

// insertion des fonctions PHP

include ("fonctions.inc"); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<meta name="GENERATOR" content="Microsoft FrontPage 5.0">

<meta name="ProgId" content="FrontPage.Editor.Document">

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>Super Clips-Box</title>

<?php

// vérifie s'il s'agit du démarrage de clips-box

if (ControleInitialisation()==0)

{ // Exécution du son de démarrage

?> <bgsound src="audio/basse.wav" loop="infinite" /> <? }

else

{ ?> <bgsound src="audio/voice.wav" /> <? } ?>

<!--mstheme--><link rel="stylesheet" href="images/comp1111.css">

<meta name="Microsoft Theme" content="compass 1111">

</head>

<body>

<div class="sommaire">

<?PHP

// affichage du sommaire

require ("pages/cathalogue.txt"); ?>

</div>

<div class="page">

<?php

// Vérifie s'il s'agit d'une initialisation

if (ControleInitialisation ()==0)

{ // Il s'agit d'une initialisation

// affichage du texte d'accueil

  require ("pages/accueil.txt");

  // Déclaration de la variable de session $départ

  $_SESSION["départ"] = 1; } 

else

{ // Il ne s'agit pas d'une initialisation

  // Affichage du lecteur et de la vidéo sélectionnée

AfficherLecteur (); } ?>

</div>

</body>

</html>

 


Le fichier des fonctions intitulé fonctions.inc :

 

<?php

// Déclare l'utilisation de variables de SESSION

SESSION_START ();

 

// Fonction qui vérifie s'il s'agit du démarrage de Clips-Box

function ControleInitialisation ()

{ if (isset($_SESSION["départ"]))

  { return 1; }

  else

  { return 0; } }

 

function AfficherClips () {

$fichier = file("videos/liste.txt");

for ($i=0;$i<count($fichier);$i=$i+1)

{ $clip = explode (";",$fichier[$i]);

echo "<tr><td>"; ?>

<a href="index.php?NomClip=<? echo $clip[0]; ?>&amp;InterpreteClip=<? echo $clip[1]; ?>&amp;TitreClip=<? echo $clip[2]; ?>"><? echo $clip[1]; ?>

</a></td><td>

<? echo $clip[2]; ?>

</td></tr>

<? }}

 

// Affichage du lecteur flv-player

function AfficherLecteur () {

// récupération des données du clip à jouer

extract ($_GET,EXTR_OVERWRITE); ?>

<!-- affichage d'un tableau d'entête -->

<table border="2">

<caption>La sélection</caption>

<tr><td>

Auteur : <? echo $InterpreteClip; ?><br />

Titre : <? echo $TitreClip; ?>

</td></tr></table>

<hr />

<?php

// Ajout du chemin de destination du clip à jouer

$NomClip = "videos/".$NomClip;

echo '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="342" height="291" id="FLVPlayer">

  <param name="movie" value="FLVPlayer.swf" />

  <param name="salign" value="lt" />

  <param name="quality" value="high" />

  <param name="scale" value="noscale" />

  <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Skin&streamName='.$NomClip.'&autoPlay=true&autoRewind=false" />

  <embed src="FLVPlayer.swf" flashvars="&MM_ComponentVersion=1&skinName=Skin&streamName=video&autoPlay=false&autoRewind=false" quality="high" scale="noscale" width="342" height="291" name="FLVPlayer" salign="LT" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>

'; }

 

// fin du fichier

?>

 


Le fichier accueil.txt :

 

<h1>Présentation du super clips-Box</h1>

<hr />

<p>

Bonjour !<br />

Dans le sommaire, sont affichées les vidéos présentes dans Clips-Box.<br />

Pour visualiser l'une des vidéos, il vous suffit de valider son lien.<br />

Sa lecture sera automatiquement déclenchée.<br />

Durant la lecture, les boutons du lecteur vous seront accessibles.<br />

Toutefois, l'unique bouton du sommaire vous permet d'arrêter la lecture, il s'intitule "Stop".

</p><p>

à bientôt !</p>

<hr />

<p>

<img src="images/note.jpg" alt="une note de musique" border="1" />

</p>

 

Le fichier cathalogue.txt :

 

<table border="2">

<caption>Les vidéos</caption>

<!-- vérifie s'il faut afficher le bouton "Stop" -->

<?php

if (ControleInitialisation()==1)

{ // Il ne s'agit pas d'une initialisation, il faut afficher le bouton "Stop"

?> <tr><th colspan="2">

<form action="stop.php">

<input type="submit" value="Stop !" accesskey="s" />

</form></th></tr> <? } ?>

<tr><th>Interprètes</th><th>Titres</th><tr>

<?php AfficherClips (); ?>

</table>

 

Le fichier script stop.php :

 

<?php

// réinitialisation de Clips-Box

SESSION_START ();

SESSION_UNSET ();

header ("location:index.php"); ?>

 


Test & téléchargement

 

Pour essayer le résultat en ligne ?

 

Pour votre site, téléchargez un modèle vierge de Clips-Box >>

 

Philippe BOULANGER