/*
 * Steuerung des Mediaplayers
 *
 * @author Thomas Scholz <thomasscholz@maxsysteme.de>
 * @created 13.07.09
 */

/** ID des HTML-Elementes mit dem gesamten Playerfenster */
var ID_PLAYER_WINDOW = "player_window";
/** ID des HTML-Elementes, in welches der Player integriert wird */
var ID_PLAYER_BOX = "player_box";
/** ID des HTML-Elementes des JW-FLV-Mediaplayers */
var ID_PLAYER = "player";
/** ID des HTML-Elementes für den Titel der aktuell gespielten Datei  */
var ID_TITLE = "media_title";
/** ID des HTML-Elementes für die Mediaauswahl */
var ID_SELECTION = "media_selection";

/** Konstante für die Kennzeichnung einer Sound-Datei */
var AUDIO = 1;
/** Konstante für die Kennzeichnung einer Video-Datei */
var VIDEO = 2;

/** Variable für den Player selbst */
var player = null;
/** ID der aktuell angezeigten Mediadatei */
var current_media_id = "";
/** ID der aktuell verwendeten Mediabox */
var current_box_id = "";
/** Array mit die ermittelten Positionen von HTML-Elementen */
var pos_cache = {};
/** Array mit den Parametern für alle Mediadateien */
var params = {};

/*
 * Usereinstellungen zum Fader
 */
var FADE_DX		= 188;
var FADE_STEP	= 10;
var FADE_DELAY	= 10;

/*
 * interne Variable für den Fader
 */
var fade_x = 0, fade_y = 0;
var fade_dy, fade_step_y;
var fade_timeout = null;

/**
 * Setzt das Fenster mit dem Mediaplayer
 *
 * @param {Number} media_id ID der Mediadatei
 * @param {String} box_id ID des HTML-Elementes, in dem der Player anzuzeigen ist
 * @param {Number} width Breite
 * @param {Number} height Höhe
 */
function setMediaPlayer(media_id, box_id, width, height)
{
	if (media_id != current_media_id || box_id != current_box_id) {
		// eventuell laufenden Player stoppen
		stopMediaPlayer();

		// ID der Mediadatei und der Mediabox global merken
		current_media_id	= media_id;
		current_box_id		= box_id;

		// Parameter aus dem globalen Parameterarray holen
		var my_params = params[media_id];
		//alert(unescape(my_params.veranstaltung) + ((my_params.beschreibung != "") ? " ("+unescape(my_params.beschreibung)+")" : ""));

		// neuen Player erstellen
		var so = new SWFObject(
			my_params.movie,
			ID_PLAYER,
			(width) ? width : my_params.width,
			(height) ? height : my_params.height,
			my_params.version
		);
		//so.useExpressInstall("lib/jw_flv_player/expressinstall.swf");
		so.addParam("allowscriptaccess", "always");
		so.addParam("allowfullscreen", my_params.fullscreen);
		so.addParam("wmode", my_params.wmode);
		so.addParam("flashvars", my_params.flashvars);
		so.write(ID_PLAYER_BOX);
		registerPlayer();

		// Playerfenster nur positionieren, wenn nötig
		var mediabox		= document.getElementById(box_id);
		var window_style	= document.getElementById(ID_PLAYER_WINDOW).style;
		if (	(parseInt(window_style.left) != getXPos(mediabox))
			||	(parseInt(window_style.top)  != getYPos(mediabox))
		) {
			window_style.left	= getXPos(mediabox) + "px";
			window_style.top	= getYPos(mediabox) + "px";
		}

		// Playerfenster anzeigen, wenn nötig
		if (window_style.visibility != "visible")
			window_style.visibility	= "visible";

		// Titel setzen und positionieren
		var mediatitle = document.getElementById(ID_TITLE);
		if (mediatitle) {
			mediatitle.innerHTML =
				"<div><a href='" + unescape(my_params.href) + "'>" +
					getTitel(my_params) +
				"</a></div>" +
				"<a href='" + unescape(my_params.href) + "'>" +
					"<img src='./pic/layout2/info.jpg' width='14' height='14' title='mehr Info' alt='mehr Info' />" +
				"</a>"
			;
			mediatitle.style.left		= (getXPos(mediabox) - 8) + "px";
			mediatitle.style.top		= (getYPos(mediabox) + 106) + "px";
			mediatitle.style.visibility	= "visible";
		}
	}
}

/**
 * Registriert einen neuen Player, d.h.
 * belegt die player-Variable und setzt Listener
 */
function registerPlayer()
{
	if (player == null || typeof(player) != "function" || !player.getConfig) {
		player = document.getElementById(ID_PLAYER);
		setTimeout("registerPlayer()", 10);
	}
	else {
		//player.style.zIndex = 9000;
		//alert(player.style.zIndex);
		player.addModelListener("STATE", "listenState");
	}
}

/**
 * Reagiert auf Änderungen des Playerstatus
 * (IDLE, BUFFERING, PLAYING, PAUSED, COMPLETED)
 *
 * @param {Object} event ModelEvent.STATE
 */
function listenState(event)
{
	//alert(event.newstate);
	if (event.newstate == "COMPLETED") {
		//alert("Wiedergabe beendet");
		closeMediaPlayer();
	}
};

/**
 * Stoppt den Mediaplayer
 */
function stopMediaPlayer()
{
	if (player != null && player.sendEvent) {
		// Player stoppen
		player.sendEvent("STOP", "true");
		// Titel ausblenden
		if (document.getElementById(ID_TITLE))
			document.getElementById(ID_TITLE).style.visibility = "hidden";
		// Player-Variable auf null setzen, damit beim nächsten
		// Aufruf der Listener wieder neu initialisiert wird!
		player = null;
		// aktuelle Media-ID zurücksetzen
		current_media_id = 0;
	}
}

/**
 * Stoppt und schließt den Mediaplayer
 */
function closeMediaPlayer()
{
	stopMediaPlayer();
	document.getElementById(ID_PLAYER_WINDOW).style.visibility = "hidden";
}

/**
 * Öffnet die Auswahl an Mediadateien für eine Rubrik
 *
 * @param {Object} button auslösendes HTML-Element
 * @param {Number} rubrik_id Rubrik-ID
 * @param {Number} typ AUDIO oder VIDEO
 */
function setRubrikMediaSelection(button, rubrik_id, typ)
{
	var offer_id = 0, i = 0, titel, my_params;
	var html = "<div class='title'>" + ((typ == AUDIO) ? "Hörbeispiele" : "Videos") + "</div>";

	for (var media_id in params) {
		my_params = params[media_id];

		if (my_params.rubrik_id == rubrik_id && my_params.typ == typ) {

			// Veranstalter (setzt Gruppierung nach offer_id voraus!)
			if (my_params.offer_id != offer_id) {
				html += "<span "+((i==0)?" class='top'":"")+">" + unescape(my_params.veranstalter) + "</span>";
				offer_id = my_params.offer_id;
			}

			html +=
				"<a class='rubrik"+((my_params.neu)?" neu":"")+"' href=\"javascript:clickMediaSelection('"+media_id+"', true)\">" +
				((my_params.neu) ? "<img src='./pic/layout2/neu.jpg' />" : "") +
				getTitel(my_params) + "</a>"
			;
			i++;
		}
	}

	setMediaSelection(button, rubrik_id, html);
}

/**
 * Öffnet die Auswahl an Mediadateien für eine Präsentation
 *
 * @param {Object} button auslösendes HTML-Element
 * @param {Number} rubrik_id Rubrik-ID
 * @param {Number} offer_id Präsentations-ID
 * @param {Number} typ AUDIO oder VIDEO
 */
function setOfferMediaSelection(button, rubrik_id, offer_id, typ)
{
	var i = 0, css, my_params;
	var html = "<div class='title'>" + ((typ == AUDIO) ? "Hörbeispiele" : "Videos") + "</div>";

	for (var media_id in params) {
		my_params = params[media_id];

		if (my_params.offer_id == offer_id && my_params.typ == typ) {
			css = (i==0) ? "top" : "";
			if (my_params.neu)
				css = (css == "") ? "neu" : " neu";

			html +=
				"<a class='"+css+"' href=\"javascript:clickMediaSelection('"+media_id+"', false)\">" +
				((my_params.neu) ? "<img src='./pic/layout2/neu.jpg' />" : "") +
				getTitel(my_params) + "</a>"
			;
			i++;
		}
	}

	setMediaSelection(button, rubrik_id, html);
}

/**
 * Öffnet die Auswahl an Freikarten für eine Rubrik
 *
 * @param {Object} button auslösendes HTML-Element
 * @param {Number} rubrik_id Rubrik-ID
 * @param {Array} freikarten Array mit Freikartenobjekten
 */
function setFreikartenSelection(button, rubrik_id, freikarten)
{
	var html = "<div class='title' onmouseover='showMediaSelection()'>Freikarten</div>";

	for (var i = 0, ii = freikarten.length; i < ii; i++)
		html += "<a href='" + freikarten[i].href + "'>" + unescape(freikarten[i].name) + "</a>";

	setMediaSelection(button, rubrik_id, html);
}

/**
 * Setzt und öffnet die Auswahl an Mediadateien
 *
 * @param {Object} button auslösendes HTML-Element
 * @param {Number} rubrik_id Rubrik-ID
 * @param {String} html Inhalt der Auswahl
 */
function setMediaSelection(button, rubrik_id, html)
{
	var select = document.getElementById(ID_SELECTION);
	if (!select)
		return;

	// alte Auswahl schließen
	closeMediaSelection();

	// Inhalt einsetzen
	select.innerHTML = html;

	// Auswahl positionieren und einblenden
	// Button-X-Pos + Buttonbreite (muss IMG sein!) - fester Wert
	var select_style		= select.style;
	select_style.left		= getXPos(document.getElementById("kopf_" + rubrik_id)) + "px";
	//select_style.left		= (getXPos(button) + button.width - 178) + "px";
	select_style.top		= (getYPos(button) + 16) + "px";
	select_style.visibility = "visible";
	//select_style.zIndex		= Number(4444);

	// Fader initialisieren und starten
	fade_dy		= select.offsetHeight;
	fade_step_y	= Math.round(FADE_STEP * (fade_dy / FADE_DX));
	fadeMediaSelection();
}

/**
 * Faderfunktion für das Öffnen der Mediaauswahl
 */
function fadeMediaSelection()
{
	var select = document.getElementById(ID_SELECTION);
	var ready = true;

	if (fade_x < FADE_DX) {
		fade_x += FADE_STEP;
		ready = false;
	}
	if (fade_y < fade_dy) {
		fade_y += fade_step_y;
		ready = false;
	}

	if (!ready) {
		setClip(select, FADE_DX - fade_x, FADE_DX, 0, fade_y);
		fade_timeout = setTimeout("fadeMediaSelection()", FADE_DELAY);
	}
	else {
		setClip(select, 0, FADE_DX, 0, fade_dy);
		fade_x = 0;
		fade_y = 0;
		clearTimeout(fade_timeout);
	}
}

/**
 * Reagiert auf das Anklicken eines Links in der Mediaauswahl
 *
 * @param {Number} media_id Media-ID
 * @param {Boolean} scroll Zum Player scrollen
 */
function clickMediaSelection(media_id, scroll)
{
	setMediaPlayer(media_id, "mediabox_" + params[media_id].offer_id);
	closeMediaSelection();
	if (scroll)
		scrollTo(0, getYPos(document.getElementById("mediabox_" + params[current_media_id].offer_id)) - 40);
}

/**
 * Öffnet die Auswahl an Mediadateien
 */
function showMediaSelection()
{
	document.getElementById(ID_SELECTION).style.visibility = "visible";
}

/**
 * Schließt die Auswahl an Mediadateien
 */
function closeMediaSelection()
{
	document.getElementById(ID_SELECTION).style.visibility = "hidden";
}

/**
 * Setzt die Clip-Styleeigenschaft eines Elementes
 *
 * @param {Object} elm HTML-Element
 * @param {Number} left
 * @param {Number} right
 * @param {Number} top
 * @param {Number} bottom
 */
function setClip(elm, left, right, top, bottom)
{
	elm.style.clip = "rect("+top+"px, "+right+"px, "+bottom+"px, "+left+"px)";
}

/**
 * Gibt den Titel einer Veranstaltung zurück
 * (entweder die Beschreibung oder der Veranstaltungsname)
 *
 * @param {Array} my_params Parameterarray
 * @return {String}
 */
function getTitel(my_params)
{
	return (my_params.beschreibung != "")
		? unescape(my_params.beschreibung)
		: unescape(my_params.veranstaltung)
	;
}

/**
 * Ermittelt die X-Y-Koordinaten eines Elements
 *
 * @param {Object} element HTML-Element
 */
function getElmPos(element)
{
	var elm = element, x = 0, y = 0;

	// Solange elm ein Objekt ist und die Eigenschaft offsetTop enthält,
	// wird diese Schleife für das Element und alle seine Offset-Eltern ausgeführt
	while ((typeof(elm) == "object") && (typeof(elm.tagName) != "undefined")) {
		y += elm.offsetTop;		// Offset des jeweiligen Elements addieren
		x += elm.offsetLeft;    // Offset des jeweiligen Elements addieren

		// wenn beim Body angekommen, elm für Abbruch auf 0 setzen
		if (elm.tagName.toLowerCase() == "body")
			elm = 0;

		// wenn elm ein Objekt ist und offsetParent enthält, Offset-Elternelement ermitteln
		if (typeof(elm) == "object")
			if (typeof(elm.offsetParent) == "object")
				elm = elm.offsetParent;
	}

	// Objekt mit x und y zurückgeben
	return {"x": x, "y": y};
}

/**
 * Gibt die X-Koordinate eines Elements
 * aus dem Koordinatencache zurück
 *
 * @param {Object} elm HTML-Element
 */
function getXPos(elm)
{
	if (!pos_cache[elm.id])
		pos_cache[elm.id] = getElmPos(elm);

	return pos_cache[elm.id].x;
}

/**
 * Gibt die Y-Koordinate eines Elements
 * aus dem Koordinatencache zurück
 *
 * @param {Object} elm HTML-Element
 */
function getYPos(elm)
{
	if (!pos_cache[elm.id])
		pos_cache[elm.id] = getElmPos(elm);

	return pos_cache[elm.id].y;
}

addLoadEvent(
	function()
	{
		if (document.getElementById(ID_SELECTION))
			onMouseLeave(ID_SELECTION);
	}
);
