//Dynamic Menu Script
  //Developed for City Technology
  //by Chris Henkel
  //
appV = navigator.appVersion.toLowerCase();
Version = parseFloat(navigator.appVersion);
NS4 = (document.layers) ? true : false;
DOM = (document.getElementById) ? true : false;
IE = (document.all) ? true : false;
Mac = (appV.indexOf("mac") != -1);
MacStyle = false;
if (Mac && ((appV.indexOf("msie 4") != -1) || NS4)) { MacStyle = true; }
Win = (appV.indexOf("win") != -1);
Refresh = ((NS4 && Mac) || (NS4 && Version < 4.2)) ? true : false; 
WidthTest = (window.innerWidth || IE) ? true : false;
getsMenu = ((NS4||IE||DOM) && WidthTest) ? true : false;
docWidth = 0;
var zzz, newWidth;
zzzing = false;
lastlayer = 0;
curpos = -180;

if (MacStyle) {
  document.write("<link rel=stylesheet href=\"MacStyle.css\" type=\"text/css\">");
} else {
  document.write("<link rel=stylesheet href=\"WinStyle.css\" type=\"text/css\">");
}

menuTitle = new Array("Events","Events.html","For Educators","Educators.html","For Kids","kidspage/index.html","Project Ideas","Design_Tech.html","About Us","AboutUs.html","Home","Index.html");
dropArray = new Array("events","educators","kids","ideas","about","home");
events = new Array();
educators = new Array("Books","Publications.html","Professional Devs","Professional_Developers.html","Become Involved","Teacher_Involve.html","Standards","Standards_Search.php");
kids = new Array("Flip Me","kidspage/pages/flip/flip.html","Fold It","kidspage/pages/frog/frog.html","Pop Ups","kidspage/pages/popups/popups.html","Sail Cars","kidspage/pages/cars/cars.html","Wind Ups","kidspage/pages/windups/windups.html");
ideas = new Array("Advanced Mechanisms","Design_Mech.html","Mechanimations","Design_Puppets.html","Mapping","Design_Map.html","Designed Environments","Design_Env.html","Signs, Symbols &amp; Codes","Design_Signs.html","Packaging","Design_Packaging.html","Fixing &amp; Fastening","Design_Fixing1.html");
about = new Array("Topics","AboutUs_Topics.html","What is Technology ?","AboutUs_Tech.html","People","AboutUs_People.html","Contact Us","Help_Contact.html","Participating Districts","AboutUs_Districts.html");
home = new Array();

if (NS4) {
  layerKey = "document.layers['";
  layerKeyend = "']";
  styleKey = "";
} else if (IE) {
  layerKey = "document.all['";
  layerKeyend = "']";
  styleKey = ".style";
} else if (DOM) {
  layerKey = "document.getElementById('";
  layerKeyend = "')";
  styleKey = ".style";
}

function init() {
if (getsMenu) {
  newWidth = (window.innerWidth) ? window.innerWidth : (document.all) ? document.body.clientWidth : "dunno";
  if (newWidth != docWidth) {
    if (Refresh && docWidth != 0 ) { document.location = document.location; }
    indent = 178;
    indent2 = 170;
    topmarg = 71;
    if (docWidth == 0) {
      poslayer("t0",indent,topmarg);
      eval(layerKey + "t0" + layerKeyend + styleKey + ".visibility = 'visible'");
      poslayer("d0",indent,(topmarg + 20));     
    }
    if (docWidth != 0) {
      eval(layerKey + "d0" + layerKeyend + styleKey + ".visibility = 'hidden'");        
      for (i = 1; i < ((menuTitle.length)/2); i++) {
        eval(layerKey + "t" + i + layerKeyend + styleKey + ".visibility = 'hidden'");
        eval(layerKey + "d" + i + layerKeyend + styleKey + ".visibility = 'hidden'");
      }
    }
    for (i = 1; i < ((menuTitle.length)/2); i++) {
      poslayer("t" + i,0,0);
      poslayer("d" + i,0,0);
    }
    for (i = 1; i < ((menuTitle.length)/2); i++) {
        if (NS4) {
          prevwidth = eval(layerKey + "t" + (i - 1) + layerKeyend + ".clip.width");
          curwidth = eval(layerKey + "t" + i + layerKeyend + ".clip.width");
        } else {
          prevwidth = eval(layerKey + "t" + (i - 1) + layerKeyend + ".offsetWidth");
          curwidth = eval(layerKey + "t" + i + layerKeyend + ".offsetWidth");
        }
        if ((prevwidth - 4 + indent + curwidth) <= newWidth && indent2 == 170) {
          poslayer("t" + i,(prevwidth - 4 + indent),topmarg);
          eval(layerKey + "t" + i + layerKeyend + styleKey + ".visibility = 'visible'");
          if ((prevwidth + indent + 150) <= newWidth) {
            poslayer("d" + i,(prevwidth - 4 + indent),(topmarg + 20));
          } else {
            poslayer("d" + i,(prevwidth - 4 + indent - (150 - curwidth)),(topmarg + 20));
          }
          indent += prevwidth - 4;
        } else {
            poslayer("t" + i,indent2,(topmarg + 21));
            eval(layerKey + "t" + i + layerKeyend + styleKey + ".visibility = 'visible'");
            if ((indent2 + 154) <= newWidth) {
              poslayer("d" + i,indent2,(topmarg + 41));            
            } else {
              poslayer("d" + i,(indent2 - (150 - curwidth)),(topmarg + 41));
            }
            indent2 += curwidth - 4;             
        }  
    }
    if (docWidth == 0 && QNav != "none" && !NS4 && !Mac) {
      eval(layerKey + QNav + layerKeyend + styleKey + ".visibility = 'visible'");
      SlideIn(QNav);
    }
    docWidth = newWidth;
  }
}
}

function poslayer(layerName,leftmar,topmar) {
  eval(layerKey + layerName + layerKeyend + styleKey + ".left = " + leftmar);
  eval(layerKey + layerName + layerKeyend + styleKey + ".top = " + topmar);
}

function showlayer(layerName) {
  if (lastlayer != 0) {
    if (zzzing && layerName == lastlayer) { 
      clearTimeout(zzz);
      zzzing = false;
    } else if (zzzing) {
      hidelayer(lastlayer);
      eval(layerKey + layerName + layerKeyend + styleKey + ".visibility = 'visible'");
      lastlayer = layerName;
    } 
  } else {
    eval(layerKey + layerName + layerKeyend + styleKey + ".visibility = 'visible'");
    lastlayer = layerName;
  }
}

function delayhide(layerName) {
  zzzing = true;
  zzz = setTimeout("hidelayer('" + layerName + "')",500);
}

function hidelayer(layerName) {
  clearTimeout(zzz);
  zzzing = false;
  eval(layerKey + layerName + layerKeyend + styleKey + ".visibility = 'hidden'");
  lastlayer = 0;
}

function keeplayer() {
  clearTimeout(zzz);
  zzzing = false;
}

if (getsMenu) {
  with (document) {
    write('<style type="text/css"><!--');
    for (i = 0; i < ((menuTitle.length) / 2); i++) {
      write("#t" + i + "{ position:absolute; z-index:99; left:0; top:0; visibility:hidden; }\n");
      write("#d" + i + "{ position:absolute; background-color:#000066; layer-background-color:#000066; z-index:100; left:0; top:0; visibility:hidden; }\n");
    }
    if (QNav != "none" && !NS4 && !Mac) {
      write("#QLinks{ position: absolute; left:-180; top:114; z-index:98; visibility:hidden;}\n");
    }
    write("a.menulink:link { text-decoration:none; color:#FFFFFF; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.menulink:visited { text-decoration:none; color:#FFFFFF; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.menulink:active { text-decoration:none; color:#FFFFFF; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.menulink:hover { text-decoration:none; color:#FFFFFF; background-color:#3333CC; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.soonlink:link { text-decoration:none; color:#9999FF; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.soonlink:visited { text-decoration:none; color:#9999FF; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.soonlink:active { text-decoration:none; color:#9999FF; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("a.soonlink:hover { text-decoration:none; color:#9999FF; background-color:#3333CC; font-family:Arial,Verdana,Helvetica,sans-serif; font-size:12px; }");
    write("//--></style>");
  }
}

function layerHTML() {
  if (getsMenu) {
    output = "";
    currArray = "";
    for (i = 1; i < (menuTitle.length); i += 2) {
      output += "<div id='t" + parseInt((i - 1) / 2) + "'><table border='0' cellpadding='0' cellspacing='0'><tr>";
      output += "<td><img src='images/MenuEdge.gif' width='9' height='19'></td><td align='center' bgcolor='000066'>";
      output += "<a href='"+ menuTitle[i] +"' onMouseover='showlayer(\"d" + parseInt((i - 1) / 2) +"\")' onMouseout='delayhide(\"d" + parseInt((i - 1) / 2) +"\")' class='menulink'>";
      output += "<nobr>" + menuTitle[(i - 1)] + "</nobr></a></td><td><img src='images/MenuEdgeR.gif' width='9' height='19'></td></tr></table></div>\n";
      output += "<div id='d" + parseInt((i - 1) / 2) + "'><table border='0' cellpadding='2' cellspacing='2' width='150'>";
      currArray = eval(dropArray[parseInt((i - 1) / 2)]);
      for (j = 1; j < (currArray.length); j += 2) {
        if (currArray[j] == "Coming Soon") {
          output += "\n<tr><td bgcolor='#000099'><a href='javascript:NewWin(\"Soon.html\",\"Soonwin\",230,450);' onMouseover='keeplayer()' onMouseout='delayhide(\"d" + ((i - 1) / 2) +"\")' class='soonlink'>" + currArray[j - 1] + "</a></td></tr>";
        } else {
          output += "\n<tr><td bgcolor='#000099'><a href='"+ currArray[j] +"' onMouseover='keeplayer()' onMouseout='delayhide(\"d" + ((i - 1) / 2) +"\")' class='menulink'>" + currArray[j - 1] + "</a></td></tr>";
        }
      }
      output += "</table></div>\n";
    }
    return output;
  }
}

function SlideIn(QName) {
  curpos += 15;
  if (curpos <= 0) {
    eval(layerKey + QName + layerKeyend + styleKey + ".left = " + curpos);
  } else {
    return;
  }
  setTimeout("SlideIn('" + QNav + "')",1);
}