function grpFensterweite()  {
  if (window.innerWidth) {
    return window.innerWidth;
  } else if (document.documentElement && document.documentElement.clientWidth && document.documentElement.clientWidth>0) {
    return document.documentElement.clientWidth; //   document.body.offsetWidth;  	
  } else if (document.body && document.body.clientWidth) {  	
    return document.body.clientWidth; //   document.body.offsetWidth;
  } else {
    return 0;
  }
}

function grpFensterhoehe()  {
  if (window.innerHeight) {
    return window.innerHeight;
  } else if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientHeight>0) {
    return document.documentElement.clientHeight; //   document.body.offsetHeight;  	
  } else if (document.body && document.body.clientHeight) {  	
    return document.body.clientHeight; //   document.body.offsetHeight;
  } else {
    return 0;
  }
}
    function myCreateElement(bez,domid,link,hatkinder) {
            var divaus = document.createElement("div");        
            divaus.setAttribute("id",domid);            
            divaus.setAttribute("pqTyp","element");            
            divaus.style.display = "block";            
            divaus.onmouseover   = snav.einblenden;
            divaus.onmouseout = snav.ausblenden;
            divaus.onmouseclick = snav.einblenden;
            var aus = document.createElement("a");            
            aus.setAttribute("id",domid + "_link");
            //aus.style.display = "block";
            //aus.style.padding = "2px 2px 2px 2px";
            if (domid.substr(0,5)=="root_") {
                aus.style.color = "#3669CF";
                aus.style.textDecoration = "none";
                var btnimg = document.createElement("img");
                if (myLinkPreFix && myLinkPreFix!="") {
                	btnimg.src = myLinkPreFix + "?s=button&g_size=16&g_padding_top=14&g_padding_left=1&g_padding_right=3&g_color=56,55,51&g_fixheight=37&g_text=" + bez;
                } else {
                	btnimg.src = "./?s=button&g_size=16&g_padding_top=14&g_padding_left=1&g_padding_right=3&g_color=56,55,51&g_fixheight=37&g_text=" + bez;
                }
                btnimg.alt = bez;
                btnimg.border=0;
                aus.appendChild(btnimg);
                
                /*var btnimg = document.createElement("img");
                btnimg.src = "./?s=button&g_size=16&g_padding_top=16&g_color=56,55,51&g_fixheight=37&g_text=|";
                btnimg.alt = bez;
                btnimg.border=0;
                aus.appendChild(btnimg); */
                
            } else if (hatkinder) { 
                aus.className = "subfolder";
                aus.appendChild(document.createTextNode(bez));
            } else {
                //aus.style.color = "black";
                aus.appendChild(document.createTextNode(bez));
            }
            if (myLinkPreFix && myLinkPreFix!="") {
            	aus.href = myLinkPreFix + link;    
            } else {
            	aus.href = link;
            }
            
            divaus.appendChild(aus);
            return divaus;
        }

    function myCreateChildCont(domid, ebene) {
        childcont2 = document.createElement("div");            
        childcont2.setAttribute("id",domid + "_child");       
        childcont2.setAttribute("pqTyp","container");            
        childcont2.setAttribute("pqEbene",ebene);
        childcont2.style.width = "216px";
        childcont2.style.display = "none";            
        childcont2.className = "submenue";   
        childcont2.onmouseout = snav.ausblenden;
        childcont2.onmouseover = snav.einblenden;    
        childcont2.style.zIndex = "4";
        return childcont2;
    }
    function myCreateCrumb(bez,link) {
        
        if (link!="") {
            aus = document.createElement("a");
            if (myLinkPreFix && myLinkPreFix!="") {
            	aus.setAttribute("href", myLinkPreFix + link);
            } else {
            	aus.setAttribute("href", link);
            }
        } else {
           aus = document.createElement("span");
        }
        //aus.style.color = "gray";
        //aus.style.textDecoration = "none";
        aus.appendChild(document.createTextNode(bez));
        return aus;
    }
    function getElementLeft(elem) {
            xPos = elem.offsetLeft;
            tempEl = elem.offsetParent;
            while (tempEl != null) {
                xPos += tempEl.offsetLeft;
                tempEl = tempEl.offsetParent;
            }
            return xPos;
        
    }


    function getElementTop(elem) {
       
                yPos = elem.offsetTop;
                tempEl = elem.offsetParent;
                while (tempEl != null) {
                    yPos += tempEl.offsetTop;
                    tempEl = tempEl.offsetParent;
                }
                return yPos;
    }
    
    function out(event) {
        //this.style.display = "none";
        // snav.logger.value += "OUT: " + this.id + "!\n";
    }
    var snav = {
        akt: 0,
        cont: null,
        reihe1: null,
        reihe2: null,
        opened: null,
        logger: null,
        ausschalten: false,
        istAktiv: false,
        isInit: false,
        init: function() {
            if (pqTimer) clearInterval(pqTimer); 
            if (!snav.isInit) {
                snav.isInit = true;
                snav.cont = document.getElementById("serienliste");
                if (!snav.cont) {
                    alert("Achtung! Element serienliste nicht gefunden!");
                    snav.cont = document.createElement("div");
                    snav.cont.setAttribute("id", "serienliste");
                    document.appendChild(snav.cont);
                }   
                
                /*
                snav.logger = document.createElement("textarea");
                snav.logger.id = "htmllogger";
                snav.logger.style.width = "300px";
                //snav.logger.style.display = "none";
                snav.logger.style.height = "200px";
                snav.cont.appendChild(snav.logger);
                */
                
                if (grpnavNavi) {
                	snav.reihe1 = document.createElement("div");
	                //snav.reihe1.className = "menuetrenner1";
                	snav.cont.appendChild(snav.reihe1);
				}
                if (grpnavBread) {
                	snav.reihe2 = document.createElement("div");
                	snav.reihe2.className = "breadcrump_div";
                	//snav.reihe2.appendChild(document.createTextNode("BreadCrump Navigation wird hier erzeugt."));
                }
                
                if (grpnavNavi) {
                if (serienliste_root.length>0) {
                    for (kid in serienliste_root) {                              
                        snav.anzeigenRoot(serienliste_root[kid],snav.reihe1 ,0);
                    }
                }

                snav.istAktiv = true;
                }
                if (grpnavBread) {
                    
	                snav.breadcrump();
	                if (grpnavBreadId) {
                        var breadcrid = document.getElementById(grpnavBreadId);
                        if (breadcrid) {
                            breadcrid.appendChild(snav.reihe2);
                        }
	                } else {
		                snav.cont.appendChild(snav.reihe2);
		            }
                }
                                
                snav.opened = Array();
            }
        }, 
        updatebc: function(neu) {
        	if (snav.isInit && grpnavBread) {
        			seitenname = neu;
                    snav.reihe2 = document.createElement("div");
                	snav.reihe2.className = "breadcrump_div";                	
	                snav.breadcrump();
	                if (grpnavBreadId) {
                        var breadcrid = document.getElementById(grpnavBreadId);
                        if (breadcrid) {
                        	while (breadcrid.childNodes[0]) {
								breadcrid.removeChild(breadcrid.childNodes[0]);
							}
                            breadcrid.appendChild(snav.reihe2);
                        }
	                }
                }
        },       
        breadcrump: function() {
            first = true;   
            aus = myCreateCrumb("PaniniComics.de","./?s=homepage&gs_" + grpnavVarname + "=0");
            snav.reihe2.appendChild(aus);            
            first = false;
            if (aktiveSerien.length>0) {
                for (pos in aktiveSerien) {   
                    if (serienliste[aktiveSerien[pos]]) {            
                        if (!first) {
                            var masdspan = document.createElement("span");
                            masdspan.innerHTML = " › ";
                            snav.reihe2.appendChild(masdspan); // document.createTextNode(" > "));
                        } else {
                            first = false;
                        }
                        aus = myCreateCrumb(serienliste[aktiveSerien[pos]]["bez"].replace(" |",""),serienliste[aktiveSerien[pos]]["link"]);
                        snav.reihe2.appendChild(aus);
                    }
                }
            } else {
                // Keine Aktiven Serien...
                var masdspan = document.createElement("span");
                            masdspan.innerHTML = " › ";
                            snav.reihe2.appendChild(masdspan); // document.createTextNode(" > "));
                aus = myCreateCrumb(seitenname,"");
                snav.reihe2.appendChild(aus);
            }
        },
        anzeigenRoot: function(id,unterhalbvon,ebene) {
            if (serienliste[id]) {
                domid="root_serienliste_element_" + id;
                link = serienliste[id]["link"];
                aus = myCreateElement(serienliste[id]["bez"], domid, link,(serienliste[id]["kinder"] && serienliste[id]["kinder"].length>0));
                aus.className = "rootmenue";
                aus.setAttribute("pqTyp","root");
                unterhalbvon.appendChild(aus);
                if (serienliste[id]["kinder"] && serienliste[id]["kinder"].length>0) {
                    childcont = myCreateChildCont(domid,ebene);
                    var top = 0;
                    var left = 0;
                    for (kid in serienliste[id]["kinder"]) {
                        snav.anzeigenSub(serienliste[id]["kinder"][kid], childcont ,ebene+1,top,left); 
                        top += 20;
                        var fth = grpFensterhoehe();                       	
                        if (false && top+20>fth-90) {
                            top = 0;
                            left += 216;
                            var ftth = (left + 216) + "px";
                            childcont.style.width = ftth.toString();
                        }
                    }
                    
                    snav.cont.appendChild(childcont);
                }
            }
        },
        anzeigenSub: function(id,unterhalbvon,ebene,top,left) {
            if (serienliste[id]) {
                domid="serienliste_element_" + id;
                link = serienliste[id]["link"];
                aus = myCreateElement(serienliste[id]["bez"], domid, link,(serienliste[id]["kinder"] && serienliste[id]["kinder"].length>0));
                aus.style.position = "absolute";
                aus.style.top = top + "px";
                aus.style.left = left + "px";                
                aus.style.width = "216px";
                aus.style.height = "20px";                     
                aus.style.backgroundColor = "white";                
                unterhalbvon.appendChild(aus);
               
                if (serienliste[id]["kinder"] && serienliste[id]["kinder"].length>0) {
                    childcont2 = myCreateChildCont(domid, ebene);     
                    childcont2.style.position = "absolute";
                    childcont2.style.top = top + "px";
                    childcont2.style.left = (left + 216) + "px";
                    childcont2.className = "subsubnav";                    
                    childcont2.style.zIndex = "6";
                    var mtop = 0;
                    var mleft = 0;                    
                    for (kid in serienliste[id]["kinder"]) {                        
                       snav.anzeigenSubSub(serienliste[id]["kinder"][kid], childcont2 ,ebene+1,mtop,mleft);
                       mtop += 21;
                    }
                    snav.cont.appendChild(childcont2);
                }
            }
        },        
        anzeigenSubSub: function(id,unterhalbvon,ebene,top,left) {
             if (serienliste[id]) {
                domid="serienliste_element_" + id;
                link = serienliste[id]["link"]
                aus = myCreateElement(serienliste[id]["bez"], domid, link, false);
                aus.style.top = top + "px";
                aus.style.left = left + "px";                
                aus.style.width = "216px";
                aus.style.height = "20px";                     
                unterhalbvon.appendChild(aus);                
            }
        },    
        einblenden: function(event) {
            snav.ausschalten = false;            
            if (this.getAttribute("pqTyp")=="root") {
                // alle ausblenden
                snav.alleAus();
                // sub Elemente Einblenden, wenn vorhanden
                cont = document.getElementById(this.id + "_child");
                if (cont) {
                    snav.zeigean(cont);
                    
                    cont.style.left = getElementLeft(this) + "px";                    
                    cont.style.top  = (getElementTop(this) + this.offsetHeight) + "px";
                    
                }
            }
            if (this.getAttribute("pqTyp")=="element") {
                if (snav.opened.length>0 && snav.opened[snav.opened.length-1].getAttribute("pqEbene")>this.parentNode.getAttribute("pqEbene")) {
                    snav.verstecke(snav.opened[snav.opened.length-1]);
                } 
                cont = document.getElementById(this.id + "_child");
                if (cont) {
                    snav.zeigean(cont);
                    body = document.getElementsByTagName("body")[0];
                    if ((getElementLeft(this) + this.offsetWidth + cont.offsetWidth)>body.offsetWidth) {
                        cont.style.left = (getElementLeft(this) - cont.offsetWidth)+ "px";                    
                    } else {
                        cont.style.left = (getElementLeft(this) + this.offsetWidth)+ "px";      
                        
                    }
                    var tfh = grpFensterhoehe();
                    var ttop = getElementTop(this);
                    if ((ttop + cont.offsetHeight)>tfh) {
                    	if ((ttop + this.offsetHeight - cont.offsetHeight)>0) {
                        	cont.style.top  = (ttop + this.offsetHeight - cont.offsetHeight) + "px"; // (getElementTop(this) - ((getElementTop(this) + cont.offsetHeight)-tfh-20) ) + "px";
                        } else {
                        	cont.style.top  = "0px"; 
                        }                    
                    } else {
                    	cont.style.top  = (getElementTop(this) ) + "px";
                    }
                    
                    
                }
            }
        },
        alleTimerAus: function() {
            if (snav.ausschalten) {
                snav.alleAus();
            }
        },
        alleAus: function() {
            if (snav.opened) {
                for(i=0;i<snav.opened.length;i++) {
                    snav.opened[i].style.display = "none";
                }
                snav.opened = Array();
            }
        },
        zeigean: function(obj) {
            obj.style.display = "block";
            snav.opened[snav.opened.length] = obj;            
        },
        verstecke: function(obj) {
            newopen = Array();
            for(i=0;i<snav.opened.length;i++) {
                if (snav.opened[i].id!=obj.id) {
                    newopen[newopen.length] = snav.opened[i];
                }
            }
            snav.opened = newopen;
            obj.style.display = "none";
        },
        domaus: function(domobj) {
            
        },
        ausblenden: function(event) {
            snav.ausschalten = true;
            window.setTimeout("snav.alleTimerAus();",2000);
        },
        aktiv: function(id) {
            var ret = false;
            for (kid in aktiveSerien) {
                if (aktiveSerien[kid]==id) {
                    ret = true;
                }
            }
            return ret;
        }
    }
    
    if (document.addEventListener) {
        document.addEventListener("DOMContentLoaded", snav.init, false);
    }
/*@cc_on @*/
/*@if (@_win32)
    document.write("<script id=pqIEload defer src='/static/void.js'><\/script>");
    var elem = document.getElementById("pqIEload");
    elem.onreadystatechange = function() {
        if (this.readyState == "complete") {
            snav.init();
        }
    };
/*@end @*/

    if (/WebKit/i.test(navigator.userAgent)) {
        var pqTimer = setInterval(
            function() {
                if (/loaded|complete/.test(document.readyState)) {
                    snav.init();
                }
        }, 30);
    }
    if (window.onload) {
        window.onload += snav.init();    
    }