Improve food import from JSON

www/activities/foodlist/js/foodlist.js

@@ -44,7 +44,7 @@ app.Foodlist = {
     app.Foodlist.list = await this.getListFromDB();
     app.Foodlist.filterList = app.Foodlist.list;
 
-    await this.renderList(true);
+    await this.renderList(true, true);
 
     if (context)
       app.FoodsMealsRecipes.resetSearchForm(app.Foodlist.el.searchForm, app.Foodlist.el.searchFilter, app.Foodlist.el.searchFilterIcon);
@@ -149,7 +149,7 @@ app.Foodlist = {
     this.renderList(true);
   },
 
-  renderList: async function(clear) {
+  renderList: async function(clear, forceHideItems) {
     if (clear) app.Utils.deleteChildNodes(app.Foodlist.el.list);
 
     //List settings
@@ -159,6 +159,11 @@ app.Foodlist = {
     let clickable = (app.FoodsMealsRecipes.editItems != "disabled");
     let showThumbnails = app.Utils.showThumbnails("foodlist");
 
+    let showHiddenItems = false;
+    let categories = app.FoodsMealsRecipes.getSelectedCategories(app.Foodlist.el.searchFilter);
+    if (categories !== undefined) // Only show hidden items when the category filter is active
+      showHiddenItems = true;
+
     if (lastIndex <= app.Foodlist.list.length) {
       //Render next set of items to list
       for (let i = lastIndex; i <= lastIndex + itemsPerLoad; i++) {
@@ -167,6 +172,7 @@ app.Foodlist = {
         let item = app.Foodlist.list[i];
 
         if (item != undefined) {
+          if (item.hidden == true && (showHiddenItems == false || forceHideItems == true)) continue;
           item.type = "food";
           app.FoodsMealsRecipes.renderItem(item, app.Foodlist.el.list, true, false, clickable, undefined, this.removeItem, undefined, false, showThumbnails);
         }
@@ -302,9 +308,9 @@ app.Foodlist = {
       for (let i = 0; i < selection.length; i++) {
         let data = JSON.parse(selection[i]);
 
-        if (data.id == undefined) { //No ID, must be a search result 
+        if (data.id == undefined || data.hidden == true) { //No ID or hidden, must be a search result 
 
-          if (data.barcode) { //If item has barcode it must be from online service
+          if (data.barcode) { //If item has barcode it must be from online service or imported from JSON
 
             //Check to see if item is already in DB 
             let dbData = await app.Foodlist.searchByBarcode(data.barcode);
@@ -313,6 +319,7 @@ app.Foodlist = {
             if (dbData) {
               data = dbData;
               data.archived = false; // Unarchive the food if it has been archived
+              if (data.hidden == true) data.hidden = false; // Unhide the food if it was imported from JSON
               await app.Foodlist.putItem(data);
             }
           }

www/activities/foods-meals-recipes/js/food-editor.js

@@ -390,7 +390,7 @@ app.FoodEditor = {
     app.FoodEditor.el.unit.value = item.unit || "";
     app.FoodEditor.el.notes.value = item.notes || "";
 
-    if (item.barcode !== undefined && !item.barcode.includes("fdcId_")) {
+    if (item.barcode !== undefined && !item.barcode.startsWith("fdcId_") && !item.barcode.startsWith("custom_")) {
       app.FoodEditor.el.barcodeContainer.style.display = "block";
       app.FoodEditor.el.barcode.value = item.barcode;
 
@@ -633,6 +633,7 @@ app.FoodEditor = {
         delete item.nutrition_per;
 
       item.archived = false;
+      if (item.hidden == true) item.hidden = false;
 
       app.data.context = {
         item: item,

www/activities/settings/js/settings.js

@@ -372,16 +372,20 @@ app.Settings = {
     }
   },
 
-
   putFoodItem: function(item) {
     return new Promise(async function(resolve, reject) {
       if (item.id == undefined && item.barcode !== undefined) {
         let dbRecord = await dbHandler.get("foodList", "barcode", item.barcode);
 
-        if (dbRecord !== undefined)
+        if (dbRecord !== undefined) {
           item.id = dbRecord.id;
+          item.hidden = dbRecord.hidden;
+        } else {
+          item.hidden = true; // Hide newly imported items by default
+        }
       }
 
+      item.type = "food";
       item.dateTime = new Date();
 
       dbHandler.put(item, "foodList").onsuccess = (e) => {
@@ -398,6 +402,13 @@ app.Settings = {
 
   importFoods: async function() {
     let categories = app.FoodsMealsRecipes.getSelectedCategories(document.getElementById("categories"));
+
+    if (categories == undefined) {
+      let msg = app.strings.settings.integration["import-foods-category-fail"] || "Please select at least one category";
+      app.Utils.toast(msg);
+      return;
+    }
+
     let file = await chooser.getFile();
 
     if (file !== undefined && file.data !== undefined) {
@@ -420,19 +431,16 @@ app.Settings = {
       }
 
       if (data !== undefined) {
-        if (categories !== undefined) {
-          for (let i = 0; i < data.foodList.length; i++)
-            data.foodList[i].categories = categories;
-        }
-        // Add a pseudo-barcode to prevent duplicate imports
         for (let i = 0; i < data.foodList.length; i++) {
+          // Add selected catogories
+          data.foodList[i].categories = categories;
+          // Add a pseudo-barcode to prevent duplicate imports
           if (data.foodList[i].id === undefined && data.foodList[i].uniqueId !== undefined)
             data.foodList[i].barcode = "custom_" + data.foodList[i].uniqueId.toString();
-
         }
 
         let title = app.strings.settings.integration.import || "Import";
-        let text = app.strings.settings["import-export"]["confirm-import-foods"] || "Are you sure? This action cannot be undone. Please backup your database first.";
+        let text = app.strings.settings["integration"]["confirm-import-foods"] || "Are you sure? This action cannot be undone. Please backup your database first.";
 
         let div = document.createElement("div");
         div.className = "dialog-text";
@@ -450,6 +458,8 @@ app.Settings = {
               keyCodes: [13],
               onClick: async () => {
                 await this.updateFoodItems(data.foodList);
+                let msg = app.strings.settings.integration["import-success-message"] || "Import Complete";
+                app.Utils.toast(msg);
               }
             }
           ]

www/activities/settings/views/import-export.html

@@ -31,7 +31,7 @@
   <div class="page-content">
 
     <div class="list multi-line-titles">
-      <ul>
+      <ul id="import-export-settings">
 
         <li>
           <div class="item-content">
@@ -52,19 +52,17 @@
         </li>
 
         <li>
-          <a href="#" class="button button-large" id="import-db" data-localize="settings.import-export.import">Import From Backup</a>
+          <p><a href="#" class="button button-large" id="import-db" data-localize="settings.import-export.import">Import From Backup</a></p>
         </li>
-      </ul>
 
-      <ul>
         <li class="item-divider" data-localize="settings.import-export.import-foods-title">Import Foods</li>
 
         <li>
-          <a href="#" class="button button-large" id="import-foods" data-localize="settings.import-export.import-foods">Import Foods from JSON</a>
-          <li class="item-content item-input" id="categories-container">
+          <p><a href="#" class="button button-large" id="import-foods" data-localize="settings.import-export.import-foods">Import Foods from JSON</a></p>
+          <li class="item-content item-input inline-label" id="categories-container">
             <a href="" id="categories">
               <div class="item-inner">
-                <div class="item-title item-label" data-localize="settings.import-export.import-foods-categories">Categories to apply to imported items</div>
+                <div class="item-title item-label" data-localize="settings.import-export.import-foods-categories">Categories for imported items</div>
                 <div class="item-input-wrap"></div>
                 <div class="item-after" id="categories-list"></div>
               </div>

www/assets/css/global-styles.css

@@ -42,6 +42,8 @@ i.searchbar-icon {margin: -12px 12px;}
 #quantity-container.item-input .item-title {width: 60vw;}
 #nutrition .item-input .item-title {width: 60vw;}
 
+#import-export-settings .item-input .item-title {width: 60vw;}
+
 img.food-thumbnail {width: 20%; margin: 0.2em 1em 0.2em 0;}
 html[dir="rtl"] img.food-thumbnail {margin: 0.2em 0 0.2em 1em;}
 

www/assets/locales/locale-en.json

@@ -283,9 +283,12 @@
     },
     "import-export": {
       "title": "Import/Export",
+      "auto-backup": "Automatic Backup",
       "backup": "Backup Database",
       "import": "Import From Backup",
-      "auto-backup": "Automatic Backup"
+      "import-foods-title": "Import Foods",
+      "import-foods": "Import Foods from JSON",
+      "import-foods-categories": "Categories for imported items"
     },
     "integration": {
       "title": "Integration",
@@ -318,6 +321,8 @@
       "import-fail": "Import Failed",
       "import": "Import",
       "confirm-import": "Are you sure? This will overwrite your current database.",
+      "confirm-import-foods": "Are you sure? This action cannot be undone. Please backup your database first.",
+      "import-foods-category-fail": "Please select at least one category",
       "import-success-title": "The backup has been restored",
       "import-success-message": "Import Complete",
       "barcode-sound": "Barcode Scan Beep",