gitadmin/sunscope
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

5.4.0

Browse Source 
Restructure
New Journal entries
Colour tabs update with wind
This commit is contained in:
fraxle
2026-08-31 15:12:45 +01:00
parent 47818fba33
commit 71860b9dd9
40 changed files with 3430 additions and 443 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/js/components.js
+40 -3
View File
@@ -1281,7 +1281,12 @@ export function ScopeReticle({ value, cat, loading, elev = 0, dt = new Date(), g
// heavy snow (- 0.5cm/h) - 2 flakes
// mixed - 1 drop + 1 flake
// -------------------------------------------------------------------
export function PrecipIcon({ precip = 0, snow = 0, size = 28, filled = false }) {
// drops - optional override for the rain-drop count (1-3). The day tabs
// pass this because their intensity is a blend of amount AND
// forecast probability, not amount alone (see the "two rain
// numbers" block in components/DayTabs.js). Callers that only have
// an mm/h figure omit it and get the amount-derived bands above.
export function PrecipIcon({ precip = 0, snow = 0, size = 28, filled = false, drops = null }) {
const r = size / 2;
const hasRain = precip > 0;
const hasSnow = snow > 0;
@@ -1321,7 +1326,9 @@ export function PrecipIcon({ precip = 0, snow = 0, size = 28, filled = false })
}
// Rain intensity - number of drops
const rainDrops = !hasRain ? 0 : precip < 1 ? 1 : precip < 4 ? 2 : 3;
const rainDrops = !hasRain ? 0
: drops != null ? Math.max(1, Math.min(3, drops))
: precip < 1 ? 1 : precip < 4 ? 2 : 3;
// Snow intensity - number of flakes
const snowFlakes = !hasSnow ? 0 : snow < 0.5 ? 1 : 2;
const fr = size * 0.08; // flake arm length
@@ -1346,7 +1353,7 @@ export function PrecipIcon({ precip = 0, snow = 0, size = 28, filled = false })
: hasRain
? Array.from({ length: rainDrops }, (_, i) => html`
<${Fragment} key=${i}>
${rainStroke(spacing * (i + 1), size * 0.53, precip >= 4)}
${rainStroke(spacing * (i + 1), size * 0.53, rainDrops >= 3)}
</>`)
: Array.from({ length: snowFlakes }, (_, i) =>
flake(spacing * (i + 1), size * 0.66, fr)
@@ -1425,6 +1432,36 @@ export function FogIcon({ size = 30 }) {
</svg>`;
}
// WINDICON - Brass Line gust glyph for the day-tab wind badge. Body paths are
// Lucide's "wind" icon (ISC licence) on its native 24x24 grid, same approach
// as CarIcon. Gale-force and above (tier >= 3) swap the brass/ink pairing for
// a colder storm blue so the step up from "blustery" is visible at a glance.
// -------------------------------------------------------------------
// halo - draws each gust line twice, a wider white stroke underneath the
// coloured one. Needed when the glyph is overlaid on the cloud/rain
// icon: without it the two line drawings tangle into one another and
// neither reads. Costs nothing when drawn on a flat tab background.
export function WindIcon({ size = 30, tier = 2, halo = false }) {
const severe = tier >= 3;
const lead = severe ? '#2f5d82' : '#c8922a';
const trail = severe ? '#3a6a92' : '#2a1a08';
const gusts = [
{ d: 'M17.7 7.7a2.5 2.5 0 1 1 1.8 4.3H2', stroke: lead },
{ d: 'M9.6 4.6A2 2 0 1 1 11 8H2', stroke: trail },
{ d: 'M12.6 19.4A2 2 0 1 0 14 16H2', stroke: trail },
];
return html`
<svg width=${size} height=${size} viewBox="0 0 24 24" fill="none"
style=${{ flexShrink: 0, display: 'inline-block', verticalAlign: 'middle', overflow: 'visible' }}>
<g stroke-linecap="round" stroke-linejoin="round">
${halo && gusts.map((p, i) => html`
<path key=${'h' + i} d=${p.d} stroke="#fdf6e8" stroke-width="4.4" opacity="0.92" />`)}
${gusts.map((p, i) => html`
<path key=${i} d=${p.d} stroke=${p.stroke} stroke-width="1.9" />`)}
</g>
</svg>`;
}
export function IceIcon({ size = 30 }) {
const icy = '#3f73c4';
return html`