0

I created a web MP3 player, It works fine, it's just that I have to edit my script every time I add new songs on my webserver. I want the list to update automatically as I add more songs. My script basically looks like this:

<body>
    <audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg">

    </audio>
    <ul id="playlist">
        <li class="active"><a href="usb/music1.mp3">Music 1</a></li>
        <li><a href="usb/music2.mp3">Music 2</a></li>
        <li><a href="usb/music3.mp3">Music 3</a></li>
        <li><a href="usb/music4.mp3">Music 4</a></li>

    </ul>
</body>

My music files are all located at /www/usb I tried something like this:

<?php
...............
echo '
<body>
    <audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg">

    </audio>
    <ul id="playlist">';
exec('find /www/usb/ -name "*.mp3"',$list);
$x=0;
while($x<count($list)){   
if($list[$x]==$h[0]){
echo '<li class="active"><a href="$list[$x]">$list[$x]</a></li>';

$x++;
}
}
echo '
</ul>
</body>
</html>';
?>

But it gives me the following error: Fatal error: Maximum execution time of 30 seconds exceeded in /www/test2.php on line 64

My complete script:

<?php
echo '
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#playlist,audio{background:#666;width:400px;padding:20px;}
.active a{color:#5DB0E6;text-decoration:none;}
li a{color:#eeeedd;background:#333;padding:5px;display:block;}
li a:hover{text-decoration:none;}
</style>
    <script type="text/javascript" src="jquery-1.11.2.min.js"></script>
    <script type="text/javascript">
var audio;
var playlist;
var tracks;
var current;

$(document).ready(function() {
  init();
});
function init(){
    current = 0;
    audio = $("audio");
    playlist = $("#playlist");
    tracks = playlist.find("li a");
    len = tracks.length - 1;
    audio[0].volume = .10;
    audio[0].play();
    playlist.find("a").click(function(e){
        e.preventDefault();
        link = $(this);
        current = link.parent().index();
        run(link, audio[0]);
    });
    audio[0].addEventListener("ended",function(e){
        current++;
        if(current == len){
            current = 0;
            link = playlist.find("a")[0];
        }else{
            link = playlist.find("a")[current];    
        }
        run($(link),audio[0]);
    });
}
function run(link, player){
        player.src = link.attr("href");
        par = link.parent();
        par.addClass("active").siblings().removeClass("active");
        audio[0].load();
        audio[0].play();
}
</script>
</head>
<body>
    <audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg">

    </audio>
    <ul id="playlist">';
exec('find /www/usb/ -name "*.mp3"',$list);
$x=0;
while($x<count($list)){   
if($list[$x]==$h[0]){
echo '<li class="active"><a href="$list[$x]">$list[$x]</a></li>';

$x++;
}
}
echo '
</ul>
</body>
</html>';
?>

How do I solve that? Please note that I also want to be able to search in sub directories. Thank you.

UPDATE 1 I tried @RhapX suggestion but instead the shown result is like this, and whenever I click the music1.mp3 or music2.mp3, it doesn't play because the url goes to http://192.168.1.1/music1.mp3 and http://192.168.1.1/music2.mp3 where the actual location is at http://192.168.1.1/usb/music1.mp3 enter image description here

Don
  • 235
  • 2
  • 4
  • 16
  • possible duplicate of [PHP get file listing including sub directories](http://stackoverflow.com/questions/12109042/php-get-file-listing-including-sub-directories) – kittykittybangbang Jan 23 '15 at 02:29
  • 1
    You're incrementing `$x` inside the `if` block. if the condition is false `$x` is never incremented and the loop becomes infinite –  Jan 23 '15 at 02:31
  • 1
    Why aren't you using `glob()` or `scandir()` rather than using a system utility? –  Jan 23 '15 at 02:33

1 Answers1

0

The following function allows for you to scan a main directory and all of its subdirectories and only list the results that have allowable file types as seen in the $allowedExtensions array.

<?php
function getFiles($path = '/www/usb') {

    // Open the path set
    if ($handle = opendir($path)) {

        // Loop through each file in the directory
        while ( false !== ($file = readdir($handle)) ) {

            // Remove the . and .. directories
            if ( $file != "." && $file != ".." ) {

                // Check to see if the file is a directory
                if( is_dir($path . '/' . $file) ) {

                    // The file is a directory, therefore run a dir check again
                    getFiles($path . '/' . $file);

                }

                // Get the information about the file
                $fileInfo = pathinfo($file);

                // Set multiple extension types that are allowed
                $allowedExtensions = array('mp3', 'wav', 'ogg', 'flac');

                // Check to ensure the file is allowed before returning the results
                if( in_array($fileInfo['extension'], $allowedExtensions) ) {
                    echo '<li class="active"><a href="' . $path . '/' . $file . '">' . $file . '</a></li>';
                }

            }
        }

        // Close the handle
        closedir($handle);
    }
} 
?>

Use by calling the function where you want the list to display

<?php getFiles(); ?>

You can change the root path that you want to scan by passing it to the function.

Example: <?php getFiles('/www/music'); ?>

This will loop through each file in your directory and strip out the . and .. files that may exist, leaving only your music files.

As Hobo Sapien noted, your loop becomes infinite upon a FALSE return, which would likely be the reason for your exhausted execution time issue.

By using this simple script, you are able to pull each file within the directory/subdirectories, regardless of how it is named without putting the script into an infinite loop.

RhapX
  • 1,663
  • 2
  • 10
  • 17