diff --git a/AdvancedSearch.php b/AdvancedSearch.php
index 3a2fde30557ea38b19a9899a8e7a112862be2f13..0da62a5c3268b11c24fed53d20115dfa8205982f 100644
--- a/AdvancedSearch.php
+++ b/AdvancedSearch.php
@@ -181,18 +181,22 @@
{
var data = {
event: 'recipelist',
- value: e
+ value: e,
+ showScore: 'false',
+ title: 'Résultats de la recherche :'
};
- window.top.postMessage(data, [data.event, data.value]);
+ window.top.postMessage(data, [data.event, data.value, data.showScore, data.title]);
}
function notifyParentScore(e) // Send a message to the parent window, asking to display the recipe #e
{
var data = {
- event: 'recipelistscore',
- value: e
+ event: 'recipelist',
+ value: e,
+ showScore: 'false',
+ title: 'Résultats de la recherche :'
};
- window.top.postMessage(data, [data.event, data.value]);
+ window.top.postMessage(data, [data.event, data.value, data.showScore, data.title]);
}
function appendIngredient(ing, status)
diff --git a/Home.php b/Home.php
index cd7534457113daa7570f906c4964da668bb8ec2e..b6253bccf9d4f44f18658555ca996df001b6c14d 100644
--- a/Home.php
+++ b/Home.php
@@ -34,7 +34,8 @@
</div>
<script>
-
+ sessionStorage.setItem('favourites', '');
+
let wrapper = document.getElementById('BlurredElementCenteredContainer');
let content = document.getElementById('content');
let embed = document.getElementById('BlurredElementEmbed');
@@ -61,7 +62,7 @@
}
else if(m_event == 'recipelist')
{
- switchView('RecipeList.php?ids=' + m_value + '&showscore=false');
+ switchView('RecipeList.php?ids=' + m_value + '&showscore=' + e.data.showScore + '&title=' + e.data.title);
}
else if(m_event == 'recipelistscore')
{
@@ -78,8 +79,11 @@
{
wrapper.classList.remove('active');
content.classList.remove('blur');
- wraper.disabled = false;
+ wrapper.disabled = false;
embed.setAttribute('src','');
+
+ //Notify child that blurred was closed
+ notifyChildBlurredClosed();
}
function showInBlurred(address)
@@ -148,6 +152,16 @@
closeBtn.addEventListener('click', hideBlurred);
+ function notifyChildBlurredClosed() // Send a message to the parent window, asking to display the recipe #e
+ {
+ var data = {
+ event: 'blurredclosed',
+ value: 'closed'
+ };
+ var tabFrame = document.getElementById('tabFrame');
+ tabFrame.contentWindow.postMessage(data, [data.event, data.value]);
+ }
+
</script>
</body>
\ No newline at end of file
diff --git a/MyFavouriteRecipes.php b/MyFavouriteRecipes.php
index d64cde063d87d7a4b897ca34057c2ab67a95a753..247eebc82e2f7d9f50cc0b80bea6cc6f4569fdfd 100644
--- a/MyFavouriteRecipes.php
+++ b/MyFavouriteRecipes.php
@@ -3,11 +3,19 @@
<head>
<title>Drinkpedia</title>
<meta charset="UTF-8">
- <link rel="stylesheet" type="text/css" href="css/MyAccount.css">
</head>
<body>
- <h1>My Favourite Recipes</h1>
+ <script>
+ var data = {
+ event: 'recipelist',
+ value: sessionStorage.getItem('favourites'),
+ showScore: 'false',
+ title: 'Favoris :'
+ };
+ window.top.postMessage(data, [data.event, data.value, data.showScore, data.title]);
+
+ </script>
</body>
</html>
\ No newline at end of file
diff --git a/RecipeList.php b/RecipeList.php
index 308de0cc3f05a4498bcbb74570be205a68bfe6f8..ecb63105fe7106f112486ed1ba6783c7e1775392 100644
--- a/RecipeList.php
+++ b/RecipeList.php
@@ -8,19 +8,20 @@
<body>
- <ul>
-
<?php
include "Donnees.inc.php";
include "scripts/Functions.php";
+
+ if(isset($_GET['title'])) echo '<h1 class="listeTitle">' . $_GET['title'] . '</h1>';
+ if ($_GET['ids'] == '') echo '<h1>Aucune recette !</h1>';
+ echo '<ul>';
$showScore = $_GET['showscore'] == 'true' ? true : false;
- if ($_GET['ids'] == '') echo '<h1>No recipe found</h1>';
- else{
+ if ($_GET['ids'] != ''){
$recipesIds = explode('|', $_GET['ids']);
@@ -33,7 +34,7 @@
echo '<li><div class="container">';
echo '<div class="extra">';
- echo '<img class="toggleFavourite" src="images/favourite.png" >';
+ echo '<img class="toggleFavourite" onclick="switchFavourite(this);" alt="' . $re[0] . '" src="" >';
if($showScore) echo '<p class="unsatisfied">Non satisfiés : ' . $re[1] . '</p>';
echo '</div>';
@@ -46,7 +47,7 @@
if(file_exists($image_url)) echo '<img class="cocktailImg" src="' . $image_url . '"></img>';
else echo '<img class="cocktailImg" src="images/missing.jfif"></img>';
- echo '<h1>' . $recipe['titre'] . '</h1>';
+ echo '<h1 class="cocktailTitle">' . $recipe['titre'] . '</h1>';
echo '</div>';
echo '</div></li>';
@@ -78,6 +79,78 @@
};
window.top.postMessage(data, [data.event, data.value]);
}
+
+ function switchFavourite(img)
+ {
+ let new_src = "images/favourite_off.png";
+ if(!img.classList.contains('favouriteOn'))
+ {
+ new_src = "images/favourite_on.png";
+ img.classList.add('favouriteOn');
+ img.classList.remove('favouriteOff');
+
+ let f = sessionStorage.getItem('favourites');
+ if(f != '') f += '|';
+ f += img.alt;
+ sessionStorage.setItem('favourites', f);
+ }
+ else
+ {
+ img.classList.remove('favouriteOn');
+ img.classList.add('favouriteOff');
+
+ let f = sessionStorage.getItem('favourites').split('|');
+ let nf = '';
+ for(let i = 0; i < f.length; i++)
+ {
+ if(img.alt != f[i])
+ {
+ if(i != 0) nf += '|';
+ nf += f[i];
+ }
+ }
+ sessionStorage.setItem('favourites', nf);
+ }
+
+ img.src= new_src;
+ }
+
+ function refreshFavourites()
+ {
+ let collection = document.getElementsByClassName('toggleFavourite');
+ let favourites = sessionStorage.getItem('favourites').split('|');
+ for(let i = 0; i < collection.length; i++)
+ {
+ let node = collection[i];
+ let r_id = node.value;
+ if(favourites.findIndex(val => val == node.alt) >= 0)
+ {
+ node.classList.add('favouriteOn');
+ node.classList.remove('favouriteOff');
+ node.src = "images/favourite_on.png";
+ }
+ else
+ {
+ node.classList.add('favouriteOff');
+ node.classList.remove('favouriteOn');
+ node.src = "images/favourite_off.png";
+ }
+ }
+ }
+
+
+ window.onmessage = function (e) {
+
+ let m_event = e.data.event;
+ let m_value = e.data.value;
+
+ if(m_event == 'blurredclosed')
+ {
+ refreshFavourites();
+ }
+ }
+
+ refreshFavourites();
</script>
</body>
diff --git a/RecipeView.php b/RecipeView.php
index a4767d8bfd7d071a4db504097967436eabf2f661..e64b3e9200ec13c524f2ba32004fc941154b96a1 100644
--- a/RecipeView.php
+++ b/RecipeView.php
@@ -5,7 +5,6 @@
<body>
- <img class="toggleFavourite" src="images/favourite.png" >
<?php
include "scripts/Functions.php";
include "Donnees.inc.php";
@@ -22,6 +21,7 @@
if(!file_exists($image_url)) $image_url = 'images/missing.jfif';
?>
+ <img class="toggleFavourite" onclick="switchFavourite(this);" alt="<?php echo $id_recipe; ?>" src="" >
<div>
<img src=<?php echo "\"" . $image_url . "\"" ?> width="256" height="256"; ?>
<span>
@@ -59,6 +59,59 @@
window.top.postMessage(data, [data.event, data.value]);
}
});
+
+ function switchFavourite(img)
+ {
+ let new_src = "images/favourite_off.png";
+ if(!img.classList.contains('favouriteOn'))
+ {
+ new_src = "images/favourite_on.png";
+ img.classList.add('favouriteOn');
+ img.classList.remove('favouriteOff');
+
+ let f = sessionStorage.getItem('favourites');
+ if(f != '') f += '|';
+ f += img.alt;
+ sessionStorage.setItem('favourites', f);
+ }
+ else
+ {
+ img.classList.remove('favouriteOn');
+ img.classList.add('favouriteOff');
+
+ let f = sessionStorage.getItem('favourites').split('|');
+ let nf = '';
+ for(let i = 0; i < f.length; i++)
+ {
+ if(img.alt != f[i])
+ {
+ if(i == 0) nf += '|';
+ nf += f[i];
+ }
+ }
+ sessionStorage.setItem('favourites', nf);
+ }
+
+ img.src= new_src;
+ }
+
+ let collection = document.getElementsByClassName('toggleFavourite');
+ let favourites = sessionStorage.getItem('favourites').split('|');
+ for(let i = 0; i < collection.length; i++)
+ {
+ let node = collection[i];
+ let r_id = node.value;
+ if(favourites.findIndex(val => val == node.alt) >= 0)
+ {
+ node.classList.add('favouriteOn');
+ node.src = "images/favourite_on.png";
+ }
+ else
+ {
+ node.classList.add('favouriteOff');
+ node.src = "images/favourite_off.png";
+ }
+ }
</script>
</body>
\ No newline at end of file
diff --git a/Recipes.php b/Recipes.php
index 85032f4270e065e1e6aa3e94d5743d64b710c207..6c3f0b074fb5a3568ad271e797fece4f8dce587f 100644
--- a/Recipes.php
+++ b/Recipes.php
@@ -14,9 +14,11 @@
getRecipes([], [], 0, true, true, function(e) {
var data = {
event: 'recipelist',
- value: e
+ value: e,
+ showScore: 'false',
+ title: 'Tous les cocktails :'
};
- window.top.postMessage(data, [data.event, data.value]);
+ window.top.postMessage(data, [data.event, data.value, data.showScore, data.title]);
});
</script>
diff --git a/css/Home.css b/css/Home.css
index 4553330d188f5dea0a2d68020aa09e326d8045d6..a35680bb6c936c2f47e826111dcbe550a18dc772 100644
--- a/css/Home.css
+++ b/css/Home.css
@@ -7,7 +7,7 @@
body {
background-image: url('../images/pattern.jpg');
background-repeat: repeat;
- background-size: 45%;
+ background-color: rgba(169, 169, 169, 0.5);
}
#tabFrame {
diff --git a/css/RecipeList.css b/css/RecipeList.css
index 1c4a75ed81ff0938b144d826d872701d5dc288c8..ae39ceff00e0efc2924d13efa6de05f96073d1ef 100644
--- a/css/RecipeList.css
+++ b/css/RecipeList.css
@@ -1,6 +1,5 @@
body {
padding: 20px;
- background-color: rgba(169, 169, 169, 0.5);
}
ul {
@@ -40,6 +39,7 @@ ul li:last-child {
flex-direction: row;
justify-content: left;
align-items: center;
+ cursor: pointer;
}
.cocktailImg {
@@ -52,6 +52,11 @@ ul li:last-child {
height: 64px;
margin-right: 15px;
object-fit: contain;
+ cursor: pointer;
+}
+
+.cocktailTitle {
+ cursor: pointer;
}
.extra {
@@ -65,4 +70,5 @@ ul li:last-child {
.toggleFavourite {
width: 32px;
height: auto;
+ cursor: pointer;
}
\ No newline at end of file
diff --git a/images/favourite.png b/images/favourite_off.png
similarity index 100%
rename from images/favourite.png
rename to images/favourite_off.png
diff --git a/images/favourite_on.png b/images/favourite_on.png
new file mode 100644
index 0000000000000000000000000000000000000000..0c4878df1c50d51e99b682ee0f72a74fa3495aee
Binary files /dev/null and b/images/favourite_on.png differ
diff --git a/images/pattern.jpg b/images/pattern.jpg
index 2615b362fcbd08e95e58b33fd9cee187f0c3b22e..eb72942a0ca16ed6f34bb9d21eb5a81911ce79c4 100644
Binary files a/images/pattern.jpg and b/images/pattern.jpg differ