@jjlmoya/utils-cooking 1.2.0

package/src/tool/egg-timer/component.astro

@@ -0,0 +1,281 @@
+---
+import { Icon } from "astro-icon/components";
+import type { ToolLocaleContent } from "../../types";
+import "./EggTimer.css";
+
+interface Props {
+  ui: ToolLocaleContent["ui"];
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="egg-timer-wrapper">
+  <div class="egg-timer-container">
+    <div class="egg-timer-grid">
+      <div class="egg-timer-card">
+        <h2 class="egg-timer-title">
+          <Icon name="mdi:tune" />
+          {ui.parameters}
+        </h2>
+
+        <div class="egg-timer-controls-space">
+          <div class="egg-timer-control-group">
+            <div class="egg-timer-label-row">
+              <label class="egg-timer-label">{ui.initial_temperature}</label>
+            </div>
+            <div class="egg-timer-buttons-group">
+              <button class="egg-timer-btn active" data-temp="4">
+                <Icon name="mdi:fridge" />
+                <span>{ui.fridge}</span> (4°C)
+              </button>
+              <button class="egg-timer-btn" data-temp="20">
+                <Icon name="mdi:thermometer" />
+                <span>{ui.ambient}</span> (20°C)
+              </button>
+            </div>
+          </div>
+
+          <div class="egg-timer-control-group">
+            <div class="egg-timer-label-row">
+              <label class="egg-timer-label">{ui.egg_size}</label>
+            </div>
+            <div class="egg-timer-size-buttons">
+              <button class="egg-timer-size-btn" data-size="53">S</button>
+              <button class="egg-timer-size-btn active" data-size="58">M</button>
+              <button class="egg-timer-size-btn" data-size="63">L</button>
+              <button class="egg-timer-size-btn" data-size="73">XL</button>
+            </div>
+          </div>
+
+          <div class="egg-timer-control-group">
+            <div class="egg-timer-label-row">
+              <label class="egg-timer-label">{ui.altitude}</label>
+            </div>
+            <div class="egg-timer-input-wrapper">
+              <input
+                type="number"
+                id="altitude-input"
+                class="egg-timer-input"
+                value="0"
+                placeholder="0"
+              />
+              <div class="egg-timer-input-buttons">
+                <button class="egg-timer-quick-btn" id="btn-sea">
+                  {ui.sea_level}
+                </button>
+                <button class="egg-timer-quick-btn" id="btn-madrid">
+                  Mad
+                </button>
+                <button
+                  class="egg-timer-quick-btn"
+                  id="btn-location"
+                  title={ui.use_location}
+                >
+                  <Icon name="mdi:crosshairs-gps" />
+                </button>
+              </div>
+            </div>
+            <p class="egg-timer-help-text">{ui.altitude_help}</p>
+          </div>
+        </div>
+      </div>
+
+      <div class="egg-timer-results">
+        <div class="egg-timer-result-card soft">
+          <div class="egg-timer-result-header">
+            <div>
+              <h3 class="egg-timer-result-title">{ui.soft_cooked}</h3>
+              <p class="egg-timer-result-subtitle">{ui.soft_description}</p>
+            </div>
+            <Icon name="mdi:egg-easter" class="egg-timer-result-icon" />
+          </div>
+          <div class="egg-timer-result-time" id="time-soft">00:00</div>
+        </div>
+
+        <div class="egg-timer-result-card mollet">
+          <div class="egg-timer-result-header">
+            <div>
+              <h3 class="egg-timer-result-title">{ui.mollet}</h3>
+              <p class="egg-timer-result-subtitle">{ui.mollet_description}</p>
+            </div>
+            <Icon name="mdi:egg" class="egg-timer-result-icon" />
+          </div>
+          <div class="egg-timer-result-time" id="time-mollet">00:00</div>
+        </div>
+
+        <div class="egg-timer-result-card hard">
+          <div class="egg-timer-result-header">
+            <div>
+              <h3 class="egg-timer-result-title">{ui.hard_cooked}</h3>
+              <p class="egg-timer-result-subtitle">{ui.hard_description}</p>
+            </div>
+            <Icon name="mdi:egg-off" class="egg-timer-result-icon" />
+          </div>
+          <div class="egg-timer-result-time" id="time-hard">00:00</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<script>
+  let currentTemp = 4;
+  let currentSize = 58;
+  let currentAltitude = 0;
+
+  const tempBtns = document.querySelectorAll(
+    ".egg-timer-btn"
+  ) as NodeListOf<HTMLElement>;
+  const sizeBtns = document.querySelectorAll(
+    ".egg-timer-size-btn"
+  ) as NodeListOf<HTMLElement>;
+  const altitudeInput = document.getElementById(
+    "altitude-input"
+  ) as HTMLInputElement | null;
+  const btnLocation = document.getElementById("btn-location");
+  const btnSea = document.getElementById("btn-sea");
+  const btnMadrid = document.getElementById("btn-madrid");
+
+  function calculateTime(
+    mass: number,
+    tempStart: number,
+    tempTarget: number,
+    altitude: number
+  ): number {
+    const waterBoilingPoint = 100 - 0.0034 * altitude;
+
+    const term1 = 0.451 * Math.pow(mass, 2 / 3);
+    const term2 = Math.log(
+      (waterBoilingPoint - tempStart) / (waterBoilingPoint - tempTarget)
+    );
+
+    const minutes = term1 * term2;
+    return minutes * 60;
+  }
+
+  function formatTime(seconds: number): string {
+    const m = Math.floor(seconds / 60);
+    const s = Math.floor(seconds % 60);
+    return `${m.toString().padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
+  }
+
+  function updateCalculations(): void {
+    if (!altitudeInput) return;
+
+    currentAltitude = parseInt(altitudeInput.value) || 0;
+
+    const tSoft = calculateTime(currentSize, currentTemp, 62, currentAltitude);
+    const tMollet = calculateTime(currentSize, currentTemp, 67, currentAltitude);
+    const tHard = calculateTime(currentSize, currentTemp, 77, currentAltitude);
+
+    const elSoft = document.getElementById("time-soft");
+    const elMollet = document.getElementById("time-mollet");
+    const elHard = document.getElementById("time-hard");
+
+    if (elSoft) elSoft.textContent = formatTime(tSoft);
+    if (elMollet) elMollet.textContent = formatTime(tMollet);
+    if (elHard) elHard.textContent = formatTime(tHard);
+  }
+
+  tempBtns.forEach((btn) => {
+    btn.addEventListener("click", () => {
+      tempBtns.forEach((b) => b.classList.remove("active"));
+      btn.classList.add("active");
+      currentTemp = parseInt(btn.getAttribute("data-temp") || "0");
+      updateCalculations();
+    });
+  });
+
+  sizeBtns.forEach((btn) => {
+    btn.addEventListener("click", () => {
+      sizeBtns.forEach((b) => b.classList.remove("active"));
+      btn.classList.add("active");
+      currentSize = parseInt(btn.getAttribute("data-size") || "0");
+      updateCalculations();
+    });
+  });
+
+  if (altitudeInput) {
+    altitudeInput.addEventListener("input", updateCalculations);
+  }
+
+  btnSea?.addEventListener("click", () => {
+    if (altitudeInput) {
+      altitudeInput.value = "0";
+      updateCalculations();
+    }
+  });
+
+  btnMadrid?.addEventListener("click", () => {
+    if (altitudeInput) {
+      altitudeInput.value = "600";
+      updateCalculations();
+    }
+  });
+
+  async function fetchElevationData(
+    latitude: number,
+    longitude: number
+  ): Promise<number | null> {
+    try {
+      const response = await fetch(
+        `https://api.open-meteo.com/v1/elevation?latitude=${latitude}&longitude=${longitude}`
+      );
+      const data = (await response.json()) as { elevation?: number };
+      return data.elevation ?? null;
+    } catch {
+      return null;
+    }
+  }
+
+  async function handleGeolocation(position: GeolocationPosition): Promise<void> {
+    const icon = btnLocation?.querySelector("svg");
+    let altitude: number | null = position.coords.altitude;
+
+    if (altitude === null) {
+      const { latitude, longitude } = position.coords;
+      altitude = await fetchElevationData(latitude, longitude);
+    }
+
+    if (altitude !== null && altitudeInput) {
+      altitudeInput.value = Math.round(altitude).toString();
+      updateCalculations();
+    } else {
+      alert(
+        "No pudimos obtener tu altitud exacta. Intenta introducirla manualmente."
+      );
+    }
+
+    if (icon) icon.classList.remove("animate-spin");
+    if (btnLocation) btnLocation.classList.remove("active");
+  }
+
+  function handleGeolocationError(): void {
+    const icon = btnLocation?.querySelector("svg");
+    console.error("Geolocation error");
+    alert("Error al obtener la ubicación. Asegúrate de dar permisos.");
+    if (icon) icon.classList.remove("animate-spin");
+    if (btnLocation) btnLocation.classList.remove("active");
+  }
+
+  if (btnLocation) {
+    btnLocation.addEventListener("click", () => {
+      if (!navigator.geolocation) {
+        alert("Tu navegador no soporta geolocalización");
+        return;
+      }
+
+      const icon = btnLocation.querySelector("svg");
+      if (icon) icon.classList.add("animate-spin");
+      btnLocation.classList.add("active");
+
+      navigator.geolocation.getCurrentPosition(
+        handleGeolocation,
+        handleGeolocationError
+      );
+    });
+  }
+
+  updateCalculations();
+</script>

package/src/tool/egg-timer/i18n/en.ts

@@ -0,0 +1,230 @@
+import type { ToolLocaleContent } from "../../../types";
+
+export const content: ToolLocaleContent = {
+  slug: "perfect-boiled-egg-timer-altitude-calculator",
+  title: "Precision Scientific Egg Timer and Altitude Calculator",
+  description:
+    "Master the thermodynamics of the perfect egg. Calculate exact boiling times based on your altitude, egg size, and initial temperature.",
+  ui: {
+    parameters: "Cooking Parameters",
+    initial_temperature: "Initial Temp",
+    fridge: "Fridge (4°C)",
+    ambient: "Room (20°C)",
+    egg_size: "Egg Size",
+    altitude: "Your Altitude",
+    use_location: "Detect Location",
+    altitude_help:
+      "Lower atmospheric pressure at high altitudes reduces the water boiling point.",
+    sea_level: "0m",
+    soft_cooked: "Soft Boiled",
+    soft_description: "Runny yolk, just-set whites.",
+    mollet: "Mollet (Jammy)",
+    mollet_description: "Custard-like yolk, firm whites.",
+    hard_cooked: "Hard Boiled",
+    hard_description: "Solid yolk, fully set whites.",
+  },
+  faqTitle: "Frequently Asked Questions",
+  faq: [
+    {
+      question: "Why does altitude affect how long eggs take to boil?",
+      answer:
+        "Water boils at lower temperatures as you go higher in altitude because there is less atmospheric pressure. At 2,000 meters, water boils at roughly 93°C instead of 100°C, meaning your egg needs much more time to reach the same internal temperature.",
+    },
+    {
+      question: "Should I use eggs straight from the fridge?",
+      answer:
+        "Fridge eggs (around 4°C) require roughly 1.5 to 2 minutes more than room-temperature eggs. Our calculator adjusts for this 'thermal starting line' automatically to ensure perfect results.",
+    },
+    {
+      question: "What causes the unappealing green ring on yolks?",
+      answer:
+        "The green ring is ferrous sulfide. It forms when the sulfur in the egg white reacts with the iron in the yolk due to overcooking or high heat. To prevent it, use our timer and immediately submerge the egg in an ice bath.",
+    },
+    {
+      question: "Why are some eggs so difficult to peel?",
+      answer:
+        "Very fresh eggs have a lower pH, making the membrane stick tightly to the shell. For easy peeling, use eggs that are 1-2 weeks old, drop them into already boiling water, and use an ice bath after cooking.",
+    },
+  ],
+  howTo: [
+    {
+      name: "Define starting conditions",
+      text: "Select your egg's initial temperature (Fridge vs. Room) and size (S to XL) to establish the thermodynamic base.",
+    },
+    {
+      name: "Adjust for your location",
+      text: "Enter your altitude or use our automatic geolocation to calibrate the exact boiling point of water at your current pressure.",
+    },
+    {
+      name: "Start the precision timer",
+      text: "Begin the countdown. Our tool calculates the precise seconds needed to denature specific egg proteins.",
+    },
+    {
+      name: "Apply the ice bath",
+      text: "When the timer ends, immediately move the egg to ice-cold water. This 'thermal shock' stops residual cooking and ensures easy peeling.",
+    },
+  ],
+  bibliographyTitle: "Scientific Sources & Thermodynamics",
+  bibliography: [
+    {
+      name: "Charles D. H. Williams - The Physics of Boiling an Egg",
+      url: "https://newton.ex.ac.uk/teaching/CDHW/Egg/",
+    },
+    {
+      name: "The Food Lab: The Science of Hard Boiled Eggs",
+      url: "https://www.seriouseats.com/the-food-lab-hard-boiled-eggs-recipe",
+    },
+    {
+      name: "Exploratorium - Egg Science and Protein Denaturation",
+      url: "https://www.exploratorium.edu/explore/cooking/egg-science",
+    },
+  ],
+  seo: [
+    {
+      type: "title",
+      text: "Master Guide for Precision Egg Boiling and Thermodynamics",
+      level: 2,
+    },
+    {
+      type: "paragraph",
+      html: "Boiling an egg is a classic exercise in <strong>applied thermodynamics</strong>. Achieving a specific texture is about controlling the rate of heat transfer from the boiling water to the core of the egg, which varies based on pressure, mass, and starting energy.",
+    },
+    {
+      type: "stats",
+      columns: 4,
+      items: [
+        {
+          value: "62°C",
+          label: "White Sets",
+          icon: "mdi:egg-outline",
+        },
+        {
+          value: "68°C",
+          label: "Yolk Sets",
+          icon: "mdi:egg-fried",
+        },
+        {
+          value: "-1°C",
+          label: "Boil Drop / 300m",
+          icon: "mdi:mountain",
+        },
+        {
+          value: "0s",
+          label: "Timing Margin",
+          icon: "mdi:timer-check-outline",
+        },
+      ],
+    },
+    {
+      type: "title",
+      text: "Comparison of Egg Boiling Stages",
+      level: 3,
+    },
+    {
+      type: "comparative",
+      columns: 3,
+      items: [
+        {
+          title: "Soft Boiled (Dippy)",
+          icon: "mdi:coffee-outline",
+          description: "Partially set whites and completely liquid, golden yolk.",
+          points: [
+            "Delicate silken texture",
+            "Perfect for toast soldiers",
+            "Quick 3-5 min cook time",
+            "Highest peeling difficulty",
+          ],
+        },
+        {
+          title: "Mollet (Jammy)",
+          icon: "mdi:water-percent",
+          description: "Firm, established whites with a custard-like, thick yolk.",
+          highlight: true,
+          points: [
+            "The culinary gold standard",
+            "Honey-thick yolk texture",
+            "Elastic, resilient whites",
+            "Ideal for bowls and ramen",
+          ],
+        },
+        {
+          title: "Hard Boiled",
+          icon: "mdi:circle-slice-8",
+          description: "Completely set proteins with a solid, tender yolk.",
+          points: [
+            "Solid and opaque center",
+            "Easiest to transport/peel",
+            "Mainstay for deviled eggs",
+            "Requires instant cooling",
+          ],
+        },
+      ],
+    },
+    {
+      type: "title",
+      text: "Water Boiling Points by Altitude",
+      level: 3,
+    },
+    {
+      type: "table",
+      headers: [
+        "City / Altitude",
+        "Elevation (m)",
+        "Boiling Point (°C)",
+        "Added Time",
+      ],
+      rows: [
+        ["Sea Level (Coast)", "0m", "100°C", "0s"],
+        ["Denver, USA", "1600m", "94.5°C", "+55s"],
+        ["Mexico City", "2240m", "92.6°C", "+75s"],
+        ["La Paz, Bolivia", "3640m", "88.1°C", "+140s"],
+      ],
+    },
+    {
+      type: "diagnostic",
+      variant: "warning",
+      title: "Hard to Peel or Green Yolk Syndrome?",
+      html: "The green ring is <strong>ferrous sulfide</strong> caused by overcooking (sulfur from whites reacting with iron in yolks). If eggs won't peel, they are too fresh; a low pH causes the membrane to fuse to the shell. Use week-old eggs and a vigorous ice bath.",
+    },
+    {
+      type: "title",
+      text: "Egg Science Technical Glossary",
+      level: 3,
+    },
+    {
+      type: "glossary",
+      items: [
+        {
+          term: "Ovotransferrin",
+          definition:
+            "The egg white protein that sets first at 62°C, providing the initial white structure.",
+        },
+        {
+          term: "Ovalbumin",
+          definition:
+            "The major egg protein requiring higher heat (80°C) to reach full solidification.",
+        },
+        {
+          term: "Atmospheric Pressure",
+          definition:
+            "The external force affecting boiling temperature; lower pressure equals a lower boil.",
+        },
+        {
+          term: "Thermal Shock",
+          definition:
+            "The process of rapid cooling to instantly halt residual internal heat transfer.",
+        },
+      ],
+    },
+    {
+      type: "tip",
+      title: "The Vinegar and Salt Hook",
+      html: "Add vinegar to your boiling water. If an egg cracks, the acid will cause the leaking white to coagulate instantly, plugging the hole and preventing a 'web' from forming.",
+    },
+    {
+      type: "paragraph",
+      html: "Our calculator utilizes the Charles Williams equation to calibrate every second based on your location and fridge temperature.",
+    },
+  ],
+  schemas: [],
+};