Update 'Analog Clock'

Analog-Clock.md

@@ -370,7 +370,6 @@ For the hour and minute hands, we will do similar. We divide the segments into 6
 ```
 Similar concept to the seconds hand, drawing a black line and a shorter black line for the minute and hour hand respectively.
 
-<img src="https://pit.pgetinker.com/Hl6c7FACToFf.png" width="256" height="240">
 
 I am going to remove the digital display of the clock now since one is supposed to assume the time based on the positions of the hands. The final result!
 
@@ -378,3 +377,43 @@ I am going to remove the digital display of the clock now since one is supposed
 <a href="https://pgetinker.com/s/4wS5gtOFiHX" title="Click to try it out!" target="_blank">[***Try it out!***]</a>
 
 <a href="https://pgetinker.com/s/4wS5gtOFiHX" title="Click to try it out!" target="_blank"><img src="https://pit.pgetinker.com/5MumBR308PXW.png" width="256" height="240"></a>
+
+# Analog Clock (Advanced)
+While this analog clock we made is functional, there are some subtleties to an actual analog clock that we are overlooking.
+
+As the seconds hand goes around, the minutes and hours hand actually slowly rotate as well such that they are pointing in the middle or towards the next number as the seconds hand gets closer and closer to the 12 o' clock position again.
+
+In order to fix this, we will instead adjust the angle based on the total number of seconds that have passed. We can figure out the total number of seconds passed in the day using the formula `hours*3600+minutes*60+seconds`. Then using this information, use `fmod()` to calculate and loop the hands around the clock as necessary.
+
+Start with the minute hand: Every 3600 seconds (one hour) it makes one revolution. Since one revolution is `2π`, it makes the formula be `2*pi*fmod(totalTime,3600)/3600`. This results in a full rotation of the minute hand around the clock every hour.
+```cpp
+        const float totalTime{float(localTime->tm_hour*3600+localTime->tm_min*60+localTime->tm_sec)};
+        const float minutesHandAngle{float(2*pi*fmod(totalTime,3600)/3600)};
+        olc::vf2d minutesHandVec{85,float(minutesHandAngle-pi/2)};
+        DrawLine(GetScreenSize()/2,GetScreenSize()/2+minutesHandVec.cart(),olc::BLACK);
+```
+Revising the `minutesHandAngle` formula now gives us a minute hand that slowly moves across over time, better indicating the current time and matching the behavior of a real analog clock!
+
+<img src="https://pit.pgetinker.com/uQ5wNSiLUBhM.png" width="256" height="240">
+
+Let's make the seconds hand also use the same `totalTime` value for the sake of consistency. And make the hour hand work proper using the same logic.
+```cpp
+        const float totalTime{float(localTime->tm_hour*3600+localTime->tm_min*60+localTime->tm_sec)};
+
+        const float hourHandAngle{float(2*pi*fmod(totalTime,43200)/43200)};
+        olc::vf2d hourHandVec{60,float(hourHandAngle-pi/2)};
+        DrawLine(GetScreenSize()/2,GetScreenSize()/2+hourHandVec.cart(),olc::BLACK);
+
+        const float minutesHandAngle{float(2*pi*fmod(totalTime,3600)/3600)};
+        olc::vf2d minutesHandVec{85,float(minutesHandAngle-pi/2)};
+        DrawLine(GetScreenSize()/2,GetScreenSize()/2+minutesHandVec.cart(),olc::BLACK);
+        
+        const float secondsHandAngle{float(2*pi*fmod(totalTime,60)/60)};
+        olc::vf2d secondsHandVec{85,float(secondsHandAngle-pi/2)};
+        DrawLine(GetScreenSize()/2,GetScreenSize()/2+secondsHandVec.cart(),olc::RED);
+```
+Using `43200` seconds to represent a full revolution of the hour hand (half a day) and `60` seconds for a full revolution of the seconds hand, we end up drawing the hands as if they move like an actual analog clock over time.
+
+<a href="https://pgetinker.com/s/VlY2wJZSEuN" title="Click to try it out!" target="_blank">[***Try it out!***]</a>
+
+<a href="https://pgetinker.com/s/VlY2wJZSEuN" title="Click to try it out!" target="_blank"><img src="https://pit.pgetinker.com/9pAIVVWVj1XS.png" width="256" height="240"></a>