// -------------------------------------------------------------- //
// --------------------   DIVISION Content   -------------------- //
// -------------------------------------------------------------- //
OpenLayer = "";
LinkLine = "";
CloseLayer = "";

// -------------------------------------------------------------- //

OpenLayer+= "  <table width='282' border='0' cellspacing='0' cellpadding='0'>";
OpenLayer+= "    <tr>";
OpenLayer+= "      <td width='12' valign='top' background='images/c_subm_bg.gif'><img src='images/c_subm_1.gif' width='12' height='18'></td>";
OpenLayer+= "       <td width='6' valign='top' bgcolor='#FFFFFF'><img src='images/c_subm_2.gif' width='6' height='18'></td>";
OpenLayer+= "      <td width='264' valign='top'>";
OpenLayer+= "      <table width='100%' border='0' cellspacing='0' cellpadding='0'>";
OpenLayer+= "     <tr><td><img src='images/c_subm_3.gif' width='264' height='8'></td> </tr>";


CloseLayer+= "      </table>";
CloseLayer+= "      </td>";
CloseLayer+= "    </tr>";
CloseLayer+= "    <tr>";
CloseLayer+= "      <td colspan='3'><img src='images/c_subm_bot.gif' width='282' height='35'></td>";
CloseLayer+= "    </tr>";
CloseLayer+= "  </table>";

// -------------------------------------------------------------- //

// start of variable

var Menu = new Array();
var Menulink = new Array();
var DivString = new Array();
var SubMenuLinks = new Array();
var SubMenuTitles = new Array();
var Sub2MenuLinks = new Array();
var Sub2MenuTitles = new Array();
var submenu = false;
var oldsub = 0;

var menutop = new Array(1,2,3,4,5,6);
var menuleft = new Array(70,70,50,70,70,70);

// MENU ID (Without Any Use)
Menu[0]='Growth of Adolescents';
Menu[1]='Psychological Health';
Menu[2]='Relationships';
Menu[3]='Your Emotions';
Menu[4]='Smoking, Drugs, Alcohol and Gambling';
Menu[5]='Sex Issues';
Menu[6]='a7';
Menu[7]='a8';
Menu[8]='a9';
Menu[9]='a10';
Menu[10]='a11';
Menu[11]='a12';
Menu[12]='a13';
Menu[13]='a14';

Menulink[0]='./e_content_110.html';
Menulink[1]='./e_content_201.html';
Menulink[2]='./e_content_30.html';
Menulink[3]='./e_content_40.html';
Menulink[4]='./e_content_50.html';
Menulink[5]='./e_content_60.html';
Menulink[6]='#';
Menulink[7]='#';
Menulink[8]='#';
Menulink[9]='#';
Menulink[10]='#';
Menulink[11]='#';
Menulink[12]='#';
Menulink[13]='#';

Menulength = 6; // total menu






// --------------------------------------- //


MenuAmount=Menu.length;
MenuWidth = 184;
MenuHeight = 187;
StartTop = 120;
StartLeft = 140;
StartLeft2 = 240;
NumOfMenuPerPage = 7;

// write main menu
    DString = "<div id = 'Div_menu' style='position:absolute;";
    DString += "top:"+StartTop+"px;"+"left:"+StartLeft+"px;visibility:hidden;z-index:0' onMouseOver='menushow()' onMouseOut='menuhide()'>";
    DString += OpenLayer;

                        for(i=0;i<Menulength;i++)
                           {DString += "<tr><td background='images/c_subm_text_bg.gif' height='20'><img src='images/spacer.gif' width='6' height='4'>";
                            DString += "<a href='" + Menulink[i] + "' onMouseOver='showDiv("+i+");' class='nav'>"+ Menu[i]+"</a>";
                            DString += "</td></tr>";
                           }
                        DString+= CloseLayer;
                        DString+= "</div>";
                        document.write(DString);



// For Each Menu
for (i=0; i<MenuAmount; i++){
        // If SubMenu Exist
        if (SubMenuLinks[i]&&SubMenuTitles[i]){
                SubLinkAmount = SubMenuLinks[i].length;
                if (SubLinkAmount>0){

                        // Calculate the corresponding Absolute position
                        if (i<NumOfMenuPerPage){
                                //var left = StartLeft + i*MenuWidth;
                                var left = StartLeft + menuleft[i];

                                var top = StartTop + menutop[i] * 19 + 5;
                        }else if (i>=NumOfMenuPerPage){
                                var left = StartLeft + (i-NumOfMenuPerPage)*MenuWidth;
                                var top = StartTop + MenuHeight;
                        }
                        // ConCate the Div string
                        DivString[i] = "<div id = 'Div_"+i+"' style='position:absolute;";
                        DivString[i]+= "top:"+top+"px;"+"left:"+left+"px;visibility:hidden;z-index:1' onMouseOver='showDiv("+i+")' onMouseOut='hideDiv("+i+")'>";
                        DivString[i]+= OpenLayer;
                        for (j=0; j<SubLinkAmount; j++){
                                DivString[i]+= "<tr><td background='images/c_subm_text_bg.gif' height='20'><img src='images/spacer.gif' width='6' height='4'>";

                                sublink =SubMenuLinks[i][j];
                                if(isNaN(sublink))
                                  { DivString[i]+= "<a href ='"+ sublink+"' class='nav' onMouseOver='hidden_submenu("+i+")'>"+SubMenuTitles[i][j]+"</a>";
                                  }
                                else
                                  { DivString[i]+= "<a href='#' onMouseOver='showDiv("+(100+sublink)+");' class='nav'>"+SubMenuTitles[i][j]+"</a>";
                                    writesubDiv(sublink,(top+(j+1)*19 + 5),left+50);
                                  }

                                DivString[i]+= "</td></tr>";
                        }
                        DivString[i]+= CloseLayer;
                        DivString[i]+= "</div>";
                        document.write(DivString[i]);
                }
        }
}

// --------------------------------------- //
// ----------   Function Call   ---------- //
// --------------------------------------- //

function hidden_all_submenu(dindex)
{     for (i=0; i<MenuAmount; i++)
          {  if (SubMenuLinks[i] && SubMenuTitles[i] && i!=dindex)
                { SubLinkAmount = SubMenuLinks[i].length;
                  if (SubLinkAmount>0){
                        for (j=0; j<SubLinkAmount; j++)
                          {  sublink =SubMenuLinks[i][j];
                                if(!isNaN(sublink))
                                  {  document.all['Div_'+ (100+sublink)].style.visibility="hidden"; }
                          }
                     }
                }
          }
 }


function hidden_submenu(dindex)
{     for (i=0; i<MenuAmount; i++)
          {  if (SubMenuLinks[i] && SubMenuTitles[i] && i==dindex)
                { SubLinkAmount = SubMenuLinks[i].length;
                  if (SubLinkAmount>0){
                        for (j=0; j<SubLinkAmount; j++)
                          {  sublink =SubMenuLinks[i][j];
                                if(!isNaN(sublink))
                                  {  document.all['Div_'+ (100+sublink)].style.visibility="hidden"; }
                          }
                     }
                }
          }
 }


function show_parent(dindex)
{  showid = -1;
     for (i=0; i<MenuAmount; i++)
          {  if (SubMenuLinks[i] && SubMenuTitles[i] && i!=dindex)
                { SubLinkAmount = SubMenuLinks[i].length;
                  if (SubLinkAmount>0)
                     {
                        for (j=0; j<SubLinkAmount; j++)
                          {   sublink =SubMenuLinks[i][j];
                                if(!isNaN(sublink) && (dindex==(100+sublink)))
                                  { showid = i; }
                          }
                     }
                }
          }

      if(showid>-1)
       { document.all['Div_'+showid].style.visibility="visible"; }
      return showid;
 }


function showDiv(divIndex){
        menushow();
        if(divIndex>100)
          { vid = show_parent(divIndex);
            hidden_all_submenu(-1);
            document.all['Div_'+divIndex].style.visibility="visible";
            submenu = true; }
         else
          { submenu = false;
            hidden_all_menu();
            hidden_all_submenu(divIndex);
          }


//        document.write(DivString[divIndex]);
        if (document.all['Div_'+divIndex])
//                document.all['Div_'+divIndex].innerHTML = OpenLayer+LinkLine+Sample+LinkLine+CloseLayer;
              {   document.all['Div_'+divIndex].style.visibility="visible";
              }


}
function hideDiv(divIndex){
        if (document.all['Div_'+divIndex])
          { // if(divIndex>100)  { submenu = false;}
            // if(submenu==false)
             { document.all['Div_'+divIndex].style.visibility="hidden";}
          }

        // hidden all sub menu
         if(divIndex<100)
          { hidden_submenu(divIndex);
          }

}

function writeDiv(){}

function writesubDiv(i2,top,left){
      var sDivString = new Array();
       Sub2LinkAmount = Sub2MenuLinks[i2].length;
            if (Sub2LinkAmount>0){
               // ConCate the Div string
                  sDivString[i2] = "<div id = 'Div_"+ (100+i2) +"' style='position:absolute;";
                  sDivString[i2]+= "top:"+top+"px;"+"left:"+left+"px;visibility:hidden;z-index:2' onMouseOver='showDiv("+(100+i2)+")' onMouseOut='hideDiv("+(100+i2)+")'>";
                  sDivString[i2]+= OpenLayer+LinkLine;
                        for (j2=0; j2<Sub2LinkAmount; j2++){
                                sDivString[i2]+= "<tr><td background='images/c_subm_text_bg.gif' height='20'><img src='images/spacer.gif' width='6' height='4'>";
                                sDivString[i2]+= "<a href ='"+Sub2MenuLinks[i2][j2]+"'  class='nav'>"+Sub2MenuTitles[i2][j2]+"</a>";
                                sDivString[i2]+= "</td></tr>";
                                sDivString[i2]+= LinkLine;
                        }
                      sDivString[i2]+= CloseLayer;
                      sDivString[i2]+= "</div>";
                      document.write(sDivString[i2]);
                }
}
function menushow()
  {document.all['Div_menu'].style.visibility="visible"; }

function menuhide()
  { document.all['Div_menu'].style.visibility="hidden";
    hidden_all_menu();
    hidden_all_submenu(1000);
  }

function hidden_all_menu()
{    for(x=0;x<Menulength;x++)
       {  if (document.all['Div_'+x])
           { document.all['Div_'+x].style.visibility="hidden";}
       }
}

function menu2show()
  { document.all['menu2'].style.visibility="visible"; }

function menu2hide()
  { document.all['menu2'].style.visibility="hidden";  }