[vlc-devel] integration of VLC in a web page

Wed Nov 25 23:24:33 CET 2009

Hi there.
I try to integrate VLC in a web page (on local server) to manage a 
simple video tool.

It works for a simple try, but i can't make working a playlist of more 
than 1 media, and cannot make playing mp3 and jpg.
VLC knows how to show images and play mp3, i don't understand why i 
can't make it working.

In the same way, when i add 2 or 3 medias, only the first is read, and 
the player stops after the first. If i try to get the number of medias 
in the playlist, all i right.

Please Help !
Find below a quick html sample.
What am i doing wrong ?
Thanks...

<html>
<head><title>Demo of VLC mozilla plugin</title></head>

<body>

<h1>Demo of VLC mozilla plugin - Example 1</h1>

<embed type="application/x-vlc-plugin" id="video1" autoplay="no" 
loop="yes" width="400" height="300" />
<br />

<a 
href="javascript:document.getElementById('video1').playlist.add('http://192.168.1.200/izi-eye/flux/fichiers/1/_racine_/mama.mp3');undefined">add</a>
<a 
href="javascript:document.getElementById('video1').playlist.add('http://192.168.1.200/izi-eye/flux/fichiers/1/_racine_/btwin.avi');undefined">add</a>
<a 
href="javascript:document.getElementById('video1').playlist.add('http://192.168.1.200/izi-eye/flux/fichiers/1/_racine_/btwin2.avi');undefined">add</a>
<a 
href="javascript:document.getElementById('video1').playlist.add('http://192.168.1.200/izi-eye/flux/fichiers/1/_racine_/coucher.jpg');undefined">add</a>
<a href="javascript:;" 
onclick='document.getElementById("video1").playlist.play()'>Play video1</a>
<a href="javascript:;" 
onclick='document.getElementById("video1").playlist.togglePause()'>Pause 
video1</a>
<a href="javascript:;" 
onclick='document.getElementById("video1").playlist.stop()'>Stop video1</a>
<a href="javascript:;" 
onclick='document.getElementById("video1").video.toggleFullscreen()'>Fullscreen</a>
<a href="javascript:;" 
onclick='document.getElementById("video1").playlist.clear()'>clear</a>

<br />
<a href="javascript:go();undefined">go</>

<script language="javascript">
function go() {
    po = document.getElementById('video1');

po.playlist.add('http://192.168.1.200/izi-eye/flux/fichiers/1/_racine_/btwin.avi');

po.playlist.add('http://192.168.1.200/izi-eye/flux/fichiers/1/_racine_/btwin2.avi');
    alert(po.playlist.itemCount);
    po.playlist.play();
    comp = setTimeout("fs()", 2000);
    //po.video.toggleFullscreen();
}
window.onload = go;

function fs() {
    po = document.getElementById('video1');
    po.video.toggleFullscreen();
    clearTimeout(comp);
}
</script>

</body>
</html>