<?php
defined('BASEPATH') OR exit('No direct script access allowed');
$this->load->view('template/head.php');
?>

<style>
body {
    scroll-behavior: smooth;
}

.footer {
    padding: 10px;
    background: rgb(18, 20, 32, .75);
    color: #F0F0F0;
    text-align: center;
    bottom: 0;
    position: initial;
    width: 100%;
    display: flex;
}

.info-votacion-fixed {
    margin-left: -1%;
}

.info-votacion {
    margin-left: -1%;
}

@media screen and (max-width: 600px) {
    .info-votacion-fixed {
    margin-left: -5%;
}

.info-votacion {
    margin-left: -5%;
}
}
img {
    max-height: 100%;
}

</style>

<?php
$data_view_header = [];
if ($empresa) {
   $data_view_header['nombre_empresa'] = $empresa;
}
$this->load->view('template/header.php', $data_view_header);
?>

<div class="loader" style="position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    color: rgb(255, 255, 255);
    background:url(<?php echo base_url().'uploads/cargando.gif' ?>) 50% 50% no-repeat rgb(255, 255, 255);"></div>
<div id="url-timer" style="display: none">votacion/Votacion_listas/timer_votacion</div>
<section class="row contenedor-titulo votacion-titulo ">
    <h1 style="color: #959595;text-align: center;
    font-weight: 900;
    color: #000;
    border-bottom: 1px dotted var(--principal);
    padding-bottom: 10px;
    text-transform: uppercase;
    font-weight: 300;"><?= $instancia->TEX_NOMINS ?></h1>
    </section>
<section class="row" id="tarjeton-listas" style="padding: 30px;">
    <div class="row contenedor-info-votacion">
        <div id="informacion-votacion" class="container info-votacion" >
            <div class="col-lg-4">
                <!-- Reloj -->
                <h3 id="display"></h3>
            </div>

            <div class="col-lg-4">
                <?php if($buscador):  ?>
                <div class="form-inline">
                    <div class="form-group">
                        <label for="busqueda" class="col-12 col-xs-12"
                            style="display: inline-block;  vertical-align: bottom;">Buscar Lista: </label>
                        <input type="text" id="buscador-listas" style="border-color: #f4863d;top: -25px; float: right; display: inline-block;"
                            class="form-control col-xs-7" placeholder="Ingrese el nombre de la lista" name="busqueda">
                    </div>
                </div>
                <?php endif; ?>
            </div>
        </div>
    </div>


    <?php $contador = 0; ?>
    <?php foreach ($listas as $lista): $contador++;
   // if($contador % 2 == 0) {
//echo '<div class="row">';
    //}
       ?>
    <div class="lista-contenedor col-xs-6 col-sm-6 col-md-3 col-lg-3" title="<?= $lista->TEX_NOMLIS ?>">
        <a href="<?= base_url('votacion/votacion_listas/get_candidatos_by_lista/' . $lista->ID_LISTA . '/' . $instancia->ID_INSTAN) ?>"
            data-toggle="<?= ($lista->TEX_PERLIS)?'tooltip"':'' ?> 
            title="<?= $lista->TEX_PERLIS ?>">
            <?= img(''.$lista->TEX_FOTO, '', ['class' => "img-responsive",'width'=>'45%', 'style'=>'margin:0 auto;float:none;text-align:center' ]) ?>
            <div class="nombre-lista"><?= $lista->TEX_NOMLIS ?></div>
        </a>
    </div>

    <?php
  //       if($contador % 2 == 0) {
//echo '</div>';
  //  }

   endforeach; ?>
</section>
<!-- Modal Aviso tiempo agotado -->
<div class="modal fade" id="modal-tiempo-agotado" tabindex="-1" role="dialog" style="top:10%"
    aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <h3 class="text-center text-danger">El tiempo de votación se ha terminado.</h3>
            </div>
            <div class="modal-footer">
                <a href="<?= base_url('acceso/logout') ?> " class="btn btn-default btn-leave-app">Salir</a>
            </div>
        </div>
    </div>
</div>
<?php
$data_view['loajs'] = $load_js;
$this->load->view('template/footer_front.php', $data_view);
?>

<!-- Modal previsualización de votos -->
<div class="modal fade" id="modal-alertas" tabindex="-1" role="dialog" style="top:10%" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <h3 class="text-center text-danger">Mensaje del sistema</h3>
                <p id="mensaje-sistema" class="text-danger text-center" style="font-weight:600;"></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>

<!-- Modal previsualización de votos -->
<div class="modal fade" id="modal-prev-votos" tabindex="-1" role="dialog" style="top:10%"
    aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <h3 class="text-center text-success" style="margin:0;padding:0">Señor@
                    <?= $this->session->userdata('TEX_NOMPAR') ?> <?= $this->session->userdata('TEX_APEPAR') ?></h3>
                <h3 class="text-center text-success" style="margin:0;padding:0">Estás seguro de realizar tu VOTO por la
                    <div id="nombre-lista"></div> que tiene los siguientes candidatos:</h3>
                <br>
                <p id="lista-candidatos" class="text-success" style="font-weight:600; margin-bottom:40px;"></p>
                <div class="row">
                    <div class="col-12 col-xs-12 col-md-6 col-lg-6 text-right">
                        <button type="button" class="btn btn-success btn-lg boton-votar-ajax btn-si-votar">Si</button>
                    </div>
                    <div class="col-12 col-xs-12 col-md-6 col-lg-6">
                        <button type="button" class="btn btn-danger btn-lg btn-no-votar"
                            data-dismiss="modal">No</button>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
            </div>
        </div>
    </div>
</div>
<script>
$(window).load(function() {
    $(".loader").fadeOut("slow");
});
</script>