var lstSecoes = ["Institucional", "Elastomeros", "Lubrificantes", "Adesivos"]
var bMouseOn = false
var whichIsOn = 'Home'

function toggleOn(e) {
    var anchor = e.target
    if (anchor === undefined) anchor = e.srcElement
    //console.log('toggleOn',anchor.parentNode.id)
    toggleAllOff(true)
    var id = anchor.parentNode.id.replace(/MenuPri/,'')
    if (id == anchor.parentNode.id) {
        //mouse sobre a imagem
        id = id.replace(/MenuImg/,'')
        $('MenuPri'+id).firstChild.className = 'MenuPri'+id+'Hover'
    }
    $('txtHome').setStyle({display:'none'})
    
    /*
    console.log('fade '+whichIsOn)
    Effect.Fade('Bg'+whichIsOn,{queue:{scope:'menu',limit:2}})
    console.log('appear '+id)
    */
    Effect.Appear('Bg'+id,{queue:{scope:'menu',limit:1,position:'end'}})
    //$('BgHome').setStyle({display:'none'})
    //$('Bg'+id).setStyle({display:'block'})
    $('txt'+id).setStyle({display:'block'})
    whichIsOn = id
}

function toggleAllOff(b) {
   //console.log('toggleAllOff',b)
   for (i=0;i<lstSecoes.length;i++) {
        $('txt'+lstSecoes[i]).setStyle({display:'none'})
        $('Bg'+lstSecoes[i]).setStyle({display:'none'})
        $('MenuPri'+lstSecoes[i]).firstChild.className = ''
    }
    if (b===true) {
    } else {
        var queue = Effect.Queues.get('menu')
        queue.each(function(e) {
             e.cancel()
        })
        $('txtHome').setStyle({display:'block'})
        /*
        console.log('out '+whichIsOn)
        Effect.Fade('Bg'+whichIsOn,{queue:{scope:'menu',position:'end',limit:2}})
        Effect.Appear('BgHome',{queue:{scope:'menu',limit:2,position:'end'}})
        whichIsOn = 'Home'
        */
        //$('BgHome').setStyle({display:'block'})
    }
}

function initToggle() {
    //console.log('initToggle')
    var i,anchor,func
    for (i=0;i<lstSecoes.length;i++) {
        //console.log($("MenuPri"+lstSecoes[i]))
        Event.observe($("MenuPri"+lstSecoes[i]),"mouseover",toggleOn,false)
        Event.observe($("MenuPri"+lstSecoes[i]),"mouseout",toggleAllOff,false)
        Event.observe($("MenuImg"+lstSecoes[i]),"mouseover",toggleOn,false)
        Event.observe($("MenuImg"+lstSecoes[i]),"mouseout",toggleAllOff,false)
        $('corpo').insertBefore(Builder.node('div',{id:'Bg'+lstSecoes[i],style:'display:none'},[Builder.node('div',{},' ')]),$('BgHome'))
    }
}

Event.observe(window,"load",initToggle,false)
