Search code examples
phphtmlmp3media-player

Setting a Dynamic Audio Playlist


I'm using an HTML5 audio player (Speakker). I've created a function to dynamically create a playlist, but I'm not sure how to implement the playlist once I've created it. This seems like the sort of thing that someone with more experience might just take for granted. I hope that's the case.

Create the playlist. Check.

    <?php $playlist= "{\"playlist\": [";?>
    <?php foreach ($items as $item){
        $titlemetadata= metadata($item, array('Dublin Core', 'Title'));
            foreach($item->Files as $file) {
                // print_r($file);
                $sourcemetadata= metadata($file, 'uri');
                $imagemetadata= metadata($file, 'thumbnail_uri');
                if (strpos($file["filename"], 'mp3') !== false) {
                    $playlist .=
                    "\"0\": {\"src\":\"$sourcemetadata\", \"type\":\"audio/mp3\"}, 
                    \"config\": 
                    {\"title\": \"$titlemetadata\",
                    \"poster\": \"$imagemetadata\"}";
                }
            }       
    }?>
    <?php $playlist .= "]}";?>
    <?php echo $playlist;?>

Implement the playlist? Nope.

<audio class="projekktor speakker dark"> <source src= ??THE PLAYLIST?? type="application/json"/> </audio>


Solution

  • I got it worked out. Here's a solution:

    <?php $collections=get_records("collection", array("public"=>"true","featured"=>"true"));
      $current_collection=end($collections);
      $items=get_records("item", array("collection"=>$current_collection));
    
      $playlist= "[";
      foreach ($items as $item){
        $titlemetadata= metadata($item, array("Dublin Core", "Title"));
            foreach($item->Files as $file) {
                $sourcemetadata= metadata($file, "uri");
                $imagemetadata= metadata($file, "thumbnail_uri");
                if (strpos($file["filename"], "mp3") !== false) {
                    $playlist .=
                    "{\"0\": {\"src\":\"$sourcemetadata\", \"type\":\"audio/mp3\"}, 
                    \"config\": 
                    {\"title\": \"$titlemetadata\",
                    \"poster\": \"$imagemetadata\"}},";
                }
            }       
       }
       $playlist .= "]";?>
    <?php 
        $string = '$(document).ready(function() {projekktor(".projekktor").setFile(' . $playlist . ');});';
    queue_js_string($string);?>