From 49a2fbe83eec6d10b8ccd654be16b5abe12d43e7 Mon Sep 17 00:00:00 2001
From: Hadrien RENAUD <hadrien.renaud@polytechnique.edu>
Date: Mon, 9 Sep 2019 01:50:26 +0200
Subject: [PATCH] :lipstick: Remold the old inscription form

Signed-off-by: Hadrien RENAUD <hadrien.renaud@polytechnique.edu>
---
 server_files/views/inscription.php | 273 ++++++++++++++++-------------
 1 file changed, 153 insertions(+), 120 deletions(-)

diff --git a/server_files/views/inscription.php b/server_files/views/inscription.php
index 7abb639..25f981c 100644
--- a/server_files/views/inscription.php
+++ b/server_files/views/inscription.php
@@ -2,136 +2,169 @@
 require_once "header.php";
 
 if ($has_error)
-	echo "<h2>Erreur : " . $error_message . "</h2>";
+    echo "<div class=\"alert alert-danger\">Erreur : " . $error_message . "</div>";
 ?>
 
+    <div class="mt-4 mb-4">
+        <h1 class="display-4">Formulaire d'inscription</h1>
+    </div>
+
 <?php
 /** @var NewUser $user */
 if (isset($user) && !$has_error) {
-	?>
-    Votre inscription est validée ! Merci désormais de confirmer votre boîte mail pour valider votre adresse.
+    ?>
+    <div class="alert alert-success">
+        Votre inscription est validée ! Merci désormais de confirmer votre boîte mail pour valider votre adresse.
+    </div>
 <?php } else if (isset($_SESSION["user_id"])) { ?>
-    <h2>Vous êtes déjà connecté !</h2>
+    <div class="alert alert-success">Vous êtes déjà connecté !</div>
 <?php } else { ?>
 
     <form method="POST">
         <input type="hidden" name="submitted" value="true"/>
-        <table style="width: 100%;">
-            <tr>
-                <td style="width: 30%;"><label for="email">E-mail :</label></td>
-                <td style="width: 70%;"><input style="width: 100%;" type="email" id="email" name="email"
-                                               value="<?php if (isset($user)) echo $user->email ?>"
-                                               required/></td>
-            </tr>
-            <tr>
-                <td><label for="password">Mot de passe :</label></td>
-                <td><input style="width: 100%;" type="password" id="password" name="password" required/></td>
-            </tr>
-            <tr>
-                <td><label for="confirm_password">Confirmer le mot de passe :</label></td>
-                <td><input style="width: 100%;" type="password" id="confirm_password" name="confirm_password" required/>
-                </td>
-            </tr>
-            <tr>
-                <td><label for="surname">Nom :</label></td>
-                <td><input style="width: 100%;" type="text" id="surname" name="surname"
-                           value="<?php if (isset($user)) echo $user->surname ?>" required/></td>
-            </tr>
-            <tr>
-                <td><label for="first_name">Prénom :</label></td>
-                <td><input style="width: 100%;" type="text" id="first_name" name="first_name"
-                           value="<?php if (isset($user)) echo $user->first_name ?>" required/></td>
-            </tr>
-            <tr>
-                <td><label for="birth_date">Date de naissance :</label></td>
-                <td><input style="width: 100%;" type="date" id="birth_date" name="birth_date"
-                           value="<?php if (isset($user)) echo $user->birth_date ?>" required/></td>
-            </tr>
-            <tr>
-                <td><label for="gender">Sexe :</label></td>
-                <td><input type="radio" id="male" name="gender" value="M"
-                           required <?= isset($_POST["gender"]) && $_POST["gender"] == "M" ? "checked" : "" ?> /><label
-                            for="male">Homme</label>
-                    <input type="radio" id="female" name="gender" value="F"
-                           required <?= isset($_POST["gender"]) && $_POST["gender"] == "F" ? "checked" : "" ?> /><label
-                            for="female">Femme</label></td>
-            </tr>
-            <tr>
-                <td><label for="address">Adresse :</label></td>
-                <td><input style="width: 100%;" type="text" id="address" name="address"
-                           value="<?php if (isset($user)) echo $user->address ?>"/></td>
-            </tr>
-            <tr>
-                <td><label for="postal_code">Code postal :</label></td>
-                <td><input style="width: 100%;" type="number" id="postal_code" name="postal_code"
-                           value="<?php if (isset($user)) echo $user->postal_code ?>" min="1000"
-                           max="95999" required/></td>
-            </tr>
-            <tr>
-                <td><label for="city">Ville :</label></td>
-                <td><input style="width: 100%;" type="text" id="city" name="city"
-                           value="<?php if (isset($user)) echo $user->city ?>"/></td>
-            </tr>
-            <tr>
-                <td><label for="country">Pays :</label></td>
-                <td><input style="width: 100%;" type="text" id="country" name="country"
-                           value="<?= isset($user) ? $user->country : "France" ?>" required/></td>
-            </tr>
-            <tr>
-                <td><label for="phone_number">Numéro de téléphone :</label></td>
-                <td><input style="width: 100%;" type="text" id="phone_number" name="phone_number"
-                           value="<?php if (isset($user)) echo $user->phone_number ?>"/></td>
-            </tr>
-            <tr>
-                <td><label for="role">Rôle :</label></td>
-                <td><select style="width: 100%;" id="role" name="role" onchange="selectRole()">
-                        <option value="participant"><?= Role::getTranslatedName(Role::PARTICIPANT) ?></option>
-                        <option value="encadrant"><?= Role::getTranslatedName(Role::ENCADRANT) ?></option>
-                    </select></td>
-            </tr>
-            <tr>
-                <td><label id="school_label" for="school">Établissement dans lequel l'élève étudie :</label></td>
-                <td><input style="width: 100%;" type="text" id="school" name="school"
-                           value="<?php if (isset($user)) echo $user->school ?>"/></td>
-            </tr>
-            <tr>
-                <td><label id="class_label" for="class">Classe :</label></td>
-                <td><select style="width: 100%;" id="class" name="class">
-                        <option value="terminale"><?= SchoolClass::getTranslatedName(SchoolClass::TERMINALE) ?></option>
-                        <option value="premiere"><?= SchoolClass::getTranslatedName(SchoolClass::PREMIERE) ?></option>
-                        <option value="seconde"><?= SchoolClass::getTranslatedName(SchoolClass::SECONDE) ?></option>
-                    </select></td>
-            </tr>
-            <tr>
-                <td><label id="responsible_name_label" for="responsible_name">Nom du responsable légal :</label></td>
-                <td><input style="width: 100%;" type="text" id="responsible_name" name="responsible_name"
-                           value="<?php if (isset($user)) echo $user->responsible_name ?>"/>
-                </td>
-            </tr>
-            <tr>
-                <td><label id="responsible_phone_label" for="responsible_phone">Téléphone du responsable légal :</label>
-                </td>
-                <td><input style="width: 100%;" type="text" id="responsible_phone" name="responsible_phone"
-                           value="<?php if (isset($user)) echo $user->responsible_phone ?>"/>
-                </td>
-            </tr>
-            <tr>
-                <td><label id="responsible_email_label" for="responsible_email">Email du responsable légal :</label>
-                </td>
-                <td><input style="width: 100%;" type="text" id="responsible_email" name="responsible_email"
-                           value="<?php if (isset($user)) echo $user->responsible_email ?>"/>
-                </td>
-            </tr>
-            <tr>
-                <td><label id="description_label" for="description">Description :</label></td>
-                <td><textarea style="width: 100%;" id="description"
-                              name="description"><?php if (isset($user)) echo $user->description ?></textarea>
-                </td>
-            </tr>
-            <tr>
-                <td colspan="2"><input style="width: 100%;" type="submit" value="S'inscrire"/></td>
-            </tr>
-        </table>
+
+        <div class="form-group row">
+            <label for="role">Rôle :</label>
+            <select id="role" name="role" onchange="selectRole()" class="custom-select">
+                <option value="participant"><?= Role::getTranslatedName(Role::PARTICIPANT) ?></option>
+                <option value="encadrant"><?= Role::getTranslatedName(Role::ENCADRANT) ?></option>
+            </select>
+        </div>
+
+        <div class="form-row">
+            <div class="form-group col-md-6">
+                <label for="surname">Nom :</label>
+                <input class="form-control" type="text" id="surname" name="surname"
+                       value="<?php if (isset($user)) echo $user->surname ?>" required/>
+            </div>
+
+            <div class="form-group col-md-6">
+                <label for="first_name">Prénom :</label>
+                <input class="form-control" type="text" id="first_name" name="first_name"
+                       value="<?php if (isset($user)) echo $user->first_name ?>" required/>
+            </div>
+        </div>
+
+        <div class="form-row">
+            <div class="form-group col-md-6">
+                <label for="email">E-mail :</label>
+                <input class="form-control" type="email" id="email" name="email"
+                       value="<?php if (isset($user)) echo $user->email ?>"
+                       required/>
+            </div>
+            <div class="form-group col-md-6">
+                <label for="phone_number">Numéro de téléphone :</label>
+                <input class="form-control" type="text" id="phone_number" name="phone_number"
+                       value="<?php if (isset($user)) echo $user->phone_number ?>"/>
+            </div>
+        </div>
+
+        <div class="form-row">
+            <div class="form-group col-md-6">
+                <label for="password">Mot de passe :</label>
+                <input class="form-control" type="password" id="password" name="password" required/>
+            </div>
+            <div class="form-group col-md-6">
+                <label for="confirm_password">Confirmer le mot de passe :</label>
+                <input class="form-control" type="password" id="confirm_password" name="confirm_password" required/>
+            </div>
+        </div>
+
+        <div class="form-row">
+            <div class="form-group col-md-6">
+                <label for="gender" class="mr-2">Sexe :</label>
+                <br/>
+                <div class="custom-control custom-radio custom-control-inline">
+                    <input type="radio" class="custom-control-input" id="male" name="gender" value="M"
+                           required <?= isset($_POST["gender"]) && $_POST["gender"] == "M" ? "checked" : "" ?> />
+                    <label for="male" class="custom-control-label">Homme</label>
+                </div>
+                <div class="custom-control custom-radio custom-control-inline">
+                    <input type="radio" class="custom-control-input" id="female" name="gender" value="F"
+                           required <?= isset($_POST["gender"]) && $_POST["gender"] == "F" ? "checked" : "" ?> />
+                    <label for="female" class="custom-control-label">Femme</label>
+                </div>
+            </div>
+            <div class="form-group col-md-6">
+                <label for="birth_date">Date de naissance :</label>
+                <input class="form-control" type="date" id="birth_date" name="birth_date"
+                       value="<?php if (isset($user)) echo $user->birth_date ?>" required/>
+            </div>
+        </div>
+
+        <div class="form-row">
+            <div class="form-group col-md-5">
+                <label for="address">Adresse :</label>
+                <input class="form-control" type="text" id="address" name="address"
+                       value="<?php if (isset($user)) echo $user->address ?>"/>
+            </div>
+            <div class="form-group col-md-2">
+                <label for="postal_code">Code postal :</label>
+                <input class="form-control" type="number" id="postal_code" name="postal_code"
+                       value="<?php if (isset($user)) echo $user->postal_code ?>" min="1000"
+                       max="95999" required/>
+            </div>
+            <div class="form-group col-md-3">
+                <label for="city">Ville :</label>
+                <input class="form-control" type="text" id="city" name="city"
+                       value="<?php if (isset($user)) echo $user->city ?>"/>
+            </div>
+            <div class="form-group col-md-2">
+                <label for="country">Pays :</label>
+                <input class="form-control" type="text" id="country" name="country"
+                       value="<?= isset($user) ? $user->country : "France" ?>" required/>
+            </div>
+        </div>
+        <div class="form-row">
+            <div class="form-group col-md-6">
+                <label id="school_label" for="school">Établissement dans lequel l'élève étudie :</label>
+                <input class="form-control" type="text" id="school" name="school"
+                       value="<?php if (isset($user)) echo $user->school ?>"/>
+            </div>
+            <div class="form-group col-md-6">
+                <label id="class_label" for="class">Classe :</label>
+                <select id="class" name="class" class="custom-select">
+                    <option value="terminale"><?= SchoolClass::getTranslatedName(SchoolClass::TERMINALE) ?></option>
+                    <option value="premiere"><?= SchoolClass::getTranslatedName(SchoolClass::PREMIERE) ?></option>
+                    <option value="seconde"><?= SchoolClass::getTranslatedName(SchoolClass::SECONDE) ?></option>
+                </select>
+            </div>
+        </div>
+
+        <div class="form-row">
+            <div class="form-group col-md-4">
+                <label id="responsible_name_label" for="responsible_name">Nom du responsable légal :</label>
+                <input class="form-control" type="text" id="responsible_name" name="responsible_name"
+                       value="<?php if (isset($user)) echo $user->responsible_name ?>"/>
+
+            </div>
+            <div class="form-group col-md-4">
+                <label id="responsible_phone_label" for="responsible_phone">Téléphone du responsable légal :</label>
+
+                <input class="form-control" type="text" id="responsible_phone" name="responsible_phone"
+                       value="<?php if (isset($user)) echo $user->responsible_phone ?>"/>
+
+            </div>
+            <div class="form-group col-md-4">
+                <label id="responsible_email_label" for="responsible_email">Email du responsable légal :</label>
+
+                <input class="form-control" type="text" id="responsible_email" name="responsible_email"
+                       value="<?php if (isset($user)) echo $user->responsible_email ?>"/>
+
+            </div>
+
+        </div>
+
+        <div class="form-group row">
+            <label id="description_label" for="description">Description :</label>
+            <textarea class="form-control" id="description"
+                      name="description"><?php if (isset($user)) echo $user->description ?></textarea>
+
+        </div>
+
+        <div class="form-group row">
+            <input class="btn btn-primary btn-lg btn-block" type="submit" value="S'inscrire"/>
+        </div>
     </form>
 
     <script>