From 0d83815bf67b6fc5b7e7683a762cb009850c80b5 Mon Sep 17 00:00:00 2001
From: Sylvain PASUTTO <sylvainpasutto@gmail.com>
Date: Fri, 2 Jun 2023 18:34:22 +0200
Subject: [PATCH 1/2] Rain picto

---
 npm-shrinkwrap.json      |  4 ++--
 src/components/parcel.js | 17 ++++++++++++++++-
 src/components/skewt.js  |  7 ++++---
 src/plugin.less          |  4 ++++
 src/selectors/skewt.js   |  9 +++++++++
 5 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json
index ec29dbb..dccd171 100644
--- a/npm-shrinkwrap.json
+++ b/npm-shrinkwrap.json
@@ -1,12 +1,12 @@
 {
   "name": "windy-plugin-sounding",
-  "version": "1.5.2",
+  "version": "1.5.4",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "windy-plugin-sounding",
-      "version": "1.5.2",
+      "version": "1.5.4",
       "license": "MIT",
       "dependencies": {
         "preact": "^10.13.1",
diff --git a/src/components/parcel.js b/src/components/parcel.js
index b83b1f7..70c455e 100644
--- a/src/components/parcel.js
+++ b/src/components/parcel.js
@@ -2,7 +2,7 @@ import { PureComponent } from "./pure";
 // eslint-disable-next-line no-unused-vars
 import { h } from "preact";
 
-export function Parcel({ parcel, width, line, pToPx, formatAltitude }) {
+export function Parcel({ parcel, width, line, pToPx, formatAltitude, params }) {
   const { trajectory, isohume, elevThermalTop, pThermalTop, pCloudTop } = parcel;
   const parts = [];
   if (trajectory) {
@@ -14,6 +14,9 @@ export function Parcel({ parcel, width, line, pToPx, formatAltitude }) {
         <Cumulus x={width} y={thtY} />,
         <line class="boundary" y1={ctY} y2={ctY} x2={width} />
       );
+      if (params.rain) {
+        parts.push(<RainDrop x={width} y={thtY} />);
+      }
     }
     parts.push(
       <line class="boundary" y1={thtY} y2={thtY} x2={width} />,
@@ -50,3 +53,15 @@ class Cumulus extends PureComponent {
     );
   }
 }
+
+export class RainDrop extends PureComponent {
+  render({ x, y }) {
+    return (
+      <path
+        class="raindrop"
+        transform={`translate(${x - 36 + 15}, ${y - 36 + 25}) scale(0.2)`}
+        d="M26.4562,52.9128c10.248,0,18.5862-8.3362,18.5862-18.5836c0-10.036-17.4188-32.8138-18.1606-33.7782L26.4562,0l-0,0 c-0,0-18.1604,23.742-18.1604,33.7764C7.8704,44.5766,16.2084,52.9128,26.4562,52.9128"
+      />
+    );
+  }
+}
diff --git a/src/components/skewt.js b/src/components/skewt.js
index 3947fd8..50aba04 100644
--- a/src/components/skewt.js
+++ b/src/components/skewt.js
@@ -3,7 +3,7 @@ import * as math from "../math";
 
 import { GRAPH_BOTTOM_MARGIN_PX } from "../selectors/sounding";
 // eslint-disable-next-line no-unused-vars
-import { Parcel } from "../components/parcel";
+import { Parcel, RainDrop } from "../components/parcel";
 import { PureComponent } from "./pure";
 // eslint-disable-next-line no-unused-vars
 import { h } from "preact";
@@ -108,7 +108,7 @@ export class SkewT extends PureComponent {
             {[-70, -60, -50, -40, -30, -20, -10, 0, 10, 20, 30, 40].map((t) => (
               <IsoTherm temp={t + 273.15} {...{ height, pToPx, line }} />
             ))}
-            {parcel && <Parcel {...{ parcel, width, height, line, pToPx, formatAltitude }} />}
+            {parcel && <Parcel {...{ parcel, width, height, line, pToPx, formatAltitude, params }} />}
             <TemperatureAxis
               width={width}
               height={height}
@@ -124,6 +124,7 @@ export class SkewT extends PureComponent {
               pSfc={pSfc}
               highClouds={zoom}
             />
+            {params.rain && !parcel && <RainDrop x={width+9} y={26} />}
             <AltitudeAxis width={width} pAxisToPx={pAxisToPx} step={ghAxisStep} metric={ghMetric} />
           </g>
           <path class="line temperature" d={line(math.zip(params.temp, params.level))} />
@@ -276,7 +277,7 @@ const Clouds = ({ width, cloudCover, pToPx, pSfc, highClouds }) => {
       <text
         class="tick"
         y={30 - 5}
-        x={width - 5}
+        x={width - 15}
         text-anchor="end"
         filter="url(#whiteOutlineEffect)"
       >
diff --git a/src/plugin.less b/src/plugin.less
index e692bfc..03beaf3 100755
--- a/src/plugin.less
+++ b/src/plugin.less
@@ -117,6 +117,10 @@
       fill: ivory;
     }
 
+    .raindrop {
+      fill: blue;
+    }
+
     .line {
       pointer-events: none;
       stroke-width: 3;
diff --git a/src/selectors/skewt.js b/src/selectors/skewt.js
index d5403f4..82b73f1 100644
--- a/src/selectors/skewt.js
+++ b/src/selectors/skewt.js
@@ -59,6 +59,15 @@ export const params = createSelector(forecasts, timestamp, pMin, (forecasts, tim
   });
 
   params.level = levels;
+  params.snow = false;
+  params.rain = false;
+  const nextfc = forecasts.forecast.data.ts.findIndex((t) => t >= timestamp);
+  if (next != -1) {
+    const previousfc = Math.max(0, next - 1);
+    const nearestfc = forecasts.forecast.data.ts[nextfc] - timestamp > timestamp - forecasts.forecast.data.ts[previousfc] ? previousfc : nextfc;
+    params.rain = forecasts.forecast.data.rain[nearestfc] > 0;
+    params.snow = forecasts.forecast.data.snow[nearestfc] > 0;
+  }
 
   const wind = params.wind_u.map((u, index) => {
     const v = params.wind_v[index];

From f4f14ca31552b6e9a277bcb5aad5977bd03aea2d Mon Sep 17 00:00:00 2001
From: Sylvain PASUTTO <sylvainpasutto@gmail.com>
Date: Tue, 6 Jun 2023 08:36:03 +0200
Subject: [PATCH 2/2] Rain visualisation : corrections

---
 src/components/parcel.js | 4 ++--
 src/components/skewt.js  | 2 +-
 src/selectors/skewt.js   | 3 +--
 3 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/parcel.js b/src/components/parcel.js
index 70c455e..5ad8a86 100644
--- a/src/components/parcel.js
+++ b/src/components/parcel.js
@@ -2,7 +2,7 @@ import { PureComponent } from "./pure";
 // eslint-disable-next-line no-unused-vars
 import { h } from "preact";
 
-export function Parcel({ parcel, width, line, pToPx, formatAltitude, params }) {
+export function Parcel({ parcel, width, line, pToPx, formatAltitude, rain }) {
   const { trajectory, isohume, elevThermalTop, pThermalTop, pCloudTop } = parcel;
   const parts = [];
   if (trajectory) {
@@ -14,7 +14,7 @@ export function Parcel({ parcel, width, line, pToPx, formatAltitude, params }) {
         <Cumulus x={width} y={thtY} />,
         <line class="boundary" y1={ctY} y2={ctY} x2={width} />
       );
-      if (params.rain) {
+      if (rain) {
         parts.push(<RainDrop x={width} y={thtY} />);
       }
     }
diff --git a/src/components/skewt.js b/src/components/skewt.js
index 50aba04..269a2aa 100644
--- a/src/components/skewt.js
+++ b/src/components/skewt.js
@@ -108,7 +108,7 @@ export class SkewT extends PureComponent {
             {[-70, -60, -50, -40, -30, -20, -10, 0, 10, 20, 30, 40].map((t) => (
               <IsoTherm temp={t + 273.15} {...{ height, pToPx, line }} />
             ))}
-            {parcel && <Parcel {...{ parcel, width, height, line, pToPx, formatAltitude, params }} />}
+            {parcel && <Parcel {...{ parcel, width, height, line, pToPx, formatAltitude, rain: params.rain }} />}
             <TemperatureAxis
               width={width}
               height={height}
diff --git a/src/selectors/skewt.js b/src/selectors/skewt.js
index 82b73f1..41964d9 100644
--- a/src/selectors/skewt.js
+++ b/src/selectors/skewt.js
@@ -62,11 +62,10 @@ export const params = createSelector(forecasts, timestamp, pMin, (forecasts, tim
   params.snow = false;
   params.rain = false;
   const nextfc = forecasts.forecast.data.ts.findIndex((t) => t >= timestamp);
-  if (next != -1) {
+  if (nextfc != -1) {
     const previousfc = Math.max(0, next - 1);
     const nearestfc = forecasts.forecast.data.ts[nextfc] - timestamp > timestamp - forecasts.forecast.data.ts[previousfc] ? previousfc : nextfc;
     params.rain = forecasts.forecast.data.rain[nearestfc] > 0;
-    params.snow = forecasts.forecast.data.snow[nearestfc] > 0;
   }
 
   const wind = params.wind_u.map((u, index) => {