/*
Zusammenfassung aller verwendeter JavaScripte in der Matuschek-Website.
Dadurch wird jeweils nur EINE Scriptdatei referenziert was den Header der HTML Dateien schön
klein und übersichtlich hält. Außerdem müssen bei neuen Scripten bzw. Funktionen diese nicht
erneut in allen Dateien eingefügt werden. Es reicht diese in der zentralen Scriptdatei
einzufügen. Der anfängliche Overhead ist vernachlässigbar, da die Datei nach dem ersten
Laden im Browsercache sein sollte.
*/


/*
RollOver Effekt/Bildwechsel für Fussball-Spatz und andere Bilder, die beim Drüberfahren
mit der Maus wechseln sollen.
*/
function bildwechsel(bildname, tauscheIn){
    bildobjekt = new Image();
    
    // Das entsprechende Bild wird je nach Angabe ins Bildobjekt geladen
    bildobjekt.src = "/grafik/homepage/spatzen/" + tauscheIn + ".gif";
    
    // Austauschen des Bildes im Document mit dem Bildobjekt
    window.document.images[bildname].src = bildobjekt.src;
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Funktion, um die Eingabe der Suchwörter im Suchformular zu checken.
Es wird überprüft ob mindestens ein Suchbegriff mit mindestens zwei Zeichen
eingegeben wurde. Wenn nicht, dann wird der User aufgefordert das zu ändern.
Erst wenn mindestens EIN gültiges Suchwort eingegeben wurde werden die Daten an
das PHP-Script weitergeleitet.
*/
function check_search_form(){
    var fehler, eingabe, zweiZeichen, woerter, sprache, fehler_meldung;
    
    // Initialisierung der Meldungen in den versch. Sprachen
    fehler_meldung = new Array();
    
    fehler_meldung[1] = new Array();
    fehler_meldung[1]["de"] = "Bitte geben Sie einen Suchbegriff ein! (mindestens 2 Zeichen)";
    fehler_meldung[1]["en"] = "Please insert a search word! (at least 2 characters)";
    fehler_meldung[1]["fr"] = "Entrez le critère de recherche! (au moins deux signes)";
    
    fehler_meldung[2] = new Array();
    fehler_meldung[2]["de"] = "Suchbegriffe müssen mindestens 2 Zeichen lang sein!";
    fehler_meldung[2]["en"] = "Search words must be at least 2 characters long!";
    fehler_meldung[2]["fr"] = "Longueur minimale d'un critère de recherche: Deux signes!";
    
    // Abfrage der Sprache aus dem versteckten Feld 'lang' im Formular
    // Wenn 'lang' nicht 'en' bzw. 'fr' ist wird auf den Default Wert 'de' gesetzt
    switch(document.suchform.lang.value){
    case "en":
    	sprache = "en";
    	break;
    case "fr":
    	sprache = "fr";
    	break;
    default:
    	sprache = "de";
    	break;
    }
    
    // Fehlerbehandlung
    fehler = 0;
    eingabe = document.suchform.searchwords.value;
    zweiZeichen = false;
    
    // auf 'leere Zeichenkette' und 'nur Leerzeichen' prüfen
    if(eingabe.match(/^\s*$/)){
    	fehler = 1;
    	// Eingabefeld von möglichen Leerzeichen befreien
    	document.suchform.searchwords.value = '';
    }
    
    // Wenn kein Fehler bisher, dann auf 'nur ein Zeichen eingegeben' prüfen
    // Per split() die eingegebenen Begriffe in ein Array schreiben und nachsehen ob die Begriffe
    // ALLE mindestens 2 Zeichen lang sind. Werden Einzeichen-Suchwörter gefunden bricht die
    // Schleife mit einer Fehlermeldung ab. Ansonsten werden die Daten an das Such-Script übergeben.
    if(fehler == 0){
        woerter = eingabe.split(" ");
        
        for(var i=0; i < woerter.length; i++){
        	if(woerter[i].length >= 2){
        		zweiZeichen = true;
        	}else{
            	if(woerter[i] == ''){
                	// multiple Leerzeichen erzeugen beim split() leere Wörter der Länge 0
                	// diese müssen einfach ignoriert werden
                	continue;
            	}
            	// es ist tatsächlich ein Einzeichen-Wort vorhanden
        		zweiZeichen = false;
        		break;// sobald ein Suchbegriff nicht lang genug ist wird die Schleife beendet
        	}
        }
        
        if(! zweiZeichen){
        	fehler = 2;
        }
    }
    
    // Ausgabe der Fehlermeldung
    if(fehler){
    	alert(fehler_meldung[fehler][sprache]);
    	document.suchform.searchwords.focus();
    	return false;
    }
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Funktion zur Überprüfung der obligatorischen Felder im Kontaktformular auf Eingabe. Die
Ausgabe der Meldungen in verschiedenen Sprachen wird durch ein Array gesteuert welches am
Anfang initialisiert wird.
*/
function check_kontakt_formular(){
    // Initialisierung der Meldungen in den versch. Sprachen
    meldungen = new Array();
    
    meldungen["de"] = new Array();
    meldungen["de"]["name"] = "Bitte geben Sie Ihren Namen ein!";
    meldungen["de"]["firma"] = "Bitte geben Sie Ihre Firma an!";
    meldungen["de"]["anschrift"] = "Bitte geben Sie Ihre Anschrift ein!";
    meldungen["de"]["telefon"] = "Bitte geben Sie Ihre Telefonnummer an!";
    meldungen["de"]["email"] = "Bitte geben Sie Ihre Email Adresse ein!";
    meldungen["de"]["sec_item_flaw"] = "Bitte geben Sie 'OK' ein!";
    
    meldungen["en"] = new Array();
    meldungen["en"]["name"] = "Please enter your name!";
    meldungen["en"]["firma"] = "Please enter your organisation!";
    meldungen["en"]["anschrift"] = "Please enter your address!";
    meldungen["en"]["telefon"] = "Please enter your phone number!";
    meldungen["en"]["email"] = "Please enter your email address!";
    meldungen["en"]["sec_item_flaw"] = "Please enter 'OK' as security code!";
    
    meldungen["fr"] = new Array();
    meldungen["fr"]["name"] = "Veuillez entrer votre nom!";
    meldungen["fr"]["firma"] = "Veuillez entrer votre société!";
    meldungen["fr"]["anschrift"] = "Veuillez entrer votre adresse!";
    meldungen["fr"]["telefon"] = "Veuillez entrer votre numéro de téléphone!";
    meldungen["fr"]["email"] = "Veuillez entrer votre adresse e-mail!";
    meldungen["fr"]["sec_item_flaw"] = "Veuillez entrer 'OK'!";
    
    // Abfrage der Sprache aus dem versteckten Feld 'sprache' im Formular
    // Wenn 'sprache' nicht 'en' bzw. 'fr' ist wird auf den Default Wert 'de' gesetzt
    switch(document.InfoFormular.lang.value){
    case "en":
    	sprache = "en";
    	break;
    case "fr":
    	sprache = "fr";
    	break;
    default:
    	sprache = "de";
    	break;
    }
    
    // Abfrage der obligatorischen Felder auf Eingabe
    if(document.InfoFormular.Name.value == ""){
    	alert(meldungen[sprache]["name"]);
    	document.InfoFormular.Name.focus();
    	return false;
    }
    if(document.InfoFormular.Firma.value == ""){
    	alert(meldungen[sprache]["firma"]);
    	document.InfoFormular.Firma.focus();
    	return false;
    }
    if(document.InfoFormular.Anschrift.value == ""){
    	alert(meldungen[sprache]["anschrift"]);
    	document.InfoFormular.Anschrift.focus();
    	return false;
    }
    if(document.InfoFormular.Telefon.value == ""){
    	alert(meldungen[sprache]["telefon"]);
    	document.InfoFormular.Telefon.focus();
    	return false;
    }
    if(document.InfoFormular.Email.value == ""){
    	alert(meldungen[sprache]["email"]);
    	document.InfoFormular.Email.focus();
    	return false;
    }
    if(document.InfoFormular.sec_item.value.toUpperCase() != "OK"){
    	alert(meldungen[sprache]["sec_item_flaw"]);
    	document.InfoFormular.sec_item.focus();
    	return false;
    }
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Funktion um Elemente ein- bzw. auszublenden. Meist in Verbindung mit dem Drüberfahren der
Maus über ein Bild oder ähnliches.
*/
function element_anzeigen(id, modus){
    if(modus == "an"){
    	document.getElementById(id).style.visibility = "visible";
    }else{
    	document.getElementById(id).style.visibility = "hidden";
    }
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Funktion um das Fenster mit den vergrößerten Bildern auf den Produktseiten aufzumachen
*/
function fensterOeffnen(adresse){
    // Bildschirmdimensionen holen
    hoehe = screen.height;
    breite = screen.width;
    
    // linke, obere Ecke des neuen Fensters berechnen, welches mittig aufgehen soll
    // dabei die Werte halbieren und die halbe Fenstergröße (637/2 = 318) abziehen
    links = (breite / 2) - 318;
    oben = (hoehe / 2) - 318;
    
    // Öffnen und fokussieren des Fensters
    fenster = window.open(adresse, "Zweitfenster", "width=637,height=637,left=" + links + ",top=" + oben);
    fenster.focus();
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Funktion zur Überprüfung der obligatorischen Felder in der Messeantwort auf Eingabe. Die
Ausgabe der Meldungen in verschiedenen Sprachen wird durch ein Array gesteuert welches am
Anfang initialisiert wird.
*/
function check_messeantwort(){
    // Initialisierung der Meldungen in den versch. Sprachen
    meldungen = new Array();
    
    meldungen["de"] = new Array();
    meldungen["de"]["name"] = "Bitte geben Sie Ihren Namen ein!";
    meldungen["de"]["firma"] = "Bitte geben Sie Ihre Firma an!";
    meldungen["de"]["anschrift"] = "Bitte geben Sie Ihre Anschrift ein!";
    meldungen["de"]["telefon"] = "Bitte geben Sie Ihre Telefonnummer an!";
    meldungen["de"]["email"] = "Bitte geben Sie Ihre Email Adresse ein!";
    meldungen["de"]["sec_item_flaw"] = "Bitte geben Sie 'OK' ein!";
    meldungen["de"]["terminkontakt_flaw"] = "Bitte geben Sie wenigstens eines der Felder Anschrift, E-Mail oder Telefon ein! Anderenfalls sind wir nicht in der Lage Sie für einen Besuchstermin zu kontaktieren.";
    
    meldungen["en"] = new Array();
    meldungen["en"]["name"] = "Please enter your name!";
    meldungen["en"]["firma"] = "Please enter your organisation!";
    meldungen["en"]["anschrift"] = "Please enter your address!";
    meldungen["en"]["telefon"] = "Please enter your phone number!";
    meldungen["en"]["email"] = "Please enter your email address!";
    meldungen["en"]["sec_item_flaw"] = "Please enter 'OK' as security code!";
    meldungen["en"]["terminkontakt_flaw"] = "Please enter at least one of the fields: address, email or phone number! Otherwise we won't be able to contact you for an appointment.";
    
    meldungen["fr"] = new Array();
    meldungen["fr"]["name"] = "Veuillez entrer votre nom!";
    meldungen["fr"]["firma"] = "Veuillez entrer votre société!";
    meldungen["fr"]["anschrift"] = "Veuillez entrer votre adresse!";
    meldungen["fr"]["telefon"] = "Veuillez entrer votre numéro de téléphone!";
    meldungen["fr"]["email"] = "Veuillez entrer votre adresse e-mail!";
    meldungen["fr"]["sec_item_flaw"] = "Veuillez entrer 'OK'!";
    meldungen["fr"]["terminkontakt_flaw"] = "Au moins un des champs E-mail, téléphone ou adresse est obligatoire. Autrement nous ne pourrions pas vous contacter pour fixer une date pour une visite.";
    
    // Abfrage der Sprache aus dem versteckten Feld 'sprache' im Formular
    // Wenn 'sprache' nicht 'en' oder 'fr' ist wird auf den Default Wert 'de' gesetzt
    switch(document.Messeantwort.lang.value){
    case "en":
    	sprache = "en";
    	break;
    case "fr":
    	sprache = "fr";
    	break;
    default:
    	sprache = "de";
    	break;
    }
    
    // Abfrage der obligatorischen Felder auf Eingabe
    if(document.Messeantwort.Name.value == ""){
    	alert(meldungen[sprache]["name"]);
    	document.Messeantwort.Name.focus();
    	return false;
    }
    if(document.Messeantwort.Firma.value == ""){
    	alert(meldungen[sprache]["firma"]);
    	document.Messeantwort.Firma.focus();
    	return false;
    }
    if(document.Messeantwort.sec_item.value.toUpperCase() != "OK"){
    	alert(meldungen[sprache]["sec_item_flaw"]);
    	document.Messeantwort.sec_item.focus();
    	return false;
    }
    
    // Wenn eine Terminvereinbarung gewünscht ist muss wenigstens Anschrift, E-Mail oder Telefon
    // angegeben sein
    if(document.Messeantwort.Terminvereinbarung.checked == true){
        if((document.Messeantwort.Anschrift.value == "") && (document.Messeantwort.Email.value == "") && (document.Messeantwort.Telefon.value == "")){
           	alert(meldungen[sprache]["terminkontakt_flaw"]);
        	return false;
        }
    }

}

////////////////////////////////////////////////////////////////////////////////////////////

/* 
Ausgabe des Drucker-Icons inkl. dem hinterlegten JavaScript falls JavaScript aktiviert ist.
Die Drucker-Hinweisbox wird auch nur generiert wenn JavaScript aktiviert ist. Anderenfalls
wird sie ja nicht benötigt und der Download kann gespart werden.
*/
function showPrinter(){
    // extract the language information
    lang = getLang();
    
    // Drucker Bild in das vorbereitete span einfügen
    $("#druckerSpan").html('<a href="javascript:window.print()"><img id="druckerIcon" src="/grafik/layout/drucker.gif" style="vertical-align:middle; width:17px; height:20px" alt=""></a>');
    
    // Drucker-Hinweis Bild an das Ende vom Body anhängen
    $("body").append('<img id="druckerHinweis" src="/grafik/layout/drucken_hinweis_' + lang + '.gif" alt="">');
    
    // Hover Effekt aktivieren
    $("#druckerIcon").hover(
        function(){
            // absolute Position vom Drucker Icon bestimmen, danach die Position für die 
            // linke Kante der Box berechnen
            // Drucker ist 17px breit  ->  off.left + 8 px = Mitte vom Drucker Icon
            // Hinweisbox ist 175px breit  ->  87px von der Mitte nach links verschieben
            var off = $("#druckerIcon").offset();
            var pos = (off.left + 8) - 87;
            var viewport = $(window).width();
            if(viewport < pos + 175){
                pos = viewport - 175;
            }
            $("#druckerHinweis").css("left",pos);
            $("#druckerHinweis").css("visibility","visible");
        },
        function(){
            $("#druckerHinweis").css("visibility","hidden");
            // beim Ändern der Fenstergröße kann ein Scrollbalken entstehen wenn die absolute
            // Position beibehalten wird -> löschen der linken Positionsangabe
            $("#druckerHinweis").css("left","");
        });
    
    // Klickbehandlung
    $("#druckerIcon").click(function(){
        $("#druckerHinweis").css("visibility","hidden");
    });
    
}

////////////////////////////////////////////////////////////////////////////////////////////

/* 
Die PDF-Hinweisbox wird nur generiert wenn JavaScript aktiviert ist. Anderenfalls
wird sie ja nicht benötigt und der Download kann gespart werden.
Hovereffekt für die PDF-Hinweisbox einschalten und gleichzeitig das standardmäßige Tooltip
ausschalten, damit nicht beides gleichzeitig angezeigt wird.
Außerdem muss die Hinweisbox auch wieder verschwinden wenn man auf das PDF Icon klickt.
Entweder erscheint dann der Download Dialog oder aber das PDF wird im Browser angezeigt. In
letzterem Fall bleibt die Hinweisbox sichtbar, da kein Mouseout Event generiert wird.
*/
function showPdfHinweisBox(){
    // extract the language information
    lang = getLang();
    
    // PDF-Hinweis Bild in das vorbereitete span einfügen
    $("body").append('<img id="pdfHinweis" src="/grafik/layout/pdf_hinweis_' + lang + '.gif" alt="">');
    
    // deaktivieren des Tooltip durch setzen des Title Attributs
    $("#pdfIcon").attr("title","");
    
    // Hover Effekt aktivieren
    $("#pdfIcon").hover(
        function(){
            // absolute Position vom PDF Icon bestimmen, danach die Position für die 
            // linke Kante der Box berechnen
            // Icon ist 25px breit  ->  off.left + 12 px = Mitte vom PDF Icon
            // Hinweisbox ist 175px breit  ->  87px von der Mitte nach links verschieben
            var off = $("#pdfIcon").offset();
            var pos = (off.left + 12) - 87;
            var viewport = $(window).width();
            if(viewport < pos + 175){
                pos = viewport - 175;
            }
            $("#pdfHinweis").css("left",pos);
            $("#pdfHinweis").css("visibility","visible");
        },
        function(){
            $("#pdfHinweis").css("visibility","hidden");
            // beim Ändern der Fenstergröße kann ein Scrollbalken entstehen wenn die absolute
            // Position beibehalten wird -> löschen der linken Positionsangabe
            $("#pdfHinweis").css("left","");
        });
        
    // Klickbehandlung
    $("#pdfIcon").click(function(){
        $("#pdfHinweis").css("visibility","hidden");
    });
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Markiert jede zweite Zeile der Datentabellen mit einem anderen Hintergrund um die Zeilen
besser voneinander unterscheiden zu können.
Dabei werden zuerst alle initial markierten Zeilen von ihrer Klasse befreit damit keine
Zeilen falsch markiert werden. Die initiale Markierung wird zur besseren Orientierung 
benötigt falls kein JavaScript eingeschaltet ist.
Ausserdem wird bei Zeilen, die explizit mit '.noChange' markiert sind die Klasse
'.marked' wieder entfernt, um sicher zu gehen, dass dort der Hintergrund nicht gewechselt
wird. Das ist z.B. beim Multi04 -> Kraftmessung nötig, da dort die Bilder _innerhalb_ der 
Tabelle liegen und sonst evtl. den falschen Hintergrund haben.
*/
function prepareDataTables(){
    $("table.daten tr").removeClass("marked");
    $("table.daten tr:odd").addClass("marked");
    $("table.daten tr.noChange").removeClass("marked");
    
    // enable hover action for each table row
    $("table.daten tr").hover(
        function(){
            if(!$(this).is(".noChange")){
                $(this).addClass("hover");
            }
        },
        function(){
            if(!$(this).is(".noChange")){
                $(this).removeClass("hover");
            }
        });
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Extracts the language information from the attribute that is defined in the html-tag.
If the language value is not valid or not set at all we will fallback to the default.
*/
function getLang(){
        var lang = $("html").attr("lang");
    
    if((lang !== 'de') && (lang !== 'en') && (lang !== 'fr')){
        lang = 'en';
    }
    
    return lang;  
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
This enables the pop up window for enlarged product images. The click-event will be assigned 
to all product images with a special class. The click handler will perform the pop up action
and for better usability we will assign a magnifying glass and some text on top of the image
to let the user know that this image can be enlarged.
*/
function enableBigImages(){
    // extract the language information
    lang = getLang();
    
    // extract the collection of relevant DOM elements
    var coll = $(".produktbild, .produktbild_folgend, .produktbild_tabelle");
    
    // append the two versions of the magnifying glass to the end of the document for later usage
    $("body").append('<img id="magnify" src="/grafik/layout/lupe_text_' + lang + '.gif" style="position:absolute; top:0px; left:0px; visibility:hidden; z-index:5; width:111px; height:21px" alt="">');
    $("body").append('<img id="magnifyTable" src="/grafik/layout/lupe_text_tabelle_' + lang + '.gif" style="position:absolute; top:0px; left:0px; visibility:hidden; z-index:5; width:111px; height:21px" alt="">');
    
    // assign the hover effect to show the magnifying glass with text
    coll.hover(
        function(){
            // change the cursor over the image into a pointer
            // to show that a click is possible (standard link behaviour)
            $(this).css("cursor","pointer");
            var off = $(this).offset();
            var h = $(this).height();
            // calculate the position of the top coordinate for the magnifying glass
            // the magnifying glass is 21 pixel in height but will be positioned under
            // the product image minus some pixel because of the border of the magnifying glass
            var posT = off.top + h;
            if($(this).hasClass("produktbild_tabelle")){
                $("#magnifyTable").css({"visibility":"visible","top":posT,"left":off.left});
            }else{
                $("#magnify").css({"visibility":"visible","top":posT,"left":off.left});
            }
        },
        function(){
            // simply hide the magnifying glass again
            $("#magnify").css("visibility","hidden");
            $("#magnifyTable").css("visibility","hidden");
        });
    
    // assign the click handler that will initiate the actual handling function
    coll.click(function(){
        var url = $(this).attr("src");
        if(url.indexOf('/anwendungen/') != -1){
            url = '/grafik/anwendungen/gross/' + url.substring(url.lastIndexOf('/')+1, url.length);
        }else{
            url = '/grafik/produkte/gross/' + url.substring(url.lastIndexOf('/')+1, url.length);
        }
        fensterOeffnen(url);
    });
}

////////////////////////////////////////////////////////////////////////////////////////////

/*
Funktionen welche direkt nach dem vollständigen Laden der Seite aufgerufen werden.
Wird auf alle Seiten angewandt!
*/
$(document).ready(function(){
    showPrinter();
    showPdfHinweisBox();
    prepareDataTables();
    enableBigImages();
});