function MultiSelectTabMenu(outer, mnuImgcssName, contentDivcssName, imgBasePath, onFiles, offFiles)
{
    if(outer == null) alert('out Elem is null: ' + contentDivcssName);
    this.OuterElem = outer;
    this.onImage = onFiles;
    this.offImage = offFiles;
    this.ImageBase = imgBasePath;
    
    this.menus = GUtil.ElemSByClass(mnuImgcssName, outer, 'img' ); //¸Þ´ºµé..
    
    if(contentDivcssName == null)
        this.contents = null;
    else
        this.contents = GUtil.ElemSByClass(contentDivcssName, outer, 'div' ); //¸Þ´º¼±ÅÃ½Ã º¸¿©Áö´Â ÄÁÅÙÃ÷°¡ µé¾îÀÖ´Â divµé...    
}

MultiSelectTabMenu.prototype.Init = function(holdLastOver, initialSelectBy, evtName)
{
    if(this.menus.length==0) return;
    
    for(k=0 ; k<this.menus.length; k++) //¸Þ´º¿¡ mouseover ÀÌº¥Æ® Ãß°¡..
    {
        if(evtName=='click' || evtName == 'onclick') 
            this.menus[k].onclick = this.SelectMenu; //Å¬¸¯½Ã ¹ÝÀÀÇÑ´Ù.
        else 
        {
            this.menus[k].onmouseover = this.SelectMenu; //¸¶¿ì½º ¿À¹ö¿¡ ¹ÝÀÀÇÑ´Ù.            
            if(holdLastOver == false)
            {//¸¶Áö¸· OnµÈ ¸Þ´º¸¦ À¯Áö½ÃÅ³ÇÊ¿ä°¡ ¾ø´Ù: ¸ÞÀÎ¸Þ´ºµî...
                this.menus[k].onmouseout = this.DeSelectMenu;
            }
            else
            {//¸¶¿ì½º°¡ ºüÁ®³ª°¡´õ¶óµµ ¸¶Áö¸· ¼±ÅÃµÈ°ÍÀÌ ¼±ÅÃµÈ »óÅÂ·Î ÀÖ°Ô ÇÑ´Ù.:(»óÇ°Áø¿­ ÅÇ µî¿¡ »ç¿ëµÈ´Ù.)
            }
        }
        
        this.menus[k].mnObj = this;
    }
    
    //¸ðµç ¸Þ´º¸¦ off·Î ÃÊ±âÈ­ ½ÃÅ²´Ù.
    for(k=0 ; k<this.menus.length; k++)
    {
        //menu OFF
        this.menus[k].setAttribute('src', this.ImageBase + this.offImage[k]);
        if(this.contents!=null && this.contents != 'undefined') this.contents[k].style.display = 'none';
    }
    
    if(typeof initialSelectBy == 'undefined' || initialSelectBy == null || initialSelectBy == 'first') //ÃÖÃÊ¿¡´Â 1¹ø ¸Þ´º°¡ ¼±ÅÃµÇµµ·Ï ÇÑ´Ù.
        this.SelectMenu(null, this.menus[0]); 
    else if (typeof initialSelectBy == 'number')
        this.SelectMenu(null, this.menus[initialSelectBy]);
    else if(initialSelectBy == 'url') //ÃÖÃÊ¿¡¿¡ url¿¡ ¸Â´Â ¸Þ´º¸¦ ¼±ÅÃÇÑ´Ù.
    {
        var curl = window.location.href.toLowerCase();        
        for(k=0 ; k<this.menus.length; k++)
        {
            var atagurl = GUtil.FindOuterElementByTagName(this.menus[k], 'a');
            atagurl = atagurl.getAttribute('href');
            if(atagurl!= null) atagurl = atagurl.toLowerCase();
            atagurl = atagurl.substring(0, atagurl.lastIndexOf('/'));
            if(curl.indexOf(atagurl)>=0)
            {
                this.offImage[k] = this.onImage[k];
                this.SelectMenu(null, this.menus[k]);
                break;
            }
        }
    }
}

MultiSelectTabMenu.prototype.DeSelectMenu = function DeSelectMenu(evt, src)
{
    if(src == null) //Ã³À½¿¡ ÇÑ¹ø¸¸ src°¡ ÀÖ°í mouser over ÀÏ¶§´Â src´Â Ç×»ó nullÀÌ´Ù.
    {
        evt = (evt) ? evt : ((window.event) ? window.event : "");
        if (evt)
            src = (evt.target) ? evt.target : evt.srcElement;// mouseoverÀÏ¶§ evt ¼Ò½º¸¦ Ã£´Â´Ù.
    }
    
    if(src.mnObj==null) return;    
    mn = src.mnObj;    
    if(src==null || typeof mn.menus == 'undefined' || mn.menus == null) return;
    for(k=0 ; k<mn.menus.length; k++)
    {
        if(src == mn.menus[k]) //menu On
        {
            mn.menus[k].setAttribute('src', mn.ImageBase + mn.offImage[k]);
            if(mn.contents!=null && mn.contents != 'undefined') mn.contents[k].style.display = 'none';
        }
    }
}

MultiSelectTabMenu.prototype.SelectMenu = function SelectMenu(evt, src)
{
    if(src == null) //Ã³À½¿¡ ÇÑ¹ø¸¸ src°¡ ÀÖ°í mouser over ÀÏ¶§´Â src´Â Ç×»ó nullÀÌ´Ù.
    {
        evt = (evt) ? evt : ((window.event) ? window.event : "")
        if (evt)
            src = (evt.target) ? evt.target : evt.srcElement;// mouseoverÀÏ¶§ evt ¼Ò½º¸¦ Ã£´Â´Ù.
    }
    
    if(src.mnObj==null) return;    
    mn = src.mnObj;    
    if(src==null || typeof mn.menus == 'undefined' || mn.menus == null) return;
    for(k=0 ; k<mn.menus.length; k++)
    {
        if(src == mn.menus[k]) //menu On
        {
            mn.menus[k].setAttribute('src',mn.ImageBase + mn.onImage[k]);
            if(mn.contents != null && mn.contents != 'undefined') mn.contents[k].style.display = 'inline';
        }
        else  //menu OFF
        {
            mn.menus[k].setAttribute('src', mn.ImageBase + mn.offImage[k]);
            if(mn.contents!=null && mn.contents != 'undefined') mn.contents[k].style.display = 'none';
        }
    }
}

////////////////////////////////////////// Text ¸Þ´º Å¬·¡½º /////////////////////////////////////////////////////////////////////////
function MultiSelectTextTabMenu(mnus, divs, cOn, cOff, initialSelect)
{
    this.TextMenus = mnus;
    this.Divs = divs;
    this.ColorOn = cOn;
    this.ColorOff = cOff;
    
    for(mk = 0; mk < mnus.length; mk++)
    {
        this.TextMenus[mk].onmouseover = this.OnMouseOver;
        this.TextMenus[mk].mnobj = this;
        this.TextMenus[mk].mnidx = mk;        
        
        this.TextMenus[mk].style.color = cOff;
        this.Divs[mk].style.display = 'none';
    }
    
    if(initialSelect == null || initialSelect == 'undefined')   initialSelect = 0;
    
    this.TextMenus[initialSelect].style.color = cOn;
    this.Divs[initialSelect].style.display = 'block';
}

MultiSelectTextTabMenu.prototype.OnMouseOver = function(evt)
{  
    var src = null;
    evt = (evt) ? evt : ((window.event) ? window.event : "")
    if (evt) src = (evt.target) ? evt.target : evt.srcElement;// mouseoverÀÏ¶§ evt ¼Ò½º¸¦ Ã£´Â´Ù.
    
    var mnobj = src.mnobj;
    for(ik = 0 ; ik < mnobj.Divs.length; ik++)
    {
        mnobj.Divs[ik].style.display = 'none';
        mnobj.TextMenus[ik].style.color = mnobj.ColorOff;
    }
    
    mnobj.Divs[src.mnidx].style.display = 'block';
    mnobj.TextMenus[src.mnidx].style.color = mnobj.ColorOn;
}

////////////////////////////// MultiSelectTabMenu with Seperator
function MultiSelectTabMenuSep(_imgroot, _outer, _tbl, _menuTDclass, _barTDclass, _contentDivcssName, _data)
///////////// _imgroot = '/Helper/Masters/img/mainmenu/', _outer = $('mainmenutableouter'), _tbl = $('<%=mainmenutbl.ClientID %>'), 
///////////// _menuTDclass = 'mnuimgclass', _barTDclass = 'id_mnbar', _contentDivcssName=null, _data = [...]
{
    this.imgroot = _imgroot;
    this.outer = _outer;
    this.tbl = _tbl;
    this.menuTDclass = _menuTDclass;
    this.barTDclass = _barTDclass;    
    
    if(_contentDivcssName == null)
        this.contents = null;
    else
        this.contents = GUtil.ElemSByClass(_contentDivcssName, outer, 'div' ); //¸Þ´º¼±ÅÃ½Ã º¸¿©Áö´Â ÄÁÅÙÃ÷°¡ µé¾îÀÖ´Â divµé...
    
    this.data = _data;
    //this.isMainMenu = _isMainMenu;
}

MultiSelectTabMenuSep.prototype.init = function(_initialSelect, _recoverInitial, _evtName) //_recoverInitial=> ¸ÞÀÎ¸Þ´º¿¡¼­´Â true °ª»ç¿ëÇÑ´Ù.
{
    var row = this.tbl.rows[0];
    var idxMn = 0;
    for(tk = 0; tk < row.cells.length; tk++)
    {
        if(row.cells[tk].className == this.menuTDclass)
        {
            row.cells[tk].obj = this;
            row.cells[tk].idxMn = idxMn;
            row.cells[tk].mndata = this.data[idxMn];
            this.data[idxMn].cell = row.cells[tk];
            row.cells[tk].prvBar = row.cells[tk].nxtBar = null;
            if( tk == 0 ) //Ã¹¹øÂ° ¼¿
            {
                if(row.cells[tk+1].className == this.barTDclass) row.cells[tk].nxtBar = row.cells[tk+1];
            }
            else if(tk == (row.cells.length-1))//¸¶Áö¸· ¼¿
            {
                if(row.cells[tk-1].className == this.barTDclass) row.cells[tk].prvBar = row.cells[tk-1];
            }
            else
            {
                if(row.cells[tk-1].className == this.barTDclass) row.cells[tk].prvBar = row.cells[tk-1]; // ¾ÕÀÇ ¼¿ÀÌ barTDclass ÀÌ¸é,, ¾ÕÀÇ ¼¿Àº prvBar
                if(row.cells[tk+1].className == this.barTDclass) row.cells[tk].nxtBar = row.cells[tk+1]; //// µÚÀÇ ¼¿ÀÌ barTDclass ÀÌ¸é,, µÚÀÇ ¼¿Àº nxtBar
            }
            
            if(_evtName=='click' || _evtName == 'onclick') 
                row.cells[tk].onclick = this.OnMouseOver;
            else
                row.cells[tk].onmouseover = this.OnMouseOver;
                
            if(_recoverInitial == true) row.cells[tk].onmouseout = this.OnMouseOut;
            
            idxMn++;   //menuTDclass ¸¸ ¼¼´Â°Å.            
        }
    }
    
    if(_initialSelect==null || isNaN(_initialSelect) ) this.initialSelect = 0;
    this.initialSelect = _initialSelect;
    if(this.initialSelect!=null) this.On(this.initialSelect); ///¼ºÅÂ.. nullÀÏ¶§ ½ÇÇà¾ÈµÇµµ·Ï if¹®Ãß°¡
}

MultiSelectTabMenuSep.prototype.OnMouseOver = function(evt)
{
    var e=evt?evt:window.event?window.event:null;
    var srcElem = e.target ? e.target : (e.srcElement ? e.srcElement : null);    
    if(srcElem.tagName.toLowerCase() == 'img') srcElem = GUtil.FindOuterElementByTagName(srcElem, 'td');
    
    srcElem.obj.On(srcElem.idxMn);
}

MultiSelectTabMenuSep.prototype.OnMouseOut = function(evt) //_recoverInitial == true ÀÏ¶§¸¸ È£ÃâµÊ
{
    var e=evt?evt:window.event?window.event:null;
    var srcElem = e.target ? e.target : (e.srcElement ? e.srcElement : null);    
    if(srcElem.tagName.toLowerCase() == 'img') srcElem = GUtil.FindOuterElementByTagName(srcElem, 'td');
    
    srcElem.obj.Off(srcElem.idxMn);
    srcElem.obj.On(srcElem.obj.initialSelect);
}

MultiSelectTabMenuSep.prototype.On = function(nth)
{
    if(nth!=null) //¼ºÅÂ, if¹®Ãß°¡,,, nth°¡ nullÀÏ¶§, default·Î ¿Â µÇ¾îÀÖ´Â td°¡ ¾ø°Ô. 
    {
        this.Off(this.lastSelect);   //¼ºÅÂ, if¹® Ãß°¡,,, 
        this.lastSelect = nth;
        
        var td = this.data[nth].cell;
        
        var mnimg = td.getElementsByTagName('img')[0];
        mnimg.src = this.imgroot + td.mndata["on"];
        if(this.contents!=null) this.contents[nth].style.display = 'block';
        
        var ibar = null;
        if(td.prvBar != null)
        {
            ibar = td.prvBar.getElementsByTagName('img')[0];
            ibar.src = this.imgroot + td.mndata["l_on"];
        }
        if(td.nxtBar != null)
        {
            ibar = td.nxtBar.getElementsByTagName('img')[0];
            ibar.src = this.imgroot + td.mndata["r_on"];
        }
    }
}

MultiSelectTabMenuSep.prototype.Off = function(nth)
{
    if(nth == null || isNaN(nth) ) return;
    
    var td = this.data[nth].cell;    
    var mnimg = td.getElementsByTagName('img')[0];
    mnimg.src = this.imgroot + td.mndata["off"];
    if(this.contents!=null) this.contents[nth].style.display = 'none';
    
    var ibar = null;
    if(td.prvBar != null)
    {
        ibar = td.prvBar.getElementsByTagName('img')[0];
        ibar.src = this.imgroot + td.mndata["l_off"];
    }
    if(td.nxtBar != null)
    {
        ibar = td.nxtBar.getElementsByTagName('img')[0];
        ibar.src = this.imgroot + td.mndata["r_off"];
    }
}


