diff --git a/css/styles.css b/css/styles.css
index 0f602221ebeb91fbb1433fe51152f23707c09e4f..cb8b73f2a0a1d54bbb693d60fa8fe70579b6dc69 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -17,7 +17,21 @@ iframe {
-.bold-btn{
+.addButton {
+ height: 40px;
+ width: 40px;
+ background-color: #53bdbd;
+ color: #005555;
+ position: relative;
+ left: 828px;
+ bottom: 45px;
+ font-size: 30px;
+ font-weight: bold;
+ border: none;
+ border-radius: 5px;
+}
+
+.bold-btn {
position: absolute;
color: white;
font-size: 18px;
@@ -27,7 +41,7 @@ iframe {
left: 50px;
}
-.btn{
+.btn {
left: 0px;
top: 0px;
width: 147px;
@@ -41,11 +55,11 @@ iframe {
margin-right: 14px;
}
-.btn:hover{
+.btn:hover {
background-color: rgba(0, 140, 140, 0.8);
}
-.btn-text{
+.btn-text {
color: #ffffff;
font-size: 18px;
font-family: 'Arial', sans-serif;
@@ -288,18 +302,18 @@ iframe {
}
.listeRepas{
- height: 500px;
+ height: 495px;
overflow-y: scroll;
}
.mealOutline {
border-radius: 25px;
background-color: #F2F2F2;
- padding-left: 67px;
- padding-top: 17px;
- padding-bottom: 17px;
- width: 895px;
- height: 66px;
+ padding-top: 10px;
+ padding-bottom: 10px;
+ padding-left: 50px;
+ width: 930px;
+ height: 55px;
margin-left: 119px;
margin-top:1em;
}
@@ -361,6 +375,18 @@ iframe {
height: 307px;
}
+.panierOutline {
+ border-radius: 25px;
+ background-color: #F2F2F2;
+ padding-left: 67px;
+ padding-top: 17px;
+ padding-bottom: 17px;
+ width: 895px;
+ height: 66px;
+ margin-left: 119px;
+ margin-top:1em;
+}
+
.search-button{
border-radius: 5px;
border-width: 0px;
diff --git a/html/chercherUnRepas.html b/html/chercherUnRepas.html
index 97c2edae0a554c600ee65cf49939706e9f1155f9..8c2cc6ca1459714109e748d114af80e02b846bd1 100644
--- a/html/chercherUnRepas.html
+++ b/html/chercherUnRepas.html
@@ -44,6 +44,7 @@
'<span class="bold">' + obj.array[index].repas[i].nom + '</span><br>' +
obj.array[index].repas[i].type + '<br>' +
'Quantité : ' + obj.array[index].repas[i].qt + ' disponibles<br>' +
+ '<button class = "addButton" onclick="addToPanier(event,'+i+', '+index+')"> + </button>' +
'</div>';
}
builtUpHTML += '</div>';
@@ -52,5 +53,15 @@
}
}
+ function addToPanier(event, repas, frigoIndex) {
+ if(sessionStorage.getItem("panier") != null){
+ var prev = sessionStorage.getItem("panier");
+ sessionStorage.setItem("panier", prev+" "+frigoIndex+"-"+repas);
+ }
+ else {
+ sessionStorage.setItem("panier", frigoIndex+"-"+repas);
+ }
+ }
+
</script>
</html>
\ No newline at end of file
diff --git a/html/panier.html b/html/panier.html
index 157756bc48985f3fdada7f56a153f1d23bfb3c0e..bae0f061c4c3ac6d02cf10b2ae1e7aeba6585b4a 100644
--- a/html/panier.html
+++ b/html/panier.html
@@ -5,8 +5,33 @@
<meta charset="UTF-8">
<title>Mon Panier</title>
</head>
-<body>
+<body id="listePanier" onload="retrievePanier()">
<br>
<p class="titleSection">Mon panier</p>
</body>
+<script src="../scripts/readJson.js"></script>
+
+<script>
+ function retrievePanier(){
+ var panierElems = sessionStorage.getItem('panier');
+ var builtUpHTML="";
+ if(panierElems != null){
+ var obj = httpGetJson();
+ var items = panierElems.split(" ");
+ for (let i = 0; i < items.length; i++){
+ if(items[i].length!=0){
+ var repasCombFrigo = items[i].split("-");
+ builtUpHTML += '<div class="panierOutline">' +
+ '<span class="bold">' + obj.array[repasCombFrigo[0]].repas[repasCombFrigo[1]].nom + '</span><br>' +
+ 'Provenance: '+obj.array[repasCombFrigo[0]].nom + '<br>' +
+ '</div>';
+ }
+
+ }
+ document.getElementById('listePanier').innerHTML = builtUpHTML;
+ sessionStorage.removeItem('frigoIndex');
+ }
+ }
+</script>
+
</html>
\ No newline at end of file