Merge pull request #2 from WorkofAditya/Beta

Added version update system

Author: WorkofAditya

index.html

@@ -18,7 +18,6 @@
 <div class="vault-container">
   <h1>Chatbot</h1>
   <div class="vault-toolbar">
-    <button id="openChangelogBtn" class="change-btn">Changelog</button>
     <button id="editDocsBtn" type="button" title="Edit Documents">Manage</button>
     <button id="aboutBtn" class="toolbar-btn">About</button>
     <button id="helpBtn">?</button>
@@ -85,11 +84,13 @@ <h2 class="about-title">ChatBot</h2>
     <p class="about-desc">A secure offline chatbot vault that stores your personal documents, notes, and files locally, no internet or servers required. <b>made to keep your data truly <i>yours</i>.</b></p>
 
     <div class="about-links-row">
-  <a href="https://github.com/WorkofAditya/ChatBot" target="_blank">GitHub</a>
-  <a href="https://codepen.io/WorkofAditya/pen/azNBRWr" target="_blank">CodePen</a>
-</div>
+      <a href="https://github.com/WorkofAditya/ChatBot" target="_blank">GitHub</a>
+      <a href="https://codepen.io/WorkofAditya/pen/azNBRWr" target="_blank">CodePen</a>
+      <a href="#" id="openChangelogBtn">Changelog</a>
+    </div>
+
     <p class="about-dev">Developed by <b>Adityasinh Sodha</b></p>
-        <p class="about-version">Version: <b>v2.0.0</b></p>
+        <p class="about-version">Version: <b>v2.0.1</b></p>
   </div>
 </div>
 
@@ -125,6 +126,17 @@ <h2 class="about-title">User Guide</h2>
   </div>
 </div>
 
+<!-- UPDATE POPUP -->
+<div id="updatePopup" class="popup">
+  <div class="popup-content">
+    <h2>Update Available</h2>
+    <p>A new version of ChatBot is ready. Install the update to get new features and improvements.</p>
+    <div class="popup-actions">
+      <button id="refreshAppBtn">Update Now</button>
+      <button id="dismissUpdateBtn">Later</button>
+    </div>
+  </div>
+</div>
 
 <script src="js/app.js"></script>
 </body>

js/app.js

@@ -930,3 +930,50 @@ helpBtn.onclick = async () => {
 closeHelp.onclick = () => {
   helpPopup.style.display = "none";
 };
+
+const LOCAL_VERSION = "2";
+const REMOTE_VERSION_URL = "https://raw.githubusercontent.com/WorkofAditya/ChatBot/refs/heads/Beta/version.txt";
+
+let latestRemoteVersion = null;
+
+function checkForAppUpdate() {
+  fetch(REMOTE_VERSION_URL + "?cache=" + Date.now())
+    .then(res => res.text())
+    .then(remote => {
+      const remoteVersion = remote.trim();
+      latestRemoteVersion = remoteVersion;
+
+      const storedVersion = localStorage.getItem("updatedVersion");
+      if (storedVersion === remoteVersion) return;
+
+      if (remoteVersion > LOCAL_VERSION) {
+        showUpdatePopup();
+      }
+    })
+    .catch(() => {});
+}
+
+function showUpdatePopup() {
+  const popup = document.getElementById("updatePopup");
+  popup.style.display = "flex";
+
+  document.getElementById("refreshAppBtn").onclick = async () => {
+    popup.style.display = "none";
+    localStorage.setItem("updatedVersion", latestRemoteVersion);
+
+    if ("serviceWorker" in navigator) {
+      const reg = await navigator.serviceWorker.getRegistration();
+      if (reg && reg.waiting) {
+        reg.waiting.postMessage("SKIP_WAITING");
+      }
+    }
+
+    setTimeout(() => window.location.reload(), 300);
+  };
+
+  document.getElementById("dismissUpdateBtn").onclick = () => {
+    popup.style.display = "none";
+  };
+}
+
+if (navigator.onLine) checkForAppUpdate();

service-worker.js

@@ -1,6 +1,6 @@
-const CACHE_NAME = "vault-cache-v14";
+const APP_VERSION = "1";
+const CACHE_NAME = `vault-cache-v${APP_VERSION}`;
 const FILES_TO_CACHE = [
-  "/",
   "/index.html",
   "/styles.css",
   "/js/app.js",
@@ -13,13 +13,10 @@ const FILES_TO_CACHE = [
   "/icons/favicon.ico"
 ];
 
-
 // Install: cache everything
 self.addEventListener("install", (event) => {
   event.waitUntil(
-    caches.open(CACHE_NAME).then((cache) => {
-      return cache.addAll(FILES_TO_CACHE);
-    })
+    caches.open(CACHE_NAME).then((cache) => cache.addAll(FILES_TO_CACHE))
   );
   self.skipWaiting();
 });
@@ -30,21 +27,40 @@ self.addEventListener("activate", (event) => {
     caches.keys().then((keyList) =>
       Promise.all(
         keyList.map((key) => {
-          if (key !== CACHE_NAME) {
-            return caches.delete(key);
-          }
+          if (key !== CACHE_NAME) return caches.delete(key);
         })
       )
     )
   );
   self.clients.claim();
 });
 
-// Fetch: serve from cache when offline
+// Fetch: cache-first for offline
 self.addEventListener("fetch", (event) => {
+  if (event.request.method !== "GET") return;
+
   event.respondWith(
-    caches.match(event.request).then((response) => {
-      return response || fetch(event.request);
+    caches.match(event.request, { ignoreSearch: true }).then((cached) => {
+      if (cached) return cached;
+
+      return fetch(event.request)
+        .then((response) => {
+          const clone = response.clone();
+          caches.open(CACHE_NAME).then((cache) => {
+            cache.put(event.request, clone);
+          });
+          return response;
+        })
+        .catch(() => {
+          if (event.request.mode === "navigate") {
+            return caches.match("/index.html");
+          }
+        });
     })
   );
 });
+
+// Force update activation from app.js
+self.addEventListener("message", (event) => {
+  if (event.data === "SKIP_WAITING") self.skipWaiting();
+});

styles.css

@@ -1128,3 +1128,28 @@ hr {
   margin: 16px 0;
   height: 2px;
 }
+
+#updatePopup .popup-content {
+  max-width: 380px;
+  text-align: center;
+  padding: 28px 22px;
+}
+#updatePopup h2 {
+  font-size: 1.4rem;
+  color: #6ab7ff;
+  margin-bottom: 10px;
+}
+#updatePopup p {
+  font-size: 0.94rem;
+  color: #e1e7f8;
+  margin-bottom: 14px;
+}
+#updatePopup .popup-actions button {
+  background: rgba(60, 110, 200, 0.15);
+  border: 1px solid rgba(60, 110, 200, 0.4);
+  color: #9abfff;
+}
+#updatePopup .popup-actions button:hover {
+  background: rgba(60, 110, 200, 0.24);
+  color: #fff;
+}

version.txt

@@ -0,0 +1 @@
+2