diff options
| -rw-r--r-- | pages/home.luax | 45 | ||||
| -rw-r--r-- | public/assets/app.css | 31 |
2 files changed, 70 insertions, 6 deletions
diff --git a/pages/home.luax b/pages/home.luax index 002d9bf..6ab86bc 100644 --- a/pages/home.luax +++ b/pages/home.luax @@ -13,6 +13,38 @@ local art = [[ __| |__ ]] +local function is_service_live(service, is_user) + local opt = '' + if is_user then + opt = '-U ' + end + local handle = io.popen('rc-service ' .. opt .. service .. ' status 2>&1') + local output = handle:read('*a') + + + local is_dummy = string.match(output, "not found") + if is_dummy then + return "unknown" + end + local is_running = string.match(output, "started") + if is_running then + return "online" + else + return "offline" + end +end + +local function Service(props) + return <div class="service-info"> + <div class="service-name"> + {$ props.attrs.service $} + </div> + <div class={"service-status service-status-" .. is_service_live(props.attrs.service, props.attrs.is_user)}> + {$ is_service_live(props.attrs.service, props.attrs.is_user) $} + </div> + </div> +end + return function(props) return <div class="main-info"> <div class="main-info-title"> @@ -21,12 +53,13 @@ return function(props) <div class="ascii-art"> {$ art $} </div> - <div class="main-info-subtitle"> - apparently like - <div class="main-info-highlight"> - {$ tostring(props.attrs.visits) $} - </div> - people saw this + <div class="service-group"> + <Service service="tailscale" is_user={true} /> + <Service service="reluax" /> + <Service service="nginx" /> + <Service service="fcgiwrap" /> + <Service service="sshd" /> + <Service service="git-daemon" /> </div> </div> end diff --git a/public/assets/app.css b/public/assets/app.css index 19ac418..53949e6 100644 --- a/public/assets/app.css +++ b/public/assets/app.css @@ -287,3 +287,34 @@ transition: all 0.2s ease-in-out; filter: brightness(100%) drop-shadow(0 0 0.5em #647089); } + +.service-group { + display: grid; + grid-template-columns: auto auto auto; + justify-content: space-around; +} + +.service-info { + width: 200px; + height: 64px; + border: 2px solid var(--color-fg); + border-radius: 8px; + margin: 4px; + display: flex; + align-items: center; + justify-content: center; +} + +.service-status { + margin-left: 8px; +} + +.service-status-unknown { + color: var(--color-blue); +} +.service-status-online { + color: var(--color-light-green); +} +.service-status-offline { + color: var(--color-light-red); +} |