From 570786c7be1e5de5b164c543288e519764ea3a06 Mon Sep 17 00:00:00 2001
From: p1907961 <romeo.phang@etu.univ-lyon1.fr>
Date: Mon, 18 Jan 2021 13:36:04 +0100
Subject: [PATCH] Added reservation action

---
 assets/css/main.css        | 207 +++++++++++++++++++++++++++++++++++++
 controller/reservation.php |  40 +++++++
 view/add_accomodation.php  |   4 +-
 view/edit_accomodation.php |   4 +-
 view/manager.php           |   6 +-
 view/reservation.php       | 205 ++++++++++++++++++++++++++++++++++++
 view/vip.php               |   5 +-
 7 files changed, 465 insertions(+), 6 deletions(-)
 create mode 100644 controller/reservation.php
 create mode 100644 view/reservation.php

diff --git a/assets/css/main.css b/assets/css/main.css
index 7c310a5..a7184cf 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -56,3 +56,210 @@ body {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
 }
+
+/* Wizard */
+@import url(https://fonts.googleapis.com/css?family=Montserrat);
+/*form styles*/
+#msform {
+    text-align: center;
+    position: relative;
+    margin-top: 30px;
+}
+#msform fieldset {
+    background: white;
+    border: 0 none;
+    border-radius: 0px;
+    box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
+    padding: 20px 30px;
+    box-sizing: border-box;
+    width: 80%;
+    margin: 0 10%;
+    position: relative;
+}
+#msform fieldset:not(:first-of-type) {
+    display: none;
+}
+#msform input, #msform textarea {
+    padding: 15px;
+    border: 1px solid #ccc;
+    border-radius: 0px;
+    margin-bottom: 10px;
+    width: 100%;
+    box-sizing: border-box;
+    font-family: montserrat;
+    color: #2C3E50;
+    font-size: 13px;
+}
+#msform input:focus, #msform textarea:focus {
+    -moz-box-shadow: none !important;
+    -webkit-box-shadow: none !important;
+    box-shadow: none !important;
+    border: 1px solid #ee0979;
+    outline-width: 0;
+    transition: All 0.5s ease-in;
+    -webkit-transition: All 0.5s ease-in;
+    -moz-transition: All 0.5s ease-in;
+    -o-transition: All 0.5s ease-in;
+}
+#msform .action-button {
+    width: 100px;
+    background: #ee0979;
+    font-weight: bold;
+    color: white;
+    border: 0 none;
+    border-radius: 25px;
+    cursor: pointer;
+    padding: 10px 5px;
+    margin: 10px 5px;
+}
+#msform .action-button:hover, #msform .action-button:focus {
+    box-shadow: 0 0 0 2px white, 0 0 0 3px #ee0979;
+}
+#msform .action-button-previous {
+    width: 100px;
+    background: #C5C5F1;
+    font-weight: bold;
+    color: white;
+    border: 0 none;
+    border-radius: 25px;
+    cursor: pointer;
+    padding: 10px 5px;
+    margin: 10px 5px;
+}
+#msform .action-button-previous:hover, #msform .action-button-previous:focus {
+    box-shadow: 0 0 0 2px white, 0 0 0 3px #C5C5F1;
+}
+.fs-title {
+    font-size: 18px;
+    text-transform: uppercase;
+    color: #2C3E50;
+    margin-bottom: 10px;
+    letter-spacing: 2px;
+    font-weight: bold;
+}
+.fs-subtitle {
+    font-weight: normal;
+    font-size: 13px;
+    color: #666;
+    margin-bottom: 20px;
+}
+#progressbar {
+    margin-bottom: 30px;
+    overflow: hidden;
+    /*CSS counters to number the steps*/
+    counter-reset: step;
+}
+#progressbar li {
+    list-style-type: none;
+    color: white;
+    text-transform: uppercase;
+    font-size: 9px;
+    width: 33.33%;
+    float: left;
+    position: relative;
+    letter-spacing: 1px;
+}
+#progressbar li:before {
+    content: counter(step);
+    counter-increment: step;
+    width: 24px;
+    height: 24px;
+    line-height: 26px;
+    display: block;
+    font-size: 12px;
+    color: #333;
+    background: white;
+    border-radius: 25px;
+    margin: 0 auto 10px auto;
+}
+#progressbar li:after {
+    content: '';
+    width: 100%;
+    height: 2px;
+    background: white;
+    position: absolute;
+    left: -50%;
+    top: 9px;
+    z-index: -1;
+}
+#progressbar li:first-child:after {
+    content: none;
+}
+#progressbar li.active:before, #progressbar li.active:after {
+    background: #ee0979;
+    color: white;
+}
+/* Autocomplete */
+.ui-helper-hidden-accessible { display:none; }
+.ui-autocomplete {
+    width: 190px;
+    max-height: 180px;
+    padding: 0;
+    margin: 0;
+    overflow-y: auto;
+    overflow-x: hidden;
+    background: white;
+    color: #2C3E50;
+    border-width: 4px 4px 4px 0;
+    border-style: solid;
+    border-color: white;
+    box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.2);
+}
+.ui-autocomplete ul {
+    list-style: none;
+}
+.ui-autocomplete li {
+    height: 36px;
+    margin: 0;
+    font: bold 14px/36px Arial, Helvetica, sans-serif;
+    white-space: nowrap;
+}
+.ui-autocomplete li:hover {
+    -moz-transition: background 0.3s ease-in;
+    -o-transition: background 0.3s ease-in;
+    -webkit-transition: background 0.3s ease-in;
+    transition: background 0.3s ease-in;
+    background: #ee0979;
+    color: white;
+}
+.ui-autocomplete li a {
+    display: block;
+    padding: 0 12px;
+    cursor: pointer;
+}
+/* Cards */
+.card, .navbar, .pagination .page-item.active .page-link {
+    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
+}
+.cascading-admin-card {
+    margin-top: 1.25rem;
+}
+.cascading-admin-card .admin-up {
+    margin-left: 4%;
+    margin-right: 4%;
+    margin-top: -1.25rem;
+}
+.cascading-admin-card .admin-up .data {
+    float: right;
+    margin-top: 2rem;
+    text-align: right;
+}
+.cascading-admin-card .admin-up .fab, .cascading-admin-card .admin-up .far, .cascading-admin-card .admin-up .fas {
+    padding: 1.7rem;
+    font-size: 2rem;
+    color: #fff;
+    text-align: left;
+    border-radius: 3px;
+}
+.primary-color, ul.stepper li.active a .circle, ul.stepper li.completed a .circle, ul.stepper li.active a .circle, ul.stepper li.completed a .circle {
+    background-color: #4285f4 !important;
+}
+.warning-color {
+    background-color: #fb3 !important;
+}
+.light-blue.lighten-1 {
+    background-color: #29b6f6 !important;
+}
+.red.accent-2 {
+    background-color: #ff5252 !important;
+}
\ No newline at end of file
diff --git a/controller/reservation.php b/controller/reservation.php
new file mode 100644
index 0000000..b02d877
--- /dev/null
+++ b/controller/reservation.php
@@ -0,0 +1,40 @@
+<?php
+if ($_SESSION['USER']->isLoggedIn() && $_SESSION['USER']->getType() == 'Staff') {
+
+    if(isset($path[1])){
+        switch ($path[1]){
+            case 'date':
+                if(isset($path[2])){
+                    $dates = [];
+                    $reservation = AccomodationReservation::fetchByUserEmail($path[2]);
+                    forEach($reservation as $reserv){
+                        $start = date_create($reserv->getStartDate());
+                        $end = date_create($reserv->getEndDate());
+                        $end->add(new DateInterval('P1D'));
+                        $period = new DatePeriod(
+                            $start,
+                            new DateInterval('P1D'),
+                            $end
+                        );
+                        foreach ($period as $key => $value) {
+                            if(!in_array($value->format('Y-m-d'), $dates)){
+                                $dates[] = $value->format('Y-m-d');
+                            }
+                        }
+                    }
+                    echo json_encode($dates);
+                }
+                die();
+            default:
+                die();
+        }
+    }
+
+    $alert = '';
+    $bornes_date = array_keys(AccomodationLoad::getRange());
+    $bornes_date = [$bornes_date[0], $bornes_date[count($bornes_date) - 1]];
+    $vips = User::fetch(array(['UserTypeName', '=', 'VIP']));
+    require_once(VIEW_PATH . $path[0] . '.php');
+} else {
+    redirect('login');
+}
\ No newline at end of file
diff --git a/view/add_accomodation.php b/view/add_accomodation.php
index 3864e11..26c29a0 100644
--- a/view/add_accomodation.php
+++ b/view/add_accomodation.php
@@ -2,8 +2,8 @@
 require_once('template/head.php');
 ?>
     <div class="container-fluid section">
-        <h1>Bienvenue M. <?=htmlspecialchars(strtoupper($_SESSION['USER']->getLastName()))?>,</h1>
-        <h2>Il semblerait que vous n'ayez pas encore ajouté d'hebergement...</h2>
+        <h2>Bienvenue M. <?=htmlspecialchars(strtoupper($_SESSION['USER']->getLastName()))?>,</h2>
+        <h3>Il semblerait que vous n'ayez pas encore ajouté d'hebergement...</h3>
     </div>
     <div class="container-fluid section">
         <form action="" method="POST">
diff --git a/view/edit_accomodation.php b/view/edit_accomodation.php
index c900655..c81f309 100644
--- a/view/edit_accomodation.php
+++ b/view/edit_accomodation.php
@@ -2,8 +2,8 @@
 require_once('template/head.php');
 ?>
     <div class="container-fluid section">
-        <h1>Bienvenue M. <?=htmlspecialchars(strtoupper($_SESSION['USER']->getLastName()))?>,</h1>
-        <h2>Ici vous pouvez éditer votre hébérgement.</h2>
+        <h2>Bienvenue M. <?=htmlspecialchars(strtoupper($_SESSION['USER']->getLastName()))?>,</h2>
+        <h3>Ici vous pouvez éditer votre hébérgement.</h3>
     </div>
     <div class="container-fluid section">
         <form action="" method="POST">
diff --git a/view/manager.php b/view/manager.php
index d38cd66..1a9630e 100644
--- a/view/manager.php
+++ b/view/manager.php
@@ -2,7 +2,11 @@
 require_once('template/head.php');
 ?>
     <div class="container-fluid section">
-        <h2>Gestions des réservations</h2>
+        <div class="row">
+            <div class="col-md-10"><h2>Gestions des réservations</h2></div>
+            <div class="col-md-2"><a href="<?=genURL('reservation')?>" class="btn btn-success">Ajouter une Reservation</a></div>
+        </div>
+
         <table class="table table-hover">
             <thead>
             <tr>
diff --git a/view/reservation.php b/view/reservation.php
new file mode 100644
index 0000000..206357d
--- /dev/null
+++ b/view/reservation.php
@@ -0,0 +1,205 @@
+<?php
+require_once('template/head.php');
+?>
+    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
+    <div class="container-fluid section">
+        <h2>Ajout d'une reservation</h2>
+    </div>
+    <div class="container-fluid section">
+        <div class="row justify-content-md-center">
+            <div class="col-md-6 col-md-offset-3">
+                <form id="msform" method="POST" action="">
+                    <ul id="progressbar">
+                        <li class="active">VIP</li>
+                        <li>Reservation</li>
+                        <li>Logement</li>
+                    </ul>
+                    <fieldset>
+                        <h2 class="fs-title">VIP</h2>
+                        <h3 class="fs-subtitle">Choix du VIP</h3>
+                        <input type="search" id="users-filter" placeholder="Rechercher..." name="vip" data-list="users-list" autocomplete="off" required />
+                        <label for="users-filter" data-icon="&#128269;"></label>
+                        <datalist id="users-list">
+                            <select>
+                                <?php
+                                forEach($vips as $vip){
+                                    echo '<option value="' .$vip->getEmail(). '" />';
+                                }
+                                ?>
+                            </select>
+                        </datalist>
+                        <input type="button" name="next" class="next action-button" value="Suivant"/>
+                    </fieldset>
+                    <fieldset>
+                        <h2 class="fs-title">Reservation</h2>
+                        <h3 class="fs-subtitle">Détail de la reservation</h3>
+                        Nombres d'occupants<input type="text" id="people" name="people" placeholder="1"/>
+                        Nombres de chambres<input type="text" id="rooms" name="rooms" placeholder="1"/>
+                        Date d'entrée<input type="text" name="dateStart" id="dateStart"/>
+                        Date de sortie<input type="text" name="dateEnd" id="dateEnd"/>
+                        <input type="button" name="previous" class="previous action-button-previous" value="Retour"/>
+                        <input type="button" name="next" class="next action-button" value="Suivant"/>
+                    </fieldset>
+                    <fieldset>
+                        <h2 class="fs-title">Logement</h2>
+                        <h3 class="fs-subtitle">Choix du logement</h3>
+                        <input type="search" id="location-filter" placeholder="Rechercher..." name="location" data-list="location-list" autocomplete="off" required />
+                        <label for="location-filter" data-icon="&#128269;"></label>
+                        <datalist id="location-list">
+                            <select>
+                                <?php
+                                forEach($vips as $vip){
+                                    echo '<option value="' .$vip->getEmail(). '" />';
+                                }
+                                ?>
+                            </select>
+                        </datalist>
+                        <input type="button" name="previous" class="previous action-button-previous" value="Retour"/>
+                        <button type="submit" class="submit action-button">Ajouter</button>
+                    </fieldset>
+                </form>
+            </div>
+        </div>
+    </div>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
+    <script>
+        var datesReserve = [];
+        var locations = [];
+        /*
+        Event choix VIP
+        */
+        $(document).ready(function() {
+            $("#users-filter").change(function (e){
+                $.get( '<?=genURL('reservation/date/')?>' + $("#users-filter").val(), function( data ) {
+                    datesReserve = [];
+                    datesReserve = datesReserve.concat(JSON.parse(data));
+                    reloadDate();
+                });
+            });
+            $("#dateEnd").change(function (e){
+                $.get( '<?=genURL('reservation/hotel/')?>' + $("#people").val() + '/'  + $("#rooms").val() + '/' + $("#dateStart").val() + '/' + $("#dateEnd").val() , function( data ) {
+                    console.log("a");
+                });
+            });
+        });
+
+        /*
+        Date
+        */
+
+        function reloadDate(){
+            $( "#dateStart" ).val('');
+            $( "#dateEnd" ).val('');
+            $( "#dateStart" ).datepicker();
+            $( "#dateEnd" ).datepicker();
+            $("#dateStart").datepicker("destroy");
+            $("#dateEnd").datepicker("destroy");
+            $( "#dateStart" ).datepicker({
+                dateFormat: 'yy-mm-dd',
+                minDate: new Date('<?=$bornes_date[0]?>'),
+                maxDate: new Date('<?=$bornes_date[1]?>'),
+                onSelect: function(dateText) {
+                    $('#dateEnd').datepicker({
+                        dateFormat: 'yy-mm-dd',
+                        minDate: dateText,
+                        maxDate: new Date('<?=$bornes_date[1]?>'),
+                        beforeShowDay: function(date){
+                            var current = jQuery.datepicker.formatDate('yy-mm-dd', date);
+                            return [ datesReserve.indexOf(current) == -1 ]
+                        }
+                    });
+                },
+                beforeShowDay: function(date){
+                    var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
+                    return [ datesReserve.indexOf(string) == -1 ]
+                }
+            });
+        }
+        $( function() {
+            reloadDate();
+        });
+        /*
+        Select Search Box
+        */
+        $('input[data-list]').each(function () {
+            var availableTags = $('#' + $(this).attr("data-list")).find('option').map(function () {
+                return this.value;
+            }).get();
+            $(this).autocomplete({
+                source: availableTags,
+                messages: {
+                    noResults: 'no results',
+                    results: function (obj) {
+                        return ''
+                    }
+                }
+            }).on('focus', function () {
+                $(this).autocomplete('search', ' ');
+            }).on('search', function () {
+                if ($(this).val() === '') {
+                    $(this).autocomplete('search', ' ');
+                }
+            });
+        });
+
+        /*
+        Wizard Form
+         */
+        var current_fs, next_fs, previous_fs;
+        var left, opacity, scale;
+        var animating;
+        $(".next").click(function(){
+            if(animating) return false;
+            animating = true;
+            current_fs = $(this).parent();
+            next_fs = $(this).parent().next();
+            $("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");
+            next_fs.show();
+            current_fs.animate({opacity: 0}, {
+                step: function(now, mx) {
+                    scale = 1 - (1 - now) * 0.2;
+                    left = (now * 50)+"%";
+                    opacity = 1 - now;
+                    current_fs.css({
+                        'transform': 'scale('+scale+')',
+                        'position': 'absolute'
+                    });
+                    next_fs.css({'left': left, 'opacity': opacity});
+                },
+                duration: 800,
+                complete: function(){
+                    current_fs.hide();
+                    animating = false;
+                },
+                easing: 'easeInOutBack'
+            });
+        });
+        $(".previous").click(function(){
+            if(animating) return false;
+            animating = true;
+            current_fs = $(this).parent();
+            previous_fs = $(this).parent().prev();
+            $("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active");
+            previous_fs.show();
+            current_fs.animate({opacity: 0}, {
+                step: function(now, mx) {
+                    scale = 0.8 + (1 - now) * 0.2;
+                    left = ((1-now) * 50)+"%";
+                    opacity = 1 - now;
+                    current_fs.css({'left': left});
+                    previous_fs.css({'transform': 'scale('+scale+')', 'opacity': opacity});
+                },
+                duration: 800,
+                complete: function(){
+                    current_fs.hide();
+                    animating = false;
+                },
+                easing: 'easeInOutBack'
+            });
+        });
+    </script>
+<?php
+require_once('template/footer.php');
+?>
\ No newline at end of file
diff --git a/view/vip.php b/view/vip.php
index 94ebcbc..e5c20f8 100644
--- a/view/vip.php
+++ b/view/vip.php
@@ -2,7 +2,10 @@
 require_once('template/head.php');
 ?>
     <div class="container-fluid section">
-        <h2>Gestions des VIP</h2>
+        <div class="row">
+            <div class="col-md-10"><h2>Gestions des VIP</h2></div>
+            <div class="col-md-2"><a href="<?=genURL('reservation')?>" class="btn btn-success">Ajouter une Reservation</a></div>
+        </div>
         <table class="table table-hover">
             <thead>
             <tr>