Skip to content
Snippets Groups Projects
Commit f4e658db authored by vautrin33u's avatar vautrin33u
Browse files

ajout session + connexion + inscription (sql) et lien entre les 3 pages

parent 05a37c6d
No related branches found
No related tags found
1 merge request!1Master
Hide whitespace changes
Inline Side-by-side
GestionUtilisateur.php
+ 47
− 79
View file @ f4e658db
<?php // Gestion de l'inscription
session_start(); // début session
/**
* Génère un formulaire d'inscription
*/
function formInscription(){
$mysqli=mysqli_connect('127.0.0.1', 'root', '') or die("Erreur de connexion");
if (!$mysqli) {
die("Connection failed: " . mysqli_connect_error());
}
$describe = $mysqli->query('describe Boissons.utilisateurs;');
if ($describe->num_rows > 0) {
$form = '<h1> Inscription </h1>';
$form .= '<form method="post" id="inscription">';
while ($row = $describe->fetch_assoc()) {
if ($row["Field"] != "user_id") {
$form .= "<label for='" . $row["Field"] . "'>";
switch ($row["Field"]){
case "nom":
$form.= "Nom : ";
break;
case "prenom":
$form.= "Prénom : ";
break;
case "pseudo":
$form.= "Pseudo : ";
$form .= "</label> <input type='text' required='true' name='" . $row["Field"] . "' > </br>";
// Réalise l'inscription ou la connexion
function realiseInscription ($json){
$mysqli= new mysqli('127.0.0.1', 'root', '', 'Boissons') or die("Erreur : tables inaccessibles");
break;
case "password":
$form.= "Mot de passe : ";
$form .= "</label> <input type='text' required='true' name='" . $row["Field"] . "' > </br>";
// Récupération depuis l'objet json
$nom = mysqli_real_escape_string ($mysqli, $json['nom']);
$prenom = mysqli_real_escape_string ($mysqli, $json['prenom']);
$sexe = mysqli_real_escape_string ($mysqli, $json['sexe']);
$email = mysqli_real_escape_string ($mysqli, $json['email']);
$pseudo = mysqli_real_escape_string ($mysqli, $json['pseudo']);
$password = mysqli_real_escape_string ($mysqli, $json['password']);
break;
case "sexe":
$form.= "Sexe : </label>";
$form .= "<input type='radio' id='Homme' name='" . $row["Field"] . "' > <label for='Homme'>Homme </label>";
$form .= "<input type='radio' id='Femme' name='" . $row["Field"] . "' > <label for='Femme'>Femme </label>";
$form .= "</br>";
break;
case "email":
$form.= "E-mail : ";
break;
}
if ($row["Field"] != "sexe" && $row["Field"] != "pseudo" && $row["Field"] != "password"){
$form .= "</label> <input type='text' name='" . $row["Field"] . "' > </br>";
}
}
}
$res = $mysqli->query("INSERT INTO utilisateurs(nom, prenom, sexe, email, pseudo, password) VALUES ('{$nom}', '{$prenom}', '{$sexe}', '{$email}', '{$pseudo}', '{$password}')");
if ($res == true){ // si l'inscription fonctionne, préparation des éléments de sessions
$_SESSION['pseudo'] = $json['pseudo'];
}
$form .= "<input type='submit' id='ok' value='Inscription'>";
$form .= "</br> <div id='explications'> </diw> </br> </form>";
return $form;
$mysqli->close();
return json_encode($res);
}
/**
* Génère un formulaire de connexion
*/
function formConnexion(){
$mysqli=mysqli_connect('127.0.0.1', 'root', '') or die("Erreur de connexion");
if (!$mysqli) {
die("Connection failed: " . mysqli_connect_error());
function realiseConnexion ($json){
$mysqli= new mysqli('127.0.0.1', 'root', '', 'Boissons') or die("Erreur : tables inaccessibles");
// Récupération depuis l'objet json
$pseudo = mysqli_real_escape_string ($mysqli, $json['pseudo']);
$password = mysqli_real_escape_string ($mysqli, $json['password']);
$res = $mysqli->query("SELECT 1 FROM utilisateurs WHERE pseudo LIKE '{$pseudo}' AND password = '{$password}'");
if ($res->num_rows == 1){
$_SESSION['pseudo'] = $json['pseudo'];
$out = true;
}else{
$out = false;
}
$describe = $mysqli->query('describe Boissons.utilisateurs;');
if ($describe->num_rows > 0) {
$form = '<h1> Connexion </h1>';
$form .= '<form method="post" id="connexion">';
while ($row = $describe->fetch_assoc()) {
switch ($row["Field"]){
case "pseudo":
$form .= "<label for='" . $row["Field"] . "'>";
$form.= "Pseudo : ";
$form .= "</label> <input type='text' required='true' name='" . $row["Field"] . "' > </br>";
$mysqli->close();
return json_encode($out);
}
break;
case "password":
$form .= "<label for='" . $row["Field"] . "'>";
$form.= "Mot de passe : ";
$form .= "</label> <input type='text' required='true' name='" . $row["Field"] . "' > </br>";
// $resultat = $res->fetch_all(MYSQLI_ASSOC);
break;
}
}
$form .= "<input type='submit' id='ok' value='Connexion'>";
$form .= "</br> <div id='explications'> </diw> </br></form>";
// Décode des fichiers issus de json et les utilise pour réaliser des opération
$in = file_get_contents('php://input');
$decoded = json_decode($in, true);
if (isset($decoded['mode'])){
if ($decoded['mode'] == 'inscription'){
echo realiseInscription($decoded);
}
if ($decoded['mode'] == 'connexion'){
echo realiseConnexion($decoded);
}
return $form;
unset($decoded);
}
?>
Requete.html → Requete.php
+ 22
− 3
View file @ f4e658db
<?php
session_start();
echo 'id session :'.session_id();
echo 'pseudo : '.$_SESSION['pseudo'];
?>
<!DOCTYPE html>
<html>
<html lang="fr">
<head>
<title>Requete</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="suggestion.js"> </script>
<script type="text/javascript" src="recettes.js"> </script>
</head>
<body>
<div id='authentification'>
<button type="button" onclick="location.href='connexion.php'">Se connecter</button>
<button type="button" onclick="location.href='inscription.php'">S'inscrire</button>
<div id='divInscription'></div>
<div id='divConnexion'></div>
</div>
<form method="post" id="form">
<fieldset id="fieldset">
<!--
Entrez votre recherche :
<input list='listeNoms' type="text" id="requete" onkeyup="afficherSuggestionsRecettes()"/>
-->
Sélectionner :
Sélectionner :
<select name='categorie' id='categorie' onclick="optionsCategorie()" >
<label for='categorie'></label><select name='categorie' id='categorie' onclick="optionsCategorie()" >
<option value='Aliment'></option>
<option value='Aliment'>Aliment</option>
</select>
......
Service.php
+ 30
− 14
View file @ f4e658db
<?php
session_start();
/**
* Se charge d'effectuer les requêtes et retourne un json
*/
......@@ -32,7 +33,30 @@ function grabRecettes (string $req){
$requete = "SELECT DISTINCT r.id, r.titre, r.ingredients, r.preparation FROM recettes r, ingredientsderecettes ing WHERE ing.idBoisson = r.id AND ing.nomIngredient LIKE '{$req}'";
echo queryDBB($requete);
}
/**
* Envoie l'image sélectionné parmi celles existantes ou rien
*/
function loadImage (string $nom){
$nom = str_replace(" ", "_", $nom);
$nom = str_replace("'", "", $nom);
$accents = array('è'=>'e', 'é'=>'e', 'ê'=>'e', 'ë'=>'e', 'ì'=>'i', 'í'=>'i', 'î'=>'i', 'ï'=>'i', 'ñ'=>'n');
$nom = strtr( $nom, $accents );
foreach (array_filter(glob('Photos/*.jpg'), 'is_file') as $file){
if ('Photos/'.$nom.'.jpg' == $file){
echo $file;
}else{
echo '';
}
}
}
// A MODIFIER
function getPanier (string $req){
$requete = "SELECT DISTINCT FROM recettes r, ingredientsderecettes ing WHERE ing.idBoisson = r.id AND ing.nomIngredient LIKE '{$req}'";
echo queryDBB($requete);
}
$in = file_get_contents('php://input');
$decoded = json_decode($in, true);
......@@ -51,19 +75,11 @@ if (isset($decoded['recettes'])){
unset($decoded['recettes']);
}
if (isset($decoded['images'])){
$nom = $decoded['images'];
$nom = str_replace(" ", "_", $nom);
$nom = str_replace("'", "", $nom);
$accents = array('è'=>'e', 'é'=>'e', 'ê'=>'e', 'ë'=>'e', 'ì'=>'i', 'í'=>'i', 'î'=>'i', 'ï'=>'i', 'ñ'=>'n');
$nom = strtr( $nom, $accents );
foreach (array_filter(glob('Photos/*.jpg'), 'is_file') as $file){
if ('Photos/'.$nom.'.jpg' == $file){
echo $file;
}else{
echo '';
}
}
loadImage($decoded['images']);
unset($decoded['images']);
}
if (isset($decoded['panier'])){
}
?>
\ No newline at end of file
connexion.php 0 → 100644
+ 54
− 0
View file @ f4e658db
<?php // Gestion de l'inscription
session_start(); // début session
?>
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Inscription</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="formulaire.js"> </script>
</head>
<body>
<?php // Gestion de l'inscription
$mysqli=mysqli_connect('127.0.0.1', 'root', '') or die("Erreur de connexion");
if (!$mysqli) {
die("Connection failed: " . mysqli_connect_error());
}
$describe = $mysqli->query('describe Boissons.utilisateurs;');
if ($describe->num_rows > 0) {
$form = '<h1> Connexion </h1>';
$form .= '<form method="post" id="connexion">';
while ($row = $describe->fetch_assoc()) {
switch ($row["Field"]){
case "pseudo":
$form .= "<label for='" . $row["Field"] . "'>";
$form.= "Pseudo : ";
$form .= "</label> <input type='text' required='true' name='" . $row["Field"] . "' > </br>";
break;
case "password":
$form .= "<label for='" . $row["Field"] . "'>";
$form.= "Mot de passe : ";
$form .= "</label> <input type='password' required='true' name='" . $row["Field"] . "' > </br>";
break;
}
}
$form .= "<input type='submit' id='ok' value='Connexion'>";
$form .= "<input type='button' id='retour' value='Retour'>";
$form .= "</br> <div id='explications'> </diw> </br></form>";
}
echo $form;
?>
</body>
</html>
\ No newline at end of file
formulaire.js
+ 144
− 60
View file @ f4e658db
......@@ -5,27 +5,96 @@
window.addEventListener("load", function (){
// Désactive par défaut le submit
var button = document.getElementById('ok');
button.disabled = true;
var ok = document.getElementById('ok');
var retour = this.document.getElementById('retour');
retour.addEventListener('click', () =>{
window.location.assign ("/Requete.php");
});
ok.disabled = true;
var formulaire = document.getElementById("inscription");
if (formulaire == null) return;
// zone explicative
var explications = this.document.getElementById('explications');
var divMdp = document.createElement("div");
var divPseudo = document.createElement("div");
explications.appendChild(divMdp);
explications.appendChild(divPseudo);
// Récupère le champ password et le test
var password = formulaire.password;
var pseudo = formulaire.pseudo;
var email = formulaire.email;
var nom = formulaire.nom;
var prenom = formulaire.prenom;
const sexe = document.getElementsByName("sexe");
// Envoie le formulaire au serveur
function envoyerForm(){
var requete = new XMLHttpRequest();
var formdata = new FormData(formulaire);
// Vérifie si erreur lors de l'envoie du formulaire
requete.addEventListener("Error", function(event) {
alert("Erreur d'envoi de formulaire...");
let input;
// Effectue la requête
var genre;
sexe.forEach(function(option) {
if (option.checked) {
genre = option;
}
});
// Visualise dans la console l'objet envoyé au serveur
for (let [key, value] of formdata.entries()) {
console.log(`${key}: ${value}`);
if (genre){
input = {
mode : 'inscription',
pseudo : pseudo.value,
password : password.value,
email : email.value,
sexe : genre.value,
prenom : prenom.value,
nom : nom.value
};
}else{
input = {
mode: 'inscription',
pseudo: pseudo.value,
password: password.value,
email: email.value,
sexe: '',
prenom: prenom.value,
nom: nom.value
};
}
// envoie effectif
requete.open("POST", "GestionUtilisateur.php");
requete.send(formdata);
console.log(input);
const xhr = new XMLHttpRequest();
xhr.open("POST", "/GestionUtilisateur.php", true);
xhr.setRequestHeader("Content-Type", "application/json ; charset=UTF-8");
// Vérifie si erreur lors de l'envoie du formulaire
xhr.addEventListener("Error", function(event) {
alert("Erreur d'envoi de formulaire d'inscription...");
});
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState === 4 && xhr.status === 200){
console.log(xhr.response);
if (xhr.response != null){
let resultat = JSON.parse(xhr.response);
if (resultat == true){
ok.disabled = true;
explications.textContent = "Inscription réussie!";
window.location.assign ("/Requete.php");
}else{
explications.textContent = "Inscription a échouée! Ce pseudo est déjà utilisé. Veuillez réessayer.";
}
}
}
}
xhr.send(JSON.stringify(input));
}
// Test si l'e-mail est vide ou dans un format correct
......@@ -81,34 +150,20 @@ window.addEventListener("load", function (){
}
}
var formulaire = document.getElementById("inscription");
if (formulaire == null) return;
formulaire.addEventListener("submit", function (event){
event.preventDefault();
envoyerForm();
});
// Récupère le champ password et le test
var password = formulaire.password;
var pseudo = formulaire.pseudo;
var email = formulaire.email;
// zone explicative
var explications = this.document.getElementById('explications');
var divMdp = document.createElement("div");
var divPseudo = document.createElement("div");
explications.appendChild(divMdp);
explications.appendChild(divPseudo);
// active le bouton d'envoi du formulaire ou le bloque et donne des explications
formulaire.addEventListener('keyup', () =>{
if (validPassword() && validPseudo() && validEmail()){
explications.innerHTML = '';
button.disabled = false;
ok.disabled = false;
}else{
button.disabled = true;
ok.disabled = true;
}
});
......@@ -137,24 +192,66 @@ window.addEventListener("load", function (){
window.addEventListener("load", function (){
// Désactive par défaut le submit
var button = document.getElementById('ok');
button.disabled = true;
var ok = document.getElementById('ok');
var retour = document.getElementById('retour');
retour.addEventListener('click', () =>{
window.location.assign ("/Requete.php");
});
ok.disabled = true;
// Récupère le formulaire de connexion
var formulaire = document.getElementById("connexion");
if (formulaire == null) return; // Si le formulaire n'existe pas, abandon
// Envoie le formulaire
// Récupère le champ password et le test
var password = formulaire.password;
var pseudo = formulaire.pseudo;
// zone explicative
var explications = this.document.getElementById('explications');
var divMdp = document.createElement("div");
var divPseudo = document.createElement("div");
explications.appendChild(divMdp);
explications.appendChild(divPseudo);
// Envoie le formulaire au serveur
function envoyerForm(){
var requete = new XMLHttpRequest();
var formdata = new FormData(formulaire);
requete.addEventListener("Error", function(event) {
alert("Erreur d'envoi de formulaire...");
// Effectue la requête
const input = {
mode : 'connexion',
pseudo : pseudo.value,
password : password.value
};
console.log(input);
const xhr = new XMLHttpRequest();
xhr.open("POST", "/GestionUtilisateur.php", true);
xhr.setRequestHeader("Content-Type", "application/json ; charset=UTF-8");
// Vérifie si erreur lors de l'envoie du formulaire
xhr.addEventListener("Error", function(event) {
alert("Erreur d'envoi de formulaire de connexion...");
});
// Visualise dans la console l'objet envoyé au serveur
for (let [key, value] of formdata.entries()) {
console.log(`${key}: ${value}`);
}
requete.open("POST", "GestionUtilisateur.php");
requete.send(formdata);
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState === 4 && xhr.status === 200){
let resultat = JSON.parse(xhr.response);
if (resultat == true){
ok.disabled = true;
explications.textContent = "Connexion réussie!";
window.location.assign ("/Requete.php");
}else{
explications.textContent = "Connexion a échouée! Vérifier le pseudo et le mot de passe.";
}
}
}
xhr.send(JSON.stringify(input));
}
// Vérifie la longueur du pseudo et si il contient des caractères spéciaux
......@@ -196,34 +293,21 @@ window.addEventListener("load", function (){
}
}
// Récupère le formulaire de connexion
var formulaire = document.getElementById("connexion");
if (formulaire == null) return; // Si le formulaire n'existe pas, abandon
formulaire.addEventListener("submit", function (event){
event.preventDefault();
envoyerForm();
});
// Récupère le champ password et le test
var password = formulaire.password;
var pseudo = formulaire.pseudo;
// zone explicative
var explications = this.document.getElementById('explications');
var divMdp = document.createElement("div");
var divPseudo = document.createElement("div");
explications.appendChild(divMdp);
explications.appendChild(divPseudo);
// active le bouton d'envoi du formulaire ou le bloque et donne des explications
formulaire.addEventListener('keyup', () =>{
var explications = this.document.getElementById('explications');
if (validPassword() && validPseudo()){
explications.innerHTML = '';
button.disabled = false;
ok.disabled = false;
}else{
button.disabled = true;
ok.disabled = true;
}
});
......
inscription.php 0 → 100644
+ 72
− 0
View file @ f4e658db
<?php // Gestion de l'inscription
session_start(); // début session
?>
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Inscription</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="formulaire.js"> </script>
</head>
<body>
<?php // Gestion de l'inscription
$mysqli=mysqli_connect('127.0.0.1', 'root', '') or die("Erreur de connexion");
if (!$mysqli) {
die("Connection failed: " . mysqli_connect_error());
}
$describe = $mysqli->query('describe Boissons.utilisateurs;');
if ($describe->num_rows > 0) {
$form = '<h1> Inscription </h1>';
$form .= '<form method="post" id="inscription">';
while ($row = $describe->fetch_assoc()) {
if ($row["Field"] != "user_id") {
$form .= "<label for='" . $row["Field"] . "'>";
switch ($row["Field"]){
case "nom":
$form.= "Nom : ";
break;
case "prenom":
$form.= "Prénom : ";
break;
case "pseudo":
$form.= "Pseudo : ";
$form .= "</label> <input type='text' required='true' name='" . $row["Field"] . "' > </br>";
break;
case "password":
$form.= "Mot de passe : ";
$form .= "</label> <input type='password' required='true' name='" . $row["Field"] . "' > </br>";
break;
case "sexe":
$form.= "Sexe : </label>";
$form .= "<input type='radio' id='Homme' value='h' name='" . $row["Field"] . "' > <label for='Homme'>Homme </label>";
$form .= "<input type='radio' id='Femme' value='f' name='" . $row["Field"] . "' > <label for='Femme'>Femme </label>";
$form .= "</br>";
break;
case "email":
$form.= "E-mail : ";
$form .= "</label> <input type='email' name='" . $row["Field"] . "' > </br>";
break;
}
if ($row["Field"] != "sexe" && $row["Field"] != "pseudo" && $row["Field"] != "password" && $row["Field"] != "email"){
$form .= "</label> <input type='text' name='" . $row["Field"] . "' > </br>";
}
}
}
}
$form .= "<input type='submit' id='ok' value='Inscription'>";
$form .= "<input type='button' id='retour' value='Retour'>";
$form .= "</br> <div id='explications'> </diw> </br> </form>";
echo $form;
?>
</body>
</html>
\ No newline at end of file
install.php
+ 11
− 1
View file @ f4e658db
......@@ -2,7 +2,7 @@
function query($link,$requete)
function query($link,$requete)
{
$resultat=mysqli_query($link,$requete) or die("$requete : ".mysqli_error($link));
return($resultat);
......@@ -112,6 +112,16 @@ function loadDB(){
FOREIGN KEY (idBoisson) REFERENCES recettes(id) ON DELETE CASCADE,
FOREIGN KEY (nomIngredient) REFERENCES aliments(alim_nom) ON DELETE CASCADE
);
CREATE TABLE IF NOT EXISTS panier (
commande_id INT AUTO_INCREMENT PRIMARY KEY,
user_id INT NOT NULL,
recette_id INT NOT NULL,
FOREIGN KEY (user_id) REFERENCES utilisateurs(user_id) ON DELETE CASCADE,
FOREIGN KEY (recette_id) REFERENCES recettes(id) ON DELETE CASCADE
);
".$str;
......
recettes.js 0 → 100644
+ 215
− 0
View file @ f4e658db
// Ajoute un formulaire pour ajouter des recettes aux favoris
function ajoutFormulaire(parent, recette){
let formRec = document.createElement('form');
let field = document.createElement('fieldset');
var add = document.createElement('button');
var cancel = document.createElement('button');
// définition du formulaire
formRec.method = 'POST';
formRec.name = 'formRecette';
// Définition du bouton d'ajout au favoris
add.textContent = "Ajouter aux favoris";
add.name = 'ajout';
add.type = 'button'; // Empêche le rechargement de le page
add.addEventListener('click', () => {
cancel.disabled = false;
add.disabled = true;
let input = {
panier : 'ajouter',
recette_id : recette.id,
user_id : 1
};
console.log(input);
})
// Définition du bouton annuler
cancel.textContent = "Retier des favoris";
cancel.name = 'retire';
cancel.type = 'button'; // Empêche le rechargement de le page
cancel.disabled = true;
cancel.addEventListener('click', () => {
cancel.disabled = true;
add.disabled = false;
let input = {
panier : 'retirer',
recette_id : recette.id,
user_id : 1
};
console.log(input);
})
// Mise en page
parent.append(formRec);
formRec.appendChild(field);
field.append(add);
field.append(cancel);
parent.append();
}
// Affiche les recettes
function afficheRecettes(recette){
// Récupère l'élément qui va afficher les recettes
let div = document.getElementById("recettes");
// parcours de toutes les recettes contenu dans l'objet
for (var i = 0; i<recette.length; i++){
// Création des éléments titre / paragraphe / liste
let conteneur = document.createElement('span'); // Contient les éléments html d'une recette
let image = document.createElement('img'); // image
let titre = document.createElement('h2'); // titre de niveau 2
let paragraph = document.createElement('p'); // paragraphe contenant la liste et description
var liste = document.createElement('ul'); // liste
liste.innerHTML += "Ingrédients :";
// Récupération du contenu
titre.textContent = recette[i].titre;
paragraph.textContent = recette[i].preparation;
let ingredients = recette[i].ingredients.split("|");
for (var j = 0; j<ingredients.length; j++){
liste.innerHTML += "<li>"+ingredients[j]+"</li>";
}
const search = recette[i].titre;
// Génère l'objet de requête à envoyer au serveur (traiter par Service.php) : le nom de la recette
const input = {
images : search
};
// Envoie de la requête
var xhr = new XMLHttpRequest();
xhr.open('POST', "/Service.php", true);
xhr.onload = () => {
if (xhr.response != null){
image.src = xhr.responseText;
}
};
xhr.send(JSON.stringify(input));
// Ajout à la div de recettes
div.append(conteneur);
conteneur.append(titre);
conteneur.append(image);
conteneur.append(paragraph);
paragraph.append(liste);
ajoutFormulaire(paragraph, recette[i]);
}
}
/**
* Génère options à partir des résultats de la table hiérarchie
* @param {} res
*/
function genereOptions(res){
// Ajoute les options
var select = document.getElementById('categorie');
var recettes = document.getElementById('recettes');
recettes.innerHTML = "";
select.innerHTML = "";
//console.log(res);
for (const objet of res){
var opt = document.createElement("option");
opt.textContent = objet.sous_nom;
opt.value = objet.sous_nom;
select.appendChild(opt);
// Effectue la requête
const input = {
recettes: objet.sous_nom
};
const xhr = new XMLHttpRequest();
xhr.open("POST", "/Service.php", true);
xhr.setRequestHeader("Content-Type", "application/json ; charset=UTF-8");
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState === 4 && xhr.status === 200){
// Si le retour n'est pas vide, on affiche les titres
if (this.response != null){
const recipes = JSON.parse(xhr.response);
if (recipes.length > 0){ // On ignore au moins
afficheRecettes(recipes);
}
}
}
}
xhr.send(JSON.stringify(input));
}
}
/**
* Affiche les options de catégories
*/
function optionsCategorie(){
// Empeche le rechargement de la page quand on valide
document.getElementById("form").addEventListener("submit", function (e) {
e.preventDefault();
return false;
});
// Récupère la position à laquelle on veut afficher des informations
var zone = document.getElementById("categorie");
var infos = document.getElementById("infos");
// Création d'un objet contenant la requêtes
var val = zone.value;
infos.innerHTML += " > " + val;
var input = {
hierarchie: val
};
// Demande au serveur php (donc à la db) les noms de
const xhr = new XMLHttpRequest();
xhr.open("POST", "/Service.php", true);
xhr.setRequestHeader("Content-Type", "application/json ; charset=UTF-8");
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState === 4 && xhr.status === 200){
// Si le retour n'est pas vide, on affiche les titres
if (this.response != null){
var resultat = JSON.parse(xhr.response);
genereOptions(resultat);
}
}
}
xhr.send(JSON.stringify(input));
}
// Permet de recharger le contenu de la page sans recharger la page
function remettreAZero(){
document.getElementById("recettes").innerHTML = "";
document.getElementById("infos").innerHTML = "";
var select = document.getElementById("categorie");
console.log(select.value);
select.innerHTML = "";
var opt, opt2;
opt = document.createElement("option");
opt2 = document.createElement("option");
opt.textContent = '';
opt.value = 'Aliment';
opt2.textContent = 'Aliment';
opt2.value = 'Aliment';
select.appendChild(opt);
select.appendChild(opt2);
}
suggestion.js
+ 2
− 156
View file @ f4e658db
......@@ -11,8 +11,7 @@ function genereSuggestions(res){
for (const nom of res){
var opt = document.createElement("option");
temp = JSON.stringify(nom["titre"])
var str = temp.replaceAll('"', '');
opt.value = str;
opt.value = temp.replaceAll('"', '');
list.appendChild(opt);
console.log(opt);
}
......@@ -20,99 +19,6 @@ function genereSuggestions(res){
textbox.appendChild(list);
}
// Affiche les recettes
function afficheRecettes(recette){
// Récupère l'élément qui va afficher les recettes
let div = document.getElementById("recettes");
// parcours de toutes les recettes contenu dans l'objet
for (var i = 0; i<recette.length; i++){
// Création des éléments titre / paragraphe / liste
let image = document.createElement('img');
let titre = document.createElement('h2');
let paragraph = document.createElement('p');
var liste = document.createElement('ul');
liste.innerHTML += "Ingrédients :";
// Récupération du contenu
titre.textContent = recette[i].titre;
paragraph.textContent = recette[i].preparation;
let ingredients = recette[i].ingredients.split("|");
for (var j = 0; j<ingredients.length; j++){
liste.innerHTML += "<li>"+ingredients[j]+"</li>";
}
const search = recette[i].titre;
const input = {
images : search
};
var xhr = new XMLHttpRequest();
xhr.open('POST', "Service.php", true);
xhr.onload = () => {
if (xhr.response != null){
image.src = xhr.responseText;
}
};
xhr.send(JSON.stringify(input));
// Ajout à la div de recettes
div.append(titre);
div.append(image);
div.append(paragraph);
div.append(liste);
}
}
/**
* Génère options à partir des résultats de la table hiérarchie
* @param {} res
*/
function genereOptions(res){
// Ajoute les options
var select = document.getElementById('categorie');
var recettes = document.getElementById('recettes');
recettes.innerHTML = "";
select.innerHTML = "";
//console.log(res);
for (const objet of res){
var opt = document.createElement("option");
opt.textContent = objet.sous_nom;
opt.value = objet.sous_nom;
select.appendChild(opt);
// Effectue la requête
const input = {
recettes: objet.sous_nom
};
const xhr = new XMLHttpRequest();
xhr.open("POST", "Service.php", true);
xhr.setRequestHeader("Content-Type", "application/json ; charset=UTF-8");
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200){
// Si le retour n'est pas vide, on affiche les titres
if (this.response != null){
const recipes = JSON.parse(xhr.response);
if (recipes.length > 0){ // On ignore au moins
afficheRecettes(recipes);
}
}
}
}
xhr.send(JSON.stringify(input));
}
}
/**
* Affiche une liste de cocktails
......@@ -140,7 +46,7 @@ function genereOptions(res){
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200){
if (xhr.readyState === 4 && xhr.status === 200){
// Si le retour n'est pas vide, on affiche les titres
if (this.response != null){
var resultat = JSON.parse(xhr.response);
......@@ -150,63 +56,3 @@ function genereOptions(res){
}
xhr.send(JSON.stringify(input));
}
/**
* Affiche les options de catégories
*/
function optionsCategorie(){
// Empeche le rechargement de la page quand on valide
document.getElementById("form").addEventListener("submit", function (e) {
e.preventDefault();
return false;
});
// Récupère la position à laquelle on veut afficher des informations
var zone = document.getElementById("categorie");
var infos = document.getElementById("infos");
// Création d'un objet contenant la requêtes
var val = zone.value;
infos.innerHTML += " > " + val;
var input = {
hierarchie: val
};
// Demande au serveur php (donc à la db) les noms de
const xhr = new XMLHttpRequest();
xhr.open("POST", "Service.php", true);
xhr.setRequestHeader("Content-Type", "application/json ; charset=UTF-8");
// Vérification des résultats
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200){
// Si le retour n'est pas vide, on affiche les titres
if (this.response != null){
var resultat = JSON.parse(xhr.response);
genereOptions(resultat);
}
}
}
xhr.send(JSON.stringify(input));
}
// Permet de recharger le contenu de la page sans recharger la page
function remettreAZero(){
document.getElementById("recettes").innerHTML = "";
document.getElementById("infos").innerHTML = "";
var select = document.getElementById("categorie");
console.log(select.value);
select.innerHTML = "";
var opt, opt2;
opt = document.createElement("option");
opt2 = document.createElement("option");
opt.textContent = '';
opt.value = 'Aliment';
opt2.textContent = 'Aliment';
opt2.value = 'Aliment';
select.appendChild(opt);
select.appendChild(opt2);
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment