Php question...

[cowboysdude]

This is a hybrid question I guess...  if this isn't the place please let me know and I'll apologize in advance... BUT here I go ...

 

I have this script that I am working on... I have been using the following [without overlay]...

 

<script>
$(function() {

// setup player 
$f("player", "/modules/mod_flowplay/swf/flowplayer-3.1.1.swf", {

	clip: {baseUrl: '<?php echo $baseurl ?>'}

// playlist plugin 
}).playlist("#playlist");

plugins: { 
        lighttpd: {  
            url: "/modules/mod_flowplay/swf/flowplayer.pseudostreaming-3.1.1.swf"  
        }


    } 

});

</script>


<!-- player container -->
<a id="player" class="player plain">
<img src="modules/mod_flowplay/images/logo.png" />
</a>


<!-- the playlist. simple HTML controlled with CSS -->
<div id="playlist">
<?php

$lines = file('modules/mod_flowplay/edit/file.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
foreach($lines as $line)
{
    list($filename, $title, $time) = explode('-', $line);
    echo "<a href='$path/$filename'> $title <br />$time";
} 
?>
</div>

<!-- let the rest of the page float normally -->
<br clear="all" />

<!-- END DO NOT CHANGE THIS -->

 

This works great it shows the menu and works when a clip is clicked on.... NOW

 

I'm trying to put these two together [the one above and this one below in a php file] to get an 'overlay' effect...

 

$(function() {

// setup overlay actions to buttons
$("button[rel]").overlay({

	// setup exposing (optional operation);
	onBeforeLoad: function() {
		this.getBackgroundImage().expose({api: true}).load();	
	},				

	onLoad: function(content) {
		// find the player contained inside this overlay and load it
		this.getContent().find("a.player").flowplayer(0).load();
	},

	onClose: function(content) {
		$f().unload();

		// close exposing
		this.getBackgroundImage().expose().close();
	}
});				

// install flowplayers
$("a.player").flowplayer("http://localhost/modules/mod_test/swf/flowplayer-3.1.2.swf"); 
});	
</script>

<p>
<button rel="#overlay1">Blonde</button> 
<button rel="#overlay2">Ateam</button>
</p>

<!-- overlays for both videos -->
<div class="overlay" id="overlay1">
<a class="player" href="http://localhost/clips/blonde.flv">

	 
</a>
</div>

<div class="overlay" id="overlay2">
<a class="player" href="http://localhost/clips/ateam.flv">
	 
</a>	
</div>

 

Does anyone have any ideas because I am not making out well here...LOL it's just not coming to me...

 

Thank you!