@jjlmoya/utils-science 1.42.0 → 1.43.0

package/src/tool/dyson-sphere-energy-capture/i18n/zh.ts

@@ -2,21 +2,45 @@ import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 
 const slug = 'dyson-sphere-energy-capture';
-const title = 'Dyson Sphere Energy Capture Simulator';
-const description = 'Compare Dyson collectors around different stars with estimates for power, radius, mass, and Kardashev coverage.';
+const title = '戴森球能量捕获模拟器';
+const description = '通过捕获功率、轨道半径、材料质量和卡尔达肖夫尺度覆盖率，比较戴森群、环形、刚性壳和静态镜云等巨型结构设计。';
 
 const howTo = [
-  { name: 'Choose a star', text: 'Select a representative star to set luminosity and mass.' },
-  { name: 'Choose a collector', text: 'Compare swarm, ring, shell, and statite cloud designs.' },
-  { name: 'Adjust controls', text: 'Set coverage, operating temperature, and target Kardashev rating.' },
-  { name: 'Review output', text: 'Read captured power, radius, mass, area, and target coverage.' },
+  {
+    name: '选择恒星类型',
+    text: '选择M型矮星、类太阳G型星、A型星、红巨星或蓝巨星，以设定光度和质量。',
+  },
+  {
+    name: '选择收集器结构',
+    text: '比较戴森群、赤道环、刚性壳和静态镜云的不同捕获假设。',
+  },
+  {
+    name: '调整覆盖率和温度',
+    text: '改变覆盖率和工作温度，观察捕获功率和安全轨道半径如何变化。',
+  },
+  {
+    name: '查看卡尔达肖夫目标',
+    text: '使用卡尔达肖夫目标滑块估算达到所选文明能量等级所需的恒星输出比例。',
+  },
 ];
 
 const faq = [
-  { question: 'What is a Dyson sphere?', answer: 'It is a family of concepts for collecting a large fraction of stellar luminosity.' },
-  { question: 'Why include several structures?', answer: 'Different structures have different efficiency, mass, and stability assumptions.' },
-  { question: 'What does target coverage show?', answer: 'It estimates the percentage of stellar output required for a selected Kardashev rating.' },
-  { question: 'Is this a precise design tool?', answer: 'No. It is an educational calculator for first-order physical intuition.' },
+  {
+    question: '戴森群是什么？',
+    answer: '戴森群是围绕恒星运行的大量独立收集器的集合，通常比刚性壳更具可行性。',
+  },
+  {
+    question: '为什么轨道半径会变化？',
+    answer: '轨道半径由收集器的工作温度和恒星光度共同决定。温度越高的收集器可以在更近的轨道上运行。',
+  },
+  {
+    question: '卡尔达肖夫评级是什么意思？',
+    answer: '它将捕获的瓦特数转换为对数制的文明能量等级。',
+  },
+  {
+    question: '材料质量精确吗？',
+    answer: '不精确。这是基于面积、面密度和稳定性假设的教育性估算。',
+  },
 ];
 
 export const content: ToolLocaleContent = {
@@ -24,41 +48,41 @@ export const content: ToolLocaleContent = {
   title,
   description,
   ui: {
-    visualization: 'Dyson collector visualization',
-    starType: 'Star type',
-    structureType: 'Structure',
-    coverage: 'Collector coverage',
-    operatingTemp: 'Operating temperature',
-    kardashevTarget: 'Kardashev target',
-    kardashevRating: 'Current rating',
-    capturedPower: 'Captured power',
-    optimalRadius: 'Optimal radius',
-    targetCoverage: 'Target coverage',
-    materialMass: 'Material mass',
-    captureMeter: 'Target capture progress',
-    statusReady: 'Adjust the system to estimate collector demand.',
-    statusUnderbuilt: 'Coverage is below the selected target.',
-    statusBalanced: 'Coverage is close to the selected target.',
-    statusExtreme: 'This configuration overshoots the target.',
-    orbitalPeriod: 'Orbital period',
-    collectorArea: 'Collector area',
-    mercuryMasses: '{value} Mercury masses',
-    kilograms: '{value} kg',
-    daysUnit: '{value} days',
-    starMDwarf: 'M dwarf',
-    starSun: 'Sun-like G star',
-    starA: 'A-type star',
-    starRedGiant: 'Red giant',
-    starBlueGiant: 'Blue giant',
-    structureSwarm: 'Dyson swarm',
-    structureRing: 'Equatorial ring',
-    structureShell: 'Rigid shell',
-    structureStatite: 'Statite mirror cloud',
+    visualization: '戴森收集器可视化',
+    starType: '恒星类型',
+    structureType: '结构',
+    coverage: '收集器覆盖率',
+    operatingTemp: '工作温度',
+    kardashevTarget: '卡尔达肖夫目标',
+    kardashevRating: '当前评级',
+    capturedPower: '捕获功率',
+    optimalRadius: '最优半径',
+    targetCoverage: '目标覆盖率',
+    materialMass: '材料质量',
+    captureMeter: '目标捕获进度',
+    statusReady: '调整系统以估算收集器需求。',
+    statusUnderbuilt: '覆盖率低于所选目标。',
+    statusBalanced: '覆盖率接近所选目标。',
+    statusExtreme: '此配置大幅超过目标。',
+    orbitalPeriod: '轨道周期',
+    collectorArea: '收集器面积',
+    mercuryMasses: '{value} 水星质量',
+    kilograms: '{value} 千克',
+    daysUnit: '{value} 天',
+    starMDwarf: 'M型矮星',
+    starSun: '类太阳G型星',
+    starA: 'A型星',
+    starRedGiant: '红巨星',
+    starBlueGiant: '蓝巨星',
+    structureSwarm: '戴森群',
+    structureRing: '赤道环',
+    structureShell: '刚性壳',
+    structureStatite: '静态镜云',
   },
   seo: [
-    { type: 'title', text: 'Dyson Sphere Energy Capture Simulator', level: 2 },
-    { type: 'paragraph', html: 'This tool estimates power and material requirements for several Dyson megastructure concepts.' },
-    { type: 'paragraph', html: 'It is useful for learning how stellar luminosity, temperature limits, and coverage affect large-scale energy capture.' },
+    { type: 'title', text: '戴森球能量捕获模拟器', level: 2 },
+    { type: 'paragraph', html: '本模拟器使用一阶恒星能量计算，比较戴森群、环形、壳体和静态云等概念。' },
+    { type: 'paragraph', html: '估算捕获功率、热轨道半径、收集器面积、轨道周期、材料质量以及达到卡尔达肖夫目标所需的覆盖率。' },
   ],
   faq,
   bibliography,

package/src/tool/epidemic-sir-simulator/bibliography.astro

@@ -0,0 +1,15 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { epidemicSirSimulator } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props {
+  locale?: KnownLocale;
+}
+
+const { locale = 'en' } = Astro.props;
+const content = await epidemicSirSimulator.i18n[locale]?.();
+---
+
+{content && <SharedBibliography links={content.bibliography} />}
+

package/src/tool/epidemic-sir-simulator/bibliography.ts

@@ -0,0 +1,37 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'Kermack and McKendrick, A contribution to the mathematical theory of epidemics',
+    url: 'https://royalsocietypublishing.org/doi/10.1098/rspa.1927.0118',
+  },
+  {
+    name: 'Centers for Disease Control and Prevention, Principles of Epidemiology',
+    url: 'https://www.cdc.gov/csels/dsepd/ss1978/index.html',
+  },
+  {
+    name: 'World Health Organization, Vaccines and immunization',
+    url: 'https://www.who.int/health-topics/vaccines-and-immunization',
+  },
+  {
+    name: 'Anderson and May, Infectious Diseases of Humans: Dynamics and Control',
+    url: 'https://global.oup.com/academic/product/infectious-diseases-of-humans-9780198540403',
+  },
+  {
+    name: 'Keeling and Rohani, Modeling Infectious Diseases in Humans and Animals',
+    url: 'https://press.princeton.edu/books/hardcover/9780691116174/modeling-infectious-diseases-in-humans-and-animals',
+  },
+  {
+    name: 'WHO, Estimating mortality from COVID-19',
+    url: 'https://www.who.int/news-room/commentaries/detail/estimating-mortality-from-covid-19',
+  },
+  {
+    name: 'Fine, Herd immunity: history, theory, practice',
+    url: 'https://pmc.ncbi.nlm.nih.gov/articles/PMC1447608/',
+  },
+  {
+    name: 'Delamater et al., Complexity of the Basic Reproduction Number (R0)',
+    url: 'https://pmc.ncbi.nlm.nih.gov/articles/PMC6537322/',
+  },
+];
+

package/src/tool/epidemic-sir-simulator/component.astro

@@ -0,0 +1,384 @@
+---
+import './epidemic-sir-simulator.css';
+
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div
+  class="sir-lab"
+  id="sir-lab"
+  data-day-label={ui.dayLabel}
+  data-days-unit={ui.daysUnit}
+  data-infectious-label={ui.infectiousLabel}
+  data-re-label={ui.reLabel}
+>
+  <div class="sir-card">
+    <header class="sir-map-top">
+      <div>
+        <p>{ui.liveScenario}</p>
+        <h2>{ui.curveChart}</h2>
+      </div>
+    </header>
+
+    <div class="sir-card-body">
+      <section class="sir-map" aria-label={ui.curveChart}>
+        <div class="sir-chart-shell">
+          <svg class="sir-chart" id="sir-chart" viewBox="0 0 760 430" role="img" aria-label={ui.curveChart}>
+            <defs>
+              <linearGradient id="sir-grid-fade" x1="0" x2="1" y1="0" y2="1">
+                <stop offset="0%" stop-color="#eef7f4" />
+                <stop offset="100%" stop-color="#ffffff" />
+              </linearGradient>
+            </defs>
+            <rect class="sir-chart-bg" x="0" y="0" width="760" height="430" rx="28"></rect>
+            <g class="sir-grid" id="sir-grid"></g>
+            <line class="sir-baseline" x1="40" x2="720" y1="364" y2="364"></line>
+            <path class="sir-area sir-area-susceptible" id="sir-area-susceptible"></path>
+            <path class="sir-area sir-area-infected" id="sir-area-infected"></path>
+            <path class="sir-area sir-area-recovered" id="sir-area-recovered"></path>
+            <path class="sir-line sir-line-susceptible" id="sir-line-susceptible"></path>
+            <path class="sir-line sir-line-infected" id="sir-line-infected"></path>
+            <path class="sir-line sir-line-recovered" id="sir-line-recovered"></path>
+            <path class="sir-line sir-line-deaths" id="sir-line-deaths"></path>
+            <g class="sir-day-marker" id="sir-day-marker">
+              <line y1="34" y2="364"></line>
+              <circle r="7"></circle>
+            </g>
+          </svg>
+          <div class="sir-readout" id="sir-readout" aria-hidden="true">
+            <strong id="sir-readout-day">{ui.dayLabel} 0</strong>
+            <span><i class="sir-key sir-key-s"></i><b id="sir-readout-s">0</b></span>
+            <span><i class="sir-key sir-key-i"></i><b id="sir-readout-i">0</b></span>
+            <span><i class="sir-key sir-key-r"></i><b id="sir-readout-r">0</b></span>
+          </div>
+        </div>
+
+        <div class="sir-timeline">
+          <input id="sir-day" type="range" min="0" max="160" value="80" aria-label={ui.inspectDay} />
+          <output id="sir-day-output">{ui.dayLabel} 80</output>
+        </div>
+
+        <div class="sir-legend" aria-label={ui.legend}>
+          <span><i class="sir-key sir-key-s"></i>{ui.susceptible}</span>
+          <span><i class="sir-key sir-key-i"></i>{ui.infected}</span>
+          <span><i class="sir-key sir-key-r"></i>{ui.recovered}</span>
+          <span><i class="sir-key sir-key-d"></i>{ui.deaths}</span>
+        </div>
+      </section>
+
+      <section class="sir-control-deck" aria-label={ui.controls}>
+        <div class="sir-control-header">
+          <div>
+            <p>{ui.controls}</p>
+            <strong>{ui.modelName}</strong>
+          </div>
+          <div class="sir-pill" id="sir-effective-r">{ui.reLabel} 0.00</div>
+        </div>
+
+        <div class="sir-metrics">
+          <div>
+            <span>{ui.peakInfected}</span>
+            <strong id="sir-peak">0</strong>
+          </div>
+          <div>
+            <span>{ui.peakDay}</span>
+            <strong id="sir-peak-day">0</strong>
+          </div>
+          <div>
+            <span>{ui.attackRate}</span>
+            <strong id="sir-attack">0%</strong>
+          </div>
+          <div>
+            <span>{ui.estimatedDeaths}</span>
+            <strong id="sir-deaths">0</strong>
+          </div>
+        </div>
+
+        <div class="sir-sliders">
+        <label class="sir-slider" for="sir-r0">
+          <span>{ui.r0}</span>
+          <output id="sir-r0-output">2.4</output>
+          <input id="sir-r0" type="range" min="0.6" max="7" step="0.1" value="2.4" />
+        </label>
+
+        <label class="sir-slider" for="sir-lethality">
+          <span>{ui.lethality}</span>
+          <output id="sir-lethality-output">1.0%</output>
+          <input id="sir-lethality" type="range" min="0" max="12" step="0.1" value="1" />
+        </label>
+
+        <label class="sir-slider" for="sir-vaccination">
+          <span>{ui.vaccination}</span>
+          <output id="sir-vaccination-output">35%</output>
+          <input id="sir-vaccination" type="range" min="0" max="95" step="1" value="35" />
+        </label>
+
+        <label class="sir-slider" for="sir-efficacy">
+          <span>{ui.vaccineEffectiveness}</span>
+          <output id="sir-efficacy-output">85%</output>
+          <input id="sir-efficacy" type="range" min="0" max="100" step="1" value="85" />
+        </label>
+
+        <label class="sir-slider" for="sir-infectious-days">
+          <span>{ui.infectiousDays}</span>
+          <output id="sir-infectious-output">7 {ui.daysUnit}</output>
+          <input id="sir-infectious-days" type="range" min="2" max="21" step="1" value="7" />
+        </label>
+
+        <label class="sir-slider" for="sir-initial">
+          <span>{ui.initialInfected}</span>
+          <output id="sir-initial-output">0.5%</output>
+          <input id="sir-initial" type="range" min="0.1" max="8" step="0.1" value="0.5" />
+        </label>
+        </div>
+      </section>
+    </div>
+  </div>
+</div>
+
+<script>
+  import { runSirSimulation } from './logic';
+
+  const root = document.getElementById('sir-lab');
+  const r0Input = document.getElementById('sir-r0') as HTMLInputElement | null;
+  const lethalityInput = document.getElementById('sir-lethality') as HTMLInputElement | null;
+  const vaccinationInput = document.getElementById('sir-vaccination') as HTMLInputElement | null;
+  const efficacyInput = document.getElementById('sir-efficacy') as HTMLInputElement | null;
+  const infectiousInput = document.getElementById('sir-infectious-days') as HTMLInputElement | null;
+  const initialInput = document.getElementById('sir-initial') as HTMLInputElement | null;
+  const dayInput = document.getElementById('sir-day') as HTMLInputElement | null;
+  const chart = document.getElementById('sir-chart') as unknown as SVGSVGElement | null;
+  const grid = document.getElementById('sir-grid');
+  const readout = document.getElementById('sir-readout');
+  const marker = document.getElementById('sir-day-marker');
+  const markerLine = marker?.querySelector('line');
+  const markerCircle = marker?.querySelector('circle');
+  const numberFormat = new Intl.NumberFormat('en', { maximumFractionDigits: 0 });
+  const storageKey = 'epidemic-sir-simulator:last-state';
+  const labels = {
+    day: root?.dataset.dayLabel ?? '',
+    days: root?.dataset.daysUnit ?? '',
+    infectious: root?.dataset.infectiousLabel ?? '',
+    re: root?.dataset.reLabel ?? '',
+  };
+
+  const paths = {
+    susceptible: document.getElementById('sir-line-susceptible'),
+    infected: document.getElementById('sir-line-infected'),
+    recovered: document.getElementById('sir-line-recovered'),
+    deaths: document.getElementById('sir-line-deaths'),
+    susceptibleArea: document.getElementById('sir-area-susceptible'),
+    infectedArea: document.getElementById('sir-area-infected'),
+    recoveredArea: document.getElementById('sir-area-recovered'),
+  };
+
+  function getValue(input: HTMLInputElement | null, fallback: number) {
+    return input ? Number(input.value) : fallback;
+  }
+
+  function trackedInputs() {
+    return [r0Input, lethalityInput, vaccinationInput, efficacyInput, infectiousInput, initialInput, dayInput];
+  }
+
+  function restoreState() {
+    try {
+      const raw = window.localStorage.getItem(storageKey);
+      if (!raw) return;
+      const state = JSON.parse(raw) as Record<string, string>;
+
+      trackedInputs().forEach((input) => {
+        if (!input || typeof state[input.id] !== 'string') return;
+        input.value = state[input.id];
+      });
+    } catch {
+      window.localStorage.removeItem(storageKey);
+    }
+  }
+
+  function saveState() {
+    const state: Record<string, string> = {};
+    trackedInputs().forEach((input) => {
+      if (!input) return;
+      state[input.id] = input.value;
+    });
+    window.localStorage.setItem(storageKey, JSON.stringify(state));
+  }
+
+  function scalePoint(day: number, value: number, days: number, population: number) {
+    const width = 680;
+    const height = 330;
+    const x = 40 + day / days * width;
+    const y = 364 - value / population * height;
+    return { x, y };
+  }
+
+  function makePath(values: number[], days: number, population: number) {
+    return values.map((value, index) => {
+      const point = scalePoint(index, value, days, population);
+      return `${index === 0 ? 'M' : 'L'}${point.x.toFixed(2)} ${point.y.toFixed(2)}`;
+    }).join(' ');
+  }
+
+  function makeArea(values: number[], days: number, population: number) {
+    const line = makePath(values, days, population);
+    return `${line} L720 364 L40 364 Z`;
+  }
+
+  function currentConfig(days: number, population: number) {
+    return {
+      population,
+      initialInfectedPercent: getValue(initialInput, 0.5),
+      r0: getValue(r0Input, 2.4),
+      infectiousDays: getValue(infectiousInput, 7),
+      vaccinationPercent: getValue(vaccinationInput, 35),
+      vaccineEffectiveness: getValue(efficacyInput, 85),
+      fatalityPercent: getValue(lethalityInput, 1),
+      days,
+    };
+  }
+
+  function setText(id: string, text: string) {
+    const node = document.getElementById(id);
+    if (!node) return;
+    node.classList.toggle('sir-value-long', text.length >= 6);
+    node.classList.toggle('sir-value-extra-long', text.length >= 8);
+    if (node.textContent === text) return;
+    node.textContent = text;
+    node.classList.remove('sir-value-flash');
+    node.getBoundingClientRect();
+    node.classList.add('sir-value-flash');
+  }
+
+  function retraceCurves() {
+    Object.values(paths).forEach((path) => {
+      if (!path || path.id.includes('area')) return;
+      path.style.animation = 'none';
+      path.getBoundingClientRect();
+      path.style.animation = '';
+    });
+  }
+
+  function positionSliderValue(input: HTMLInputElement | null, outputId: string) {
+    const output = document.getElementById(outputId);
+    if (!input || !output) return;
+    const min = Number(input.min);
+    const max = Number(input.max);
+    const value = Number(input.value);
+    const progress = (value - min) / (max - min);
+    output.style.setProperty('--value-x', `${Math.max(0, Math.min(1, progress)) * 100}%`);
+  }
+
+  function drawGrid() {
+    if (!grid || grid.childElementCount > 0) return;
+    const ns = 'http://www.w3.org/2000/svg';
+
+    for (let row = 0; row <= 4; row += 1) {
+      const line = document.createElementNS(ns, 'line');
+      const y = 34 + row * 82.5;
+      line.setAttribute('x1', '40');
+      line.setAttribute('x2', '720');
+      line.setAttribute('y1', y.toString());
+      line.setAttribute('y2', y.toString());
+      grid.append(line);
+    }
+
+    for (let column = 0; column <= 5; column += 1) {
+      const line = document.createElementNS(ns, 'line');
+      const x = 40 + column * 136;
+      line.setAttribute('x1', x.toString());
+      line.setAttribute('x2', x.toString());
+      line.setAttribute('y1', '34');
+      line.setAttribute('y2', '364');
+      grid.append(line);
+    }
+  }
+
+  function drawCurves(result: ReturnType<typeof runSirSimulation>, days: number, population: number) {
+    const susceptible = result.points.map((point) => point.susceptible);
+    const infected = result.points.map((point) => point.infected);
+    const recovered = result.points.map((point) => point.recovered + point.vaccinated);
+    const deaths = result.points.map((point) => point.deaths);
+
+    paths.susceptible?.setAttribute('d', makePath(susceptible, days, population));
+    paths.infected?.setAttribute('d', makePath(infected, days, population));
+    paths.recovered?.setAttribute('d', makePath(recovered, days, population));
+    paths.deaths?.setAttribute('d', makePath(deaths, days, population));
+    paths.susceptibleArea?.setAttribute('d', makeArea(susceptible, days, population));
+    paths.infectedArea?.setAttribute('d', makeArea(infected, days, population));
+    paths.recoveredArea?.setAttribute('d', makeArea(recovered, days, population));
+  }
+
+  function updateSliderOutputs() {
+    setText('sir-r0-output', getValue(r0Input, 2.4).toFixed(1));
+    setText('sir-lethality-output', `${getValue(lethalityInput, 1).toFixed(1)}%`);
+    setText('sir-vaccination-output', `${getValue(vaccinationInput, 35).toFixed(0)}%`);
+    setText('sir-efficacy-output', `${getValue(efficacyInput, 85).toFixed(0)}%`);
+    setText('sir-infectious-output', `${getValue(infectiousInput, 7).toFixed(0)} ${labels.days}`);
+    setText('sir-initial-output', `${getValue(initialInput, 0.5).toFixed(1)}%`);
+    positionSliderValue(r0Input, 'sir-r0-output');
+    positionSliderValue(lethalityInput, 'sir-lethality-output');
+    positionSliderValue(vaccinationInput, 'sir-vaccination-output');
+    positionSliderValue(efficacyInput, 'sir-efficacy-output');
+    positionSliderValue(infectiousInput, 'sir-infectious-output');
+    positionSliderValue(initialInput, 'sir-initial-output');
+  }
+
+  function updateMetrics(result: ReturnType<typeof runSirSimulation>) {
+    setText('sir-peak', numberFormat.format(result.summary.peakInfected));
+    setText('sir-peak-day', result.summary.peakDay.toString());
+    setText('sir-attack', `${(result.summary.attackRate * 100).toFixed(1)}%`);
+    setText('sir-deaths', numberFormat.format(result.summary.finalDeaths));
+    setText('sir-effective-r', `${labels.re} ${result.summary.effectiveR0.toFixed(2)}`);
+  }
+
+  function updateInspection(result: ReturnType<typeof runSirSimulation>, days: number, population: number) {
+    const inspectedDay = Math.min(days, getValue(dayInput, 80));
+    const inspected = result.points[inspectedDay] ?? result.points[0];
+    const infectedPoint = scalePoint(inspectedDay, inspected.infected, days, population);
+    markerLine?.setAttribute('x1', infectedPoint.x.toFixed(2));
+    markerLine?.setAttribute('x2', infectedPoint.x.toFixed(2));
+    markerCircle?.setAttribute('cx', infectedPoint.x.toFixed(2));
+    markerCircle?.setAttribute('cy', infectedPoint.y.toFixed(2));
+    setText('sir-day-output', `${labels.day} ${inspectedDay}: ${numberFormat.format(inspected.infected)} ${labels.infectious}`);
+    setText('sir-readout-day', `${labels.day} ${inspectedDay}`);
+    setText('sir-readout-s', numberFormat.format(inspected.susceptible));
+    setText('sir-readout-i', numberFormat.format(inspected.infected));
+    setText('sir-readout-r', numberFormat.format(inspected.recovered + inspected.vaccinated));
+
+    if (readout) {
+      const x = infectedPoint.x / 760 * 100;
+      readout.style.setProperty('--readout-x', `${Math.max(4, Math.min(76, x))}%`);
+      readout.style.setProperty('--readout-y', `${Math.max(12, Math.min(82, infectedPoint.y / 430 * 100))}%`);
+    }
+  }
+
+  function update() {
+    saveState();
+    const days = 160;
+    const population = 100000;
+    const result = runSirSimulation(currentConfig(days, population));
+    drawCurves(result, days, population);
+    updateSliderOutputs();
+    updateMetrics(result);
+    updateInspection(result, days, population);
+    retraceCurves();
+  }
+
+  drawGrid();
+  restoreState();
+  [r0Input, lethalityInput, vaccinationInput, efficacyInput, infectiousInput, initialInput, dayInput].forEach((input) => {
+    input?.addEventListener('input', update);
+  });
+  chart?.addEventListener('pointermove', (event) => {
+    if (!dayInput) return;
+    const rect = chart.getBoundingClientRect();
+    const localX = Math.max(40, Math.min(720, (event.clientX - rect.left) / rect.width * 760));
+    dayInput.value = Math.round((localX - 40) / 680 * 160).toString();
+    update();
+  });
+  update();
+</script>

package/src/tool/epidemic-sir-simulator/entry.ts

@@ -0,0 +1,30 @@
+import type { ScienceToolEntry, ToolLocaleContent } from '../../types';
+
+export interface EpidemicSirSimulatorUI {
+  [key: string]: string;
+}
+
+export type EpidemicSirSimulatorLocaleContent = ToolLocaleContent<EpidemicSirSimulatorUI>;
+
+export const epidemicSirSimulator: ScienceToolEntry<EpidemicSirSimulatorUI> = {
+  id: 'epidemic-sir-simulator',
+  icons: { bg: 'mdi:virus-outline', fg: 'mdi:chart-bell-curve' },
+  i18n: {
+    de: () => import('./i18n/de').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    es: () => import('./i18n/es').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    it: () => import('./i18n/it').then((m) => m.content),
+    ja: () => import('./i18n/ja').then((m) => m.content),
+    ko: () => import('./i18n/ko').then((m) => m.content),
+    nl: () => import('./i18n/nl').then((m) => m.content),
+    pl: () => import('./i18n/pl').then((m) => m.content),
+    pt: () => import('./i18n/pt').then((m) => m.content),
+    ru: () => import('./i18n/ru').then((m) => m.content),
+    sv: () => import('./i18n/sv').then((m) => m.content),
+    tr: () => import('./i18n/tr').then((m) => m.content),
+    zh: () => import('./i18n/zh').then((m) => m.content),
+  },
+};
+