jQuery(document).ready(function() {
//(c)2011 Oliver Grünberg, CITY TYPO, Gestaltungsbüro für gedruckte und elektronische Medien, Stuttgart, www.citytypo.de

   //Seitentitel auslesen
   var TempTitle = new Array();
   TempTitle = document.title.split(" ");

   if (TempTitle[0] == "Standorte" || TempTitle[0] == "Sites"){
      //alert("... Wartungsarbeiten!");
      //$('div').css('border', '1px solid lime');

      PfadCMSHTMLDateien = "index.php/";
      PfadExterneHTMLDateien = "tl_files/iks/standortkarte/";
      PfadBilder = "tl_files/iks/standortkarte/";

      KarteLaden();
   }


   //*** AB HIER NICHTS MEHR ÄNDERN ************************************************************************************
   function KarteLaden(){
      //Die Gesamtkarte laden aus #kartereset
      $("#karte").load(PfadExterneHTMLDateien + "reset.html", function(){
         //Für jedes Div innerhalb von #karte#kartereset gilt folgendes
         $(this).children().children("div").each(
            function(){
               //alert($(this).attr("id"));
               //alert($(this).children("img").attr("class"));
               
               //Beim drüberfahren über das Bild innerhalb des divs irgendwas anderes machen...
               $(this).children("img").mouseover(function(){
                  $(this).attr("src", PfadBilder + "transparentgrau.png");
                  QuadLaden($(this).parent().attr("id"));
               });
               $(this).children("img").mouseout(function(){
                  $(this).attr("src", PfadBilder + "blank.png");
               });

               function QuadLaden(TempQuadID){
                  //alert(TempQuadID);
                  //wenn das Bild zur Klasse .blank gehört, dann ein Klick-Event hinzufügen
                  $("#" + TempQuadID + " .blank").click(function() {
                     //alert(this);
                     //$("div").css("border", "1px solid lime")
                     //erstmal ausblenden, nur um es später wieder einblenden zu können
                     $("#" + TempQuadID).hide();
                     //neu positionieren und mittels css formatieren
                     $("#" + TempQuadID).css("position", "absolute")
                        .css("top", "0px")
                        .css("left", "0px")
                        .css("width", "500px")
                        .css("height", "580px")
                        .css("z-index", "10")
                        //.css("border", "1px solid #DDDDDD")
                        .css("background-color", "#ffffff");
                     //Jetzt den variablen Inhalt aus einer anderen Seite laden  #quad
                     //alert("externe Karte laden...");
                     $("#" + TempQuadID).load(PfadCMSHTMLDateien + "standortkartedetails" + TempQuadID + " #quad", {}, function(){
                        //und wieder ein Klick-Event hinzufügen, nämlich das Div ausblenden, wenn man drauf klickt
                        $("#" + TempQuadID + " img").dblclick(function(){
                           //alert("zurück");
                           $("#" + TempQuadID).fadeOut("slow", function(){KarteLaden()});
                        });
                        //Link zum Schließen anhängen
                        $(this).append("<div class='quadschliessen'><img title='zurück zur Gesamtkarte' src='" + PfadBilder + "kreuzle.png'></div>");
                        $("#" + TempQuadID + " .quadschliessen").click(function(){
                           //alert("zurück");
                           $("#" + TempQuadID).fadeOut("slow", function(){KarteLaden()});
                        });
                        //Details ausblenden, wenn man nur auf die Karte klickt
                        $("#" + TempQuadID + " img").click(function(){
                           $("#" + TempQuadID + " .details").fadeOut();
                        });
                        //wenn in der externen html Seite Divs der Klasse .details sind, etwas mit denen anstellen...
                        $(this).children("div").children(".details").each(function(){
                           //alert($(this).attr("id"));
                           //Link zum Schließen anhängen
                           $(this).append("<div class='detailsschliessen'><img title='Details schließen' src='" + PfadBilder + "kreuzle.png'></div>");
                           $("#" + TempQuadID + " .detailsschliessen").click(function(){
                              //alert("zurück");
                              $("#" + TempQuadID + " .details").fadeOut("slow");
                           });
                           $(this).css("width", "220px")
                              .css("top", "150px")
                              .css("left", "140px")
                              .css("position", "absolute")
                              .hide();
                        });
                        //wenn in der externen html Seite Divs der Klasse .boppel sind, etwas mit denen anstellen...
                        //alert($(this).children().attr("id"));
                        //alert($(this).html());
                        //   $(this).children().children().each(function(){
                        //   alert($(this).attr("id"));
                        //});
//AB HIER
                        $(this).children("div").children(".boppel").each(function(){
                           //$(this).wrap("<a href='#'></a>");
                           //Zu Testzwecken klickbaren Bereich anzeigen
                           //$(this).css("background", "#000000");
                           //$(this).css("opacity", ".5");
                           $(this).hide()
                              .fadeIn("slow")
                              .click(function(){
                                 //alert($(this).attr("id"));
                                 $(".details").fadeOut();
                                 $("#" + $(this).attr("id").replace(/boppel/, "details")).fadeIn("slow");
                              });
                        });
                        //wenn in der externen html Seite Divs der Klasse .stadt sind, etwas mit denen anstellen...
                        $(this).children("div").children(".stadt").each(function(){
                           //alert(this);
                           //$(this).wrap("<a href='#' title='" + $(this).attr("title") + "'></a>");
                           //Zu Testzwecken klickbaren Bereich anzeigen
                           //$(this).css("background", "#000000");
                           //$(this).css("opacity", ".5");
                           $(this).hide()
                              .fadeIn("slow")
                              .click(function(){
                                 //alert($(this).attr("id"));
                                 $(".details").fadeOut();
                                 $("#" + $(this).attr("id").replace(/stadt/, "details")).fadeIn("slow");
                              });
                        });
                        //alert(this);
                        //alert(document.readyState);
                     });
                     //das vorher ausgeblendete Div einblenden
                     $("#" + TempQuadID).fadeIn("slow");
                  });
               }
            }
         );
      });
   }






});