<?php
require_once('template_header.php');
?>

<section style="width:400px;
            margin:0 auto;
           ">
<h1 style="width: 38%;
                margin: 0 auto;
                padding-bottom: 10px;
                ">Inscription</h1>
<!-- 'create identite' html form -->
<form id="form_signup" method="POST" style="width:100%;
            padding: 30px;
            border: 1px solid #f1f1f1;
            background: #fff;
            box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);">
        <div>
            <label>Identifiant</label>
            <input type='text' id='login' name='login' class="form-control" required />
        </div>

        <div>
            <label>Mot de passe</label>
            <input type='text' id='password' name='password' class="form-control"  required />
        </div>

        <div>
            <label>Pseudo</label>
            <input type='text' id='pseudo' name='pseudo' class="form-control" required/>
        </div>

        <div>
            <label>Âge</label>
            <input type='text' id='age' name='age' class="form-control" required />
        </div>

        <div>
            <label>Poids(kg)</label>
            <input type='text' id='poids' name='poids' class="form-control" required/>
        </div>

        <div>
            <label>Taille(cm)</label>
            <input type='text' id='taille' name='taille' class="form-control" required/>
        </div>
       
        <div class="form-group">
            <label>Sexe</label>
            <select class="form-control" id="sexe" name="sexe">
            <option selected>Choisir...</option>
            <option>Femme</option>
            <option>Homme</option>
        </select>
        </div>

        <div class="form-group">
            <label>Niveau de sport</label>
            <select class="form-control" id="niveaudusport" name="niveaudusport">
            <option selected>Choisir...</option>
            <option>Bas</option>
            <option>Moyen</option>
            <option>Elevé</option>
        </select>
        </div>

        <!-- button to submit form -->
        </div>
            <div  class="form-action-buttons">
            <input type="submit" value="Créer">
        </div>
</form>



<script
    src="https://code.jquery.com/jquery-3.4.1.min.js"
    integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
    crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-serialize-object/2.5.0/jquery.serialize-object.min.js" ></script>

<script type="text/javascript">

$(document).ready( function($) {
    // will run if create identite form was submitted
    $(document).on('submit', '#form_signup', function(){
        // get form data
        var form_data=JSON.stringify($(this).serializeObject());
        // console.log(form_data);

        // submit form data to api
        $.ajax({
            url: "https://eden.imt-lille-douai.fr/~liang.wu/API_LOGIN/identite/create.php",
            type : "POST",
            contentType : 'application/json',
            data : form_data
        });
    });
});
</script>

</section>

</body>

<footer>
<div style="text-align:center">
   <a href="index.php">Se connecter</a>
</div>
</footer>
