/****************** Alle Rechte vorbehalten: Rainer Wagener, wagener [ed] rohschnitt.de **********************/

 function testat()
 {
    if(!document.getElementById || !document.body.nodeName || ie_mac)
       return;

    var selector = new Object;

    if(document.cookie)
       estilo = parseInt(wertholen("estilo"));

    var x = new Array(3);
    for (var i=0;i<x.length;i++)
       x[i] = "";

    if(estilo <= 2 && estilo >= 0) x[estilo] = " selected";

/**************** Warnhinweis für Screenreadernutzer mit Javascript *******************/

    if(navigator.userAgent.indexOf("Safari") == -1)
    {
       selector = "<h3 class=\"hide\">Achtung Screenreader-Nutzer!</h3>\n";
       selector += "<p class=\"hide\"><strong>Der folgende Bereich ist für Nutzer von <span lang=\"en\">Screenreadern</span> kaum nutzbar. Es handelt sich ausschließlich um Möglichkeiten der optischen Anpassung dieses Webautritts. Sie können diesen Bereich überspringen zu den <a href=\"#tech\">technischen Hinweisen</a>. Falls Sie doch weitergehen wollen, lassen Sie sich in dem der Überschrift \"Farben anpassen\" folgenden Formular nicht verwirren. Sie werden dort einige Buttons antreffen, die sie nicht bedienen können.</strong></p>";

/**************** Gruppe Seitenstil wählen *******************/

       selector += "<div>\n";
    }

    else
    {
       selector = "<div>\n";
    }

    selector += "<h3><a name=\"stil\" id=\"stil\">Verschiedene Seitenstile wählen</a></h3>\n";
    selector += "<p class=\"norm\">Zur Anpassung des Internetangebots der <acronym title=\"Bundesakademie für Kirche und Diakonie\">BAKD</acronym> an Ihre persönlichen Bedürfnisse oder Vorlieben stehen Ihnen verschiedene Seitenstile zur Verfügung. Bei starker Vergrößerung (ab 200%) sollte auf den Stil \"XXL-Flex\" gewechselt werden. Der Stil \"Freie Farbwahl\" vereinigt die Flexibilität von \"XXL-Flex\" mit der Möglichkeit, über die Schieberegler oder per Eingabe eine individuelle Anpassung der Vorder- und Hintergrundfarbe vorzunehmen. Die vorgenommenen Änderungen bleiben im gesamten Internetauftritt gültig.<br><strong>Wichtig: Der eingestellte Seitenstil kann nur über den anschließenden Selektor rückgängig gemacht werden!<br>Auch wichtig: Für alle Einstellungen muß zuerst der entsprechende Seitenstil im Selektor gewählt werden!</strong></p>\n";

    selector += "<form id=\"fo1\" action=\"javascript:stilwaehl()\">\n";
    selector += "<fieldset>\n";
    selector += "<legend>Seitenstil</legend>\n";
    selector += "<select size=\"1\">\n";
    selector += "<option" + x[0] + ">Standardstil</option>\n";
    selector += "<option" + x[1] + ">XXL-Flex</option>\n";
    selector += "<option" + x[2] + ">Freie Farbwahl</option>\n";
    selector += "</select>\n";
    selector += "</fieldset>\n";
    selector += "</form>\n";

    selector += "<p class=\"norm\"><a class=\"seitetop\" href=\"#inhalt\">Seitenanfang</a></p>\n";
    selector += "</div>\n";

/**************** Gruppe Schriftgröße wählen *******************/

    selector += "<div>\n";
    selector += "<h3 class=\"noborder\"><a name=\"schriftg\" id=\"schriftg\">Schriftgröße wählen</a></h3>\n";
    selector += "<p class=\"norm\">Hier können Sie die Schriftgröße unabhängig von den Möglichkeiten Ihres Browsers ändern. <br><strong>Wichtig: Dazu muß der Seitenstil \"XXL-Flex\" oder \"Freie Farbwahl\" eingestellt sein!</strong></p>\n";

    selector += "<form id=\"fo2\" action=\"javascript:em()\" method=\"post\">\n";
    selector += "<fieldset>\n";
    selector += "<legend>Schriftgröße</legend>\n";
    selector += "<input id=\"first\" type=\"submit\" value=\"größer\">\n";
    selector += "<input type=\"submit\" value=\"kleiner\">\n";
    selector += "<input type=\"submit\" value=\"normal\">\n";
    selector += "</fieldset>\n";
    selector += "</form>\n";

    selector += "<p class=\"norm\"><a class=\"seitetop\" href=\"#inhalt\">Seitenanfang</a></p>\n";
    selector += "</div>\n";

/**************** Gruppe Farben wählen *******************/

    selector += "<div>\n";
    selector += "<h3 class=\"noborder\"><a name=\"farben\" id=\"farben\">Farben anpassen</a></h3>\n";
    selector += "<p class=\"norm\">Hier können Sie die Vorder- und Hintergrundfarbe an Ihre persönlichen Bedürfnisse anpassen. Die einfache Bedienung der Schieberegler per Maus oder Tastatur ist weiter unten ausführlich erklärt. <br><strong>Wichtig: Zur Farbanpassung muß der Seitenstil \"Freie Farbwahl\" eingestellt sein!</strong></p>\n";
    selector += "</div>\n";

/**************** Schieberegler *******************/

    selector += "<form id=\"fo3\" action=\"\">\n";
    selector += "<div>\n";
    selector += "<h4 id=\"schrift\">Schriftfarbe</h4>\n";
    selector += "<h4 id=\"hinten\">Hintergrundfarbe</h4>\n";

    if(navigator.userAgent.indexOf("Safari") == -1)
    {
       selector += "<div class=\"unten\" id=\"d100\"></div>\n";
       selector += "<input type=\"button\" value=\"\" class=\"oben\" id=\"b0\">\n";
       selector += "<div class=\"unten\" id=\"d101\"></div>\n";
       selector += "<input type=\"button\" value=\"\" class=\"oben\" id=\"b1\">\n";
       selector += "<div class=\"unten\" id=\"d102\"></div>\n";
       selector += "<input type=\"button\" value=\"\" class=\"oben\" id=\"b2\">\n";
       selector += "<input type=\"button\" id=\"weiss\" value=\"Standard\"><br>\n";
       selector += "<input type=\"button\" id=\"schwarz\" value=\"Invert\"><br>\n";
       selector += "<input type=\"button\" id=\"lau\" value=\"Gelb-Blau\">\n";
       selector += "<div class=\"unten\" id=\"d103\"></div>\n";
       selector += "<input type=\"button\" value=\"\" class=\"oben\" id=\"b3\">\n";
       selector += "<div class=\"unten\" id=\"d104\"></div>\n";
       selector += "<input type=\"button\" value=\"\" class=\"oben\" id=\"b4\">\n";
       selector += "<div class=\"unten\" id=\"d105\"></div>\n";
       selector += "<input type=\"button\" value=\"\" class=\"oben\" id=\"b5\">\n";
    }

    else
    {
       selector += "<div class=\"unten\" id=\"d100\"></div>\n";
       selector += "<button type=\"button\" value=\"\" class=\"oben\" id=\"b0\"></button>\n";
       selector += "<div class=\"unten\" id=\"d101\"></div>\n";
       selector += "<button type=\"button\" value=\"\" class=\"oben\" id=\"b1\"></button>\n";
       selector += "<div class=\"unten\" id=\"d102\"></div>\n";
       selector += "<button type=\"button\" value=\"\" class=\"oben\" id=\"b2\"></button>\n";
       selector += "<input type=\"button\" id=\"weiss\" value=\"Standard\"><br>\n";
       selector += "<input type=\"button\" id=\"schwarz\" value=\"Invert\"><br>\n";
       selector += "<input type=\"button\" id=\"lau\" value=\"Gelb-Blau\">\n";
       selector += "<div class=\"unten\" id=\"d103\"></div>\n";
       selector += "<button type=\"button\" value=\"\" class=\"oben\" id=\"b3\"></button>\n";
       selector += "<div class=\"unten\" id=\"d104\"></div>\n";
       selector += "<button type=\"button\" value=\"\" class=\"oben\" id=\"b4\"></button>\n";
       selector += "<div class=\"unten\" id=\"d105\"></div>\n";
       selector += "<button type=\"button\" value=\"\" class=\"oben\" id=\"b5\"></button>\n";
    }

    selector += "</div>\n";
    selector += "</form>\n";

/**************** Eingabe- Ausgabefelder *******************/

    selector += "<div id=\"centro\">\n";
    selector += "<form id=\"fo4\" action=\"javascript:uebernehmen(201)\">\n";
    selector += "<fieldset>\n";
    selector += "<legend>Schriftfarbe</legend>\n";
    selector += "<label for=\"read01\" class=\"hide\">aktuelle Schriftfarbe</label>\n";
    selector += "<input class=\"eingabe\" id=\"read01\" type=\"text\" value=\"#000\" readonly><br>\n";
    selector += "<label for=\"f201\" class=\"hide\">Eingabe der Schriftfarbe</label>\n";
    selector += "<input class=\"eingabe texter\" id=\"f201\" type=\"text\" maxlength=\"10\" value=\"Eingabe\"><br>\n";
    selector += "<input class=\"aply\" type=\"submit\" value=\"Übernehmen\">\n";
    selector += "</fieldset>\n";
    selector += "</form>\n";

    selector += "<form id=\"fo5\" action=\"javascript:uebernehmen(204)\" method=\"post\">\n";
    selector += "<fieldset>\n";
    selector += "<legend>Hintergrundfarbe</legend>\n";
    selector += "<label for=\"read04\" class=\"hide\">aktuelle Hintergrundfarbe</label>\n";
    selector += "<input class=\"eingabe\" id=\"read04\" type=\"text\" value=\"#FFF\" readonly><br>\n";
    selector += "<label for=\"f204\" class=\"hide\">Eingabe der Hintergrundfarbe</label>\n";
    selector += "<input class=\"eingabe texter\" id=\"f204\" type=\"text\" maxlength=\"10\" value=\"Eingabe\"><br>\n";
    selector += "<input class=\"aply\" type=\"submit\" value=\"Übernehmen\">\n";
    selector += "</fieldset>\n";
    selector += "</form>\n";
    selector += "<p class=\"clear\"><a class=\"seitetop\" href=\"#inhalt\">Seitenanfang</a></p>\n";

    selector += "</div>\n";

/**************** Erklärung *******************/

    selector += "<div id=\"erklaer\">\n";
    selector += "<h4><a class=\"sprung\" name=\"bedien\" id=\"bedien\">Bedienung der Farbanpassung</a></h4>\n";
    selector += "<p>Zuerst den Seitenstil auf \"Freie Farbwahl\" einstellen. Dann können Sie die Farbanpassung mit der Maus, per Tastatur oder mittels Eingabe in die vorgesehenen Felder bedienen. <br>In jedem Fall wird die gewählte Schrift- und Hintergrundfarbe sofort übernommen und angezeigt.</p>\n";
    selector += "<h5>Bedienung mit der Maus:</h5>\n";
    selector += "<p>Entweder die Schieberegler wie üblich durch Tastendruck mit der Maus 'anfassen' und dann verschieben, oder auf die Laufbahn über <abbr title=\"beziehungsweise\">bzw.</abbr> unter dem Schieberegler klicken oder drücken.</p>\n";
    selector += "<h5>Bedienung mit der Tastatur:</h5>\n";
    selector += "<p>Den Focus auf einen Schieberegler setzen und dann mit der O-Taste nach oben und mit der U-Taste nach unten schieben.</p>\n";
    selector += "<h5>Buttons zur Schnellbedienung:</h5>\n";
    selector += "<p>Mit dem Button 'Standard' können Sie sofort in die Ausgangsansicht (schwarz auf weiß) zurückkehren. Der Button 'Invert' führt zur invertierten Ansicht (weiß auf schwarz) und der untere Button 'Gelb-Blau' bewirkt gelbe Schrift auf blauem Hintergrund.</p>\n";
    selector += "<h5>Eingabe von Farbwerten (für Profis):</h5>\n";
    selector += "<p>In das  mit 'Eingabe' vorbelegte Feld klicken oder mit dem Tabulator den Focus setzen und einen dreistelligen Farbwert in hexadezimaler Form (<abbr title=\"zum Beispiel\">z.B.</abbr> #FC3 oder nur FC3) eingeben. Nun auf den Übernahme-Button klicken oder einfach die Eingabetaste drücken. <br>Hexadezimale Zahlen bestehen aus den normalen Ziffern (0 bis 9) und zusätzlich den Buchstaben von A bis F. Ein dreistelliger hexadezimaler Farbwert wäre also z.B. \"00F\", was dunkelblau entspricht. Alle Zeichen, die keinem hexadezimalen Wert entsprechen, werden ignoriert. Mehr als drei sinnvolle Werte werden nicht interpretiert. Wenn Sie weniger als drei sinnvolle Werte eingeben, wird die Farbe nur entsprechend der Anzahl dieser Werte verändert (Sie geben <abbr title=\"zum Beispiel\">z.B.</abbr> #88 ein und verändern damit die Farbe von #000 zu #880).</p>\n";

    selector += "<p class=\"clear\"><a class=\"seitetop\" href=\"#inhalt\">Seitenanfang</a></p>\n";
    selector += "</div>\n";

   document.write(selector);
 }

 function linken()
 {
    if(!document.body.setAttribute || ie_mac)
       return;

    var adres = Array("#stil", "#schriftg", "#farben", "#bedien");
    var texte = Array("Seitenstile ", "Schriftgröße ", "Farbanpassung ", "Bedienung ");

    for(var i=0;i<adres.length;i++)
    {
       var spa = document.createElement("span");

       if(document.body.setAttributeNode)
       {
          var klass = document.createAttribute("class");
          klass.nodeValue = "hide";
          spa.setAttributeNode(klass);
          var spantext = document.createTextNode(". ");
          spa.appendChild(spantext);
       }
       else
          spa.setAttribute("class", "hide");


       var linker = document.createElement("a");
       if(document.body.setAttributeNode)
       {
          var ref = document.createAttribute("href");
          ref.nodeValue = adres[i];
          linker.setAttributeNode(ref);
       }
       else
          linker.setAttribute("href", adres[i]);

       var text = document.createTextNode(texte[i]);
       linker.appendChild(text);

       var liste = document.createElement("li");
       liste.appendChild(linker);
       liste.appendChild(spa);

       document.getElementById("insert").insertBefore(liste, document.getElementById("before"));
    }
 }