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

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

OpenLayer+= "  <table width='160' border='0' cellspacing='0' cellpadding='0'>";
OpenLayer+= "    <tr>";
OpenLayer+= "      <td colspan='2' valign='top'><img src='images/m_nav_top1.gif' width='160' height='4'></td>";
OpenLayer+= "    </tr>";
OpenLayer+= "    <tr>";
OpenLayer+= "      <td background='images/m_nav_l_bg.gif' valign='top'><img src='images/spacer.gif' width='9' height='0'></td>";
OpenLayer+= "      <td width='151'>";
OpenLayer+= "      <table width='100%' border='0' cellspacing='0' cellpadding='0'>";

//LinkLine+= "        <tr valign='middle' >";
//LinkLine+= "  <td><img src='images/spacer.gif' width='9' height='0'></td>";
//LinkLine+= "        </tr>";

CloseLayer+= "      </table>";
CloseLayer+= "      </td>";
CloseLayer+= "    </tr>";
CloseLayer+= "    <tr>";
CloseLayer+= "      <td colspan='2' valign='top'><img src='images/m_nav_bot1.gif' width='160' height='26'></td>";
CloseLayer+= "    </tr>";
CloseLayer+= "  </table>";

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

// start of variable

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

menutop = new Array(0,0,1,1,2,2,8.6);
menuleft = new Array(20,40,20,40,20,40,20);


// MENU ID (Without Any Use)
Menu[0]='a1';
Menu[1]='a2';
Menu[2]='a3';
Menu[3]='a4';
Menu[4]='a5';
Menu[5]='a6';
Menu[6]='a7';
Menu[7]='a8';
Menu[8]='a9';
Menu[9]='a10';
Menu[10]='a11';
Menu[11]='a12';
Menu[12]='a13';
Menu[13]='a14';

// Define the SubMenu array (link and the link name)
SubMenuLinks[1] = new Array();
SubMenuTitles[1] = new Array();
SubMenuLinks[1][0] = './content_200.html';
SubMenuTitles[1][0] = '肥瘦circle game';
SubMenuLinks[1][1] = './content_210.html';
SubMenuTitles[1][1] = '科學計算─肥瘦現形';
SubMenuLinks[1][2] = './content_220.html';
SubMenuTitles[1][2] = '肥胖萬花筒';
SubMenuLinks[1][3] = './content_230.html';
SubMenuTitles[1][3] = '怕肥吃出禍';
SubMenuLinks[1][4] = '/content_240.html';
SubMenuTitles[1][4] = '健康自然美─總結';


SubMenuLinks[3] = new Array();
SubMenuTitles[3] = new Array();
SubMenuLinks[3][0] = './content_400.html';
SubMenuTitles[3][0] = 'Set好情緒不撻 Q';
SubMenuLinks[3][1] = './content_410.html';
SubMenuTitles[3][1] = '情緒100%放大睇';
SubMenuLinks[3][2] = './content_420.html';
SubMenuTitles[3][2] = '管理情緒有秘技';
SubMenuLinks[3][3] = './content_430.html';
SubMenuTitles[3][3] = '情緒的第十級風暴─抑鬱症及焦慮症狀況';

SubMenuLinks[2] = new Array();
SubMenuTitles[2] = new Array();
SubMenuLinks[2][0] = './content_300.html';
SubMenuTitles[2][0] = '溝通寬頻快線';
SubMenuLinks[2][1] = './content_310.html';
SubMenuTitles[2][1] = '父母大變細？─家人相處篇';
SubMenuLinks[2][2] = './content_320.html';
SubMenuTitles[2][2] = '知心撞到正─朋友相處篇';

SubMenuLinks[0] = new Array();
SubMenuTitles[0] = new Array();
SubMenuLinks[0][0] = 'content_100.html';
SubMenuTitles[0][0] = '我的body成熟時';
SubMenuLinks[0][1] = 'content_110.html';
SubMenuTitles[0][1] = '我的童年不見了─男性篇';
SubMenuLinks[0][2] = 'content_120.html';
SubMenuTitles[0][2] = '我的童年不見了─女性篇';
SubMenuLinks[0][3] = 'content_130.html';
SubMenuTitles[0][3] = '少年心聲不幼稚─男女青春期思維的改變';
SubMenuLinks[0][4] = 'content_140.html';
SubMenuTitles[0][4] = '我想呼吸自由空氣─青少年心理及社交的改變';
SubMenuLinks[0][5] = 'content_150.html';
SubMenuTitles[0][5] = '成年人也有心底話─總結';

SubMenuLinks[4] = new Array();
SubMenuTitles[4] = new Array();
SubMenuLinks[4][0] = './content_500.html';
SubMenuTitles[4][0] = '人無「惡癮」品自高';
SubMenuLinks[4][1] = './content_510.html';
SubMenuTitles[4][1] = '萬般帶不走，唯有味隨身';
SubMenuLinks[4][2] = './content_520.html';
SubMenuTitles[4][2] = '有「揩」冇「high」';
SubMenuLinks[4][3] = './content_530.html';
SubMenuTitles[4][3] = '強身不要學醉拳─酗酒';
SubMenuLinks[4][4] = './content_540.html';
SubMenuTitles[4][4] = '發財不要埋便─賭博';
SubMenuLinks[4][5] = './content_550.html';
SubMenuTitles[4][5] = '向誘惑勇敢說NO！';


SubMenuLinks[5] = new Array();
SubMenuTitles[5] = new Array();
SubMenuLinks[5][0] = './content_600.html';
SubMenuTitles[5][0] = '性有惑「三級」攻略';
SubMenuLinks[5][1] = './content_610.html';
SubMenuTitles[5][1] = '心思思 查字典';
SubMenuLinks[5][2] = './content_620.html';
SubMenuTitles[5][2] = '性無惑三級攻略─青少年篇';
SubMenuLinks[5][3] = './content_630.html';
SubMenuTitles[5][3] = '吃禁果、有後果';
SubMenuLinks[5][4] = './content_640.html';
SubMenuTitles[5][4] = '戴無色眼鏡 看兩性關係';
SubMenuLinks[5][5] = './content_650.html';
SubMenuTitles[5][5] = '總結：有情不亂性';


SubMenuLinks[6] = new Array();
SubMenuTitles[6] = new Array();
SubMenuLinks[6][0] = './parent_html/project_1.htm';
SubMenuTitles[6][0] = '專題探討1';
SubMenuLinks[6][1] = './parent_html/project_2.htm';
SubMenuTitles[6][1] = '專題探討2';
SubMenuLinks[6][2] = './parent_html/project_3.htm';
SubMenuTitles[6][2] = '專題探討3';


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

MenuAmount=Menu.length;
MenuWidth = 160;
MenuHeight = 21;
StartTop = 155 + MenuHeight;
StartLeft = 50;
NumOfMenuPerPage = 7;

// 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] * 20;
                        }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:0' onMouseOver='showDiv("+i+")' onMouseOut='hideDiv("+i+")'>";
                        DivString[i]+= OpenLayer+LinkLine;
                        for (j=0; j<SubLinkAmount; j++){
                                DivString[i]+= "<tr><td height='19' class='nav' background='images/m_nav_1_bg.gif'>&nbsp;";

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

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

// --------------------------------------- //
// ----------   Function Call   ---------- //
// --------------------------------------- //
function debug(){
        alert('hello');
}

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){
        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_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:1' onMouseOver='showDiv("+(100+i2)+")' onMouseOut='hideDiv("+(100+i2)+")'>";
                  sDivString[i2]+= OpenLayer+LinkLine;
                        for (j2=0; j2<Sub2LinkAmount; j2++){
                                sDivString[i2]+= "<tr><td height='19' class='nav' background='images/m_nav_1_bg.gif'>&nbsp;";
                                sDivString[i2]+= "<a href ='"+Sub2MenuLinks[i2][j2]+"'>"+Sub2MenuTitles[i2][j2]+"</a>";
                                sDivString[i2]+= "</td></tr>";
                                sDivString[i2]+= LinkLine;
                        }
                      sDivString[i2]+= CloseLayer;
                      sDivString[i2]+= "</div>";
                      document.write(sDivString[i2]);
                }
}
// --------------------------------------- //
// --------------------------------------- //
/*
      <table border="0" cellspacing="0" cellpadding="0" bgcolor="#9F7439" width="100%" >
        <tr>
          <td bgcolor="#FFD83B"><img src="images/table_09_over.gif" width="100%" height="6"></td>
        </tr>
        <tr>
          <td bgcolor="#FFD83B">&nbsp;&nbsp;<a href="#"class="table">aaaaaaaaaaaa</a></td>
        </tr>
        <tr>
          <td bgcolor="#FFD83B"><img src="images/table_09_over.gif" width="100%" height="6"></td>
        </tr>
        <tr>
          <td bgcolor="#FFD83B">&nbsp;&nbsp;<a href="#"class="table">aaaaaaa</a></td>
        </tr>
        <tr>
          <td bgcolor="#FFD83B"><img src="images/table_09_over.gif" width="100%" height="6"></td>
        </tr>
        <tr>
          <td bgcolor="#FFD83B">&nbsp;&nbsp;<a href="#"class="table">aaaaa</a></td>
        </tr>
        <tr>
          <td bgcolor="#FFD83B"><img src="images/table_09_over.gif" width="100%" height="6"></td>
        </tr>
      </table>
*/