<html>
    <head>
        <meta charset="UTF-8">
        <title>CSE Invent : Identification</title>

        <?php pwa::printManifeste(); ?>
        
        <meta name="mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="application-name" content="CSE Invent : CMS">
        <meta name="apple-mobile-web-app-title" content="CSE Invent : CMS">
        <meta name="msapplication-starturl" content="/">
        <meta name="msapplication-TileColor" content="#da532c">
        <meta name="theme-color" content="#ffffff">

        <link rel="icon" type="image/x-icon" href="<?php cache::printFileWithTime("favicon.ico") ?>">

        <script src="<?php cache::printFileWithTime("libs/js/jquery.min.js") ?>"></script>
        <script src="<?php cache::printFileWithTime("libs/bootstrap/js/bootstrap.min.js") ?>"></script>
        
        <link rel="stylesheet" href="<?php cache::printFileWithTime("libs/bootstrap/assets/dist/css/bootstrap.min.css") ?>">
        <link rel="stylesheet" href="<?php cache::printFileWithTime("css/login.css") ?>">
    </head>
    <body>

        <div class="wrapper fadeInDown">
            
            <div id="formContent">
                
                <div class="fadeIn first">
                    <img src="img/logo.png" id="icon" alt="CSE Invent" />
                </div>

                <form method="post" action="/submit.php" id="form-authent">
                    <input type="hidden" name="from" value="login">
                    <input type="text" class="fadeIn second" name="email" id="email" placeholder="email" required>
                    <input type="password" class="fadeIn third" name="password" placeholder="mot de passe" required>
                    <input type="text" class="third" style="display:none;" name="authenticator" id="authenticator" maxlength="6" placeholder="Code Google Authenticator">
                    <input type="button" class="fadeIn fourth" id="submit-authent" value="Se connecter">
                </form>
                
                <div id="formFooter"<?php if(!alert::ifError()) { echo ' style="display:none"'; } ?>>
                    <div class="alert alert-danger" role="alert"><?php if(alert::ifError()) { echo alert::printAlert(alert::getError()); } ?></div>
                </div>

                <script>
                        $("#submit-authent").on("click", function() {
                            var formData = {
                                email: $("#email").val(),
                                from: "authenticator",
                            };

                            $.ajax({
                                type: "POST",
                                url: "submit.php",
                                data: formData,
                                dataType: "json",
                                encode: true,
                            }).done(function (data) {
                                if(data == 1){ 
                                    $("#authenticator").show();
                                    $("#authenticator").prop("required", true);
                                    $('#submit-authent').attr('type', 'submit');
                                } else {   
                                    $("#form-authent").submit();
                                }
                            }).fail(function () {
                                console.log(data);
                            });
                        });
                </script>
            </div>
        </div>
        <?php pwa::printServiceWorker(); ?>
    </body>
</html>

<?php 
    alert::destroyAlert();
?>