Is it possible to have the player automatically resize itself according to the type of file that is being played?
For example, if in my playlist I have and mp3 file I would like to have the player only be 20 pixels high and about 300 wide. But if the next item in the playlist is an flv video, then I'd like the player to automatically adjust to a bigger size to see the video. If this can be done, how would I do this?
It would push the other page elements down.
How do I set up an "item listener"?
<script type="text/javascript">
var player = null;
var playlist = null;
var soundWidth = 300;
var soundHeight = 20;
var videoWidth = 300;
var videoHeight = 240;
function playerReady(obj)
{
player = gid(obj.id);
addListeners();
};
function addListeners()
{
playlist = player.getPlaylist();
if(playlist.length > 0)
{
player.addControllerListener('ITEM', 'itemMonitor');
}
else
{
setTimeout("addListeners();", 100);
}
};
function itemMonitor(obj)
{
if(playlist[obj.index]['type'] == 'sound')
{
setFlashSize(soundWidth, soundHeight);
}
else
{
setFlashSize(videoWidth, videoHeight);
}
};
function setFlashSize(newW, newH)
{
gid('playercontainer').style.width = newW + "px";
gid('playercontainer').style.height = newH + "px";
player.width = newW;
player.height = newH;
};
function gid(name)
{
return document.getElementById(name);
};
</script>
The code above assumes that your player in embedded in a HTML container element with an id="playercontainer", like this:
<div id="playercontainer" class="playercontainer"><a id="player" class="player" href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Get the Flash Plugin to see this video.</a></div>I just downloaded a great example using the jw player.
It demonstrates how to do most everything you would want to do with the jw player including, on-demand streaming from multiple servers, resizing, sendevent, and dynamically setting the start position. It also works with all browsers, so there are no compatibility issues, and it does not need to use the swfobject.
Details: http://www.promatrixinc.com/Video.Explorer.Express/
Also, check out the full version of the Video Explorer here:
http://www.promatrixinc.com/Video.Explorer/?directory=voiceover_speech_sequencer_streamhoster
What is going to happen to the other page elements when the player expands?
Are you going to push them over & down or are you going to expand the player over them?
You can see that effect on this Test Page: http://willswonders.myip.org:8074/Simple_Re-Size_OverLayer.html
To do the automatic re-sizing, set up an ITEM listener.
When the index changes, check the type, if it's video, re-size to 300x240, if it's sound, re-size to 200x20.
Of course, the sizes can be anything that you want, I just used those sizes for illustrative purposes.