Hello, I am new to web development and PHP/JS. I am currently using JWPlayer to show video on our church website using an xml playlist and all is working fine but it is rather cumbersome to upload new videos/Mp3 files. Each time we want to add a new video or audio we have to upload it to the server and change the xml playlist file. This works "OK" but i would like to change it so that it is more dynamic. What I would like to do is have PHP to read a folder and generate a list or table of the files and then the user would click on the one they want to listen to. I can already read the folder contents and put the contents in a table however when I put the onClick event tag in for the table i start getting errors. No particular error definition, it just says unexpected "" on line whatever and when I look at that line it is empty. When i take out the event tag everything displays ok but of course when I click in the file nothing happens.

Basically what I want to be able to do is:

upload a file to the server and have it update and play on the website without having to modify a playlist xml file. make it more dynamic.


Any suggestions on how i should implement this.

My PHP code is below..

<?php



$sermonDirectory = opendir("Sermons");

// gets each entry in the directory

while($entryName = readdir($sermonDirectory)) {
	$dirArray[] = $entryName;
}

//close the directory
closedir($sermonDirectory);
//Sort the Array
sort($dirArray);

//count the elements
$count = count($dirArray);

//Start the list
printf ("<ul>\n");


for($index = 0; $index < $count; $index++)
{
$ext = pathinfo($dirArray[$index], PATHINFO_EXTENSION);
if($dirArray[$index] !='.' && $dirArray[$index]!='..' && $ext!="xml")
{
printf ("<li><a href='#' onclick='jwplayer().load('$dirArray[$index]')'>\n");
printf ("$dirArray[$index]");
printf ("</a></li>\n");

}
}
printf ("</ul>\n");




?>

ok, say we have a directory called media. Let's put all the media in this directory. For the sake of this example we have flv, mp4 videos inside this directory. I am not sure if we can play mp3 with the same player for video. I have not tested this script, but if you can post your progress, I can probably help you further.

<!-- below is our target jwplayer -->
<script type='text/javascript' src='player/jwplayer.js'></script>
<div id="container"></div>
<script type="text/javascript">
  jwplayer("container").setup({
    autostart: true,
    flashplayer: "player/player.swf",
    height: 370,
    width: 720
  });
</script>
<?php
//lets create a simple function to take care of the files
function dirVideo($dir) {
$d = dir($dir); 
while (false!== ($file = $d->read())) 
{
$extension = substr($file, strrpos($file, '.')); 
if(($extension == ".flv") || ($extension ==".mp4"))
$videos[$file] = $file; 
}
$d->close(); 
asort($videos); 
return $videos; 
}

//we are done with the simple function, lets define our directory

$video_loc = "media"; //this is the location of the uploaded video
//put them in ul
echo "<ul>";
//lets use the simple function we have created above
$array = dirVideo($video_loc);
if($array !=null){
    foreach ($array as $key => $video) 
    {
// we need the filename without the extension for our link.
$link_name = substr($video, 0 , -4);
?>
<li>
<a href="#" onclick="jwplayer().load('<?=$key?>')"><?=$link_name?></a>
</li>

<?}}
else{
	echo "Video directory! is empty";
} 


?>

Warning! the above script will not read file with this type of file name mysummer.vacation.video.flv . The reason is that the script will pick up the first dot, making the file extension as .vacation.

That's should work for you. Just style the <ul> to arranged the $link_name.

i just want to add, if for some reason you need to know the count of media with specific extensions, then following codes can be use.

$flvcount = count(glob("".$video_loc. "*.flv"));
$mp4count = count(glob("".$video_loc. "*.mp4"));
echo $flvcount; 
echo $mp4count;

Just echo $flvcount to display how many flv inside the directory media.

commented: Very well written respnses and they work very well +0

This works very well. I had to change a few lines just to match folders for my server but it works like I wanted it to. Now I just need to make it look better. Maybe use a table instead of a list. Thank you so much this is great.

Hi,
Have you heard of Simple XML? It is nice way to deal with XML
Using SimpleXML, File Upload and Little HTML is enough to make simple GUI for task like the attached image. You can add DB support but it can be done without any database interaction.

Thank you, I will have to look in to that.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.