components.js 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813
  1. let recipeDetailsComp = {
  2. recipe: {},
  3. display: function(recipe){
  4. this.recipe = recipe;
  5. openSidebar(document.querySelector("#recipeDetails"));
  6. document.querySelector("#recipeName").style.display = "block";
  7. document.querySelector("#recipeNameIn").style.display = "none";
  8. document.querySelector("#recipeDetails h1").innerText = recipe.name;
  9. let ingredientList = document.querySelector("#recipeIngredientList");
  10. while(ingredientList.children.length > 0){
  11. ingredientList.removeChild(ingredientList.firstChild);
  12. }
  13. let template = document.querySelector("#recipeIngredient").content.children[0];
  14. for(let i = 0; i < recipe.ingredients.length; i++){
  15. ingredientDiv = template.cloneNode(true);
  16. ingredientDiv.children[0].innerText = recipe.ingredients[i].ingredient.name;
  17. ingredientDiv.children[2].innerText = `${recipe.ingredients[i].quantity} ${recipe.ingredients[i].ingredient.unit}`;
  18. ingredientDiv.ingredient = recipe.ingredients[i].ingredient;
  19. ingredientDiv.name = recipe.ingredients[i].ingredient.name;
  20. ingredientList.appendChild(ingredientDiv);
  21. }
  22. document.querySelector("#addRecIng").style.display = "none";
  23. let price = document.querySelector("#recipePrice");
  24. price.children[1].style.display = "block";
  25. price.children[2].style.display = "none";
  26. price.children[1].innerText = `$${(recipe.price / 100).toFixed(2)}`;
  27. document.querySelector("#recipeUpdate").style.display = "none";
  28. },
  29. edit: function(){
  30. let ingredientDivs = document.querySelector("#recipeIngredientList");
  31. if(merchant.pos === "none"){
  32. let name = document.querySelector("#recipeName");
  33. let nameIn = document.querySelector("#recipeNameIn");
  34. name.style.display = "none";
  35. nameIn.style.display = "block";
  36. nameIn.placeholder = name.innerText;
  37. let price = document.querySelector("#recipePrice");
  38. price.children[1].style.display = "none";
  39. price.children[2].style.display = "block";
  40. price.children[2].placeholder = price.children[1].innerText;
  41. }
  42. for(let i = 0; i < ingredientDivs.children.length; i++){
  43. let div = ingredientDivs.children[i];
  44. div.children[2].innerText = this.recipe.ingredients[i].ingredient.unit;
  45. div.children[1].style.display = "block";
  46. div.children[1].placeholder = this.recipe.ingredients[i].quantity;
  47. div.children[3].style.display = "block";
  48. div.children[3].onclick = ()=>{div.parentElement.removeChild(div)};
  49. }
  50. document.querySelector("#addRecIng").style.display = "flex";
  51. document.querySelector("#recipeUpdate").style.display = "flex";
  52. },
  53. update: function(){
  54. this.recipe.name = document.querySelector("#recipeNameIn").value || this.recipe.name;
  55. this.recipe.price = Math.round((document.querySelector("#recipePrice").children[2].value * 100)) || this.recipe.price;
  56. this.recipe.ingredients = [];
  57. let divs = document.querySelector("#recipeIngredientList").children;
  58. for(let i = 0; i < divs.length; i++){
  59. if(divs[i].name === "new"){
  60. let select = divs[i].children[0];
  61. this.recipe.ingredients.push({
  62. ingredient: select.options[select.selectedIndex].ingredient,
  63. quantity: divs[i].children[1].value
  64. })
  65. }else{
  66. this.recipe.ingredients.push({
  67. ingredient: divs[i].ingredient,
  68. quantity: divs[i].children[1].value || divs[i].children[1].placeholder
  69. });
  70. }
  71. }
  72. let data = {
  73. id: this.recipe.id,
  74. name: this.recipe.name,
  75. price: this.recipe.price,
  76. ingredients: []
  77. }
  78. for(let i = 0; i < this.recipe.ingredients.length; i++){
  79. data.ingredients.push({
  80. ingredient: this.recipe.ingredients[i].ingredient.id,
  81. quantity: this.recipe.ingredients[i].quantity
  82. });
  83. }
  84. fetch("/recipe/update", {
  85. method: "PUT",
  86. headers: {
  87. "Content-Type": "application/json;charset=utf-8"
  88. },
  89. body: JSON.stringify(data)
  90. })
  91. .then((response) => response.json())
  92. .then((response)=>{
  93. if(typeof(response) === "string"){
  94. banner.createError(response);
  95. }else{
  96. merchant.editRecipe(this.recipe);
  97. banner.createNotification("Recipe successfully updated");
  98. }
  99. })
  100. .catch((err)=>{
  101. banner.createError("Something went wrong. Please refresh the page");
  102. })
  103. },
  104. remove: function(){
  105. fetch(`/merchant/recipes/remove/${this.recipe.id}`, {
  106. method: "DELETE"
  107. })
  108. .then((response) => response.json())
  109. .then((response)=>{
  110. if(typeof(response) === "string"){
  111. banner.createError(response);
  112. }else{
  113. merchant.editRecipe(this.recipe, true);
  114. banner.createNotification("Recipe removed");
  115. }
  116. })
  117. .catch((err)=>{
  118. banner.createError("Something went wrong. Try refreshing the page");
  119. });
  120. },
  121. displayAddIngredient: function(){
  122. let template = document.querySelector("#addRecIngredient").content.children[0].cloneNode(true);
  123. template.name = "new";
  124. document.querySelector("#recipeIngredientList").appendChild(template);
  125. let categories = merchant.categorizeIngredients();
  126. for(let i = 0; i < categories.length; i++){
  127. let optGroup = document.createElement("optgroup");
  128. optGroup.label = categories[i].name;
  129. template.children[0].appendChild(optGroup);
  130. for(let j = 0; j < categories[i].ingredients.length; j++){
  131. let option = document.createElement("option");
  132. option.innerText = `${categories[i].ingredients[j].ingredient.name} (${categories[i].ingredients[j].ingredient.unit})`;
  133. option.ingredient = categories[i].ingredients[j].ingredient;
  134. optGroup.appendChild(option);
  135. }
  136. }
  137. }
  138. }
  139. let newOrderComp = {
  140. isPopulated: false,
  141. unused: [],
  142. display: function(){
  143. if(!this.isPopulated){
  144. let categories = merchant.categorizeIngredients();
  145. let categoriesList = document.querySelector("#newOrderCategories");
  146. let template = document.querySelector("#addIngredientsCategory").content.children[0];
  147. let ingredientTemplate = document.querySelector("#addIngredientsIngredient").content.children[0];
  148. for(let i = 0; i < categories.length; i++){
  149. let category = template.cloneNode(true);
  150. category.children[0].children[0].innerText = categories[i].name;
  151. category.children[0].children[1].onclick = ()=>{addIngredientsComp.toggleAddIngredient(category)};
  152. category.children[0].children[1].children[1].style.display = "none";
  153. category.children[1].style.display = "none";
  154. categoriesList.appendChild(category);
  155. for(let j = 0; j < categories[i].ingredients.length; j++){
  156. let ingredientDiv = ingredientTemplate.cloneNode(true);
  157. ingredientDiv.children[0].innerText = categories[i].ingredients[j].ingredient.name;
  158. ingredientDiv.children[1].onclick = ()=>{this.addOne(ingredientDiv, category.children[1])};
  159. ingredientDiv.ingredient = categories[i].ingredients[j].ingredient;
  160. this.unused.push(categories[i].ingredients[j]);
  161. category.children[1].appendChild(ingredientDiv);
  162. }
  163. }
  164. this.isPopulated = true;
  165. }
  166. openSidebar(document.querySelector("#newOrder"));
  167. },
  168. addOne: function(ingredientDiv, container){
  169. for(let i = 0; i < this.unused.length; i++){
  170. if(this.unused[i] === ingredientDiv){
  171. this.unused.splice(i, 1);
  172. break;
  173. }
  174. }
  175. let quantityInput = document.createElement("input");
  176. quantityInput.type = "number";
  177. quantityInput.placeholder = ingredientDiv.ingredient.unit;
  178. quantityInput.min = "0";
  179. quantityInput.step = "0.01";
  180. ingredientDiv.insertBefore(quantityInput, ingredientDiv.children[1]);
  181. let priceInput = document.createElement("input");
  182. priceInput.type = "number";
  183. priceInput.placeholder = "Price Per Unit";
  184. priceInput.min = "0";
  185. priceInput.step = "0.01";
  186. ingredientDiv.insertBefore(priceInput, ingredientDiv.children[2]);
  187. ingredientDiv.children[3].innerText = "-";
  188. ingredientDiv.children[3].onclick = ()=>{this.removeOne(ingredientDiv, container)};
  189. container.removeChild(ingredientDiv);
  190. document.getElementById("newOrderAdded").appendChild(ingredientDiv);
  191. },
  192. removeOne: function(ingredientDiv, container){
  193. this.unused.push(ingredientDiv.ingredient);
  194. ingredientDiv.removeChild(ingredientDiv.children[1]);
  195. ingredientDiv.removeChild(ingredientDiv.children[1]);
  196. ingredientDiv.children[1].innerText = "+";
  197. ingredientDiv.children[1].onclick = ()=>{this.addOne(ingredientDiv, container)};
  198. ingredientDiv.parentElement.removeChild(ingredientDiv);
  199. container.appendChild(ingredientDiv);
  200. },
  201. submit: function(){
  202. let categoriesList = document.getElementById("newOrderAdded");
  203. let ingredients = [];
  204. for(let i = 0; i < categoriesList.children.length; i++){
  205. let quantity = categoriesList.children[i].children[1].value;
  206. let price = categoriesList.children[i].children[2].value;
  207. if(quantity !== "" && price !== ""){
  208. ingredients.push({
  209. ingredient: categoriesList.children[i].ingredient.id,
  210. quantity: parseFloat(quantity),
  211. price: parseInt(price * 100)
  212. });
  213. }
  214. }
  215. let order = new Order(
  216. document.getElementById("orderName").value,
  217. document.getElementById("orderDate").value,
  218. ingredients,
  219. merchant
  220. )
  221. let data = {
  222. orderId: order.name,
  223. date: order.date,
  224. ingredients: []
  225. }
  226. for(let i = 0; i < order.ingredients.length; i++){
  227. data.ingredients.push({
  228. ingredient: order.ingredients[i].ingredient.id,
  229. quantity: order.ingredients[i].quantity,
  230. price: order.ingredients[i].price
  231. });
  232. }
  233. fetch("/order", {
  234. method: "POST",
  235. headers: {
  236. "Content-Type": "application/json;charset=utf-8"
  237. },
  238. body: JSON.stringify(data)
  239. })
  240. .then(response => response.json())
  241. .then((response)=>{
  242. if(typeof(response) === "string"){
  243. banner.createError(response);
  244. }else{
  245. merchant.editOrders([order]);
  246. banner.createNotification("New order created");
  247. // updateInventory(newOrder.ingredients);
  248. }
  249. })
  250. .catch((err)=>{
  251. banner.createError("Something went wrong. Try refreshing the page");
  252. });
  253. },
  254. }
  255. let newIngredientComp = {
  256. display: function(){
  257. openSidebar(document.querySelector("#newIngredient"));
  258. document.querySelector("#newIngName").value = "";
  259. document.querySelector("#newIngCategory").value = "";
  260. document.querySelector("#newIngQuantity").value = 0;
  261. document.querySelector("#newIngUnit").value = ""
  262. },
  263. submit: function(){
  264. let newIngredient = {
  265. ingredient: {
  266. name: document.querySelector("#newIngName").value,
  267. category: document.querySelector("#newIngCategory").value,
  268. unit: document.querySelector("#newIngUnit").value
  269. },
  270. quantity: document.querySelector("#newIngQuantity").value
  271. }
  272. if(validator.ingredient(newIngredient)){
  273. fetch("/ingredients/create", {
  274. method: "POST",
  275. headers: {
  276. "Content-Type": "application/json;charset=utf-8"
  277. },
  278. body: JSON.stringify(newIngredient)
  279. })
  280. .then((response) => response.json())
  281. .then((response)=>{
  282. if(typeof(response) === "string"){
  283. banner.createError(response);
  284. }else{
  285. merchant.editIngredients([{
  286. ingredient: new Ingredient(
  287. response.ingredient._id,
  288. response.ingredient.name,
  289. response.ingredient.category,
  290. response.ingredient.unit
  291. ),
  292. quantity: response.quantity
  293. }]);
  294. banner.createNotification("Ingredient successfully created");
  295. }
  296. })
  297. .catch((err)=>{
  298. banner.createError("Something went wrong. Try refreshing the page");
  299. });
  300. }
  301. }
  302. }
  303. let orderDetailsComp = {
  304. display: function(order){
  305. openSidebar(document.querySelector("#orderDetails"));
  306. document.querySelector("#removeOrderBtn").onclick = ()=>{this.remove(order._id)};
  307. document.querySelector("#orderDetails h1").innerText = order.name;
  308. document.querySelector("#orderDetails h3").innerText = order.date.toLocaleDateString("en-US");
  309. let ingredientList = document.querySelector("#orderIngredients");
  310. while(ingredientList.children.length > 0){
  311. ingredientList.removeChild(ingredientList.firstChild);
  312. }
  313. let template = document.querySelector("#orderIngredient").content.children[0];
  314. let grandTotal = 0;
  315. for(let i = 0; i < order.ingredients.length; i++){
  316. let ingredient = template.cloneNode(true);
  317. let price = (order.ingredients[i].quantity * order.ingredients[i].price) / 100;
  318. grandTotal += price;
  319. ingredient.children[0].innerText = order.ingredients[i].ingredient.name;
  320. ingredient.children[1].innerText = `$${(order.ingredients[i].price / 100).toFixed(2)}`;
  321. ingredient.children[2].innerText = price.toFixed(2);
  322. ingredientList.appendChild(ingredient);
  323. }
  324. document.querySelector("#orderTotalPrice p").innerText = `$${grandTotal.toFixed(2)}`;
  325. },
  326. remove: function(id){
  327. fetch(`/order/${id}`, {
  328. method: "DELETE",
  329. headers: {
  330. "Content-Type": "application/json;charset=utf-8"
  331. }
  332. })
  333. .then((response) => response.json())
  334. .then((response)=>{
  335. if(typeof(response) === "string"){
  336. banner.createError(response);
  337. }else{
  338. updateOrders({_id: id}, true);
  339. banner.createNotification("Order successfully removed");
  340. }
  341. })
  342. .catch((err)=>{
  343. banner.createError("Something went wrong, try refreshing the page");
  344. });
  345. }
  346. }
  347. let addIngredientsComp = {
  348. isPopulated: false,
  349. fakeMerchant: {},
  350. chosenIngredients: [],
  351. display: function(){
  352. let sidebar = document.querySelector("#addIngredients");
  353. if(!this.isPopulated){
  354. fetch("/ingredients")
  355. .then((response) => response.json())
  356. .then((response)=>{
  357. if(typeof(response) === "string"){
  358. banner.createError(response);
  359. }else{
  360. for(let i = 0; i < merchant.ingredients.length; i++){
  361. for(let j = 0; j < response.length; j++){
  362. if(merchant.ingredients[i].ingredient.id === response[j]._id){
  363. response.splice(j, 1);
  364. break;
  365. }
  366. }
  367. }
  368. for(let i = 0; i < response.length; i++){
  369. response[i] = {ingredient: response[i]}
  370. }
  371. this.fakeMerchant = new Merchant(
  372. {
  373. name: "none",
  374. inventory: response,
  375. recipes: [],
  376. },
  377. []
  378. );
  379. this.populateAddIngredients();
  380. }
  381. })
  382. .catch((err)=>{
  383. banner.createError("Unable to retrieve data");
  384. });
  385. this.isPopulated = true;
  386. }
  387. openSidebar(sidebar);
  388. },
  389. populateAddIngredients: function(){
  390. let addIngredientsDiv = document.getElementById("addIngredientList");
  391. let categoryTemplate = document.getElementById("addIngredientsCategory");
  392. let ingredientTemplate = document.getElementById("addIngredientsIngredient");
  393. let categories = this.fakeMerchant.categorizeIngredients();
  394. while(addIngredientsDiv.children.length > 0){
  395. addIngredientsDiv.removeChild(addIngredientsDiv.firstChild);
  396. }
  397. for(let i = 0; i < categories.length; i++){
  398. let categoryDiv = categoryTemplate.content.children[0].cloneNode(true);
  399. categoryDiv.children[0].children[0].innerText = categories[i].name;
  400. categoryDiv.children[0].children[1].onclick = ()=>{addIngredientsComp.toggleAddIngredient(categoryDiv)};
  401. categoryDiv.children[1].style.display = "none";
  402. categoryDiv.children[0].children[1].children[1].style.display = "none";
  403. addIngredientsDiv.appendChild(categoryDiv);
  404. for(let j = 0; j < categories[i].ingredients.length; j++){
  405. let ingredientDiv = ingredientTemplate.content.children[0].cloneNode(true);
  406. ingredientDiv.children[0].innerText = categories[i].ingredients[j].ingredient.name;
  407. ingredientDiv.children[1].onclick = ()=>{this.addOne(ingredientDiv)};
  408. ingredientDiv.ingredient = categories[i].ingredients[j].ingredient;
  409. categoryDiv.children[1].appendChild(ingredientDiv);
  410. }
  411. }
  412. },
  413. toggleAddIngredient: function(categoryElement){
  414. let button = categoryElement.children[0].children[1];
  415. let ingredientDisplay = categoryElement.children[1];
  416. if(ingredientDisplay.style.display === "none"){
  417. ingredientDisplay.style.display = "flex";
  418. button.children[0].style.display = "none";
  419. button.children[1].style.display = "block";
  420. }else{
  421. ingredientDisplay.style.display = "none";
  422. button.children[0].style.display = "block";
  423. button.children[1].style.display = "none";
  424. }
  425. },
  426. addOne: function(element){
  427. element.parentElement.removeChild(element);
  428. document.getElementById("myIngredients").appendChild(element);
  429. document.getElementById("myIngredientsDiv").style.display = "flex";
  430. for(let i = 0; i < this.fakeMerchant.ingredients.length; i++){
  431. if(this.fakeMerchant.ingredients[i].ingredient === element.ingredient){
  432. this.fakeMerchant.ingredients.splice(i, 1);
  433. this.chosenIngredients.push(element.ingredient);
  434. break;
  435. }
  436. }
  437. let input = document.createElement("input");
  438. input.type = "number";
  439. input.min = "0";
  440. input.step = "0.01";
  441. input.placeholder = element._unit;
  442. element.insertBefore(input, element.children[1]);
  443. element.children[2].innerText = "-";
  444. element.children[2].onclick = ()=>{this.removeOne(element)};
  445. },
  446. removeOne: function(element){
  447. element.parentElement.removeChild(element);
  448. element.removeChild(element.children[1]);
  449. element.children[1].innerText = "+";
  450. element.children[1].onclick = ()=>{this.addOne(element)};
  451. if(document.getElementById("myIngredients").children.length === 0){
  452. document.getElementById("myIngredientsDiv").style.display = "none";
  453. }
  454. for(let i = 0; i < this.chosenIngredients.length; i++){
  455. if(this.chosenIngredients[i] === element.ingredient){
  456. this.chosenIngredients.splice(i, 1);
  457. this.fakeMerchant.ingredients.push({
  458. ingredient: element.ingredient
  459. });
  460. break;
  461. }
  462. }
  463. this.populateAddIngredients();
  464. },
  465. submit: function(){
  466. let ingredients = document.getElementById("myIngredients").children;
  467. let newIngredients = [];
  468. let fetchable = [];
  469. for(let i = 0; i < ingredients.length; i++){
  470. if(ingredients[i].children[1].value === ""){
  471. banner.createError("Please enter a quantity for each ingredient you want to add to your inventory");
  472. return;
  473. }
  474. newIngredients.push({
  475. ingredient: ingredients[i].ingredient,
  476. quantity: ingredients[i].children[1].value
  477. });
  478. fetchable.push({
  479. id: ingredients[i].ingredient.id,
  480. quantity: ingredients[i].children[1].value
  481. });
  482. }
  483. fetch("/merchant/ingredients/add", {
  484. method: "POST",
  485. headers: {
  486. "Content-Type": "application/json;charset=utf-8"
  487. },
  488. body: JSON.stringify(fetchable)
  489. })
  490. .then((response)=>{
  491. if(typeof(response) === "string"){
  492. banner.createError(response);
  493. }else{
  494. merchant.editIngredients(newIngredients);
  495. banner.createNotification("All ingredients added successfully");
  496. }
  497. })
  498. .catch((err)=>{
  499. banner.createError("Something went wrong. Try refreshing the page");
  500. });
  501. }
  502. }
  503. let ingredientDetailsComp = {
  504. ingredient: {},
  505. display: function(ingredient, category){
  506. this.ingredient = ingredient;
  507. sidebar = document.querySelector("#ingredientDetails");
  508. document.querySelector("#ingredientDetails p").innerText = category.name;
  509. document.querySelector("#ingredientDetails h1").innerText = ingredient.ingredient.name;
  510. document.querySelector("#ingredientStock").innerText = `${ingredient.quantity} ${ingredient.ingredient.unit}`;
  511. document.querySelector("#ingredientInput").placeholder = `${ingredient.quantity} ${ingredient.ingredient.unit}`;
  512. let quantities = [];
  513. let now = new Date();
  514. console.time("Single Ingredient Sold");
  515. for(let i = 1; i < 31; i++){
  516. let endDay = new Date(now.getFullYear(), now.getMonth(), now.getDate() - i)
  517. let startDay = new Date(now.getFullYear(), now.getMonth(), now.getDate() - i - 1);
  518. let indices = merchant.transactionIndices(startDay, endDay);
  519. if(indices === false){
  520. quantities.push(0);
  521. }else{
  522. quantities.push(merchant.singleIngredientSold(indices, ingredient));
  523. }
  524. }
  525. console.timeEnd("Single Ingredient Sold");
  526. let sum = 0;
  527. for(let quantity of quantities){
  528. sum += quantity;
  529. }
  530. document.querySelector("#dailyUse").innerText = `${(sum/quantities.length).toFixed(2)} ${ingredient.ingredient.unit}`;
  531. let ul = document.querySelector("#ingredientRecipeList");
  532. let recipes = merchant.getRecipesForIngredient(ingredient.ingredient);
  533. while(ul.children.length > 0){
  534. ul.removeChild(ul.firstChild);
  535. }
  536. for(let i = 0; i < recipes.length; i++){
  537. let li = document.createElement("li");
  538. li.innerText = recipes[i].name;
  539. li.onclick = ()=>{
  540. changeStrand("recipeBookStrand");
  541. recipeDetailsComp.display(recipes[i]);
  542. }
  543. ul.appendChild(li);
  544. }
  545. openSidebar(sidebar);
  546. },
  547. remove: function(){
  548. for(let i = 0; i < merchant.recipes.length; i++){
  549. for(let j = 0; j < merchant.recipes[i].ingredients.length; j++){
  550. if(this.ingredient.id === merchant.recipes[i].ingredients[j].ingredient._id){
  551. banner.createError("Must remove ingredient from all recipes before removing");
  552. return;
  553. }
  554. }
  555. }
  556. fetch(`/merchant/ingredients/remove/${this.ingredient.ingredient.id}`, {
  557. method: "DELETE",
  558. })
  559. .then((response) => response.json())
  560. .then((response)=>{
  561. if(typeof(response) === "string"){
  562. banner.createError(response);
  563. }else{
  564. banner.createNotification("Ingredient removed");
  565. merchant.editIngredients([this.ingredient], true);
  566. }
  567. })
  568. .catch((err)=>{});
  569. },
  570. edit: function(){
  571. document.querySelector("#ingredientStock").style.display = "none";
  572. document.querySelector("#ingredientInput").style.display = "block";
  573. document.querySelector("#editSubmitButton").style.display = "block";
  574. },
  575. editSubmit: function(){
  576. this.ingredient.quantity = Number(document.getElementById("ingredientInput").value);
  577. let data = [{
  578. id: this.ingredient.ingredient.id,
  579. quantity: this.ingredient.quantity
  580. }];
  581. if(validator.ingredientQuantity(data[0].quantity)){
  582. fetch("/merchant/ingredients/update", {
  583. method: "PUT",
  584. headers: {
  585. "Content-Type": "application/json;charset=utf-8"
  586. },
  587. body: JSON.stringify(data)
  588. })
  589. .then((response) => response.json())
  590. .then((response)=>{
  591. if(typeof(response) === "string"){
  592. banner.createError(response);
  593. }else{
  594. merchant.editIngredients([this.ingredient]);
  595. banner.createNotification("Ingredient updated");
  596. }
  597. })
  598. .catch((err)=>{
  599. banner.createError("Something went wrong, try refreshing the page");
  600. });
  601. }
  602. }
  603. }
  604. let newRecipeComp = {
  605. display: function(){
  606. let ingredientsSelect = document.querySelector("#recipeInputIngredients select");
  607. let categories = merchant.categorizeIngredients();
  608. for(let category of categories){
  609. let optgroup = document.createElement("optgroup");
  610. optgroup.label = category.name;
  611. ingredientsSelect.appendChild(optgroup);
  612. for(let ingredient of category.ingredients){
  613. let option = document.createElement("option");
  614. option.value = ingredient.ingredient.id;
  615. option.innerText = ingredient.ingredient.name;
  616. optgroup.appendChild(option);
  617. }
  618. }
  619. openSidebar(document.querySelector("#addRecipe"));
  620. },
  621. //Updates the number of ingredient inputs displayed for new recipes
  622. changeRecipeCount: function(){
  623. let newCount = document.querySelector("#ingredientCount").value;
  624. let ingredientsDiv = document.querySelector("#recipeInputIngredients");
  625. let oldCount = ingredientsDiv.children.length;
  626. if(newCount > oldCount){
  627. let newDivs = newCount - oldCount;
  628. for(let i = 0; i < newDivs; i++){
  629. let newNode = ingredientsDiv.children[0].cloneNode(true);
  630. newNode.children[2].children[0].value = "";
  631. ingredientsDiv.appendChild(newNode);
  632. }
  633. for(let i = 0; i < newCount; i++){
  634. ingredientsDiv.children[i].children[0].innerText = `Ingredient ${i + 1}`;
  635. }
  636. }else if(newCount < oldCount){
  637. let newDivs = oldCount - newCount;
  638. for(let i = 0; i < newDivs; i++){
  639. ingredientsDiv.removeChild(ingredientsDiv.children[ingredientsDiv.children.length-1]);
  640. }
  641. }
  642. },
  643. submit: function(){
  644. let newRecipe = {
  645. name: document.querySelector("#newRecipeName").value,
  646. price: document.querySelector("#newRecipePrice").value,
  647. ingredients: []
  648. }
  649. let inputs = document.querySelectorAll("#recipeInputIngredients > div");
  650. for(let input of inputs){
  651. newRecipe.ingredients.push({
  652. ingredient: input.children[1].children[0].value,
  653. quantity: input.children[2].children[0].value
  654. });
  655. }
  656. if(!validator.recipe(newRecipe)){
  657. return;
  658. }
  659. fetch("/recipe/create", {
  660. method: "POST",
  661. headers: {
  662. "Content-Type": "application/json;charset=utf-8"
  663. },
  664. body: JSON.stringify(newRecipe)
  665. })
  666. .then((response) => response.json())
  667. .then((response)=>{
  668. if(typeof(response) === "string"){
  669. banner.createError(response);
  670. }else{
  671. let recipe = new Recipe(
  672. response._id,
  673. response.name,
  674. response.price,
  675. response.ingredients,
  676. merchant,
  677. );
  678. merchant.editRecipe(recipe);
  679. banner.createNotification("New recipe successfully created");
  680. }
  681. })
  682. .catch((err)=>{
  683. banner.createError("Refresh page to update data");
  684. });
  685. },
  686. }