// JavaScript Documents
   
var formularValid = false;
errorArray = new Object();

errorArray["textfeld"]  = false;
errorArray["Vorname"]  = false;
errorArray["Nachname"] = false;
errorArray["stadt"] = false;
errorArray["Telefon"] = false;
errorArray["Email"] = false;

var formIsOk = 1;
    function checkSubmitButton()
        {
          var formIsOk = 1;
          for (var Eigenschaft in errorArray) 
          {
            
            if(errorArray[Eigenschaft]== false) 
            {
                //alert('checkSubmitButton: ' +Eigenschaft + ' ist '+ errorArray[Eigenschaft]); /*Gibt fr jedes Objekt Array eine Warnung aus um den Inhalt auf true oder false zu prfen*/
                formIsOk = 0;
                        break;
            }
            else
            {
            formIsOK = 1;
            
            }
          } 
          
          if (formIsOk == 1) {
          //alert('form is ok');
            document.getElementById('formSender').disabled = false;
            document.getElementById('formSender').style.color = '#000000';            
            document.getElementById('userAngaben').innerHTML="Ihre persönlichen Angaben sind in Ordnung!";
            document.getElementById('userAngaben').style.color="#00CC00";
            document.getElementById('userAngaben').style.fontWeight = '900';
          } else {
          //alert('form is NOT ok');
            document.getElementById('formSender').disabled = true;
            document.getElementById('formSender').style.color = '#909090';
            document.getElementById('userAngaben').innerHTML="Bitte überprüfen Sie ihre persönlichen Angaben!";
            document.getElementById('userAngaben').style.color="red"; /*Hier wird nicht wie fgColor(HTML) der style sheet angesprochen*/
            document.getElementById('userAngaben').style.fontWeight = '900';
            
          }
        }


    function initialisierung() /*Hier wird zu Beginn beim laden der Datei:*/
        {    
            document.forms.form2.reset();
            // In diesem Teil der Funtion wird nur das 'p' tag mit der id 'dritterAbsatz' gesucht und style werden vergegeben
            // Da Elemente mit 'document.getElementById' angesprochen werden können, werden diese direkt angsprochen
            var wechElement = document.getElementById('dritterAbsatz'); /*Eine Mthode document Objects,holt sich ein ELement bei seiner ID*/
            wechElement.style.display = 'none'; /*Der Absatz "dritter Absatz" versteckt mit "display = none*/
            //alert(wechElement.style.display); /*tested den aktuellen Zustand des Elements wechElement.style.display*/
            // In diesem Teil der Funktion werden alle 'p' tags gesucht um Ihnen während der Initialisierung bestimmte style werte zu geben
            // Da man aber die Elemente nicht mit "document.getElementsByClass" ansprechen kann, muss sich anders beholfen werden               
            var allElems = document.getElementByTagName('p'); /*Variable  allElems wird ein Arrays*/
            // alert(typeof allElems); /*Debugging des TYp von allElems*/
            //alert(allElems.length); /*die Länge des Elements allElems*/
            //allElems[1].style.color = "yellow";
            for (var i = 0; i < allElems.length; i++) /*Anzahl der Elemente im Array (allElems.lenth und z&auml;hlt rauf*/
                {
                //alert('rum');
                var paragraph = allElems[i]; /*Variable paragraph wird in jedem Durchlauf mit aktuellen Element des Array bef�llt  */
                if (paragraph.className && paragraph.className == 'Absatz') /*Erst wird nach Klasse gepr�ft, dann nach Klasse mit Namen "Absatz"*/
                    {
                    paragraph.style.color = '#767676'; /*Auf diese "RICHTIGEN" Elemente werden dann die Eigenschaften angewand*/
                    paragraph.style.fontSize ='9px';      /*"font-Size" wird bei dieser Verwendung IMMER im camelCase fontSize*/    
                    }
                }  
        }
        
     //EIN ECHTER MINDFUCK!!!!!!!
     function resetteAlleTextFelder()
        {
        //alert('los gehts!');
        document.forms.form2.reset();
        document.getElementById('textfeld').style.backgroundColor='#FFFFFF';
        document.getElementById('textfeld').style.borderColor='silver';
        var formularfelder = document.getElementsByTagName('input');
        //alert(formularfelder.length);
            for (i = 0; i < formularfelder.length; i++) /*Anzahl der Elemente im Array (allElems.length und z�hlt rauf*/                                                                    
            {
                var feldtester = formularfelder[i];        /*Variable feldtester wird in jedem Durchlauf mit aktuellen Element des Array bef�llt  */
                /*Diese sind nun OBJEKTE*/
                //alert(feldtester.id);// tested die Zahl der Felder
                feldtester.style.backgroundColor='#FFFFFF';
                feldtester.style.borderColor='silver';
                /*Erst wird nach der id gepr�ft, auf diese Felder wird die �nderung NICHT ausgef�hrt*/
                /*Sonst werden der reset und der submit Button eckig dargestellt weil sie ebenfalls resettet werden!!!*/
                if(feldtester.id != 'resetter' && feldtester.id != 'formSender')
                    {
                        //alert(feldtester.id);// tested die Zahl der Felder
                        //value = ''; //wird nun durch "document.forms.Kontakt.reset();" �berfl�ssig!!!
                    }
            }
        //document.getElementById('formSender').disabled = true;    
        }
        
    function inputCheckinit() /*Verpasst dem Formular die Info dass noch Felder ausgef�llt werden m�ssen*/
       {
        document.getElementById('formSender').disabled = true;
        document.getElementById ('formSender').style.color = '#909090';
        var userAngabenInhalt = document.getElementById('userAngaben');
        var userBestellung = document.getElementById('oderStatus')
        document.getElementById('userAngaben').innerHTML="Bitte &uuml;berpr&uuml;fen Sie ihre pers&ouml;nlichen Angaben!";
        document.getElementById('userAngaben').style.color="red"; /*Hier wird nicht wie fgColor(HTML) der style sheet angesprochen*/
        document.getElementById('userAngaben').style.fontWeight = '900';
       }
       
    function inputCheckinitKontakt() /*Verpasst dem Formular die Info dass noch Felder ausgef�llt werden m�ssen*/
       {
        var userAngabenInhalt = document.getElementById('userAngaben');
        document.getElementById('userAngaben').innerHTML="Bitte &uuml;berpr&uouml;fen Sie ihre pers&ouml;nlichen Angaben!";
        document.getElementById('userAngaben').style.color="#990000";
       }


    
function checkOrderForNumber(feld)
        {
        feld.style.backgroundColor = '#FFFFFF';
        feld.style.borderColor = 'silver';
        var error = '';
        var stripped = feld.value.replace(/[\(\)\.\-\ ]/g, '');    
       if (feld.value != "") 
            {
            if (isNaN(parseInt(stripped))) 
                {
                    feld.value = 'Nur Zahlen';
                    feld.style.backgroundColor = '#FFCC00';
                    feld.style.color = '#000000';
                    errorArray[feld.id] = false;
                    checkSubmitButton();
                } 
            }
       else 
            {
                feld.value = '';
                feld.style.backgroundColor = '#FFFFFF';
                feld.style.color = '#000000';
                errorArray[feld.id] = true;
                
            } 
            checkSubmitButton();
         }             
       
    function aktiviereTextFeld(feld)
        {
            feld.style.borderColor='#000000';
        //alert('drin!'); -> Hier gef&auml;hrlich, der Focus geht aus dem Textfeld und l&ouml;st damit "function deaktiviereTextFeld" aus !!!
        //var textFeldName = document.getElementById('Vorname');
       // document.getElementById('Kontakt').style.opacity = '1';
            if (feld.value =='' || feld.value =="Bitte f&uuml;llen Sie dieses Feld aus" || feld.value == 'Bitten nur Zahlen verwenden' || feld.value =='Dies ist keine Telefon Nummer' || feld.value =='Ihr Postleitzahl scheint zu kurz' || feld.value =='Ihr Postleitzahl scheint zu lang' || feld.value =='Bitte geben Sie eine Postleitzahl ein' || feld.value=='Bitte geben Sie eine Telefon Nummer ein' || feld.value== 'Bitte eine valide email verwenden' || feld.value== 'Bitte teilen Sie uns ihr Anliegen mit.' || feld.value== 'Geht\'s auch  ein wenig ausf&uuml;hrlicher?\n    :)\nWir brauchen ein wenig mehr Informationen um ihr Anliegen bearbeiten zu k&ouml;nnen!' )
            {
            feld.style.color = '#000000'; //Setzt Textfarbe auf schwarz weil diese in der function deaktiviereTextFeld auf weiss gesetzt wird
            feld.style.backgroundColor = '#CCCCCC'; //Setzt die Hintergrundfarbe des gerade aktiven Textfeldes auf grau
            feld.style.borderColor = 'black';
            feld.value = ''; //Leert den Inhalt des gerade aktiven Textfeldes
            }
            if (feld.value !='') 
            {
            feld.style.color = '#000000';
            feld.style.backgroundColor = '#FFFFFF';
            }
        }

    function deaktiviereTextFeld (feld) 
        {
       //alert('deak TF');
        feld.style.backgroundColor = '#FFFFFF';
        feld.style.borderColor = 'silver';
        if (feld.value =='')
            {
//alert('TF leer');
            feld.value = 'Bitte fuellen Sie dieses Feld aus';
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            
            }

        else //Neu EINGEFUEGT
        {
        //alert('tf not empty. switch over feld.id');
    
             switch (feld.id)
                {
     
                case 'Vorname':
                    //alert('vorname auf true');
                    errorArray[feld.id] = true;                         
                    break;
                    
                case 'Nachname':
                    errorArray[feld.id] = true;                        
                    break;                                                              
                                        
                case 'stadt':                
                    errorArray[feld.id] = true;                       
                    break;
                    
                case 'Telefon':                    
                    checkPhone(feld);
                    break;
                                           
                case 'Email':
                    //alert('check Email id');
                    checkEmail(feld);
                    break;
                    
                 case 'textfeld':                 
                    checktextfeld(feld);                 
                    break;
                          
                 }
            }
            checkSubmitButton();
        }
    
    
    function deaktiviereTextFeldWhite (feld)
       {
       feld.style.backgroundColor = '#FFFFFF';
       feld.style.borderColor = 'silver';
       }

    function datenSenden()
        {
        window.location.href = "Danksagung.html";
      }       
function validateFormOnSubmit(theForm) 
    {
    var reason = "";
      reason += checkUsername(theForm.username);
      reason += checkPassword(theForm.pwd);
      reason += checkEmail(theForm.email);
      reason += checkPhone(theForm.phone);
      reason += checkEmpty(theForm.location);  
      if (reason != "") 
      {
        //alert("Some fields need correction:\n" + reason);
        return false;
      }
      //alert("All fields are filled correctly");
      return false;
    }
function checkEmpty(feld) 
    {
        var error = "";
     
        if (feld.value.length == 0) {
            feld.value = 'Bitte f&uuml;llen Sie dieses Feld korrekt aus';
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000'; 
            error = "The requi#FFCC00 field has not been filled in.\n"
        } else {
            feld.style.backgroundColor = 'White';
        }
        return error;  
    }
    
function checktextfeld(feld)
    {
            if (feld.value == "") 
            {
//alert('TF value leer');
            feld.value = 'Bitte teilen Sie uns ihr Anliegen mit.';
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            checkSubmitButton();
            }
        else if (document.forms.form2.textfeld.value.length < 20)
            {
//alert('TF < 20');
            feld.value = 'Geht\'s auch  ein wenig ausfuehrlicher?\n    :)\nWir brauchen ein wenig mehr Informationen um ihr Anliegen bearbeiten zu koennen!';
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            checkSubmitButton();
            }
        else
            {
//alert('TF gueltig');
            errorArray[feld.id] = true;
            checkSubmitButton();
            }
            
            
    }    
    


function trim(s)
    {
      return s.replace(/^\s+|\s+$/, '');
    }
    
function checkEmail(feld) 
    {
   var error = "";

    var tfeld = trim(feld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;
    //fehlermeldungArrayUserInfo[feldnummer] = 0;/* uebergibt den Wert 1 und damit "richtig" an das Array fehlermeldungArrayUserInfo*/
   
    if (feld.value == "") 
        {
            feld.value = 'Bitte f&uuml;llen Sie dieses Feld aus';
            //fehlermeldungArrayUserInfo[feldnummer] = 1; /* uebergibt den Wert 1 und damit "falsch" an das Array fehlermeldungArrayUserInfo*/
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            checkSubmitButton();
            
        } 
    else if (!emailFilter.test(tfeld)) 
        {   //test email for illegal characters -> var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ^-> FEST DEFINIERTE METHODE;
            feld.value = 'Bitte eine valide email verwenden';
            //fehlermeldungArrayUserInfo[feldnummer] = 1; /* uebergibt den Wert 1 und damit "falsch" an das Array fehlermeldungArrayUserInfo*/
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            checkSubmitButton();
        } 
    else if (feld.value.match(illegalChars)) 
        {
            feld.value = 'Emailadresse enthält ungültige Werte!';
            //fehlermeldungArrayUserInfo[feldnummer] = 1; /* uebergibt den Wert 1 und damit "falsch" an das Array fehlermeldungArrayUserInfo*/
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            checkSubmitButton();
        } 
    else 
        {
            feld.style.backgroundColor = 'White';
            errorArray[feld.id] = true;
            checkSubmitButton();
        }
    return error;
    }
     
    
function checkPhone(feld)  
    {
    var error = '';
    var stripped = feld.value.replace(/[\(\)\.\-\ ]/g, '');    
    //fehlermeldungArrayUserInfo[feldnummer] = 0;/* uebergibt den Wert 1 und damit "richtig" an das Array fehlermeldungArrayUserInfo*/
    if (feld.value != "" && feld.value != 'Bitte f�llen Sie dieses Feld aus' ) 
        {
            if (isNaN(parseInt(stripped))) 
            {
                feld.value = 'Bitten nur Zahlen verwenden';
                //fehlermeldungArrayUserInfo[feldnummer] = 1; /* uebergibt den Wert 1 und damit "falsch" an das Array fehlermeldungArrayUserInfo*/
                feld.style.backgroundColor = '#FFCC00';
                feld.style.color = '#000000';
                errorArray[feld.id] = false;
                checkSubmitButton();
            } 
        else if ((stripped.length <= 5)) 
            {
                feld.value = 'Dies ist keine Telefon Nummer';
                //fehlermeldungArrayUserInfo[feldnummer] = 1;/* uebergibt den Wert 1 und damit "falsch" an das Array fehlermeldungArrayUserInfo*/
                feld.style.backgroundColor = '#FFCC00';
                feld.style.color = '#000000';
                errorArray[feld.id] = false;
                checkSubmitButton();
            } 
        else
            {
            errorArray[feld.id] = true;
            checkSubmitButton();
            }   
        }
       else
        {
            feld.value = 'Bitte geben Sie eine Telefon Nummer ein';
            //fehlermeldungArrayUserInfo[feldnummer] = 1; /* uebergibt den Wert 1 und damit "falsch" an das Array fehlermeldungArrayUserInfo*/
            feld.style.backgroundColor = '#FFCC00';
            feld.style.color = '#000000';
            errorArray[feld.id] = false;
            checkSubmitButton();
        }
    }
  
        /*Methoden haben Klammern, Eigenschaften (Attribute) haben KEINE Klammern*/
        /*Variablen haben �hnlichkeiten mit Eigenschaften von Objekten*/
        /*Methoden sind Funktionen die an Objekte gebunden sind*/