<?php

if ($_SESSION['id_user'] == "") {
    echo '
			<script>
				window.location = "/login"
			</script>
        ';
}

$id = $pagina[1];
$base = '';
$bt_iz = '';
$bt_dr = '';
$circulo = '';

/* $query = mysqli_query($connect, "SELECT * FROM Pabellones WHERE id = '" . $id . "' ");
$data = mysqli_fetch_array($query);

$queryIz = mysqli_query($connect, "SELECT * FROM Stands WHERE id_pabellon = '" . $id . "' AND posicion = 1 ");
$dataIz = mysqli_fetch_array($queryIz);

$queryDr = mysqli_query($connect, "SELECT * FROM Stands WHERE id_pabellon = '" . $id . "' AND posicion = 2 ");
$dataDr = mysqli_fetch_array($queryDr); */

$base = $recursos . '/' . $data["imagen"];

$bg = "";

if ($id == 1) {
    $bg = "bg_stand_argentina.png";
} else if ($id == 2) {
    $bg = "bg_stand_colombia.png";
}else if ($id == 3) {
    $bg = "bg_stand_mexico.png";
}else if ($id == 4) {
    $bg = "bg_stand_experiencias.png";
}else if ($id == 5) {
    $bg = "bg_stand_juegos.png";
}

?>


<img id="myVideo" src="/img/img_wd/<?php echo $bg; ?>" alt="">

<style>
    #myVideo {
        position: fixed;
        right: 0;
        bottom: 0px;
        min-width: 100%;
        min-height: 100%;
        z-index: -1;
        width: 100%;
        padding-top: auto;
    }
    .blanco {
        color: white !important;
    }
</style>


<div class="e_web">
    <div style="display: block;" id="button_lobby">

    
    <?php
        if ($id == 1) {
            
        } else if ($id == 2) {
            
        }else if ($id == 3) {
            
        }else if ($id == 4) {
            
        }else if ($id == 5) {
            ?>
                
                    <a href="<?php echo $url; ?>/concursos/1"><button type="button" class="btn btn-light" style="position: absolute; top: 50%; left: 25%; background-color: #fdd300; border: 0;">CRUCIGRAMA</button></a>
                    <a href="<?php echo $url; ?>/trivia/1"><button type="button" class="btn btn-light" style="position: absolute; top: 50%; left: 48%; background-color: #fdd300; border: 0;">TRIVIA</button></a>
                    <a href="<?php echo $url; ?>/concursos/2"><button type="button" class="btn btn-light" style="position: absolute; top: 50%; left: 67%; background-color: #fdd300; border: 0;">BUSCA PALABRA</button></a>
                    <a href="<?php echo $url; ?>/concursos/3"><button type="button" class="btn btn-light" style="position: absolute; top: 80%; left: 48%; background-color: #fdd300; border: 0;">DRIVE TRIP</button></a>

     
            <?php
        }
    ?>

        <?php /* echo $bt_iz;  */?>
        <?php /* echo $bt_dr; */ ?>
        <a href="<?php echo $url; ?>/lobby">
            <img src="<?php echo $url; ?>/img/img_wd/bt_back.png" style="width: 130px; position: absolute; bottom: 20px; left: 10%;">
        </a>
        <!-- <img src="<?php echo $base; ?>" width="100%"> -->
    </div>
    
</div>

<div class="e_movil" align="center">
    <div style="display: none;" id="button_lobby">
        <!-- <img src="<?php /* echo $base; */ ?>" width="100%"> -->
        <?php /* echo $bt_iz_movil; */ ?>
        <?php /* echo $bt_dr_movil;  */?>

        <?php
        if ($id == 1) {
            
        } else if ($id == 2) {
            
        }else if ($id == 3) {
            
        }else if ($id == 4) {
            
        }else if ($id == 5) {
            ?>

                <a href="<?php echo $url; ?>/stand/5"><button type="button" class="btn btn-light">CRUCIGRAMA</button></a>
                <a href="<?php echo $url; ?>/stand/5"><button type="button" class="btn btn-light">TRIVIA</button></a>
                <a href="<?php echo $url; ?>/stand/5"><button type="button" class="btn btn-light">BUSCA PALABRA</button></a>

            <?php
        }
    ?>
    
        <a href="<?php echo $url; ?>/lobby">
            <img src="<?php echo $url; ?>/img/img_wd/bt_back.png" width="220">
        </a>
    </div>

</div>

<script type='text/javascript'>
    document.getElementById('myVideo').addEventListener('ended', myHandler, false);

    function myHandler(e) {
        document.getElementById('button_lobby').style.display = 'block'
    }
</script>


<style>
    .botones {
        position: absolute;
        border-radius: 30px;
        font-size: 11px;
        padding: 5px 20px;
        font-weight: bold;
    }

    .parpadea {

        animation-name: parpadeo;
        animation-duration: 1s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;

        -webkit-animation-name: parpadeo;
        -webkit-animation-duration: 3s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
    }

    @-moz-keyframes parpadeo {
        0% {
            transform: scale(1);
        }

        15% {
            transform: scale(1.1);
        }

        30% {
            transform: scale(1);
        }

        100% {
            transform: scale(1);
        }
    }

    @-webkit-keyframes parpadeo {
        0% {
            transform: scale(1);
        }

        15% {
            transform: scale(1.1);
        }

        30% {
            transform: scale(1);
        }

        100% {
            transform: scale(1);
        }
    }

    @keyframes parpadeo {
        0% {
            transform: scale(1);
        }

        15% {
            transform: scale(1.1);
        }

        30% {
            transform: scale(1);
        }

        100% {
            transform: scale(1);
        }
    }
</style>

<script>
    $(document).ready(function() {
        $("#maestro").height($("#img_muestra").height());
    });

    $(window).resize(function() {
        $("#maestro").height($("#img_muestra").height());
    });
</script>