<?php
session_start();
include("app/models/connect.php");
include("app/models/functions.php");
include("app/models/arrays.php");
$pagina = "home";
if (isset($_SESSION['id_user']) && $_SESSION['id_user'] != "") {
    $pagina = "lobby";
}
if ($_GET["pg"] != "") {
    $pagina = explode("/", $_GET["pg"]);
} else {
    $pagina = explode("/", $pagina);
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta property="og:url" content="http://nuestramejorversion.co/" />
    <meta property="og:type" content="article" />
    <meta property="og:title" content="Nuestra mejor version" />
    <meta property="og:description" content="Nuestra mejor version" />
    <meta property="og:image" content="https://nuestramejorversion.co/icon_astellas.png" />

    <link rel="icon" href="<?php echo $url; ?>/favicon.ico">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" crossorigin="anonymous">

    <script src="<?php echo $url; ?>/js/jQuery.js"></script>
<!--     <script src="https://code.jquery.com/jquery-3.4.1.js" integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
 -->    <!-- <script   src="https://code.jquery.com/jquery-3.6.0.js"   integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="   crossorigin="anonymous"></script> -->
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>

    <script src="<?php echo $url; ?>/slider/js/swiper.js"></script>
    <script src="/js/jquery.rwdImageMaps.min.js"></script>
    <link href="<?php echo $url; ?>/slider/css/swiper.css" rel="stylesheet" />
    <title>Nuestra mejor versión</title>

    <!-- Global site tag (gtag.js) - Google Analytics -->
    <!-- <script async src="https://www.googletagmanager.com/gtag/js?id=UA-187068589-1"></script>
    <script>
        window.dataLayer = window.dataLayer || [];

        function gtag() {
            dataLayer.push(arguments);
        }
        gtag('js', new Date());

        gtag('config', 'UA-187068589-1');
    </script> -->



    <style>
        @charset "utf-8";
        /* CSS Document */

        @font-face {
            font-family: Signika-Regular;
            src: url(/fonts/Signika-Regular.otf);
        }

        @font-face {
            font-family: Signika-Bold;
            src: url(/fonts/Signika-Bold.otf);
        }

        @font-face {
            font-family: Signika-Semibold;
            src: url(/fonts/Signika-Semibold.otf);
        }

        @font-face {
            font-family: CoreSanBold;
            src: url(/fonts/CoreSansA75ExtraBold.otf);
        }

        @font-face {
            font-family: S-Core-CoreSanMedium;
            src: url(/fonts/S-Core-CoreSansA55Medium.otf);
        }

        @font-face {
            font-family: S-Core-CoreSansBold;
            src: url(/fonts/S-Core-CoreSansA65Bold.otf);
        }

        body {
            background-color: #dbe6ec;
            background-size: cover;
            background-attachment: fixed;
            background-position: center;
            background-repeat: no-repeat;
            font-family: S-Core-CoreSanMedium;
        }

        .btn_item_menu {
            margin-top: 0px;
            font-size: 14px;
            color: #ffffff;
            padding: 5px 8px;
        }

        .btn_item_menu:hover {
            color: #ffea00;
        }

        .btn-primary {
            background-color: #a7a9ac;
            border: 0px;
        }


        .btn-success {
            color: #fff;
            background-color: #006db7;
            border-color: #006db7;
        }

        a {
            text-decoration: none;
        }

        a:hover {
            text-decoration: none;
        }

        a:active {
            text-decoration: none;
        }

        .btn-dark {
            background-color: #062a3c;
        }

        .footer {
            background: rgb(166, 43, 78);
            color: #ffffff;
            font-size: 13px;
            position: fixed;
            bottom: 0px;
            left: 0px;
            width: 100%;
            z-index: 10;
            border-top: 3px solid #ffffff;
        }

        .btn-astella-red {
            color: rgb(166, 43, 78);
            background-color: #006db7;
            border-color: #006db7;
        }

        .items_contador {
            font-size: 40px;
            font-weight: bold;
            font-family: S-Core-CoreSansBold;
        }

        <?php if ($pagina[0] == 'dia') { ?>
        .e_movil {
            display: none;
        }

        .e_web {
            display: block;
        }

        .encabezado_movil {
            display: none;
        }

        .encabezado_web {
            display: block;
        }

        <?php } else { ?>
        .e_movil {
            display: none;
        }

        .e_web {
            display: contents;
        }

        .encabezado_movil {
            display: none;
        }

        .encabezado_web {
            display: block;
        }

        <?php }  ?>
        .botones_trivias {
            width: 100%;
            border-radius: 5px;
            padding: 10px;
            margin-bottom: 20px;
            border: 0;
            background-color: #059190;
            color: #fff;
        }

        <?php
        if ($pagina[0] == 'trivia' || $pagina[0] == 'concursos' || $pagina[0] == 'home' || $pagina[0] == 'login' || $pagina[0] == 'muestra' || $pagina[0] == 'lobby' || $pagina[0] == 'auditorio' || $pagina[0] == 'salones' || $pagina[0] == 'stand') {
        ?>
        .menu_base {
            /* background: rgb(166, 43, 78); */
            /* background: linear-gradient(90deg, rgba(217, 30, 73, 1) 0%, rgba(166, 43, 78,1) 24%, rgba(147,149,151,1) 100%);  */
            /* background-color: rgb(217, 30, 73);  */
            padding-right: 0;
            /* border-bottom: 3px solid #ffea00; */
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 10;
        }

        <?php

        } else {
        ?>
        .menu_base {
            background: rgb(166, 43, 78);
            /* background: linear-gradient(90deg, rgba(217, 30, 73, 1) 0%, rgba(166, 43, 78,1) 24%, rgba(147,149,151,1) 100%);  */
            /* background-color: rgb(217, 30, 73);  */
            padding-right: 0;
            /* border-bottom: 3px solid #ffea00; */
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 10;
        }

        <?php
        }
        ?>
        .btn_item_menu_active {
            color: #ffea00;
        }

        <?php
        if ($pagina[0] == 'dia') {
        ?>
        @media (max-width: 780px) {
            .e_movil {
                display: block;
            }

            .e_web {
                display: none;
            }

            .encabezado_movil {
                display: block;
            }

            .encabezado_web {
                display: none;
            }

        }

        <?php
        } else {
        ?>
        @media (max-width: 780px) {
            .e_movil {
                display: contents;
            }

            .e_web {
                display: none;
            }

            .encabezado_movil {
                display: block;
            }

            .encabezado_web {
                display: none;
            }

        }

        <?php
        }
        ?>
    </style>

</head>

<body>

    <?php include("views/menu.php"); ?>
    <div class="container-fluid">

    <!-- <div class="row"> -->

        <?php include("views/modal.php"); ?>
        <?php include("views/" . $pagina[0] . ".php"); ?>
        <?php /* include("views/footer.php"); */ ?>
    <!-- </div> -->
    </div>

    <div id="xscript"></div>


    <script>
        function Navegar(val) {
            var posicion;
            if (val == 1) {
                posicion = $("#planes").offset().top;
            }
            if (val == 2) {
                posicion = $("#caracteristicas").offset().top;
            }
            if (val == 3) {
                posicion = $("#contactanos").offset().top;
            }

            $("html, body").animate({
                scrollTop: posicion
            }, 2000);
        }

        function Ver_Invitacion() {
            $("#modal_videos").modal("show");
            $("#cont_video").html('<video width="100%" controls autoplay><source src="https://firebasestorage.googleapis.com/v0/b/fora2020-b6f9b.appspot.com/o/invitacion_fora2020.mp4?alt=media&token=c7433c1d-8e76-493d-8f91-fd85bb4ccbf9" type="video/mp4" id="play_video"></video>');
        }

        function Ver_Videos(link_video) {
            $("#modal_videos").modal("show");
            $("#cont_video").html('<video width="100%" controls autoplay><source src="' + link_video + '" type="video/mp4"></video>');
        }
    </script>

</body>
<!-- The core Firebase JS SDK is always required and must be listed first -->
<!-- <script src="https://www.gstatic.com/firebasejs/8.2.2/firebase.js"></script>
 
<script>
  // Your web app's Firebase configuration
    var firebaseConfig = {
        apiKey: "AIzaSyBc4fFwumMcp1J9J2pejhpPQOfmPlFUp6o",
        authDomain: "ournorth-450c4.firebaseapp.com",
        databaseURL: "https://ournorth-450c4-default-rtdb.firebaseio.com",
        projectId: "ournorth-450c4",
        storageBucket: "ournorth-450c4.appspot.com",
        messagingSenderId: "281119170967",
        appId: "1:281119170967:web:17211ef88cdbaa080a64d2"
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    var database = firebase.database();
    
    //2. ESCUCHAMOS SI UN USUARIO SE CONECTA 
    var tb_notificaciones = database.ref('notificaciones');
    tb_notificaciones.on('value', Notificaciones);
    
    
    var recibir = false;
    function Notificaciones(data){
        if(recibir == true){
            console.log(data.val().tipo);
            
            //GÉNERICA
            if( data.val().tipo == 1){
                $("#notificacion_sms").html( data.val().mensaje );
                $(".notificaciones").fadeIn(); 
                setTimeout(function(){ OcultarNotificacion() }, 10000);
            }
            //EVENTO
            if( data.val().tipo == 2){
                $("#notificacion_sms").html( data.val().mensaje );
                $(".notificaciones").fadeIn(); 
                setTimeout(function(){ OcultarNotificacion() }, 10000);
            }
            
            //CANAL ACTIVO
            if( data.val().tipo == 3){
               if(vista_streaming){
                   Cargar_Canal();
               }
            }
            
            //TRIVIA ACTIVA
            if( data.val().tipo == 4){
               if(vista_streaming){
                   Cargar_Pregunta();
               }
            }
            
            
            //BOTON DESAFIO ACTIVO
            if( data.val().tipo == 5){
               $("#bt_desafio").show();
            }
            
            
            
            
            //TRIVIA ACTIVA
            if( data.val().tipo == 15){
               if(vista_streaming){
                   Cargar_Recargar_Live();
               }
            }

            
        }
        recibir = true;
    }
    
    
    var tb_chat = database.ref('chat');
    tb_chat.on('value', Chateos);
    
    
    var recibirchat = false;
    function Chateos(data){
        if(recibirchat == true){
            mensaje_fr = '<div class="chat_box"><div class="txt_envia">'+data.val().nombre+' - '+data.val().fecha+'</div>'+data.val().comentario+'</div>';
            $("#cont_chat").append( mensaje_fr ); 
            $("#scroll_cont").animate({ scrollTop: $("#cont_chat").height() }, 500);
            
        }
        recibirchat = true;
    }
    
    
</script> -->

<?php if ($pagina[0] == "live") { ?>
    <script type="text/javascript">
        var tb_sesion = database.ref('participants/' + <?php echo $_SESSION['id_user']; ?>);

        tb_sesion.update({
            user: <?php echo $_SESSION['id_user']; ?>,
            vista: 'live',
            nombre: '<?php echo $_SESSION['name_user']; ?>',
        });
        tb_sesion.onDisconnect().remove();
    </script>
<?php } ?>

</html>