Fix lunar eclipse shadows for high res displays (#28)

* Improved start-up animation.
* Fixed bug in drawing lunar eclipse shadows on high pixel density displays. (Unfortunately, this bug has been lurking since 2018-08-13.)

Author: kshetline

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "svc-ng",
-  "version": "1.14.7",
+  "version": "1.14.8",
   "license": "MIT AND GPL-3.0-or-later",
   "author": "Kerry Shetline <kerry@shetline.com>",
   "scripts": {

package.json

@@ -4,7 +4,7 @@
   <div class="about-dialog">
     <img src="/assets/resources/svc_lunar_eclipse.png" alt="lunar eclipse" width="64" height="64">
     <h2>Sky View Café NP</h2>
-    Version 1.14.7<br><br>
+    Version 1.14.8<br><br>
     Copyright © 2016-2022 Kerry Shetline.
   </div>
 </p-dialog>

src/app/app.component.html

@@ -70,6 +70,7 @@ export class MoonDrawer {
     if (size === 0 && observer)
       size = ceil(solarSystem.getAngularDiameter(MOON, time_JDE, observer) * pixelsPerArcSec);
 
+    pixelsPerArcSec *= pixelRatio;
     size *= pixelRatio;
     // Make sure that the size is odd, so that one pixel can be the exact center of the image.
     size += (size + 1) % 2;
@@ -121,7 +122,7 @@ export class MoonDrawer {
     }
 
     // I'm going to treat the umbra and penumbra of the Earth as imaginary circular
-    // objects directly opposite from the Sun and located at the same distance from
+    // objects directly opposite to the Sun and located at the same distance from
     // the Earth as the Moon.
     //
     // If you can imagine the typical diagram of how umbral and penumbral shadows are
@@ -145,8 +146,8 @@ export class MoonDrawer {
         const uRadius = round(ei.umbraRadius * pixelsPerArcSec) + 2;
         const pRadius = round(ei.penumbraRadius * pixelsPerArcSec) + 2;
 
-        u2 = uRadius * uRadius;
-        p2 = pRadius * pRadius;
+        u2 = uRadius ** 2;
+        p2 = pRadius ** 2;
       }
     }
 
@@ -191,7 +192,7 @@ export class MoonDrawer {
 
           // Are we within the penumbra?
           if (sdx * sdx + sdy * sdy <= p2) {
-            // Also within the umbra? Even darker a shadow.
+            // Also within the umbra? Even darker shadow.
             if (sdx * sdx + sdy * sdy <= u2)
               gray /= 2.5;
 

src/app/svc/moon-drawer.ts

@@ -84,6 +84,9 @@
   <h2 class="header-sans"><a name="history">What's New / Version History</a></h2>
   <div  style="padding-left: 1em; text-indent: -1em">
 
+  <p><b>1.14.8 2022-05-14:</b> Fixed bug in drawing lunar eclipse shadows on high pixel density displays.
+    (I definitely need more user feedback! This bug must have existed since 2018-08-13.)</p>
+
   <p><b>1.14.7 2022-04-30:</b> Fixed iOS keyboard input bug caused by iOS update.</p>
 
   <p><b>1.14.6 2022-01-15:</b> Added an option to change the first day of the week for calendars from the locale