/*
 * Init and setup FlowPlayer.  This example file shows 'advanced' features like
 * playlists and configuring with JavaScript. FlowPlayer.html is a simpler example.
 */

var flowPlayer1;
function init() {
	if (document.getElementById) {
		flowPlayer1 = document.getElementById("FlowPlayer");
	}
	setInitialConfig();
}

// wait for the page to fully load before initializing
window.onload = init;

function setInitialConfig() {
	fpConf.playList = clips;
	fpConf.autoPlay = false;
	fpConf.autoBuffering = false;
	flowPlayer1.setConfig(fpConf);
}

/*
 * This is the playlist with FLV videos and images. The images can have a duration property
 * and the flv video files can have start and end properties that give the starting and
 * ending positions in seconds. All these attributes (duration, start, end) are optional.
 *
 * The start and end attributes really only work with the Flash Media Server. I have had
 * problems when thesting using Red5.
 */
var clips = [                      
	{ name: 'ClickToPlay',  url: '../images/video1.flv' }
];

var fpConf = {
	showPlayList: false,
	bufferLength: 20,
	loop: false,
	hideControls: false,
	showMenu: false
}

/*
 * JavaScript event hanlders:
 */
function clipSelected(clipIndex) {
	flowPlayer1.ToClip(clipIndex);
}

function play() {
	flowPlayer1.DoPlay();
	updateIsPlaying();
}

function pause() {
	flowPlayer1.Pause();
	updateIsPlaying();
}

function stop() {
	flowPlayer1.DoStop();
	updateIsPlaying();
}

function updateIsPlaying() {
	var field = document.getElementById("playing");
	field.value = "Playing: " + flowPlayer1.getIsPlaying() + ", paused : " + flowPlayer1.getIsPaused();
}

function seek() {
	var seekTimeField = document.getElementById("seekTime");
	flowPlayer1.Seek(seekTimeField.value);
}

function getTime() {
	var time = flowPlayer1.getTime();
	var timeField = document.getElementById("time");
	timeField.value = time;
}

function getDuration() {
	var value = flowPlayer1.getDuration();
	var field = document.getElementById("duration");
	field.value = value;
}

function getPercentLoaded() {
	var value = flowPlayer1.getPercentLoaded();
	var field = document.getElementById("loaded");
	field.value = value;
}

function replaceConfig() {
	// replace the playlist in our configuration
	fpConf.playList = [                      
	{ name: 'Honda accord', url: '../../flashvideos/video1.flv'} ];
	fpConf.autoBuffering = true;
	fpConf.autoPlay = true;
	flowPlayer1.setConfig(fpConf);
}

function replaceFileConfig(videotowatch) {
	// replace the playlist in our configuration
	fpConf.playList = [                      
	{ name: 'video', url: videotowatch} ];
	fpConf.autoBuffering = true;
	fpConf.autoPlay = true;
	flowPlayer1.setConfig(fpConf);
}

/*
 * Flash callback handlers. The player calls these on specific events:
 */

function onClipDone(clip) {
	addClipEvent("clip done : " + describeClip(clip));
}

function onClipChanged(clip) {
	addClipEvent("changed to clip : " + clip.name);
}

function onLoadBegin(clip) {
	//addClipEvent("started loading : " + clip.name);
}

function onStartBuffering(clip) {
	addClipEvent("started buffering : " + clip.name);
}

function onBufferFull(clip) {
	addClipEvent("buffer full for : " + clip.name);
}

function onBufferFlush(clip) {
	addClipEvent("buffer flush for : " + clip.name);
}

function onMetaData(obj) {
	addClipEvent("metadata received : duration " + obj.duration + ", video data rate " + obj.videodatarate + ", audio data rate " + obj.audiodatarate + ", creation date " + obj.creationdate);
}

function onStreamNotFound(clip) {
	addClipEvent("stream not found: " + describeClip(clip));
}

function onPlay(clip) {
	addClipEvent("play: " + clip.name);
}

function onStop(clip) {
	addClipEvent("stop: " + clip.name);
}

function onPause(clip) {
	addClipEvent("paused: " + clip.name);
}

function onResume(clip) {
	addClipEvent("resumed: " + clip.name);
}

function onCuePoint(cuePoint) {
	addClipEvent("cue point received, time: " + cuePoint.time + ", type '" + cuePoint.type + "', thumb: " + cuePoint.thumb + ", parameters: " + cuePoint.parameters);
}

/*
 * Helpers:
 */
 
function addClipEvent(desc) {
	var events = document.getElementById("events");
	events.appendChild(document.createTextNode(desc));
	events.appendChild(document.createElement("br"));
}

function describeClip(clip) {
	return "Name: " + clip.name + ", baseUrl: " + clip.baseUrl + ", fileName: " + clip.fileName + 
	", start: " + clip.start + ", end: " + clip.end + ", protected: " + clip.protected +
	", linkUrl: " + clip.linkUrl + ", linkWindow: " + clip.linkWindow + ", controlEnabled: " +
	clip.controlEnabled;
}

