display time until opening/closing

Cargo.lock

@@ -132,6 +132,7 @@ dependencies = [
  "anyhow",
  "axum",
  "chrono",
+ "chrono-humanize",
  "maud",
  "serde",
  "serde_json",
@@ -187,6 +188,15 @@ dependencies = [
  "windows-targets",
 ]
 
+[[package]]
+name = "chrono-humanize"
+version = "0.2.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "799627e6b4d27827a814e837b9d8a504832086081806d45b1afa34dc982b023b"
+dependencies = [
+ "chrono",
+]
+
 [[package]]
 name = "core-foundation-sys"
 version = "0.8.7"

Cargo.toml

@@ -7,6 +7,7 @@ edition = "2021"
 anyhow = "1.0.95"
 axum = { version = "0.8.1", features = ["macros"] }
 chrono = "0.4.39"
+chrono-humanize = "0.2.3"
 maud = { version = "0.27.0", features = ["axum"] }
 serde = { version = "1.0.217", features = ["derive"] }
 serde_json = "1.0.138"

src/data.rs

@@ -1,7 +1,9 @@
 use std::collections::HashMap;
 
 use chrono::{DateTime, Datelike, Duration, Timelike, Utc};
+use chrono_humanize::HumanTime;
 use serde::{Deserialize, Serialize};
+use serde_json::map::Entry;
 
 use crate::{
     clock,
@@ -104,6 +106,19 @@ pub struct Window {
     pub duration: Duration,
 }
 
+impl Window {
+    pub fn display_end_time(&self) -> String {
+        let end_date = self.start_time + self.duration;
+        let human_date = HumanTime::from(clock::to_earth_time(end_date));
+        format!("{}", human_date)
+    }
+
+    pub fn display_start_time(&self) -> String {
+        let human_date = HumanTime::from(clock::to_earth_time(self.start_time));
+        format!("{}", human_date)
+    }
+}
+
 #[allow(clippy::needless_lifetimes)]
 impl<'a> CombinedFish<'a> {
     /// Fills in the rest of the struct.

src/templates.rs

@@ -1,6 +1,7 @@
-use std::sync::Arc;
+use std::{cmp::Ordering, sync::Arc};
 
 use axum::extract::State;
+use chrono::Duration;
 use maud::{html, Markup, DOCTYPE};
 
 use crate::{clock, data::CombinedFish, AppState};
@@ -35,13 +36,22 @@ pub fn main_page(state: State<Arc<AppState>>, with_layout: bool) -> Markup {
     let template = html! {
         h1 { "Hello! Current ET: " (clock::get_current_eorzea_date().format("%H:%M")) }
         @for fish in values {
-            section.up[fish.is_up || fish.is_always_up] {
+            section.up[fish.is_up || fish.is_always_up].alwaysup[fish.is_always_up] {
                 .title {
                     h3 { (fish.meta.name_en) }
                     .subtitle {
                         "Patch " (fish.entry.patch)
                     }
                 }
+                .when {
+                    @if let Some(window) = fish.windows.first() {
+                        @if fish.is_up || fish.is_always_up {
+                            "closes " (window.display_end_time())
+                        } @else {
+                            "opens " (window.display_start_time())
+                        }
+                    }
+                }
                 .meta {
                     @if fish.entry.start_hour.is_some() && fish.entry.end_hour.is_some() {
                         div {

static/style.css

@@ -5,10 +5,10 @@ body {
 
 section {
     margin-bottom: 5px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
     padding: 0 10px;
+    align-items: center;
 }
 
 .title {
@@ -30,6 +30,25 @@ section {
     text-align: end;
 }
 
+.when {
+    text-align: center;
+}
+
 section.up {
     background-color: greenyellow;
 }
+
+section.alwaysup {
+    background-color: #c6ff6e;
+    background-image: linear-gradient(
+        45deg,
+        greenyellow 25%,
+        transparent 25%,
+        transparent 50%,
+        greenyellow 50%,
+        greenyellow 75%,
+        transparent 75%,
+        transparent
+    );
+    background-size: 50px 50px;
+}