/**************************************
directions:  
inser the following html:

    <div id="videoPlayerContainer">
        <div id="videoPlayer"></div>
        <div id="videoTextContainer">
            <div id="videoTextHeader"></div>
                <span>Video URL:</span><input type="text" id="textVideoUrl" />
                <span>Embed Code:</span><input type="text" id="textVideoCode" />
        </div>
    </div>
    <a href="javascript:void(0);" onclick="OnVideoClick(12345, 'text for video 1');">video 1</a>
    <a href="javascript:void(0);" onclick="OnVideoClick(123456, 'text for video 2');">video 2</a>
    <a href="javascript:void(0);" onclick="OnVideoClick(123453, 'text for video 3');">video 3</a>


and then trigger the video switch by making a call to OnVideoClick('2023434112', 'cheese') with the 
corresponding video id and caption to be placed in the header text.
***************************************/
var defaultWidth = 525;
var defaultHeight = 335;

// loads the video player and then changes the text.
// width and height are optional
function OnVideoClick(videoId, headerText, width, height)
{
    LoadVideo(videoId, width, height);
}

// loads the video player
// width and height are optional
function LoadVideo(videoId, width, height)
{
    // if the width and height have been specified, we set it.
    // otherwise we use the default width and height that are defined above
    width = (width) ? width : defaultWidth;
    height = (height) ? height : defaultHeight;
    
    // change the video source   
    var videoPlayerContainer = document.getElementById('videoPlayer');
	videoPlayerContainer.innerHTML = '<embed src="http://mediaservices.myspace.com/services/media/embed.aspx/m=' + videoId + ',t=1,mt=video,primaryColor=0xf5d873,ap=1,sr=0,hb=true" width="' + width + '" height="' + height + ' wmode="transparent" allowfullscreen="true" type="application/x-shockwave-flash" />';

}