<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
require_once("../../wp-load.php");
wp_head();
session_start();
session_unset();
session_destroy();
//print_r($_SESSION);

$url = "https://$_SERVER[HTTP_HOST]";
?>

<script src="https://js.stripe.com/v3/"></script>
<script src="<?php echo $url ?>/tpv2/public/checkout.min.js" defer></script>
<link rel="stylesheet" href="<?php echo $url ?>/tpv2/public/bootstrap-datepicker3.min.css">
<link rel="stylesheet" href="<?php echo $url ?>/tpv2/public/fontawesome.min.css">
<link rel="stylesheet" href="<?php echo $url ?>/tpv2/public/galeria/dist/css/lightbox.min.css">
<script src="<?php echo $url ?>/tpv2/public/bootstrap-datepicker.min.js"></script>
<div class="preloader"></div>
<?php include("header.php"); ?>
<div class="container custom top30 text-center">
    <p><b>Entorno 100% seguro</b> para completar su inscripción al curso de la <b>Escuela Nacional de Socorrismo ®</b>.<br>Para resolver cualquier duda o problema, por favor contacte directamente o escriba vía whatsapp al <a href="tel:611697872">611 697 872</a></p>
</div>
<div class="container cabecera-seccion top30" id="cabecera-resumen-carrito" rel="resumen-carrito">
    <div class="paso-num">1</div><h4>Resumen de compra</h4>
    <i class="fa fa-chevron-right"></i>
    <i class="fa fa-chevron-down" style="display:none"></i>
</div>
<div class="container top30 cuerpo" id="cuerpo-resumen-carrito" data-status="display" >
    <div class="row" id="custom-cart">
        <?php require_once($_SERVER["DOCUMENT_ROOT"] . "/tpv2/public/resume-cart.php"); ?>
    </div>
    <div class="center">
        <button class="btn btn-primary cambio-paso" rel="datos-alumno" type="button">Continuar a datos del alumno <i class="fa fa-chevron-down"></i></button>
    </div>
</div>

<div class="container cabecera-seccion top30" id="cabecera-datos-alumno" rel="datos-alumno">
    <div class="paso-num">2</div><h4>Datos del alumno</h4>
    <i class="fa fa-chevron-right" style="display:none"></i>
    <i class="fa fa-chevron-down"></i>
</div>
<div class="container cuerpo" id="cuerpo-datos-alumno" style="display: none">
    <div class="center top30">
        <button class="btn btn-primary cambio-paso" rel="resumen-carrito" type="button">Volver a Resumen Compra <i class="fa fa-chevron-up"></i></button>
    </div>
    <div class="row  top30">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <form class="g-3 needs-validation" id="datos-alumnos" novalidate>
                <div class="row">
                    <div class="col-md-12">
                        <p>Por favor, repasar bien. Serán los que aparezcan en el aula y en el diploma</p>
                        <hr>
                    </div>
                </div>
                <div class="row" id="cuerpo-datos-alumno">
                    <div class="col-md-4">
                        <label for="nombre" class="form-label">Nombre <span class="campo-obligatorio">*</span></label>
                        <input type="text" class="form-control" placeholder="Nombre" id="nombre" value="" required>
                        <div class="invalid-feedback">
                            Campo obligatorio
                        </div>
                    </div>
                    <div class="col-md-4">
                        <label for="apellido1" class="form-label" >Apellido 1 <span class="campo-obligatorio">*</span></label>
                        <input type="text" class="form-control" placeholder="Primer Apellido" id="apellido1" value="" required>
                        <div class="invalid-feedback">
                            Campo obligatorio
                        </div>
                    </div>
                    <div class="col-md-4">
                        <label for="apellido2" class="form-label">Apellido 2</label>
                        <input type="text" placeholder="Segundo apellido" class="form-control" id="apellido2" value="">
                    </div>
                    <div class="col-md-6">
                        <label for="tlf" class="form-label">Teléfono <span class="campo-obligatorio">*</span></label>
                        <input type="tel" class="form-control" placeholder="Teléfono de notificaciones" id="tlf" required>
                        <div class="invalid-feedback">
                            Campo obligatorio
                        </div>
                    </div>
                    <div class="col-md-6">
                        <label for="ciudad" class="form-label">Ciudad <span class="campo-obligatorio">*</span></label>
                        <input type="text" class="form-control" placeholder="Ciudad" id="ciudad" required>
                        <div class="invalid-feedback">
                            Campo obligatorio
                        </div>
                    </div>
                    <div class="col-md-12">
                        <label for="email" class="form-label" >Email <span class="campo-obligatorio">*</span></label>
                        <input type="email" class="form-control" placeholder="Email de notificaciones" id="email" required>
                        <div class="invalid-feedback">
                            Por favor, introduce un email válido
                        </div>
                    </div>
                    <div class="col-md-4">
                        <label for="dni" class="form-label">DNI / Pasaporte <span class="campo-obligatorio">*</span></label>
                        <input placeholder="DNI / Pasaporte" type="text" class="form-control" id="dni" required>
                        <div class="invalid-feedback">
                            Campo obligatorio
                        </div>
                    </div>
                    <div class="col-md-4">
                        <label for="validationCustom07" class="form-label">Fecha Nacimiento <span class="campo-obligatorio">*</span></label>

                        <div class="input-group date" id="fecha-nacimiento">
                            <input type="text" readonly placeholder="dd/mm/yyyy" class="form-control" id="fecha-nacimiento" name="Fecha_inicio" value="" required>
                            <span class="input-group-addon">
                                <span class="glyphicon glyphicon-calendar"></span>
                            </span>
                            <div class="invalid-feedback">
                                Campo obligatorio
                            </div>
                        </div>

                    </div>
                    <?php if ($resumenCart->isCursoSOS) { ?>
                        <div class="col-md-4">
                            <label for="talla" class="form-label">Talla Camiseta Regalo <span class="campo-obligatorio">*</span></label>
                            <select class="form-select" id="talla" required>
                                <option selected disabled value="">Selecciona Talla</option>
                                <option value="S">S</option>
                                <option value="M">M</option>
                                <option value="L">L</option>
                                <option value="XL">XL</option>
                                <option value="XXL">XXL</option>
                            </select>
                            <div class="invalid-feedback">
                                Campo obligatorio
                            </div>
                        </div>
                    <?php } ?>
                    <div class="col-md-12">
                        <label for="comentario" class="form-label">Comentario</label>
                        <textarea class="form-control" name="comentario-cliente" id="comentario-cliente" placeholder="Si es pack amigo o grupal, indicar las personas acompañantes. Sólo en el curso de socorrismo." rows="3"></textarea>
                    </div>
                </div>
            </form>
        </div>
        <div class="col-md-2"></div>
    </div>
    <div class="center top30">
        <button class="btn btn-primary" rel="datos-pago" id="guardar-alumno" type="button">Continuar a completar matricula <i class="fa fa-chevron-down"></i></button>
    </div>
</div>
</div>
<!-- Display a payment form -->
<div class="container cabecera-seccion top30" id="cabecera-datos-pago" rel="datos-pago">
    <div class="paso-num">3</div><h4>Completar Compra</h4>
    <i class="fa fa-chevron-right" style="display:none"></i>
    <i class="fa fa-chevron-down"></i>
</div>
<div class="container cuerpo" id="cuerpo-datos-pago" style="display: none">
    <div class="center top30">
        <button class="btn btn-primary cambio-paso" rel="resumen-carrito" type="button">Ir a resumen compra <i class="fa fa-chevron-up"></i></button>
        <button class="btn btn-primary cambio-paso" rel="datos-alumno" type="button">Modificar Datos Alumno <i class="fa fa-chevron-up"></i></button>
    </div>
    <div class="row">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <form id="payment-form" class="needs-validation" novalidate>
                <div class="col-md-12">
                    <h5>Total compra: <span id="total-cart-tpv"><?php echo number_format($resumenCart->total, 2, ",", "."); ?></span>€</h5>
                    <?php if ($resumenCart->esPagoRetenido) { ?>
                        <h4 class="red">A pagar ahora: 0€</h4>
                        <p>(Retendremos el importe total en tu cuenta bancaria, máximo 6 días)</p>
                    <?php } ?>
                    <hr>
                </div>
                <div id="payment-element">
                    <!--Stripe.js injects the Payment Element-->
                </div>

                <div class="col-12 politica">
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="" id="invalidCheck" required>
                        <label class="form-check-label" for="invalidCheck">
                            Acepto la <a href="/politica-de-privacidad/">política de privacidad</a> y las <a href="/aviso-legal-web/">terminos y condiciones de la compra.</a>
                        </label>
                        <div class="invalid-feedback">
                            Debes aceptar la política de privacidad y condiciones de compra para continuar.
                        </div>
                    </div>
                </div>
                <button id="submit" class="top30">
                    <div class="spinner hidden" id="spinner"></div>
                    <span id="button-text">Completar Matrícula</span>
                </button>
                <div id="payment-message" class="hidden"></div>
            </form>
        </div>
        <div class="col-md-2"></div>
    </div>
</div>

<?php include("footer.php"); ?>
<script src="<?php echo $url ?>/tpv2/public/galeria/dist/js/lightbox.min.js"></script>
<script type="text/javascript">
    // The items the customer wants to buy
    var URL = "<?php echo "https://" . $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI']; ?>";
    const items = [{
            id: "Curso ENSSAP",
            amount: "<?php echo number_format($resumenCart->total, 2, "", ""); ?>"
        }];

    const typeCapture = "<?php echo $resumenCart->esPagoRetenido ? "manual" : "automatic" ?>";

    lightbox.option({
        'resizeDuration': 200,
        'wrapAround': true
    })

</script>