var allCursos = new Array();
var allTopicos = new Array();
var allCategorias = new Array();
var textTecnos = new Array();

var onlyTime = true;

function Curso(tecnologia ,nombre, valor) {
    this.tecnologia = tecnologia;
    this.nombre = nombre;
    this.valor = valor;
}

function Topico(tipo ,nombre, valor) {
    this.tipo = tipo;
    this.nombre = nombre;
    this.valor = valor;
}

function loadTopicos2() {
    var params = {method:"GET", onSuccess:readTopicos};
    new Ajax.Request("Asuntos2.xml", params);
}

function readTopicos(resp){
    var topicoXML = resp.responseXML;
    var tagCategorias = topicoXML.getElementsByTagName("Categoria");
    var tamCatego = tagCategorias.length;
    for(var i = 0; i < tamCatego; i++){
        var txtCategoria = tagCategorias[i].getAttribute("name");
        allCategorias.push(txtCategoria);
        var tagsTopicos = tagCategorias[i].getElementsByTagName("topico");
        if(txtCategoria == "cursos") {
            readCursos(topicoXML);            
        }else{
            readTopico(txtCategoria, tagsTopicos);
        }
    }
    var cadTable = generateTable()
    $('panelTopicos').innerHTML = cadTable;
   // alert(cadTable);
}

function readTopico(txtCatego, topicoXML){
    var tamTopicos = topicoXML.length;
    for(var i = 0; i < tamTopicos; i++){
        var nombre = topicoXML[i].firstChild.nodeValue;
        var valor  = topicoXML[i].getAttribute("value");
        allTopicos.push(new Topico(txtCatego, nombre, valor));
    }
     
}

function readCursos(topicoXML){
    var tagCursos = topicoXML.getElementsByTagName("tecnologia");
    var tamCursos = tagCursos.length;
    for(var i = 0; i < tamCursos; i++){
        var tagTecno = tagCursos[i].getElementsByTagName("topico");
        var txtTecno = tagCursos[i].getAttribute("name");
        textTecnos.push(txtTecno);
        for(var j = 0; j < tagTecno.length; j ++){
            var valor = tagTecno[j].getAttribute("value");
            var texto = tagTecno[j].firstChild.nodeValue;
            allCursos.push(new Curso(txtTecno, texto, valor));
        }
    }
}

function showDivTopicos(){
    $('panelTopicos').show();
    new Effect.Opacity('panelTopicos', { from: 0, to: 1, duration: 2.5 });
    new Effect.Opacity('content', { from: 1, to: 0.3 });
     $('select1').blur();
}

/**
 * generaTablaTopico
 */
function generateTable() {
    var tamCategorias = allCategorias.length;
    var strHtml = "";
    strHtml += "<div id='tituloTopicos' style='width=400px'> </div>";
    strHtml += "<table  width='98%' align='center' " +
                       "style='font-size:small;font-family:Verdana;border-style:border'>" +
                "<tr id='rowCurso' align='center'>";

   strHtml += "<td id='colCurso' align='center' colspan='4' style='font-size:small;font-family:Verdana;font-weight:bolder'> Seleccione un servicio  <td> </tr>";
   strHtml += "<tr align='center'><td align='center' colspan='4' width='100%'>";
   // **************  CUSOS A DESPLEGAR ***************************************
   strHtml += "<table id='tblCursos' width='100%' height='100%' align='center' " +
                              "style='font-size:x-small;' onmouseout='effectColOut(this)' >" +
                              "<tr align='center'>"
   for(var iTecnos = 0; iTecnos < textTecnos.length; iTecnos++){
       strHtml += "<td id='titulo" + iTecnos + "' align='center' style='font-weight:bolder'> CURSOS " + textTecnos[iTecnos].toUpperCase() + "</td>"
   }
   var contador = 0;
   strHtml += "</tr><tr ><td id='cursoJava' valign='top' style='text-align:left'";
   strHtml += "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>";
   
   // **************  Imprimiendo los cursos disponibles  *********************
   for(var iCursos = 0; iCursos < allCursos.length; iCursos++){
       if(allCursos[iCursos].tecnologia == "java"){
            strHtml  += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                            "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allCursos[iCursos].valor + "\");'>" +
                            allCursos[iCursos].nombre + "</li>";
            contador ++;
       }
       else{
           strHtml += "</td><td id='cursoPhp' valign='top' ";
           strHtml += "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)' >"
           break;
       }
   }

   //  ************************************************************************
   for(var iCursos = contador; iCursos < allCursos.length; iCursos++){
       if(allCursos[iCursos].tecnologia == "php"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                      "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allCursos[iCursos].valor + "\");'>" + allCursos[iCursos].nombre + "</li>";
            contador ++;
       }
       else{
           strHtml += "</td><td id='cursoNet' valign='top' style='text-align:left'";
           strHtml += "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>"
           break;
       }
   }

   //  ************************************************************************
   for(var iCursos = contador; iCursos < allCursos.length; iCursos++){
       if(allCursos[iCursos].tecnologia == "net"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allCursos[iCursos].valor + "\");' >" + allCursos[iCursos].nombre + "</li>";
            contador ++;
       }
       else{
           strHtml += "</td><td id='cursoLinux' valign='top' style='text-align:left' ";
            strHtml += "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>"
           break;
       }
   }

   //  ************************************************************************
   for(var iCursos = contador; iCursos < allCursos.length; iCursos++){
       if(allCursos[iCursos].tecnologia == "linux"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                        "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allCursos[iCursos].valor + "\");'>" + allCursos[iCursos].nombre + "</li>";
            contador ++;
       }
       else{
           strHtml += "</td><td id='cursoOracle' valign='top' style='text-align:left' ";
            strHtml += "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>"
           break;
       }
   }

   for(var iCursos = contador; iCursos < allCursos.length; iCursos++){
       if(allCursos[iCursos].tecnologia == "oracle"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allCursos[iCursos].valor + "\");'>" + allCursos[iCursos].nombre + "</li>";
            contador ++;
       }
       else{
           strHtml += "</td><td id='cursoOtros' valign='top' style='text-align:left' "
            strHtml += "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>"
           break;
       }
   }

   for(var iCursos = contador; iCursos < allCursos.length; iCursos++){
       if(allCursos[iCursos].tecnologia == "otros"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allCursos[iCursos].valor + "\");'>" + allCursos[iCursos].nombre + "</li>";
            contador ++;
       }
       else{
           strHtml += "</td>"
           break;
       }
   }

   strHtml += "</tr></table>"

   strHtml += "</td> </tr>";

   // ******************************************************************************
   
   strHtml += "<tr align='center'><td id='colOtros1' style='font-weight:bolder;font-size:x-small'> DIPLOMADOS <td>";
   strHtml += "<td id='colOtros2' style='font-weight:bolder;font-size:x-small'> CONSULTORIA </td>";
   strHtml += "<td id='colOtros3' style='font-weight:bolder;font-size:x-small'> OTROS </td>";

   // ******************************************************************************

   strHtml += "<tr>";
   contador = 0;
   strHtml += "<td id='colsDiplo' valign='top' style='font-size:x-small;text-align:left' " +
              "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>";
   for(var iDiplo = contador; iDiplo < allTopicos.length; iDiplo++){
        if(allTopicos[iDiplo].tipo == "diplomados"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allTopicos[iDiplo].valor + "\");'>" + allTopicos[iDiplo].nombre + "</li>";
            contador ++;
        }else{
           strHtml += "</td><td  valign='top' style='font-size:x-small;text-align:left' " +
                      "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>";
           break;
       }
   }
   strHtml += "</td><td id='colsConsult' valign='top' style='font-size:x-small;text-align:left' onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>";
   for(var iDiplo = contador; iDiplo < allTopicos.length; iDiplo++){
        if(allTopicos[iDiplo].tipo == "consultoria"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allTopicos[iDiplo].valor + "\");'>" + allTopicos[iDiplo].nombre + "</li>";
            contador ++;
        }else{
           strHtml += "</td><td id='colsOtros' valign='top' style='font-size:x-small;text-align:left' " +
                      "onmouseover='effectColOver(this)' onmouseout='effectColOut(this)'>";
           break;
       }
   }

   for(var iDiplo = contador; iDiplo < allTopicos.length; iDiplo++){
        if(allTopicos[iDiplo].tipo == "otros"){
            strHtml += "<li style='cursor:pointer' onmouseover='rowEffectOver(this)' " +
                "onmouseout='rowEffectOut(this)' onclick='onClickTopico(this, \" " + allTopicos[iDiplo].valor + "\");'>" + allTopicos[iDiplo].nombre + "</li>";
            contador ++;
        }else{
           strHtml += "</td>"
           break;
       }
   }

   //*******************************************************************
   strHtml += "</tr></table>";
   return strHtml;
}

function onClickTopico(elemento, value) {
    var eTopico = $("select1");
    eTopico.innerHTML = "";
    var option = document.createElement("option");
    option.innerHTML = elemento.innerHTML;
    option.setAttribute("value", value);
    eTopico.appendChild(option);
    new Effect.Puff('panelTopicos');
    new Effect.Opacity('panelTopicos', { from: 1, to: 0, duration: 1.5 });
    new Effect.Opacity('content', { from: 0.3, to: 1.3 });
    
}

function rowEffectOver(elemento) {
     elemento.style.color = "#FFEEAA";
     elemento.style.backgroundColor = "#90B0DA";
     
}

function rowEffectOut(elemento) {
    elemento.style.color = "black";
    elemento.style.backgroundColor = "";
}

function effectColOut(id) {
//    alert(id);
    id.style.backgroundImage = "url('./images/FondoAzul.jpg')";
    if(id == $("cursoJava")){
        $('cursoJava').style.backgroundImage = "url('./images/FondoAzul.jpg')";
        $('titulo0').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    }else if(id == $("cursoPhp")){
        $('cursoPhp').style.backgroundImage = "url('./images/FondoAzul.jpg')";
        $('titulo1').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    }else if(id == $("cursoNet")){
        $('cursoNet').style.backgroundImage = "url('./images/FondoAzul.jpg')";
        $('titulo2').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    }else if(id == $("cursoLinux")){
        $('cursoLinux').style.backgroundImage = "url('./images/FondoAzul.jpg')";
        $('titulo3').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    }else if(id == $("cursoOracle")){
        $('cursoOracle').style.backgroundImage = "url('./images/FondoAzul.jpg')";
        $('titulo4').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    }else if(id == $("cursoOtros")){
        $('cursoOtros').style.backgroundImage = "url('./images/FondoAzul.jpg')";
        $('titulo5').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    }else if(id == $("tblCursos"))
        $('colCurso').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colCurso"))
        $('cursoJava').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colsDiplo"))
        $('colOtros1').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colOtros1"))
        $('colsDiplo').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colsConsult"))
        $('colOtros2').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colOtros2"))
        $('colsConsult').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colOtros3"))
        $('colsOtros').style.backgroundImage = "url('./images/FondoAzul.jpg')";
    else if(id == $("colsOtros"))
        $('colOtros3').style.backgroundImage = "url('./images/FondoAzul.jpg')";
}

function effectColOver(id){
    id.style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    if(id == $("cursoJava")){
        $('titulo0').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
        //$('colCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("cursoNet")){
        $('titulo2').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
        //$('colCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("cursoPhp")){
        $('titulo1').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
        //$('colCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("cursoLinux")){
        $('titulo3').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
        //$('colCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("cursoOracle")){
        $('titulo4').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
        //$('colCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("cursoOtros")){
        $('titulo5').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
        //$('colCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("tblCursos")){
        $('rowCurso').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    }else if(id == $("colOtros1"))
        $('colsDiplo').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    else if(id == $("colsDiplo"))
        $('colOtros1').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    else if(id == $("colOtros2"))
        $('colsConsult').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    else if(id == $("colsConsult"))
        $('colOtros2').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    else if(id == $("colOtros3"))
        $('colsOtros').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
    else if(id == $("colsOtros"))
        $('colOtros3').style.backgroundImage = "url('./images/FondoAzul2.jpg')";
}