From ae7e1a75456f8ec45f6ee9e417a77d52bc6c7e31 Mon Sep 17 00:00:00 2001
From: Ni Rui <ranqus@gmail.com>
Date: Wed, 6 Mar 2024 20:27:38 +0800
Subject: [PATCH] Improve the "time difference" error message

---
 ui/app.css |  6 +++++-
 ui/app.js  | 31 ++++++++++++++++++++++---------
 2 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/ui/app.css b/ui/app.css
index b2a8ce3c..e6a271a0 100644
--- a/ui/app.css
+++ b/ui/app.css
@@ -29,10 +29,14 @@
 }
 
 body.app-error {
-  background: #b44;
+  background: #944;
   color: #fff;
 }
 
+body.app-error .app-error-message {
+  white-space: pre-line;
+}
+
 #app-loading {
   width: 100%;
   min-height: 100%;
diff --git a/ui/app.js b/ui/app.js
index 4b58543f..a5fc4f15 100644
--- a/ui/app.js
+++ b/ui/app.js
@@ -63,7 +63,7 @@ const mainTemplate = `
   :error="authErr"
   @auth="submitAuth"
 ></auth>
-<loading v-else :error="loadErr"></loading>
+<loading class="app-error-message" v-else :error="loadErr"></loading>
 `.trim();
 
 const socksInterface = "/sshwifty/socket";
@@ -288,17 +288,30 @@ function startApp(rootEl) {
           let result = await this.doAuth("");
 
           if (result.date) {
-            let serverTime = result.date.getTime(),
-              clientTime = new Date().getTime(),
-              timeDiff = Math.abs(serverTime - clientTime);
+            let serverRespondTime = result.date,
+              serverRespondTimestamp = serverRespondTime.getTime(),
+              clientCurrent = new Date(),
+              clientTimestamp = clientCurrent.getTime(),
+              timeDiff = Math.abs(serverRespondTimestamp - clientTimestamp);
 
             if (timeDiff > maxTimeDiff) {
               this.loadErr =
-                "The time difference between this client " +
-                "and the backend server is beyond operational limit.\r\n\r\n" +
-                "Please try reload the page, and if the problem persisted, " +
-                "consider to adjust your local time so both the client and " +
-                "the server are running at same date time";
+                "The datetime difference between current client " +
+                "and the Sshwifty server is beyond the operational tolerance." +
+                "\r\n\r\n" +
+                "The server time was " +
+                serverRespondTime +
+                ", and the client time was " +
+                clientCurrent +
+                ", resulted a " +
+                timeDiff +
+                "ms time difference, exceeding the " +
+                "limitation of " +
+                maxTimeDiff +
+                "ms.\r\n\r\n" +
+                "Try reload the page, see if the problem persists. And if " +
+                "it did, please make sure both the server and the client are " +
+                "having the correct time settings";
 
               return;
             }