Maintenance Gitlab - Jeudi 09 Décembre 2021 à partir de 10h - Mises à jour de sécurité

Commit 7b7d1960 authored by ALGLAVE Ivan's avatar ALGLAVE Ivan
Browse files

AvancedSearch fonctionnal

parent 1f0fbba7
......@@ -13,7 +13,7 @@
<?php
include 'scripts/Functions.php';
$ingredientsList = getAllIngredients();
?>
?>
<div id="content">
<div id="elementInput" class="autocomplete">
......@@ -49,12 +49,31 @@
<div id="searchDiv">
<button onclick="performSearch();">Rechercher</button>
</div>
<div id="chosenItemsOverview">
<div id="parametersDiv">
<h2>Autoriser des éléments manquants </h2>
<input id="AllowMissingCheckbox" type="checkbox" onclick="allowMissingClicked(this.checked);">
<h2>Autoriser des éléments non desirés </h2>
<input id="AllowUnwaentedCheckbox" type="checkbox" onclick="allowUnwantedClicked(this.checked);">
<h2>Nombre maximum de conditions non-satisfiées : </h2>
<input type="number" id="maxUnsatifiedInput" min="0" max="20" oninput="maxUnsatisfiedChanged(this.value);" value="0">
</div>
<div class="chosenItemsOverview">
</div>
<div style="display: none;">
<div id="CI_Clone" class="chosenItem">
<img class="chosenItemImage" src="images/check.png" >
<h2 class="chosenItemName">Example</h2>
<button value="Clone" onclick="chosenItemCrossClicked(this)" class="chosenItemCross">X</button>
</div>
</div>
</div>
<script>
let ingredientsOverview = document.getElementsByClassName("chosenItemsOverview")[0];
let ingredientViewOriginal = document.getElementById('CI_Clone');
let inputField = document.getElementById('myInput');
let chosenIngredients = new Map();
let allIngredients = [<?php $first = true; foreach($ingredientsList as $ingredient) { if(!$first) echo ','; else $first = false; echo '"' . $ingredient . '"'; } ?>];
......@@ -62,6 +81,21 @@
var allowMissing = false;
var maxUnsatisfied = 0;
function allowMissingClicked(status)
{
allowMissing = (status == 'checked');
}
function allowUnwantedClicked(status)
{
allowUnwanted = (status == 'checked');
}
function maxUnsatisfiedChanged(value)
{
maxUnsatisfied = value;
}
function elementInputChange(val)
{
var toggleSwitch = document.getElementById('toggleWanted');
......@@ -80,9 +114,6 @@
document.getElementById('na').checked = "";
document.getElementById('off').checked = "checked";
}
else{
}
}
else
{
......@@ -96,19 +127,40 @@
function setElementWanted()
{
var element = document.getElementById('myInput').value;
chosenIngredients.set(element, 'wanted');
setElementWantedByName(element);
}
function setElementWantedByName(name)
{
chosenIngredients.set(name, 'wanted');
appendIngredient(name, 'wanted');
if(inputField.value == name) elementInputChange(name);
}
function setElementNone()
{
var element = document.getElementById('myInput').value;
chosenIngredients.delete(element);
setElementNoneByName(element);
}
function setElementNoneByName(name)
{
chosenIngredients.delete(name);
removeIngredient(name);
if(inputField.value == name) elementInputChange(name);
}
function setElementUnwanted()
{
var element = document.getElementById('myInput').value;
chosenIngredients.set(element, 'unwanted');
setElementUnwantedByName(element);
}
function setElementUnwantedByName(name)
{
chosenIngredients.set(name, 'unwanted');
appendIngredient(name, 'unwanted');
if(inputField.value == name) elementInputChange(name);
}
function performSearch()
......@@ -133,6 +185,36 @@
window.top.postMessage(data, [data.event, data.value]);
}
function appendIngredient(ing, status)
{
let new_id = 'CI_' + ing;
if(document.getElementById(new_id)) removeIngredient(ing);
let clone = ingredientViewOriginal.cloneNode(true);
clone.id = 'CI_' + ing;
let cross = clone.getElementsByClassName('chosenItemCross')[0];
let name = clone.getElementsByClassName('chosenItemName')[0];
let image = clone.getElementsByClassName('chosenItemImage')[0];
cross.value = ing;
name.innerHTML = ing;
if(status == 'unwanted') image.src = 'images/uncheck.png';
ingredientsOverview.appendChild(clone);
}
function removeIngredient(ing)
{
ingredientsOverview.removeChild(document.getElementById('CI_' + ing));
if(inputField.value == ing) document.getElementById('na').click();
}
function chosenItemCrossClicked(node)
{
removeIngredient(node.value);
}
</script>
</body>
......
......@@ -30,7 +30,11 @@
echo '<li><div class="container">';
echo '<div class="extra">';
echo '<img class="toggleFavourite" src="images/favourite.png" >';
echo '<p class="unsatisfied">Non satisfiés : ' . $re[1] . '</p>';
echo '</div>';
echo '<div class="listElement" onclick="showRecipe(' . intval($re[0]) . ');">';
$recipe = $Recettes[intval($re[0])];
......
......@@ -11,6 +11,7 @@ body {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: rgba(255, 255, 255, 0.75);
width: 80vw;
border-radius: 25px;
......@@ -53,4 +54,66 @@ body {
#searchDiv button:hover {
background-color: grey;
}
.chosenItemsOverview {
border-style: solid;
border-width: 2px;
border-color: black;
border-radius: 10px;
background-color: rgba(180, 180, 180, 0.50);
display: flex;
flex-wrap: wrap;
width: 60vw;
min-height: 10vh;
justify-content: center;
align-items: center;
margin: 50px;
}
.chosenItem {
height: 48px;
display: flex;
justify-content: center;
align-items: center;
border-style: solid;
border-radius: 10px;
border-width: 1px;
border-color: black;
margin: 10px;
}
.chosenItemImage {
width: 32px;
height: 32px;
margin: 10px;
}
.chosenItemName {
font-size: 20px;
font-weight: bold;
}
.chosenItemCross {
font-size: 20px;
font-weight: bold;
border-style: none;
background-color: transparent;
color: red;
}
#parametersDiv {
font-size: x-small;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
margin: 0px;
}
#parametersDiv input {
text-align: center;
width: 64px;
margin: 2px;
padding: 2px;
}
\ No newline at end of file
......@@ -54,9 +54,15 @@ ul li:last-child {
object-fit: contain;
}
.toggleFavourite {
.extra {
float: right;
vertical-align: middle;
display: flex;
flex-direction: column;
justify-content: right;
align-items: flex-end;
}
.toggleFavourite {
width: 32px;
height: auto;
}
\ No newline at end of file
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment