@jjlmoya/utils-drones 1.14.0 → 1.16.0

package/src/tool/drone-flight-time/i18n/zh.ts

@@ -1,5 +1,6 @@
 import type { DroneFlightTimeLocaleContent } from '../index';
 import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
+import { bibliography } from '../bibliography';
 
 const slug = 'drone-flight-time-calculator';
 const title = '无人机飞行时间计算器用于评估LiPo LiIon续航';
@@ -81,11 +82,7 @@ export const content: DroneFlightTimeLocaleContent = {
   slug,
   title,
   description,
-  faqTitle: '常见问题解答',
-  bibliographyTitle: '参考文献',
   ui: {
-    faqTitle: '常见问题解答',
-    bibliographyTitle: '参考文献',
     batterySpecs: '电池规格',
     capacity: '电池容量',
     voltage: '电压 (S 电芯)',
@@ -229,11 +226,7 @@ export const content: DroneFlightTimeLocaleContent = {
     },
   ],
   faq: faqItems,
-  bibliography: [
-    { name: '欧洲航空局 (EASA) 有关于各种类民用级航空守则', url: 'https://www.easa.europa.eu/en/domains/civil-drones' },
-    { name: 'ArduPilot 全面百科', url: 'https://ardupilot.org/copter/' },
-    { name: '关于电池系统大科普学术指南网', url: 'https://batteryuniversity.com/' },
-  ],
+  bibliography,
   howTo: howToSteps,
   schemas,
 };

package/src/tool/drone-flight-time/seo.astro

@@ -1,5 +1,5 @@
 ---
-import { SEOArticle, SEOTitle, SEOList, SEOTip } from '@jjlmoya/utils-shared';
+import { SEORenderer } from '@jjlmoya/utils-shared';
 import { droneFlightTime } from './index';
 import type { KnownLocale } from '../../types';
 
@@ -12,20 +12,4 @@ const content = await droneFlightTime.i18n[locale]?.();
 if (!content) return null;
 ---
 
-<SEOArticle>
-  {content.seo.map((section: any) => {
-    if (section.type === 'title') {
-      return <SEOTitle title={section.text} level={section.level || 2} />;
-    }
-    if (section.type === 'paragraph') {
-      return <p set:html={section.html} />;
-    }
-    if (section.type === 'list') {
-      return <SEOList items={section.items} />;
-    }
-    if (section.type === 'tip') {
-      return <SEOTip title="Consejos">{section.html}</SEOTip>;
-    }
-    return null;
-  })}
-</SEOArticle>
+{content.seo?.length > 0 && <SEORenderer content={{ locale, sections: content.seo }} />}

package/src/tool/drone-power-analyzer/bibliography.astro

@@ -0,0 +1,6 @@
+---
+import { Bibliography as BibliographyComponent } from '@jjlmoya/utils-shared';
+import { bibliography } from './bibliography';
+---
+
+<BibliographyComponent links={bibliography} />

package/src/tool/drone-power-analyzer/bibliography.ts

@@ -0,0 +1,7 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  { name: 'GetFPV - Understanding Thrust to Weight Ratio', url: 'https://rcdrone.top/blogs/articles/fpv-compute-thrust-to-weight' },
+  { name: 'Oscar Liang - Drone Motor Database & Specs', url: 'https://oscarliang.com/table-prop-motor-lipo-weight/' },
+  { name: 'ArduPilot - Multirotor Power & Efficiency', url: 'https://ardupilot.org/plane/docs/drivecalculator-guide.html' },
+];

package/src/tool/drone-power-analyzer/component.astro

@@ -0,0 +1,210 @@
+---
+const { ui } = Astro.props;
+import PowerGauge from "./components/PowerGauge.astro";
+import MotorConfig from "./components/MotorConfig.astro";
+import WeightConfig from "./components/WeightConfig.astro";
+import FlightProfile from "./components/FlightProfile.astro";
+---
+
+<div class="power-analyzer-ui" data-ui={JSON.stringify(ui)}>
+  <div class="tech-mega-card">
+    <div class="card-grid">
+      <div class="config-sidebar">
+        <MotorConfig {ui} />
+        <WeightConfig {ui} />
+      </div>
+      <div class="main-display">
+        <PowerGauge {ui} />
+        <FlightProfile {ui} />
+      </div>
+    </div>
+  </div>
+</div>
+
+<script>
+  const container = document.querySelector(".power-analyzer-ui") as HTMLElement;
+  const uiData = JSON.parse(container.getAttribute("data-ui") || "{}") as Record<string, string>;
+
+  const motorCountSelect = document.getElementById("motorCount") as HTMLSelectElement;
+  const thrustInput = document.getElementById("thrustPerMotor") as HTMLInputElement;
+  const auwInput = document.getElementById("auw") as HTMLInputElement;
+  const unitToggle = document.getElementById("unitToggle") as HTMLInputElement;
+  const ratioDisplay = document.getElementById("ratioDisplay") as HTMLElement;
+  const ratioBadge = document.getElementById("ratioBadge") as HTMLElement;
+  const totalThrustDisplay = document.getElementById("totalThrust") as HTMLElement;
+  const gaugeNeedle = document.getElementById("gaugeNeedle") as unknown as SVGLineElement;
+  const profilesContainer = document.getElementById("profilesContainer") as HTMLElement;
+  const recommendationText = document.getElementById("recommendation-text") as HTMLElement;
+  const unitLabels = document.querySelectorAll(".unit") as NodeListOf<HTMLElement>;
+  const batteryChips = document.querySelectorAll(".battery-chip") as NodeListOf<HTMLElement>;
+
+  let currentUnit: "g" | "lbs" = "g";
+  const LBS_TO_G = 453.592;
+
+  const batteryWeightToKey: Record<string, string> = {
+    "182": "batteryName_tattu4s",
+    "231": "batteryName_tattu6s",
+    "118": "batteryName_gnb4s",
+    "205": "batteryName_gnb6s",
+  };
+
+  const addedBatteries: Set<string> = new Set();
+
+  const badgeMap: Record<number, { text: string; classes: string }> = {
+    0: { text: "badge_unstable", classes: "" },
+    3: { text: "badge_cinematic", classes: "optimal" },
+    5: { text: "badge_sweetSpot", classes: "optimal" },
+    7: { text: "badge_racing", classes: "racing" },
+    8: { text: "badge_extreme", classes: "racing" },
+  };
+
+  const recommendationMap: Record<number, string> = {
+    2: "recommendation_low",
+    4: "recommendation_cinematic",
+    5: "recommendation_freestyle",
+    7: "recommendation_racing",
+    99: "recommendation_extreme",
+  };
+
+  function calculate() {
+    const motorCount = parseInt(motorCountSelect.value);
+    let thrust = parseFloat(thrustInput.value) || 0;
+    let auw = parseFloat(auwInput.value) || 0;
+
+    if (currentUnit === "lbs") {
+      thrust *= LBS_TO_G;
+      auw *= LBS_TO_G;
+    }
+
+    const totalThrust = thrust * motorCount;
+    const ratio = auw > 0 ? totalThrust / auw : 0;
+
+    ratioDisplay.textContent = ratio.toFixed(2);
+    totalThrustDisplay.textContent = currentUnit === "lbs" ? `${(totalThrust / LBS_TO_G).toFixed(1)} lbs` : `${totalThrust.toFixed(0)} g`;
+
+    updateGauge(ratio);
+    updateProfiles(ratio);
+    updateRecommendation(ratio);
+  }
+
+  function updateGauge(ratio: number) {
+    const clampedRatio = Math.max(1, Math.min(ratio, 10));
+    let angle = 180 + ((clampedRatio - 1) / 9) * 180;
+    angle = Math.max(180, Math.min(angle, 360));
+    const rad = (angle * Math.PI) / 180;
+    const needleLength = 52;
+    const x2 = 100 + needleLength * Math.cos(rad);
+    const y2 = 70 + needleLength * Math.sin(rad);
+    gaugeNeedle.setAttribute("x2", x2.toString());
+    gaugeNeedle.setAttribute("y2", y2.toString());
+
+    ratioBadge.classList.remove("optimal", "racing");
+    const badgeThreshold = Object.keys(badgeMap).map(Number).sort((a, b) => b - a).find(t => ratio >= t) || 0;
+    const badge = badgeMap[badgeThreshold];
+    ratioBadge.textContent = uiData[badge.text] || "";
+    if (badge.classes) ratioBadge.classList.add(...badge.classes.split(" "));
+  }
+
+  function updateProfiles(ratio: number) {
+    const profiles = [
+      { key: "cinematicLabel", suitable: ratio > 2.0 },
+      { key: "freestyleLabel", suitable: ratio > 4.0 },
+      { key: "racingLabel", suitable: ratio > 5.5 },
+      { key: "proRacingLabel", suitable: ratio > 7.5 },
+    ];
+
+    profilesContainer.innerHTML = profiles
+      .map(p => `<div class="profile-card ${p.suitable ? "suitable" : "not-suitable"}"><div class="profile-name">${uiData[p.key] || ""}</div></div>`)
+      .join("");
+  }
+
+  function updateRecommendation(ratio: number) {
+    const threshold = Object.keys(recommendationMap).map(Number).sort((a, b) => a - b).find(t => ratio < t) || 99;
+    const key = recommendationMap[threshold];
+    const text = (uiData[key] || "").replace("{ratio}", ratio.toFixed(2));
+    recommendationText.textContent = text;
+  }
+
+  function toggleUnit() {
+    currentUnit = currentUnit === "g" ? "lbs" : "g";
+
+    const thrustVal = parseFloat(thrustInput.value) || 0;
+    const auwVal = parseFloat(auwInput.value) || 0;
+
+    if (currentUnit === "lbs") {
+      thrustInput.value = (thrustVal / LBS_TO_G).toFixed(1);
+      auwInput.value = (auwVal / LBS_TO_G).toFixed(1);
+    } else {
+      thrustInput.value = (thrustVal * LBS_TO_G).toFixed(0);
+      auwInput.value = (auwVal * LBS_TO_G).toFixed(0);
+    }
+
+    unitLabels.forEach(label => {
+      label.textContent = currentUnit === "g" ? "g" : "lbs";
+    });
+
+    batteryChips.forEach(chip => {
+      const weightG = parseFloat(chip.getAttribute("data-battery-weight")!);
+      const uiKey = batteryWeightToKey[weightG.toString()];
+      const batteryName = uiKey ? (uiData[uiKey] || "") : "";
+      chip.textContent = currentUnit === "lbs"
+        ? `${batteryName} (+${(weightG / LBS_TO_G).toFixed(1)} lbs)`
+        : `${batteryName} (+${weightG}g)`;
+    });
+
+    calculate();
+  }
+
+  motorCountSelect.addEventListener("change", calculate);
+  thrustInput.addEventListener("input", calculate);
+  auwInput.addEventListener("input", calculate);
+  unitToggle.addEventListener("change", toggleUnit);
+
+  const thrustSlider = document.querySelector('input[type="range"][min="100"][max="5000"]') as HTMLInputElement;
+  const auwSlider = document.querySelector('input[type="range"][min="50"][max="5000"]:last-of-type') as HTMLInputElement;
+
+  if (thrustSlider) {
+    thrustSlider.addEventListener("input", () => {
+      thrustInput.value = thrustSlider.value;
+      calculate();
+    });
+    thrustInput.addEventListener("input", () => {
+      thrustSlider.value = thrustInput.value;
+    });
+  }
+
+  if (auwSlider) {
+    auwSlider.addEventListener("input", () => {
+      auwInput.value = auwSlider.value;
+      calculate();
+    });
+    auwInput.addEventListener("input", () => {
+      auwSlider.value = auwInput.value;
+    });
+  }
+
+  document.querySelectorAll(".battery-chip").forEach((btn) => {
+    btn.addEventListener("click", () => {
+      const weightG = parseFloat(btn.getAttribute("data-battery-weight")!);
+      const weight = currentUnit === "lbs" ? weightG / LBS_TO_G : weightG;
+      const currentVal = parseFloat(auwInput.value) || 0;
+      const isAdded = addedBatteries.has(weightG.toString());
+
+      if (isAdded) {
+        auwInput.value = (currentVal - weight).toFixed(currentUnit === "lbs" ? 1 : 0);
+        addedBatteries.delete(weightG.toString());
+        btn.classList.remove("battery-chip-active");
+      } else {
+        auwInput.value = (currentVal + weight).toFixed(currentUnit === "lbs" ? 1 : 0);
+        addedBatteries.add(weightG.toString());
+        btn.classList.add("battery-chip-active");
+        auwInput.classList.add("pulse");
+        setTimeout(() => auwInput.classList.remove("pulse"), 600);
+      }
+
+      calculate();
+    });
+  });
+
+  calculate();
+</script>

package/src/tool/drone-power-analyzer/components/FlightProfile.astro

@@ -0,0 +1,37 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="flight-section">
+  <h3 class="flight-title">
+    {ui.flightProfiles || "Flight Profile Assessment"}
+  </h3>
+
+  <div id="profilesContainer" class="profiles-grid">
+    <div class="profile-card suitable">
+      <div class="profile-name">{ui.cinematicLabel || "Cinematic"}</div>
+    </div>
+    <div class="profile-card suitable">
+      <div class="profile-name">{ui.freestyleLabel || "Freestyle"}</div>
+    </div>
+    <div class="profile-card suitable">
+      <div class="profile-name">{ui.racingLabel || "Racing"}</div>
+    </div>
+    <div class="profile-card suitable">
+      <div class="profile-name">{ui.proRacingLabel || "Pro Racing"}</div>
+    </div>
+  </div>
+
+  <div class="recommendation-section">
+    <p class="recommendation-title">
+      {ui.recommendationLabel || "Flying Style Recommendation"}
+    </p>
+    <p id="recommendation-text" class="recommendation-text">
+      With a ratio of 2.00:1, this is ideal for heavy-lift cinematography with smooth, controlled movements.
+    </p>
+  </div>
+</div>

package/src/tool/drone-power-analyzer/components/MotorConfig.astro

@@ -0,0 +1,46 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="config-section">
+  <h3 class="section-title">
+    {ui.motorConfiguration || "Motor Configuration"}
+  </h3>
+
+  <div class="input-group">
+    <label for="motorCount">{ui.motorCount || "Motor Count"}</label>
+    <select id="motorCount">
+      <option value="4">{ui.quad || "Quad (4)"}</option>
+      <option value="6">{ui.hexa || "Hexa (6)"}</option>
+      <option value="8">{ui.octo || "Octo (8)"}</option>
+    </select>
+  </div>
+
+  <div class="input-group">
+    <label for="thrustPerMotor">{ui.thrustPerMotor || "Thrust per Motor"}</label>
+    <div class="input-with-unit">
+      <input
+        id="thrustPerMotor"
+        type="number"
+        min="100"
+        max="5000"
+        step="10"
+        value="600"
+      />
+      <span class="unit">{ui.thrustUnit || "g"}</span>
+    </div>
+    <input
+      type="range"
+      min="100"
+      max="5000"
+      step="10"
+      value="600"
+      class="thrust-slider"
+      onchange="document.getElementById('thrustPerMotor').value = this.value; document.getElementById('thrustPerMotor').dispatchEvent(new Event('input'));"
+    />
+  </div>
+</div>

package/src/tool/drone-power-analyzer/components/PowerGauge.astro

@@ -0,0 +1,48 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="gauge-container">
+  <div class="unit-toggle-global">
+    <input id="unitToggle" type="checkbox" class="unit-checkbox" />
+    <label for="unitToggle" class="unit-label-global">g / lbs</label>
+  </div>
+
+  <div class="gauge-wrapper">
+    <svg viewBox="0 0 200 160" class="gauge-svg">
+      <defs>
+        <linearGradient id="gaugeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+          <stop offset="0%" stop-color="#ef4444" />
+          <stop offset="33%" stop-color="#f97316" />
+          <stop offset="66%" stop-color="#22c55e" />
+          <stop offset="100%" stop-color="#6366f1" />
+        </linearGradient>
+      </defs>
+
+      <path d="M 40 70 A 60 60 0 1 1 160 70" fill="none" stroke="url(#gaugeGradient)" stroke-width="14" stroke-linecap="round" opacity="0.6" />
+
+      <g id="needleGroup">
+        <line id="gaugeNeedle" x1="100" y1="70" x2="160" y2="70" stroke="var(--pa-primary)" stroke-width="3" stroke-linecap="round" />
+      </g>
+
+      <circle cx="100" cy="70" r="8" fill="var(--pa-primary)" filter="drop-shadow(0 2px 4px rgba(0,0,0,0.3))" />
+    </svg>
+  </div>
+
+  <div class="ratio-display-main">
+    <span id="ratioDisplay" class="ratio-number-large">0.00</span>
+    <span class="ratio-label-large">:1</span>
+    <span id="ratioBadge" class="ratio-badge">Unstable</span>
+  </div>
+
+  <div class="gauge-info">
+    <div class="thrust-display">
+      <span class="thrust-label">{ui.totalThrust || "Total Thrust"}</span>
+      <span id="totalThrust" class="thrust-value">0g</span>
+    </div>
+  </div>
+</div>

package/src/tool/drone-power-analyzer/components/WeightConfig.astro

@@ -0,0 +1,49 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="config-section">
+  <h3 class="section-title">
+    {ui.weightConfiguration || "Weight"}
+  </h3>
+
+  <div class="input-group">
+    <label for="auw">{ui.auwLabel || "All-Up Weight (AUW)"}</label>
+    <div class="input-with-unit">
+      <input
+        id="auw"
+        type="number"
+        min="50"
+        max="5000"
+        step="10"
+        value="800"
+      />
+      <span class="unit">{ui.weightUnit || "g"}</span>
+    </div>
+    <input
+      type="range"
+      min="50"
+      max="5000"
+      step="10"
+      value="800"
+      class="auw-slider"
+      onchange="document.getElementById('auw').value = this.value; document.getElementById('auw').dispatchEvent(new Event('input'));"
+    />
+  </div>
+
+  <div class="battery-presets">
+    <p class="battery-title">
+      {ui.batteryPresets || "Quick Add"}
+    </p>
+    <div class="battery-chips">
+      <button class="battery-chip" data-battery-weight="182">{ui.presetTattu4s || "Tattu 4S"}</button>
+      <button class="battery-chip" data-battery-weight="231">{ui.presetTattu6s || "Tattu 6S"}</button>
+      <button class="battery-chip" data-battery-weight="118">{ui.presetGnb4s || "GNB 4S"}</button>
+      <button class="battery-chip" data-battery-weight="205">{ui.presetGnb6s || "GNB 6S"}</button>
+    </div>
+  </div>
+</div>