kartoffelsalat-rechner/js/main.js

import Alpine from "https://unpkg.com/alpinejs@3.15.4/dist/module.esm.js";
window.Alpine = Alpine;
Alpine.data("daten", () => ({
  zutaten: [
    { gruppe: "Grundzutaten" },
    { name: "Kartoffeln", einheit: "g", faktor: 200 },
    { name: "Nudeln", einheit: "g", faktor: 50 },
    { name: "Salatgurke", einheit: "x", faktor: 0.5, runde: 10 },
    { name: "Saure Gurke", einheit: "x", faktor: 2 },
    { name: "Mayonnaise", einheit: "g", faktor: 20 },
    { name: "Senf", einheit: " EL", faktor: 1.4 },
    { name: "Ketchup", einheit: " EL", faktor: 1.4 },
    { name: "Saure Sahne", einheit: "ml", faktor: 100 },
    { gruppe: "Früchte" },
    { name: "Birne", einheit: "x" },
    { name: "Apfel", einheit: "x" },
    { name: "Rote Beete", einheit: " Knolle/n" },
    { name: "Mandarine", einheit: "x" },
    { name: "Ananas", einheit: "g", faktor: 50 },
    { name: "Mango", einheit: "g", faktor: 50 },
    { gruppe: "Gemüse" },
    { name: "Rucola", einheit: "g", faktor: 150 },
    { name: "Kopfsalat", einheit: " Blätter" },
    { name: "Oliven", einheit: "g", faktor: 50 },
    { name: "Erbsen", einheit: "g", faktor: 50 },
    { name: "Tomaten (stückig)", einheit: "g", faktor: 200 },
    { name: "Paprika", einheit: "x" },
    { name: "Karotte", einheit: "x" },
    { gruppe: "Fleischanteil" },
    { name: "Fleischwurst", einheit: "g", faktor: 200 },
    { name: "Hackfleisch", einheit: "g", faktor: 250 },
    { name: "Bratwurst", einheit: "x" },
    { name: "Hering", einheit: "g", faktor: 150 },
    { name: "Thunfisch", einheit: "g", faktor: 100 },
    { name: "Lachs", einheit: "g", faktor: 100 },
    { name: "Mehlwürmer" },
    { gruppe: "Milchprodukte" },
    { name: "Käse", einheit: "g", faktor: 100 },
    { name: "Sahne", einheit: "ml", faktor: 100 },
    { gruppe: "Special Gewürze" },
    { name: "Knoblauch", einheit: " Zehe/n" },
    { name: "Chili", einheit: " Scoville", faktor: 10_000 },
    { gruppe: "Sonstiges" },
    { name: "Champignons", einheit: "g", faktor: 100 },
    { name: "Eier", einheit: "" },
    { name: "Zwiebeln", einheit: "g", faktor: 100 },
    { name: "Meeresfrüchte" },
    { name: "Spargel", einheit: " Stange/n" },
  ],
  filter: "",
  init() {
    this.zutaten.forEach((z, index) => {
      if (z.name) {
        z.menge = 0;
        z.id = index;
      }
    });
  },
  reset() {
    this.filter = "";
    for (let index = 0; index < this.zutaten.length; index++) {
      const zutat = this.zutaten[index];
      if (zutat.menge && zutat.menge > 0) {
        zutat.menge = 0;
      }
    }
  },
  get zutaten_filter() {
    if (this.filter.length == 0) {
      return this.zutaten;
    }
    let filtered = this.zutaten.filter((z) => {
      return (
        z.gruppe ||
        (z.name && z.name.toLowerCase().includes(this.filter.toLowerCase()))
      );
    });
    return filtered;
  },
  menge(delta, id) {
    let zutat = this.zutaten.find((z) => z.id == id);
    zutat.menge = Math.max(0, Math.min(zutat.menge + delta, 10));
  },
  get rezept() {
    let ausgabe = [];
    for (let i = 0; i < this.zutaten.length; i++) {
      const zutat = this.zutaten[i];
      if (zutat.menge > 0 && zutat.einheit) {
        let faktor = zutat.faktor ?? 1;
        let runde = zutat.runde ?? 1;
        ausgabe.push(
          `${Math.round(zutat.menge * faktor * runde) / runde}${zutat.einheit} ${zutat.name}`,
        );
      }
    }
    return ausgabe;
  },
  get rezeptname() {
    let zutaten = this.zutaten.reduce(
      (a, v) => ({ ...a, [v.name]: v.menge }),
      {},
    );
    let gesamt = Object.values(zutaten).reduce((a, b) => {
      if (b) {
        return a + b;
      } else {
        return a;
      }
    }, 0);
    if (zutaten["Salatgurke"] >= 4 && zutaten["Senf"] >= 4 && gesamt < 15) {
      return ["Senfgurken"];
    }
    if (zutaten["Nudeln"] >= 1 && zutaten["Kartoffeln"] == 0) {
      return ["Nudelsalat"];
    }
    if (
      zutaten["Hackfleisch"] >= 2 &&
      zutaten["Nudeln"] >= 3 &&
      zutaten["Tomaten (stückig)"] >= 2
    ) {
      return ["Spaghetti Bolognese"];
    }
    if (
      zutaten["Ketchup"] >= 3 &&
      zutaten["Mayonnaise"] >= 3 &&
      zutaten["Kartoffeln"] >= 1
    ) {
      return ["Pommes Rot-Weiß"];
    }
    if (
      zutaten["Kopfsalat"] >= 3 &&
      zutaten["Karotte"] >= 1 &&
      zutaten["Paprika"] >= 1
    ) {
      return ["Gemischter Salat", "etwas Schnittlauch und Petersilie"];
    }
    if (zutaten["Paprika"] >= 4 && zutaten["Hackfleisch"] >= 1) {
      return ["Gefüllte Paprika"];
    }
    let allObst = [
      "Birne",
      "Apfel",
      "Rote Beete",
      "Mandarine",
      "Ananas",
      "Mango",
    ];
    let obst = Object.entries(zutaten).filter((z) => allObst.includes(z[0]));
    if (obst.length == allObst.length && obst.every((z) => z[1] >= 1)) {
      return ["Obstsalat"];
    }
    if (zutaten["Apfel"] == 2 && gesamt == 2) {
      return ["Bratapfel"];
    }
    return ["Kartoffelsalat"];
  },
}));
Alpine.start();