Negative numbers when left open

[ts-web]

Hi there, great site, I keep it open all the time.

Sometimes when I open it in the morning, say at 10am, it shows a negative number like "-2h 55m until sunrise". The visuals are otherwise accurate. Then when I refresh the page, it shows the correct text: "9h 20m until sunset".

[alexburner]

Hey I'm glad you're enjoying it! And that is super weird, I'll start a long-running version & try to repo the issue

[ts-web]

Here's a screenshot:

If it helps, I debugged the minified code and pulled out what I think is the redux state object:

{"space":{"latitude":38.075770299999995,"longitude":-78.49514359999999},"suns":{"solarNoon":{"ms":1539018160658,"angle":-90,"point":{"x":250,"y":70},"text":"1:02pm"},"nadir":{"ms":1538974960658,"angle":-270,"point":{"x":249.99999999999997,"y":430},"text":"1:02am"},"sunrise":{"ms":1538997425292,"angle":-176.39735833333333,"point":{"x":70.35571017492074,"y":238.68942383240704},"text":"7:17am"},"sunset":{"ms":1539038896025,"angle":-3.6026375,"point":{"x":429.64429064760714,"y":238.6894368965085},"text":"6:48pm"},"sunriseEnd":{"ms":1538997589048,"angle":-175.71504166666665,"point":{"x":70.50313904692655,"y":236.5509514093742},"text":"7:19am"},"sunsetStart":{"ms":1539038732269,"angle":-4.284954166666665,"point":{"x":429.4968619311154,"y":236.5509644627544},"text":"6:45pm"},"dawn":{"ms":1538995843954,"angle":-182.98626666666667,"point":{"x":70.24443089709902,"y":259.37738644251107},"text":"6:50am"},"dusk":{"ms":1539040477363,"angle":2.986270833333336,"point":{"x":429.75556842095773,"y":259.37739951470496},"text":"7:14pm"},"nauticalDawn":{"ms":1538994014093,"angle":-190.61068749999998,"point":{"x":73.07781653959836,"y":283.1442453467262},"text":"6:20am"},"nauticalDusk":{"ms":1539042307224,"angle":10.610691666666668,"point":{"x":426.9221810500836,"y":283.14425821287045},"text":"7:45pm"},"nightEnd":{"ms":1538992179215,"angle":-198.2560125,"point":{"x":79.06007352147316,"y":306.387423558058},"text":"5:49am"},"night":{"ms":1539044142102,"angle":18.256016666666667,"point":{"x":420.93992237791724,"y":306.3874359891601},"text":"8:15pm"},"goldenHourEnd":{"ms":1538999539046,"angle":-167.59005000000002,"point":{"x":74.20570492942605,"y":211.3171120436958},"text":"7:52am"},"goldenHour":{"ms":1539036782271,"angle":-12.409945833333339,"point":{"x":425.79429788367247,"y":211.3171248278177},"text":"6:13pm"}},"now":{"ms":1539105867287,"angle":275.4442875,"point":{"x":267.0780071293116,"y":70.81199350265882},"text":"now"},"hours":[{"ms":1538971200000,"angle":-285.6694083333333,"point":{"x":298.6155523497661,"y":423.3104961325977},"text":"12am"},{"ms":1538974800000,"angle":-270.6694083333333,"point":{"x":252.1029604586643,"y":429.9877150177458},"text":"1am"},{"ms":1538978400000,"angle":-255.66940833333334,"point":{"x":205.447055287611,"y":424.3990685681974},"text":"2am"},{"ms":1538982000000,"angle":-240.66940833333334,"point":{"x":161.8273596714845,"y":406.92541380381397},"text":"3am"},{"ms":1538985600000,"angle":-225.66940833333334,"point":{"x":124.21648378156883,"y":378.75755142020864},"text":"4am"},{"ms":1538989200000,"angle":-210.66940833333334,"point":{"x":95.17754665485035,"y":341.8150746892304},"text":"5am"},{"ms":1538992800000,"angle":-195.66940833333334,"point":{"x":76.68950386740235,"y":298.6155523497662},"text":"6am"},{"ms":1538996400000,"angle":-180.66940833333334,"point":{"x":70.01228498225416,"y":252.1029604586643},"text":"7am"},{"ms":1539000000000,"angle":-165.66940833333334,"point":{"x":75.60093143180262,"y":205.44705528761102},"text":"8am"},{"ms":1539003600000,"angle":-150.66940833333334,"point":{"x":93.074586196186,"y":161.82735967148457},"text":"9am"},{"ms":1539007200000,"angle":-135.66940833333334,"point":{"x":121.24244857979139,"y":124.21648378156883},"text":"10am"},{"ms":1539010800000,"angle":-120.66940833333334,"point":{"x":158.18492531076961,"y":95.17754665485032},"text":"11am"},{"ms":1539014400000,"angle":-105.66940833333334,"point":{"x":201.38444765023377,"y":76.68950386740235},"text":"12pm"},{"ms":1539018000000,"angle":-90.66940833333334,"point":{"x":247.8970395413357,"y":70.01228498225416},"text":"1pm"},{"ms":1539021600000,"angle":-75.66940833333334,"point":{"x":294.55294471238903,"y":75.60093143180265},"text":"2pm"},{"ms":1539025200000,"angle":-60.66940833333334,"point":{"x":338.1726403285154,"y":93.074586196186},"text":"3pm"},{"ms":1539028800000,"angle":-45.66940833333334,"point":{"x":375.78351621843115,"y":121.24244857979139},"text":"4pm"},{"ms":1539032400000,"angle":-30.669408333333337,"point":{"x":404.82245334514965,"y":158.1849253107696},"text":"5pm"},{"ms":1539036000000,"angle":-15.669408333333337,"point":{"x":423.3104961325977,"y":201.3844476502338},"text":"6pm"},{"ms":1539039600000,"angle":-0.6694083333333367,"point":{"x":429.9877150177458,"y":247.89703954133566},"text":"7pm"},{"ms":1539043200000,"angle":14.330591666666663,"point":{"x":424.3990685681973,"y":294.55294471238903},"text":"8pm"},{"ms":1539046800000,"angle":29.330591666666663,"point":{"x":406.92541380381397,"y":338.1726403285154},"text":"9pm"},{"ms":1539050400000,"angle":44.33059166666666,"point":{"x":378.75755142020864,"y":375.78351621843115},"text":"10pm"},{"ms":1539054000000,"angle":59.33059166666666,"point":{"x":341.8150746892304,"y":404.82245334514965},"text":"11pm"}],"ms":1539105867287}

[alexburner]

Thank you! That is helpful. I've also reproduced the problem locally, still not sure the root cause

[alexburner]

Got it! SunCalc was misinterpreting the time stamp when the day ticked over at midnight, and calculating times for the previous day. Setting the time to noon before passing it seems to fix the issue: 2be7781

This should fix the negative numbers

[alexburner]

I also added a PR with a test showing the problem in the underlying library: mourner/suncalc#123