From f103ad35af41b77b3b7876a9d219284090880682 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=82=8D=E3=82=80=E3=81=AD=E3=81=93?= <nem@nem.x0.to>
Date: Mon, 17 Jun 2024 12:30:29 +0900
Subject: [PATCH] =?UTF-8?q?=E3=83=AC=E3=82=B9=E3=83=9D=E3=83=B3=E3=82=B9?=
 =?UTF-8?q?=E5=87=A6=E7=90=86=E4=BF=AE=E6=AD=A3,=20=E3=83=80=E3=82=A6?=
 =?UTF-8?q?=E3=83=B3=E3=82=92=E6=AD=A3=E5=B8=B8=E3=81=AB=E5=88=A4=E5=AE=9A?=
 =?UTF-8?q?=E3=81=A7=E3=81=8D=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/index.html | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/static/index.html b/static/index.html
index 82ce95b..3ab16ba 100644
--- a/static/index.html
+++ b/static/index.html
@@ -44,15 +44,23 @@
             fetch(location.href + 'meta/ping')
                 .then(res => res.text())
                 .then(text => {
-                    document.querySelector('#lastChecked').textContent = new Date().toLocaleTimeString();
                     if (text === 'pong') {
                         document.querySelector('#stateStr').textContent = '✅ Server is running!';
                         document.querySelector('#catIcon').textContent = '✅';
-                    } else {
-                        document.querySelector('#stateStr').textContent = '❌ Server is down!';
-                        document.querySelector('#catIcon').textContent = '❌';
+                    } else { // Unknow response (? emoji
+                        document.querySelector('#stateStr').textContent = '❓ Server is responding but unknown!';
+                        document.querySelector('#stateStr').append(document.createElement('br'));
+                        document.querySelector('#stateStr').append(document.createTextNode('Response: ' + text));
+                        document.querySelector('#stateStr').style.color = '#333';
+                        document.querySelector('#catIcon').textContent = '❓';
+                                            
                     }
-                                        
+                }).catch(err => {
+                    document.querySelector('#stateStr').textContent = '❌ Server is down!';
+                    document.querySelector('#catIcon').textContent = '❌';
+                }).finally(() => {
+                    const now = new Date();
+                    document.querySelector('#lastChecked').textContent = now.toLocaleTimeString();
                 });
         }, 1000 * 1);
 
@@ -97,7 +105,8 @@
         <!-- divider -->
         <div style="margin: 20px 0; border-bottom: 1px solid #ccc;"></div>
         <!-- 以下の情報は実行環境の現状であって，稼働しているバージョンのことを指すとは限らないことを忠告 -->
-        <p style="font-size: 0.6em; color: gray">The information below is about the current environment, not necessarily the version running.</p>
+        <p style="font-size: 0.6em; color: gray">The information below is about the current environment, not necessarily
+            the version running.</p>
 
     </main>
 </body>