From 2f84e3f66f27bfe9533dde17d784d704f261fdc4 Mon Sep 17 00:00:00 2001
From: Jadowyne Ulve <jadowyne.ulve@outlook.com>
Date: Tue, 22 Oct 2024 21:10:22 -0500
Subject: [PATCH] Started on work for pills in the Food Info

---
 __pycache__/api.cpython-312.pyc    | Bin 34087 -> 34075 bytes
 __pycache__/config.cpython-312.pyc | Bin 2687 -> 2675 bytes
 __pycache__/main.cpython-312.pyc   | Bin 24007 -> 23995 bytes
 templates/items/item.html          |  73 ++++++++++++++++++++++++++++-
 4 files changed, 71 insertions(+), 2 deletions(-)

diff --git a/__pycache__/api.cpython-312.pyc b/__pycache__/api.cpython-312.pyc
index ad9adda5547c69e3b78ca7fb549ee19e81cd627d..5d8f3cf4d8957522ff8bb0d103c7116e29dc52e0 100644
GIT binary patch
delta 72
zcmZ49#WcH%iTgA!FBbz4NZCtl<etQ$W8-WU6Iz^FR2-9)n37)}<DZx6Qj}Si8sn0m
ZT$-DjS5h34TbZ1nk_x0YUu6ku001Ag7~cQ@

delta 84
zcmbQ;#k9POiTgA!FBbz4<V_RX$UTY0!o%4rCbT%Us5mAoF(tn|#w9<wG&eP`q&Oxy
gKP5G$AiuaIy(qP~Fh`-FvLquv4<@qtBuh{O0HM7e#sB~S

diff --git a/__pycache__/config.cpython-312.pyc b/__pycache__/config.cpython-312.pyc
index 10a5f907c2bac01c83e134a4a44519e9b39227a5..f9c31478f7ff71a4128f70ec10f6d8e8decc2ca1 100644
GIT binary patch
delta 70
zcmew_@>zuYG%qg~0}x2rOKjw3XVS5Ewu%WYPAw{q$x2MgFOTuhOLZyAEK7}X$xklL
WP0cGQj>)Y|&QD1NQk%V)OgRAT*cS5u

delta 82
zcmew?@?V7eG%qg~0}w>*<K4*3&Sc^3Y!wq)oLW>Ila-i~UmoL<pIn-onpaXBlboND
e8dH#8T#{atT3nc;P*7Qtk)H<>*=)yT$^igqWE|xH

diff --git a/__pycache__/main.cpython-312.pyc b/__pycache__/main.cpython-312.pyc
index 899b7b5a424ec737fbcd89dcf764e08a8c0c6bcf..e3334f3cbd35a8544963241d1989c000a1fac03f 100644
GIT binary patch
delta 72
zcmX@Un{oGUM()$Ryj%=GAZ0JHk^3y8j;*s*OlWaxQE^OGVoH8_jDKFLOHpQ7YK%*M
Za%paAUP*CGZe?<QN-B`rEWorq8UR#=88H9=

delta 84
zcmdnJoALN=M()$Ryj%=GU>YT`k^3y8g{QMsOlWaxQE^OGVoH8_j7xrUX>Mv>NpVba
geoAUgL4I*bdQoa|VU9vUWl2VU9!z923)A*!0KeNFod5s;

diff --git a/templates/items/item.html b/templates/items/item.html
index fa76e3a..3613758 100644
--- a/templates/items/item.html
+++ b/templates/items/item.html
@@ -13,6 +13,8 @@
         <!-- Material Symbols - Sharp Set -->
         <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
         <script src="https://cdn.jsdelivr.net/npm/@materializecss/materialize@2.0.3-alpha/dist/js/materialize.min.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
+
     </head>
     <style>
         header, main, footer, body {
@@ -146,7 +148,19 @@
                             </tbody>
                         </table>
                     </div>
-                    <div id="food_info" class="col s12">Food Info</div>
+                    <div id="food_info" class="col s12">
+                        <div class="row" style="gap: 10px; padding-top: 10px;">
+                            <div id="food_groups_container" class="col s12 chips">
+                                <!-- This holds open for food groups pills -->
+                            </div>
+                            <div id="ingrediants_container" class="col s12 chips">
+                                <!-- This holds all the ingrediants pills -->
+                            </div>
+                            <div id="nutrients_container" class="col s12">
+                                <!-- This holds all the nutrients tables -->
+                            </div>                           
+                        </div>
+                    </div>
                     <div id="logistics_info" class="col s12">Logistics Info</div>
                     <div id="linked_items" class="col s12 disabled">Linked Items</div>
                   </div>
@@ -185,13 +199,16 @@
     </body>
     <script src="{{ url_for('static', filename='itemHandler.js') }}"></script>
     <script>
-    const item = {{ item|tojson }}
+    
+    var item = {{ item|tojson }};
     var reference_state = 1
     let links = {};
     let updated = {};
     let item_info = {};
     let food_info = {};
     let logistics_info = {};
+    let food_groups = [];
+    let ingrediants = [];
     
 
     document.addEventListener('DOMContentLoaded', async function() {
@@ -206,7 +223,25 @@
         var elems = document.querySelectorAll('.modal');
         var instances = M.Modal.init(elems, {});
 
+
+        var elem = document.getElementById('food_groups_container');
+        M.Chips.init(elem, {
+            placeholder: 'Add Group...',
+            secondaryPlaceholder: 'Add Group...',
+            onChipDelete: deleteFoodGroup,
+            onChipAdd: addFoodGroup,
+        });
+
+        var elem = document.getElementById('ingrediants_container');
+        M.Chips.init(elem, {
+            placeholder: 'Add Ingrediant...',
+            secondaryPlaceholder: 'Add Ingrediant...',
+            onChipDelete: deleteIngrediant,
+        });
+
         await propagateInfo()
+        refreshFoodGroups()
+        refreshIngrediants()
         populateReferences(item[23], 'shopping_list')
         populateReferences(item[24], 'recipe')
         populateReferences(item[25], 'group')
@@ -220,8 +255,42 @@
         const itemType = document.getElementById('item_type');
         itemType.value = item[11];
         await propagateLinks()
+
+        food_groups = item[33];
+        ingrediants = item[34];
     }
 
+    function refreshFoodGroups(){
+        let instance = M.Chips.getInstance(document.getElementById('food_groups_container'));
+        for (let i=0; i < food_groups.length; i++){
+            instance.addChip({tag: String(food_groups[i])});
+        ;}
+    };
+
+    function addFoodGroup(e, chip){
+        chipText = chip.textContent.replace('close', '').trim()
+        console.log(chipText)
+        food_groups.push(chipText)
+        console.log(food_groups)
+    }
+
+    function deleteFoodGroup(e, chip){
+        chipText = chip.textContent.replace('close', '').trim()
+        food_groups = food_groups.filter(chip => chip !== chipText);
+    };
+
+    function deleteIngrediant(e, chip){
+        chipText = chip.textContent.replace('close', '').trim()
+        ingrediants = ingrediants.filter(chip => chip !== chipText);
+    }
+
+    function refreshIngrediants(){
+        let instance = M.Chips.getInstance(document.getElementById('ingrediants_container'));
+        for (let i=0; i < ingrediants.length; i++){
+            instance.addChip({tag: String(ingrediants[i])});
+        ;}
+    };
+
     async function propagateLinks(){
         var element = document.getElementById("weblinks");
         element.innerHTML = ""