tiny time counter added into ai login.

Pony-Driland · Feb 19, 2025 · 41442d6 · 41442d6
1 parent b4001bb
commit 41442d6
Show file tree

Hide file tree

Showing 4 changed files with 89 additions and 30 deletions.
diff --git a/docs/index.html b/docs/index.html
@@ -24,15 +24,15 @@
         <link rel="stylesheet" href="./css/cryptofont/cryptofont.min.css">
         <link rel="stylesheet" href="./css/bootstrap.min.css">
 
-        <link rel="stylesheet" href="./css/dark.css?v=322">
-        <link rel="stylesheet" href="./css/main.css?v=322">
-        <link rel="stylesheet" href="./css/carousel.css?v=322"./>
+        <link rel="stylesheet" href="./css/dark.css?v=323">
+        <link rel="stylesheet" href="./css/main.css?v=323">
+        <link rel="stylesheet" href="./css/carousel.css?v=323"./>
 
         <link rel="stylesheet" href="./photoswipe/photoswipe.css">
         <link rel="stylesheet" href="./photoswipe/default-skin/default-skin.css">
 
         <!-- Manifest -->
-        <link rel="manifest" href="./manifest.json?v=322">
+        <link rel="manifest" href="./manifest.json?v=323">
 
         <!-- Page Info -->
         <meta content="Homepage" property="og:title">
@@ -46,7 +46,7 @@
         <meta content="The dimension of lost creatures and the home of hope." property="description">
 
         <!-- Embed -->
-        <link href="./oEmbed/index.json?v=322" rel="alternate" title="oEmbed JSON Profile" type="application/json+oembed">
+        <link href="./oEmbed/index.json?v=323" rel="alternate" title="oEmbed JSON Profile" type="application/json+oembed">
         <meta content="/img/icon/icon.png" property="og:image">
 
         <link href="https://ponydriland.com" rel="canonical">
@@ -63,29 +63,29 @@
         <meta property="twitter:site" content="Pony Driland">
 
         <!-- Base -->
-        <script src="./js/files/Notification.js?v=322"></script>
+        <script src="./js/files/Notification.js?v=323"></script>
         <script src="./js/events.js"></script>
         <script src="./js/jquery.min.js"></script>
 
         <!-- AI -->
-        <script src="./js/ai/google.js?v=322"></script>
-        <script src="./js/ai/templates.js?v=322"></script>
-        <script src="./js/ai/TinyAiManager.js?v=322"></script>
+        <script src="./js/ai/google.js?v=323"></script>
+        <script src="./js/ai/templates.js?v=323"></script>
+        <script src="./js/ai/TinyAiManager.js?v=323"></script>
 
         <!-- Web3 -->
         <script src="./js/bignumber.min.js"></script>
         <script src="./crypto/ethers.umd.min.js"></script>
         <script src="./crypto/walletconnect.v1.js"></script>
-        <script src="./crypto/web3.js?v=322"></script>
+        <script src="./crypto/web3.js?v=323"></script>
 
         <!-- Script -->
         <script>var fileVersion = '?v=418';</script>
         <script src="./js/qrcode.js"></script>
-        <script src="./chapters/config.js?v=322"></script>
-        <script src="./crypto/config.js?v=322"></script>
-        <script src="./chapters/sound.js?v=322"></script>
-        <script src="./chapters/characters.js?v=322"></script>
-        <script src="./chapters/counter.js?v=322"></script>
+        <script src="./chapters/config.js?v=323"></script>
+        <script src="./crypto/config.js?v=323"></script>
+        <script src="./chapters/sound.js?v=323"></script>
+        <script src="./chapters/characters.js?v=323"></script>
+        <script src="./chapters/counter.js?v=323"></script>
 
         <script src="./js/base64.js"></script>
         <script src="./js/clone.min.js"></script>
@@ -102,21 +102,21 @@
         <script src="./js/md5.js"></script>
         <script src="./js/FileSaver.min.js"></script>
 
-        <script src="./js/tinyLib.js?v=322"></script>
+        <script src="./js/tinyLib.js?v=323"></script>
 
         <script src="./js/photoswipe.min.js"></script>
         <script src="./js/photoswipe-ui-default.min.js"></script>
 
-        <script src="./js/files/chapters.js?v=322"></script>
-        <script src="./js/files/start.js?v=322"></script>
-        <script src="./js/chapter_manager/updater.js?v=322"></script>
-        <script src="./js/chapter_manager/tts/tts.js?v=322"></script>
-        <script src="./js/chapter_manager/music/index.js?v=322"></script>
-        <script src="./js/chapter_manager/music/pizzicato.js?v=322"></script>
-        <script src="./js/chapter_manager/music/seamlessloop.js?v=322"></script>
-        <script src="./js/chapter_manager/music/vanilla.js?v=322"></script>
-        <script src="./js/chapter_manager/index.js?v=322"></script>
-        <script src="./crypto/main.js?v=322"></script>
+        <script src="./js/files/chapters.js?v=323"></script>
+        <script src="./js/files/start.js?v=323"></script>
+        <script src="./js/chapter_manager/updater.js?v=323"></script>
+        <script src="./js/chapter_manager/tts/tts.js?v=323"></script>
+        <script src="./js/chapter_manager/music/index.js?v=323"></script>
+        <script src="./js/chapter_manager/music/pizzicato.js?v=323"></script>
+        <script src="./js/chapter_manager/music/seamlessloop.js?v=323"></script>
+        <script src="./js/chapter_manager/music/vanilla.js?v=323"></script>
+        <script src="./js/chapter_manager/index.js?v=323"></script>
+        <script src="./crypto/main.js?v=323"></script>
 
         <!-- Global site tag (gtag.js) - Google Analytics -->
         <script async src="https://www.googletagmanager.com/gtag/js"></script>

diff --git a/docs/js/ai/TinyAiManager.js b/docs/js/ai/TinyAiManager.js
@@ -712,9 +712,8 @@ const AiScriptStart = () => {
       tinyAiScript.enabled = false;
     }
 
-    // update login button
-    aiLogin.button.attr("title", aiLogin.title);
-    aiLogin.button.attr("data-bs-original-title", aiLogin.title);
+    // Update login button
+    aiLogin.updateTitle();
   };
 
   tinyAiScript.isEnabled = () => {
@@ -795,6 +794,40 @@ const AiScriptStart = () => {
     $("#markdown-read").empty();
     $("#top_page").addClass("d-none");
 
+    // Try to prevent user browser from deactivating the page accidentally in browsers that have tab auto deactivator
+    const aiTimeScriptUpdate = () => {
+      try {
+        // Get data
+        const now = moment();
+        const totalTime = JSON.parse(
+          localStorage.getItem("total-time-using-ai") || "{}",
+        );
+
+        if (typeof totalTime.now !== "number") totalTime.now = now.valueOf();
+        if (typeof totalTime.secondsUsed !== "number")
+          totalTime.secondsUsed = 0;
+        const past = moment(totalTime.now);
+
+        // Diff
+        const diff = Math.abs(now - past);
+        if (diff >= 999) totalTime.secondsUsed++;
+
+        // Complete
+        totalTime.now = now.valueOf();
+        localStorage.setItem("total-time-using-ai", JSON.stringify(totalTime));
+        if (aiLogin) {
+          aiLogin.secondsUsed = totalTime.secondsUsed;
+          aiLogin.updateTitle();
+        }
+      } catch (err) {
+        console.error(err);
+      }
+      appData.ai.secondsUsed++;
+    };
+
+    appData.ai.interval = setInterval(aiTimeScriptUpdate, 1000);
+    aiTimeScriptUpdate();
+
     // Start loading page
     let isFirstTime = true;
     $.LoadingOverlay("show", { background: "rgba(0,0,0, 0.5)" });

diff --git a/docs/js/files/start.js b/docs/js/files/start.js
@@ -1,5 +1,8 @@
 // Start Load
-const appData = { youtube: {}, ai: { using: false } };
+const appData = {
+  youtube: {},
+  ai: { using: false, interval: null, secondsUsed: 0 },
+};
 appData.emitter = new EventEmitter();
 
 // Start Document
@@ -422,6 +425,12 @@ const insertMarkdownFile = function (text, isMainPage = false, isHTML = false) {
 
 // Remove Fic Data
 const clearFicData = function () {
+  if (appData.ai.interval) {
+    clearInterval(appData.ai.interval);
+    appData.ai.interval = null;
+    appData.ai.secondsUsed = 0;
+  }
+
   for (const item in storyData.sfx) {
     if (typeof storyData.sfx[item].hide === "function") {
       storyData.sfx[item].hide(0);
@@ -950,6 +959,15 @@ $(() => {
         // AI Login
         const aiLogin = {
           base: $("<li>", { class: "nav-item font-weight-bold" }),
+          secondsUsed: 0,
+          title: "",
+          updateTitle: () => {
+            if (aiLogin.button) {
+              const title = `${aiLogin.title}${aiLogin.secondsUsed > 0 ? ` - ${tinyLib.formatTimer(aiLogin.secondsUsed)}` : ""}`;
+              aiLogin.button.removeAttr("title");
+              aiLogin.button.attr("data-bs-original-title", title);
+            }
+          },
         };
         tinyAiScript.setAiLogin(aiLogin);
 

diff --git a/docs/js/tinyLib.js b/docs/js/tinyLib.js
@@ -397,6 +397,14 @@ tinyLib.booleanCheck = function (value) {
 
 };
 
+tinyLib.formatTimer = function(seconds) {
+    const hours = Math.floor(seconds / 3600);
+    const minutes = Math.floor((seconds % 3600) / 60);
+    const secs = seconds % 60;
+
+    return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
+}
+
 // Visible Item
 $.fn.isInViewport = function () {