Monday, September 27, 2010

Flow Player Integration

1. download Flowplayer  dist
2. download  make_player make_player
3. make archive faila themes / default / make_player.htm if you are in default theme, if you do use another theme archive of other topics.
4. unzip Flowplayer.rar
5. upload all dist folder in the root directory
6. unzip make_player.rar
7. replace the faila  make_player.htm


In index.php, add this:

Code:

$playlist = 1;

$pl = array();



    $sql    = "SELECT video_id, title, description FROM videos WHERE approved = 'yes' AND public_private = 'public' AND featured = 'yes' ORDER BY indexer DESC LIMIT 10";

    $query    = @mysql_query($sql);

    while ( $result = @mysql_fetch_array($query) ) {

        $pl[] = $result;

    }
Then add this just before the TBS render at the end:

Code:

$TBS->MergeBlock('pl', $pl);
In main_1.htm, add this just before the closing head tag:

Code:

<link href="[var.base_url]/themes/default/css/playlist.css" rel="stylesheet" type="text/css" media="all">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"><!--[onload;block=script;when [var.playlist]=1;comm]--></script>

<script type="text/javascript" src="http://static.flowplayer.org/js/flowplayer-3.2.4.min.js"><!--[onload;block=script;when [var.playlist]=1;comm]--></script>

<script type="text/javascript" src="http://static.flowplayer.org/js/flowplayer.playlist-3.0.8.min.js"><!--[onload;block=script;when [var.playlist]=1;comm]--></script>



<script type="text/javascript"> 

$(function() {

    

    // setup player 

    $f("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.4.swf", {

    

        clip: {baseUrl: '[var.base_url]/uploads'}

        

    // playlist plugin 

    }).playlist("#playlist");

    

});

<!--[onload;block=script;when [var.playlist]=1;comm]-->    

</script>
In inner_index.htm, replace everything in this section:

Code:

  <!--Video Player Container.  This is where the player embed code goes-->

  <!--End Video Player Container-->
With this:

Code:

<a id="player" class="player plain"> 

    <img src="http://static.flowplayer.org/img/player/btn/play_text_large.png" /> 

</a>   

  

<div id="playlist"> 

    <a href="[pl.video_id;block=a].flv"> 

        <img src="[var.base_url]/uploads/thumbs/[pl.video_id;block=a].jpg" /> 

        <strong>[pl.title;htmlconv=no;block=a;ope=max:18;maxhtml]</strong><br />[pl.description;htmlconv=no;block=a;ope=max:28;maxhtml]

    </a> 

</div>  

<div id="fp_mar"></div>
Upload this playlist.css to your themes/default/css/ folder, and you're done!

No comments:

Post a Comment