// global.js

///////////////////////////////////////////////////////////////////////////
// Einstellungen
///////////////////////////////////////////////////////////////////////////

// URLs
var HOME_ONLINE = "redaktion-bahamas.org";
var HOME_OFFLINE = "D:/Internet/bahamas";
var HOME_EMAIL = "redaktion@redaktion-bahamas.org";

// Dateinamen
var LINK_CSS = "sys/global.css";
var LINK_UPDATECSS = "sys/updatecss.js";
var LINK_HOME = "index.html";
var LINK_ABO = "abo.html";
var LINK_HEFTARCHIV = "heft-archiv.html";
var LINK_AKTUELLARCHIV = "aktuell-archiv.html";
var LINK_SUCHE = "suche.html";
var LINK_IMPRESSUM = "impressum.html";
var LINK_IMGTITEL = "img/bahamas242.jpg";
var LINK_IMGPALME = "img/palme74.jpg";

// Menü-Titel
var S_HOME = "Home";
var S_ABO = "Bestellung und Verkauf";
var S_HEFTARCHIV = "Heft-Archiv";
var S_AKTUELLARCHIV = "Aktuell-Archiv";
var S_SUCHE = "Suche";
var S_IMPRESSUM = "Impressum";
	
// Bild-Titel
var S_IMGTITEL = "Redaktion Bahamas";
var S_IMGPALME = "Palme der Bahamas";

// Seitendimension
var WIDTH_PAGE = 1000;
var WIDTH_PAGE_BORDER = 50;
var WIDTH_PAGE_LEFT = 700;
var WIDTH_PAGE_RIGHT = 200;
var HEIGHT_PAGE = 0;

// Zoom-Faktor bei schmalem Monitor
var WIDTH_PAGE_ZOOM = 1;

// 1spaltige Darstellung auf schmalerer Seite.
// ID_TEXTSPALTE ist die ID eines div-Elements, innerhalb dessen
// Text dargestellt ist. Wenn ein Element mit dieser ID in einer
// Seite erkannt wird, wird automatisch oberhalb des Textes ein
// Textmenü angelegt, mit dem die Textspalte gezoomt werden kann.
var WIDTH_PAGE_1SPALTIG = 800;
var ID_TEXTSPALTE = "TextSpalte"; 
var TEXTSPALTE_WIDTH = 550;
var TEXTSPALTE_MIN = 225;
var TEXTSPALTE_MAX = WIDTH_PAGE_1SPALTIG-(WIDTH_PAGE_BORDER*2);
var TEXTSPALTE_ZOOMX = 50;

// Farben für die Animation von Links und Buttons
var LINK_COLOR_ALL = "#808000";
var LINK_COLOR_MENUBTN = "#dd0000";
var LINK_COLOR_TEXTMENUBTN = "#dd0000";
var LINK_BGCOLOR_REDBTN = "#dd0000";
var LINK_BGCOLOR_WINDOWSBTN = "#808000";

///////////////////////////////////////////////////////////////////////////
// Textmenü
///////////////////////////////////////////////////////////////////////////

var TEXTSPALTE = null;
var ID_ZOOM_MINUS = "ZoomMinusx";
var ID_ZOOM_PLUS = "ZoomPlusx";
var ZOOM_MINUS = null;
var ZOOM_PLUS = null;

///////////////////////////////////////////////////////////////////////////
// Systemvariabeln, die in InitApplication() initialisiert werden.
///////////////////////////////////////////////////////////////////////////

var APP_URL = null;
var APP_EMAIL = null;
var APP_BROWSER_NAME = null;
var APP_BROWSER_VERSION = 0;
var APP_BROWSER_MSIE = false;
var APP_BROWSER_FF = false;
var APP_WINVERSION = 0;

///////////////////////////////////////////////////////////////////////////
// Titel der rechten Spalte, null bei 1spaltiger Seite.
// Wird der Funktion StartPage() als Parameter übergeben.
///////////////////////////////////////////////////////////////////////////

var TITEL_RECHTESPALTE = null;

///////////////////////////////////////////////////////////////////////////
// Helper
///////////////////////////////////////////////////////////////////////////

// Javascript Module laden

function LoadJsModule(newmsrc,newmsrcid)
{
	var h = document.getElementsByTagName("head")[0];
	if(!h || !newmsrc)
	{
		return;
	}
	var s = document.createElement('script');
	if(!h || !newmsrc)
	{
		s.id = newmsrcid;
	}
	s.type = "text/javascript";
	s.src = newmsrc;
	h.appendChild(s);
}

// body-/window.onload handler hinzufügen

function AddOnLoadHandler(newf)
{
	var oldf = window.onload;
	if(typeof window.onload != "function")
	{
		window.onload = newf;
	}
	else
	{
		window.onload = function()
		{
			oldf();
			newf();
		}
	}
}

// Fenstergröße ermitteln

function GetWindowWidth()
{
	if(document.compatMode == "CSS1Compat")
	{
		return document.documentElement.clientWidth;
	}
	else
	{
		return document.body.clientWidth;
	}
}

function GetWindowHeight()
{
	if(document.compatMode == "CSS1Compat")
	{
		return document.documentElement.clientHeight;
	}
	else
	{
		return document.body.clientHeight;
	}
}

// Windows Version

function GetWinVersion()
{
	var s = navigator.userAgent;
	var i = s.indexOf("Windows NT");

	APP_WINVERSION = 0;

	if( i != -1 )
	{
		APP_WINVERSION = Number(s.charAt(i+11));
	}
}

// Browser Name und Version ermitteln

function GetBrowser()
{
	var ie = "MSIE ";
	var ff = "Firefox/";
	var s = navigator.userAgent;

	APP_BROWSER_NAME = null;
	APP_BROWSER_VERSION = null;
	APP_BROWSER_MSIE = false;
	APP_BROWSER_FF = false;

	// Try Internet Explorer
	if( s.indexOf(ie) != -1 )
	{
		APP_BROWSER_NAME = navigator.appName;
		APP_BROWSER_VERSION = Number(s.split(ie)[1].substring(0,3)).toPrecision(2);
		APP_BROWSER_MSIE = true;
		return;
	}

	// Try Firefox
	if( s.indexOf(ff) != -1 )
	{
		APP_BROWSER_NAME = "Firefox";
		APP_BROWSER_VERSION = Number(s.split(ff)[1].substring(0,3)).toPrecision(2);
		APP_BROWSER_FF = true;
		return;
	}

	// Andere
	APP_BROWSER_NAME = navigator.appName;
	APP_BROWSER_VERSION = Number(navigator.appVersion.charAt(0));
	return;
}

///////////////////////////////////////////////////////////////////////////
// Links und Buttons animieren bei onmouseover/onmouseout
///////////////////////////////////////////////////////////////////////////

var oldColor = null;
var outElement = null;

function fMouseOverLink()
{
	var e = null;
	if( APP_BROWSER_MSIE )
	{
		e = event.srcElement;
	}
	else
	{
		e = this;
	}
	if( !e )
	{
		return;
	}
	oldColor = e.style.color;
	outElement = e;
	if( e.className == "MenuButton" )
	{
		e.style.backgroundColor = LINK_COLOR_MENUBTN;
	}
	else
	if( e.className == "TextmenuButton" )
	{
		e.style.backgroundColor = LINK_COLOR_TEXTMENUBTN;
	}
	else
	{
		e.style.color = LINK_COLOR_ALL;
	}
}

function fMouseOutLink()
{
	if( !outElement )
	{
		return;
	}
	if( outElement.className == "MenuButton" || outElement.className == "TextmenuButton" )
	{
		outElement.style.backgroundColor = oldColor;
	}
	else
	{
		outElement.style.color = oldColor;
	}
	outElement = null;
}

function fMouseOverButton()
{
	var e = null;
	if( APP_BROWSER_MSIE )
	{
		e = event.srcElement;
	}
	else
	{
		e = this;
	}
	if( !e )
	{
		return;
	}
	oldColor = e.style.color;
	outElement = e;
	if( e.className == "RedButton" )
	{
		e.style.backgroundColor = LINK_BGCOLOR_REDBTN;
	}
	else
	{
		e.style.backgroundColor = LINK_BGCOLOR_WINDOWSBTN;
	}
}

function fMouseOutButton()
{
	if( !outElement )
	{
		return;
	}
	outElement.style.backgroundColor = oldColor;
	outElement = null;
}

///////////////////////////////////////////////////////////////////////////
// Elemente initialisieren
///////////////////////////////////////////////////////////////////////////

function AnimateLinks()
{
	var x = document.links;
	if(!x)
	{
		return;
	}
	var e;
	var i = 0;
	var l = x.length;
	while(i < l)
	{
		e = x[i];
		if( e )
		{
			e.onmouseover = fMouseOverLink;
			e.onmouseout = fMouseOutLink;
			if( !APP_BROWSER_MSIE && e.className != "TextmenuButton" && e.className != "MenuButton" )
			{
				e.onclick = fMouseOutLink;
			}
		}
		i++;
	}
}

function AnimateButtons()
{
	var x = document.getElementsByTagName("button");
	if(!x)
	{
		return;
	}
	var e;
	var i = 0;
	var l = x.length;
	while(i < l)
	{
		e = x[i];
		if( e && (e.className || APP_WINVERSION < 6) )
		{
			e.onmouseover = fMouseOverButton;
			e.onmouseout = fMouseOutButton;
		}
		i++;
	}
}

// Für Browser, die kein CSS border-spacing kennen:
// cellpadding und cellspacing entfernen.

function AnimateTables()
{
	var x = document.getElementsByTagName("table");
	if(!x)
	{
		return;
	}
	var e;
	var i = 0;
	var l = x.length;
	while(i < l)
	{
		e = x[i];
		if( e )
		{
			e.cellPadding = "0px";
			e.cellSpacing = "0px";
		}
		i++;
	}
}

///////////////////////////////////////////////////////////////////////////
// Textmenü anzeigeb
///////////////////////////////////////////////////////////////////////////

function ShowTextmenu()
{
	document.writeln("<p class='Textmenu' id='Textmenu'>");
	document.writeln("Spalte: ");
	document.writeln("<a class='TextmenuButton' id='"+ID_ZOOM_MINUS+"' href='javascript:ZoomTextSpalte(-1);'>-</a>");
	document.writeln("<a class='TextmenuButton' id='"+ID_ZOOM_PLUS+"' href='javascript:ZoomTextSpalte(1);'>+</a>");
	document.writeln("</p>");
	ZOOM_MINUS = document.getElementById(ID_ZOOM_MINUS);
	ZOOM_PLUS = document.getElementById(ID_ZOOM_PLUS);
}

///////////////////////////////////////////////////////////////////////////
// Textspalte zoomen
///////////////////////////////////////////////////////////////////////////

var ZOOM_MINUS_DISABLED = false;
var ZOOM_PLUS_DISABLED = false;

function ZoomTextSpalte(direction)
{
	if(!TEXTSPALTE)
	{
		return;
	}
	var w = TEXTSPALTE.clientWidth;
	if(direction == 1)
	{
		if(ZOOM_PLUS_DISABLED)
		{
			return;
		}
		if(w == TEXTSPALTE_MAX)
		{
			DisableZoomButton(ZOOM_PLUS,true);
			ZOOM_PLUS_DISABLED = true;
			return;
		}
		w += TEXTSPALTE_ZOOMX;
		if(w >= TEXTSPALTE_MAX)
		{
			TEXTSPALTE.style.width = TEXTSPALTE_MAX + "px";
		}
		else
		{
			TEXTSPALTE.style.width = w + "px";
		}
		if(ZOOM_MINUS_DISABLED)
		{
			DisableZoomButton(ZOOM_MINUS,false);
			ZOOM_MINUS_DISABLED = false;
		}
	}
	else
	{
		if(ZOOM_MINUS_DISABLED)
		{
			return;
		}
		if(w == TEXTSPALTE_MIN)
		{
			DisableZoomButton(ZOOM_MINUS,true);
			ZOOM_MINUS_DISABLED = true;
			return;
		}
		w -= TEXTSPALTE_ZOOMX;
		if(w <= TEXTSPALTE_MIN)
		{
			TEXTSPALTE.style.width = TEXTSPALTE_MIN + "px";
		}
		else
		{
			TEXTSPALTE.style.width = w + "px";
		}
		if(ZOOM_PLUS_DISABLED)
		{
			DisableZoomButton(ZOOM_PLUS,false);
			ZOOM_PLUS_DISABLED = false;
		}
	}
}

// Zoom-Button disable true/false

function DisableZoomButton(btn,b)
{
	if(b)
	{
		btn.onmouseout();
		btn.onmouseover = null;
		btn.onmouseout = null;
		btn.style.cursor = "no-drop"; // "not-allowed";
	}
	else
	{
		btn.onmouseover = fMouseOverLink;
		btn.onmouseout = fMouseOutLink;
		btn.style.cursor = "pointer";
	}
}

///////////////////////////////////////////////////////////////////////////
// Statuszeile am Ende der Seite.
///////////////////////////////////////////////////////////////////////////

function Statuszeile()
{
	var s = document.getElementById("GesamteSeite");
	if(s && s.rows && s.rows[0].cells)
	{
		var spzahl = s.rows[0].cells.length;
		document.writeln("<tr>");
		if(spzahl > 1)
		{
			document.writeln("<td colspan='"+ spzahl +"'>");
		}
		else
		{
			document.writeln("<td>");
		}
		document.writeln("<div class='Statuszeile' id='TEST_MESSAGE'></div>");
		document.writeln("</td>");
		document.writeln("</tr>");
	}
}

// Text in der Statuszeile anzeigen

function ShowStatuszeile(msg)
{
	var e = document.getElementById("TEST_MESSAGE");
	if(e)
	{
		if(e.style.display != "block")
		{
			e.style.display = "block";
		}
		if(msg)
		{
			e.innerHTML = msg;
		}
	}
}

///////////////////////////////////////////////////////////////////////////
// Seite öffnen - Die Seite ist eine Tabelle.
//
// StartPage(rsptitel) MUSS unmittelbar NACH <BODY> aufgerufen werden!
//
// 1spaltig: - rsptitel = null
//			 - Enthält die Seite ein div-Element mit der
//			   id "TextSpalte", wird das Textmenü aktiviert, mit dem
//			   der Inhalt dieses div-Elements gezoomt werden kann.
//
// 2spaltig: - rsptitel = Text, der über der 2. Spalte erscheint.
//			 - Innerhalb der Seite MÜSSEN 2 TABELLENSPALTEN angelegt werden!
//			   Die Zeile dafür ist bereits geöffnet und wird automatisch geschlossen.
//
// Immer:	 - ZUSÄTZLICHE ZEILEN NUR AM ENDE DER SEITE!
//			   VORHER MUSS die in dieser Funktion bereits geöffnete ZEILE GESCLOSSEN werden.
//			   Die NEUE ZEILE darf NICHT GESCHLOSSEN werden, weil sie danach
//			   durch den Aufruf von EndPage geschlossen wird!
// EndPage() MUSS unmittelbar VOR </BODY> aufgerufen werden!
///////////////////////////////////////////////////////////////////////////

function StartPage(rsptitel)
{
	TITEL_RECHTESPALTE = rsptitel;

	var seitecss = "GesamteSeite";

	if(!TITEL_RECHTESPALTE)
	{
		// 1spaltige Seite (Texte) immer auf schmalerer Seite darstellen
		WIDTH_PAGE = WIDTH_PAGE_1SPALTIG;
		seitecss = "GesamteSeite1spaltig";
	}

	document.writeln("<table class='"+seitecss+"' id='GesamteSeite'>");
	document.writeln("<tr id='TitelZeile'>");
	document.writeln("<td class='LinkeSpalteOben' id='LinkeSpalteOben'>");

// Start Titel/Menü
	document.writeln("<table>");
	document.writeln("<tr class='MenuZeile'>");
	document.writeln("<td>");
	document.writeln("<img class='TitelLogo1' src='"+APP_URL+LINK_IMGTITEL+"' alt='"+S_IMGTITEL+"' title='"+S_IMGTITEL+"'></img>");
	document.writeln("<p>");
	document.writeln("<a class='MenuButton' href='"+APP_URL+LINK_HOME+"'>"+S_HOME+"</a>");
	document.writeln("<a class='MenuButton' href='"+APP_URL+LINK_ABO+"'>"+S_ABO+"</a>");
	document.writeln("<a class='MenuButton' href='"+APP_URL+LINK_HEFTARCHIV+"'>"+S_HEFTARCHIV+"</a>");
	document.writeln("<a class='MenuButton' href='"+APP_URL+LINK_AKTUELLARCHIV+"'>"+S_AKTUELLARCHIV+"</a>");
	document.writeln("<a class='MenuButton' href='"+APP_URL+LINK_SUCHE+"'>"+S_SUCHE+"</a>");
	document.writeln("<a class='MenuButton' href='"+APP_URL+LINK_IMPRESSUM+"'>"+S_IMPRESSUM+"</a>");
	document.writeln("</p>");
	document.writeln("</td>");
	document.writeln("<td>");
	document.writeln("<img class='TitelLogo2' src='"+APP_URL+LINK_IMGPALME+"' alt='"+S_IMGPALME+"' title='"+S_IMGPALME+"'></img>");
	document.writeln("</td>");
	document.writeln("</tr>");
	document.writeln("</table>");
// Ende Titel/Menü

	document.writeln("</td>");

///////////////////////////////////////////////////////////////////////////
// 2spaltig - rechte Spalte in der Titelzeile anzeigen
///////////////////////////////////////////////////////////////////////////

	if( TITEL_RECHTESPALTE )
	{
		document.writeln("<td class='RechteSpalteOben' id='RechteSpalteOben'>");
		document.writeln("<div class='RechteSpalteOben'>"+TITEL_RECHTESPALTE+"</div>");
		document.writeln("</td>");
	}

	document.writeln("</tr>");
	document.writeln("<tr id='SeitenZeile'>");

///////////////////////////////////////////////////////////////////////////
// 1spaltig - Spalte über die ganze Seite öffnen
///////////////////////////////////////////////////////////////////////////

	if( !TITEL_RECHTESPALTE )
	{
		document.writeln("<td>");
		// TextMenü zunächst unsichtbar anzeigen
		ShowTextmenu();
	}
}

///////////////////////////////////////////////////////////////////////////
// Seite schließen
///////////////////////////////////////////////////////////////////////////

function EndPage()
{
	if( !TITEL_RECHTESPALTE )
	{
		document.writeln("</td>");
	}
	document.writeln("</tr>");

	Statuszeile();

	document.writeln("</table>");

	AddOnLoadHandler(EndLayout);
}

///////////////////////////////////////////////////////////////////////////
// Layout abschließen
///////////////////////////////////////////////////////////////////////////

function EndLayout()
{
	ShowStatuszeile(location)

	if( APP_BROWSER_MSIE && APP_BROWSER_VERSION < 8 )
	{
		AnimateTables();
	}

	var seite = document.getElementById("GesamteSeite");

	if( seite && seite.offsetHeight < HEIGHT_PAGE )
	{
		// Seitehöhe ggf. auf die Fensterhöhe erweitern.
		// Vergrößert wird nur die Zeile direkt unter der Titelzeile,
		// die den wesentlichen Inhalt der Seite enthält (Seitenzeile).

		// Oberen und unteren Seitenrand abziehen
		var h = HEIGHT_PAGE-(WIDTH_PAGE_BORDER*2);

		// Höhe aller anderen Zeilen abziehen
		var r = seite.rows;
		if(r)
		{
			var e;
			var i = 0;
			var l = r.length;
			var sz = null;
			while(i < l)
			{
				e = r[i];
				if( e )
				{
					// Die zu vergrößernde Zeile wird natürlich
					// nicht abgezogen, nur merken.
					if( e.id == "SeitenZeile" )
					{
						sz = e;
					}
					else
					{
						h -= e.clientHeight;
					}
				}
				i++;
			}
			if(sz)
			{
				// Seitenzeile ausdehnen
				sz.style.height = h + "px";
			}			
		}
	}

	TEXTSPALTE = document.getElementById(ID_TEXTSPALTE);
	if( TEXTSPALTE )
	{
		// Das div-Element innerhalb der Seite, dessen Inhalt zum zommen bestimmt
		// ist, wurde gefunden: das Textmenü wird angezeigt.
		var txtm = document.getElementById("Textmenu");
		if(txtm)
		{
			txtm.style.visibility = "visible";
		}
	}

	AnimateLinks();
	AnimateButtons();
}

///////////////////////////////////////////////////////////////////////////
// Programm Starten:
// - URLs initialisieren
// - Browser ermitteln
// - Betriebssystem ermitteln
// - Monitorauslösung ermitteln
// - Bei schmalem Monitor Stylesheets zoomen
///////////////////////////////////////////////////////////////////////////

function InitApplication()
{
	var prot = location.protocol;
	var online = (prot == "http:");
	var home = online ? HOME_ONLINE : HOME_OFFLINE;
	APP_URL = prot + "//" + home + "/";
	APP_EMAIL = HOME_EMAIL;
	document.writeln("<link rel='stylesheet' type='text/css' href='"+APP_URL+LINK_CSS+"'></link>");
	GetWinVersion();
	GetBrowser();
	GetMonitor();
	if(WIDTH_PAGE_ZOOM != 1)
	{
		LoadJsModule(APP_URL+LINK_UPDATECSS,"LINK_UPDATECSS");
	}
}

// Monitorauflösung ermitteln und
// ggf. Zoom-Faktor festlegen

function GetMonitor()
{
	var w = GetWindowWidth();
	HEIGHT_PAGE = GetWindowHeight();

	if(WIDTH_PAGE > w)
	{
		w -= 50;
		WIDTH_PAGE_ZOOM = w/WIDTH_PAGE;
	}
}

///////////////////////////////////////////////////////////////////////////
// Go...
///////////////////////////////////////////////////////////////////////////

InitApplication();