Show the current hour’s name and the current time in a box

src/main.rs

@@ -55,6 +55,16 @@ fn time_to_degrees(timestamp: i32, // should be time/timestamp
     seconds_to_degrees(timestamp)
 }
 
+fn seconds_to_hms(seconds: i32) -> (i32, i32, i32) {
+    let mut secs = seconds;
+    let hours = secs / 3600;
+    secs -= hours * 3600;
+    let minutes = secs / 60;
+    secs -= minutes * 60;
+
+    (hours, minutes, secs)
+}
+
 fn hour_name_path(image_width: u32, outer_r: f32, ring_width: f32) -> Path {
     let radius = outer_r - ring_width / 2.0;
     let delta_x = radius * (15.0_f32.to_radians() / 2.0).sin();
@@ -323,7 +333,9 @@ fn gen_svg() -> Document {
         .moon {stroke: none; fill: rgb(170, 170, 170);}
         .sun {stroke: none; fill: rgb(238, 187, 85);}
         .mid-marker {stroke: red;}
-        .dial {stroke-width: 2px; stroke: rgb(238, 187, 85);}",
+        .dial {stroke-width: 2px; stroke: rgb(238, 187, 85);}
+        #current-hour rect {stroke: none; fill: rgba(255, 255, 255, 0.5);}
+        #current-hour-name {font-weight: bold;}",
     );
 
     let definitions = Definitions::new().add(hour_name_path(image_width, outer_r, ring_width));
@@ -493,6 +505,64 @@ fn gen_svg() -> Document {
             image_width as f32 / 2.0 + outer_r - ring_width + hour_name_font_size,
         );
 
+    let utc_now = local_time - utc_offset;
+    let utc_hour = utc_now / 3600;
+    let (local_hour, local_minute, local_second) = seconds_to_hms(local_time);
+
+    let current_box_width = (200f32 / 700f32) * image_width as f32;
+    let current_box_height = (100f32 / 700f32) * image_width as f32;
+    let current_hour_name_font_size = (40f32 / 700f32) * image_width as f32;
+    let current_time_font_size = (30f32 / 700f32) * image_width as f32;
+
+    let current_hour_rect = Rectangle::new()
+        .set("x1", 0)
+        .set("y1", 0)
+        .set("width", current_box_width)
+        .set("height", current_box_height);
+
+    let current_hour_name = Text::new()
+        .set("id", "current-hour-name")
+        .set("font-size", current_hour_name_font_size)
+        .set("text-anchor", "middle")
+        .set("dominant-baseline", "mathematical")
+        .set("x", current_box_width / 2.0)
+        .set(
+            "y",
+            (current_box_height / 5.0) + (current_hour_name_font_size / 2.0),
+        )
+        .add(TextNode::new(HOUR_NAMES[utc_hour as usize]));
+
+    let current_time_text = Text::new()
+        .set("font-size", current_time_font_size)
+        .set("text-anchor", "middle")
+        .set("dominant-baseline", "mathematical")
+        .set("x", current_box_width / 2.0)
+        .set("y", current_box_height - (current_time_font_size / 2.0))
+        .add(TextNode::new(format!(
+            "{:02}:{:02}:{:02}",
+            local_hour, local_minute, local_second
+        )));
+
+    let top_pos = if local_hour > 6 && local_hour < 18 {
+        moon_radius * 1.5 // under the moon
+    } else {
+        0.0 - moon_radius * 1.5 - current_box_height // above the moon
+    };
+
+    let current_hour_group = Group::new()
+        .set("id", "current-hour")
+        .set(
+            "transform",
+            format!(
+                "translate({}, {})",
+                image_width as f32 / 2.0 - current_box_width / 2.0,
+                image_width as f32 / 2.0 + top_pos
+            ),
+        )
+        .add(current_hour_rect)
+        .add(current_hour_name)
+        .add(current_time_text);
+
     Document::new()
         .set("viewBox", (0i32, 0i32, 700i32, 700i32))
         .set("width", 700i32)
@@ -508,6 +578,7 @@ fn gen_svg() -> Document {
         .add(noon_marker)
         .add(midnight_marker)
         .add(dial)
+        .add(current_hour_group)
 }
 
 fn main() {