var offsetEl = null;
var dvQtde = null;
var dvDetalhe = null;
var btIncQtde = null;

// Variavel para controle do Ajax
var xmlHttp = null;


function showQtde(element, codigo){
    var end = document.body.clientWidth - (element.offsetWidth + 160);
    var top = calculateOffset(element,"offsetTop");
    
    dvQtde = document.getElementById("qtde");
    btIncQtde = document.getElementById("incqtde");
    
    //Posiciona o div na tela
    dvQtde.style.left = end + "px";
    dvQtde.style.top = top + 8 + "px";

    document.frmCarrinho.hidCodProduto.value = codigo;

        
    // Configura o botao do carrinho
    dvQtde.style.display= "block";
    document.frmCarrinho.txtQuant.focus();
}

function closeQtde() {
    dvQtde.style.display = "none";
}

// Carrega os dados do pop-up
function getDados(element, codigo){
    
    
    var url = "supermercado/detalheProduto.jsp?codProduto="+codigo;
    
    clearTable(document.getElementById("tbInfoProduto"));

    document.getElementById("foto").setAttribute("src","");
    document.getElementById("foto").style.display = "none";
        
    xmlHttp = null;
    createXmlRequest();
            
    xmlHttp.open("GET", url, true);
    xmlHttp.onreadystatechange = function () {
        if (isAjax(xmlHttp)){
            setInfoProduto(xmlHttp.responseXML);
        }
    }
     
    showDetalheProduto(element);
    document.getElementById("produto").innerHTML = "Aguarde...";
    xmlHttp.send(null);
        
    
}

// preenche os dados na tabela de detalhes

function setInfoProduto(xml) {
    
    var response = xml.getElementsByTagName("super");
    var produto;
    var nomes = "";
    var endereco = "";
    var cidade = "";
    var dataPreco = "";
    var preco = "";
    var foto = "";
    var codsuper = "";
    
    produto = response[0].getElementsByTagName("produto")[0].firstChild.data;
    foto =    response[0].getElementsByTagName("foto")[0].firstChild.data;  
    
    document.getElementById("produto").innerHTML = "Produto: "+produto;
    

    if (foto != ""){
        document.getElementById("foto").setAttribute("src","images/supermercado/"+foto+".gif");
        document.getElementById("foto").style.display = "block";
    }    
    
    for(var i = 0; i < response.length; i++){
        var supermercado = response[i];
        
        nomes = supermercado.getElementsByTagName("nomes")[0].firstChild.data;
        endereco = supermercado.getElementsByTagName("endereco")[0].firstChild.data;
        cidade = supermercado.getElementsByTagName("cidade")[0].firstChild.data;
        dataPreco = supermercado.getElementsByTagName("dataPreco")[0].firstChild.data;
        preco = supermercado.getElementsByTagName("preco")[0].firstChild.data;
        codsuper = supermercado.getElementsByTagName("codsuper")[0].firstChild.data;
        
        
        var row = document.createElement("tr");
        row.appendChild(createCell(nomes,"left"));
        row.appendChild(createCell(endereco,"left"));
        row.appendChild(createCell(cidade,"left"));
        row.appendChild(createCell(dataPreco,"center"));
        row.appendChild(createCell("R$ "+preco,"center"));
        
        // seta o id da linha com o codigo do supermercado.
        row.id = codsuper;
        
        document.getElementById("tbInfoProduto").appendChild(row);
    }    
    
    adicionaEfeito("tbInfoProduto");
}


// adiciona efeito a linha da tabela
function adicionaEfeito(tableid){
    var table = document.getElementById(tableid);
    
    var rows = table.getElementsByTagName("TR");
    
    for (var i = 0; i < rows.length; i++){
           rows[i].onmouseover = mostraEfeito;
           rows[i].onmouseout = tiraEfeito;
    }    
    
}


// seta a cor e o fundo da linha
function mostraEfeito(){
    this.style.background = "black";
    this.style.color = "white";

}


// tira o efeito da linha
function tiraEfeito(){
    this.style.background = "white";
    this.style.color = "black";
}



// Mostra o PopUp de detalhes do produto
function showDetalheProduto(element){

    var top = calculateOffset(element,"offsetTop");
    
    dvDetalhe = document.getElementById("dvDetalhe");
    
    dvDetalhe.style.top = top - 150 + "px";
    dvDetalhe.style.left = 180+"px";
    
    dvDetalhe.style.display = "block";
    
}

function fecharDetalhe(){
    dvDetalhe.style.display = "none";
}

function calculateOffset(field, attr) {
    var offset = 0;
    
    while(field) {
        offset += field[attr];
        field = field.offsetParent;
    }
    
    return offset;
}

/* função para pesquisar o produto pelo nome */
function pesquisarProduto(){
    var valor = document.getElementById("txtPesquisa").value;
    
    if (valor == "" || valor == "Digite aqui o produto"){
        alert("Informe o nome do produto para pesquisa.");
        document.getElementById("txtPesquisa").focus();
        return false;
    }
    
    url = "produtosup.jsp?txtNome="+valor;
    document.location.href = url;
    
}

function pesquisarFocus(){
    var txt = document.getElementById("txtPesquisa");
    
    if (txt.value = "Digite aqui o produto") {
        txt.value = "";
    }
    
}



/*
    FUNCOES AJAX 
*/

// Cria o objeto Ajax
function createXmlRequest(){
    
    if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }   
}

// Verifica a requisição Ajax
function isAjax(obj) {
    if (obj.readyState == 4) {
        if (obj.status == 200) {
            return true;
        } else {
            return false;
        }    

    }
}

// cria uma celula na tabela
function createCell(text, align){
    var cell = document.createElement("td");
    cell.appendChild(document.createTextNode(text));
    
    if (align != null){
        cell.setAttribute("align", align);
    }    
    
    return cell;
}    

// limpa o conteudo da tabela
function clearTable(table){
    var ind = table.childNodes.length;
    
    for (var i = ind - 1; i >= 0;i--){
        table.removeChild(table.childNodes[i]);
    }    
}