'USE STRICT';
// insere no teu html <script... ? pronto
// apostar.js nao ta carregando
/*
  Deixei essa parte funcionando, pois a de teste de acumulada não estou conseguindo.
  eu não mechi em nada ai

 */


$(function(){

    $('#apostaAcomulada').hide();

    var apostas = [];

    $('.dangerHover').on('click', function(){
        //a unica coisa q eu fiz foi add esse toggleClass pra ele fica azul quando clicado
		$(this).toggleClass('classAtiva');
        var idCamp = $(this).attr('idCamp');
        var caluna = $(this).attr('caluna');
        var colTimes = $(this).attr('colTimes');
        var valor = $(this).attr('valor');
        var idInt = $(this).attr('idind');

        var a = {
            idCamp: idCamp,
            caluna: caluna,
            colTimes: colTimes,
            valor: valor,
            idInt: idInt
        };

        // cade a parte que add?
       // já ginha a validaça se ja foi add


        var jogos = $.grep(apostas, function(e){ return  e.idInt == a.idInt; });

        if(jogos.length == 1) {
            console.log('esse jogo ja foi adicionado');
        } else {
            apostas.push(a);

        }

        testa(apostas, a);

     // testa







        $('#boxsApostas').html('');
        for(var i = 0; i < apostas.length; i++) {
            $('.btnFinalAposta').show();
            $('#boxsApostas').append('<div class=\"divApostas bg-success\" idClose=\"aposta_close_'+apostas[i].idInt+'\"> <div indexRemove=\"'+i+'\" class=\"close clickClose\" data-id=\"aposta_id_'+apostas[i].idInt+'\">x</div><h4>'+apostas[i].colTimes+' <input type=\"hidden\" name=\"times[]\" value=\"'+apostas[i].colTimes+'\"> </h4> <h5>'+apostas[i].caluna+'</h5> <div class=\"btn-group col-sm-3\" style=\"padding: 0; margin: 0;\"> <input type=\"text\" class=\"form-control maskMoney digCalq\" idAposta=\"'+apostas[i].idInt+'\"  name=\"valor[]\" value=\"\" digCalc=\"'+apostas[i].valor+'\"> <input type="hidden" value=\"\" name=\"valCalc[]\" id=\"aposta_valCalc_'+apostas[i].idInt+'\"> </div><div class=\"colSomaAposta\" id=\"aposta_idHtmlValor_'+apostas[i].idInt+'\"></div><input type=\"hidden\" class=\"valorSoma\" name=\"valSoma[]\" idValor=\"o que eh esse valSoma?\" maxlength=\"5\"> <div class=\"clearfix\"></div></div>'); // aqui vai o HTML do form, os inputs
        }

    });

    function testa(arr_apostas, arr_atual) {
        console.log('teste');

            /*
                conto quantos campeonatos tem com mesmo ID
                depois conto quantos jogos com mesmo id
             */
        var campeonatos = $.grep(arr_apostas, function(e){ return  e.idCamp == arr_atual.idCamp; });
        var jogos = $.grep(arr_apostas, function(e){ return  e.idInt != arr_atual.idInt; });




        /*
            Se quantidade de campeonatos com mesmo ID for maior q 2, mostra aposta ocumulada
            ou se jogos for maior q 1
         */
        if( (campeonatos.length > 2) && (jogos.length) ){
            $('#apostaAcomulada').show();
        } else {
            $('#apostaAcomulada').hide();
        }

        /*
            Regra aplicada, agora não to entendendo mais é nada!
            hehehe
         */


    }

    // ler um elemento carregado no javascript sempre é um problema de atualização do dom :(
    $(document).on('click','.clickClose', function(){
        var index = $(this).attr('indexRemove');
        apostas.splice(index, 1);

        $('#boxsApostas').html('');
        for(var i = 0; i < apostas.length; i++) {
            $('#boxsApostas').append('<div class=\"divApostas bg-success\" idClose=\"aposta_close_'+apostas[i].idInt+'\"> <div indexRemove=\"'+i+'\" class=\"close clickClose\" data-id=\"aposta_id_'+apostas[i].idInt+'\">x</div><h4>'+apostas[i].colTimes+' <input type=\"hidden\" name=\"times[]\" value=\"'+apostas[i].colTimes+'\"> </h4> <h5>'+apostas[i].caluna+'</h5> <div class=\"btn-group col-sm-3\" style=\"padding: 0; margin: 0;\"> <input type=\"text\" class=\"form-control maskMoney digCalq\" idAposta=\"'+apostas[i].idInt+'\"  name=\"valor[]\" value=\"\" digCalc=\"'+apostas[i].valor+'\"> <input type="hidden" value=\"\" name=\"valCalc[]\" id=\"aposta_valCalc_'+apostas[i].idInt+'\"> </div><div class=\"colSomaAposta\" id=\"aposta_idHtmlValor_'+apostas[i].idInt+'\"></div><input type=\"hidden\" class=\"valorSoma\" name=\"valSoma[]\" idValor=\"o que eh esse valSoma?\" maxlength=\"5\"> <div class=\"clearfix\"></div></div>'); // aqui vai o HTML do form, os inputs

        }
    });

    $(document).on('keyup','.digCalq', function(){
        var valor_digitado = $(this).val();
        var valor_aposta = $(this).attr('digCalc');
        var multiplicaCao = valor_digitado * valor_aposta;

        var id = $(this).attr('idAposta');

        $('#aposta_valCalc_' + id).val(multiplicaCao);

        $("#aposta_idHtmlValor_"+id).text(multiplicaCao);

    });

    function testaAcumulado(arr){
        $.grep(arr, function(e){ return ((e.idInt != a.idInt) && (e.idCamp == a.idCamp)) ; });
    }




    });