IMBRIQUER (EMBEDDING) UN FICHIER VIDÉO - Lecteur WMP)

Voir aussi:

• Imbriquer (embedding) un fichier audio (pour WMP)
• Imbriquer (embedding) un fichier flash (swf) (pour toute application flash)
• Imbriquer (embedding) un lecteur Quicktime (mov, qtl, mp4)

Retourner à IMBRIQUER DES MÉDIAS SUR UNE PAGE WEB ...

Ici je vais montrer 2 solutions, les deux sont bonnes et valides.

La solution WMP basée sur la méthode Satay

Voici le code original qui fonctionne dans tous les fureteurs.

Comme exemple je vais utiliser une méta-fichier Windows Media - wvx or asx. Comme celui-ci est conçu pour fair du streaming, il se prète mieux à se fair imbriquer (embedding) que le fichier vidéo lui-même. La largeur et la hauteur indiquées sont compatibles avec les contrôles visible du lecteur. Malheureusement Firefox n'affiche pas les méta-données du fichier média.

NB: ce code est pour un document avec un doctype XHTML. Pour un doctype HTML ou aucun doctype du tout, TOUTES les balises qui sont fermées ici par />, DOIVENT être fermées seulement par >.

  
<object id="MediaPlayer" width="301" height="145" 
	data="video-file.wvx"  
	type="application/x-mplayer2" 
	title="Titire de cet object audio">
		<param name="filename" value="video-file.wvx" />
		<param name="height" value="384" />
		<param name="width" value="320" />
		<param name="autoStart" value="1" />
		<param name="autoPlay" value="1" />
		<param name="AnimationatStart" value="0" /> 
		<param name="showdisplay" value="1" /> 
		<param name="TransparentAtStart" value="1" />
		<param name="ShowControls" value="1" />
		<param name="ShowStatusBar" value="1" />
		<param name="bgcolor" value="#000000" />
		<param name="volume" value="100%" />
		<param name="loop" value="0" />
      <em>Description de l'object vid&eacute;o</em>
</object>

Veuillez noter ce petit fait saillant: normalement mettre les valeurs des paramètres à "true" ou "false" est équivalent à "1" ou "0"respectivement. En Firefox, pour une raison inconnue, ceci:

<param name="autoStart" value="0" />
<param name="autoPlay" value="0" />

fonctionne comme voulu (donc ni autostart ni autoplay) tandis que

<param name="autoStart" value="false" />
<param name="autoPlay" value="false" />

ne fonctionne pas, donc il va démarrer sans égard à la valeur utilisée. En fait cette même "logique" (ou manque de logique) semble s'appliquer à toutes les valeurs des paramètres booléens en Firefox, alors j'ai opté pour employer les valeurs numériques.

Il semble aussi qu'il est inutile de spécifier et autostart et autoplay, et que autostart tout seul pourrait être suffisant. En fin de compte, mettre les deux à la même valeur semble être la meilleur option. Autoplay semble être associé avec le lecteur Quicktime (donc sans rapport à WMP).

Un exemple d'un fichier vidéo streaming de basse fidélité (lo-fi). Le clip vidéo original est ici):

Dans l'exemple de plus haut on assume que le plugin nécessaire de WMP est bel et bien installé dans le fureteur. Ceci est tout un défi dans des fureteurs autre que IE, mais ça c'est un autre problème. Il existe un Windows Media Player pour le MAC aussi, alors les fichiers Windows Media ne sont pas à éviter. Ils sont excellents à un bitrate bas (moins de 128kbps) - alors ils font du streaming très bien par les techniques de pseudo-streaming décrites ailleurs.

La solution WMPObject

Cette solution est très facile à utiliser. Elle requiert du javascript afin que Windows Media Player soit actif et visible, ce qui semble raisonnable. Dans l'absence de javascript, un contenu alternatif est fourni, ce qui est hautement préférable en tout cas.

On inclut 2 scripts dans la section head de la page web: WMPObject.js et myWMPlayer.js. Le deux peuvent être téléchargés dans un fichier zip ici.

Dans le body de la page, à la place la place du fichier vidéo à afficher, on ouvre un <div id="my_video_id"> et on y place du contenu alterntif à afficher si javscript n'est pas disponible.

Tout de suite après la fermeture de ce div, on y place un autre script simple qui servira à insérer l'object WMP audio.

  
<div id="my_video_id">
   <p>ce contenu es affiché au lieu de l'objet WMP lui-même. 
   Ca peut être du texte, une image, n'importe quoi, tout ce qui
   s'applique.
   Il sera remplacé par l'object WMP si javascript est habilité.
   Ceci peut être placé dans un div avec largeur, hauteur et style.</p>
</div>

  <script type="text/javascript">
<!--
// ce script remplace l'image dans le 
// div id="my_video_id" de plus haut par l'object WMP
//  
// On fournit des valeurs pour: 
//          myplayerid,myfile,width,height,showcontrols,	
//          showdisplay,showstatusbar,autoplay,autostart 
// le lecteur audio complet a une largeur de 301 et une hauteur de 145 

// le  div id défini plus haut pour audio
   var myvideoid = "my_video_id"; 
   
   var myfile = "sample-video.wmv";
   var width = 320;
   var height = 384;
	 var showcontrols=1;
	 var showdisplay=1;
	 var showstatusbar=1;
	 var autoplay=1;
	 
// autostart doit avoir la même valeur que  autoplay
     var autostart=1; 

 	 myWMPlayer(myvideoid,myfile,width,height,showcontrols,
                showdisplay,showstatusbar,autoplay,autostart); 
// --> 
</script> 

Voici quelques exemples avec WMPObject. Le 1er exemple, pour vidéo, a été codé comme ça.

Un test spécial est disponible pour un fichier AVI aussi. Cela présente un autre problème non-résolu (ou pas complètement résolu) dans Opera 9.10, surtout pour Windows Vista.

Si vous avez deviné que c'est la même solution que pour faire jouer un vidéo dans un lecteur imbriqué (embedded) Windows Media Player, vous y gagnez!

NB: Ces scripts sont en modification quasi constante. SVP revoir ce site pour y trouver les dernières versions. Aussi veuillez m'informer de toute limitation ou erreur que vous rencontrez, que ce soit avec des systèmes d'exploitation différents, des fureteurs différents autre que ce que j'ai pu tester moi-même.

• Imbriquer (embedding) un fichier audio
• Imbriquer (embedding) un fichier flash (swf)

Retourner à IMBRIQUER DES MÉDIAS SUR UNE PAGE WEB ...

Pub