sleep mode

application/assets/css/main.css

@@ -100,10 +100,11 @@ h2 {
 h2.reblog::before {
   content: "";
   display: inline-block;
-  width: 20px; /* Adjust to your image size */
-  height: 20px; /* Adjust to your image size */
+  width: 1.1rem; /* Adjust to your image size */
+  height: 1.1rem; /* Adjust to your image size */
   background-image: url("../icons/reblog.svg");
   background-size: cover; /* Adjusts image to fill the box */
+  padding: 3px 0 0 0;
   margin-right: 5px; /* Space between image and text */
 }
 

application/index.js

@@ -12,29 +12,45 @@ import {
   volume_control,
 } from "./assets/js/helper.js";
 import { mastodon_account_info, reblog } from "./assets/js/mastodon.js";
-
 import localforage from "localforage";
 import { detectMobileOS } from "./assets/js/helper.js";
 import m from "mithril";
 import { v4 as uuidv4 } from "uuid";
 import * as sanitizeHtml from "sanitize-html";
-
 import dayjs from "dayjs";
 import duration from "dayjs/plugin/duration";
-
 import swiped from "swiped-events";
-
 import fxparser from "fast-xml-parser";
+import Timeworker from "./worker.js";
 
 // Extend dayjs with the duration plugin
 dayjs.extend(duration);
 
+const worker = new Worker(new URL("./worker.js", import.meta.url), {
+  type: "module",
+});
+
+function startTimer(timerDuration) {
+  worker.postMessage({ action: "start", duration: timerDuration });
+  console.log("started");
+}
+
+function stopTimer() {
+  worker.postMessage({ action: "stop" });
+}
+
+worker.onmessage = function (event) {
+  if (event.data.action === "stop") {
+    console.log("Timer expired, audio stopped.");
+    globalAudioElement.pause();
+  }
+};
+
 const parser = new fxparser.XMLParser({
   ignoreAttributes: false,
   parseAttributeValue: true,
 });
 
-//github.com/laurentpayot/minidenticons#usage
 export let status = {
   visibility: true,
   deviceOnline: true,
@@ -1011,8 +1027,6 @@ var article = {
 
         current_article = h;
 
-        console.log(h);
-
         return m(
           "article",
           {
@@ -1446,8 +1460,23 @@ const AudioPlayerView = {
 
     top_bar("", "", "");
     bottom_bar("", "<img src='assets/icons/play.svg'>", "");
+    if (settings.sleepTimer != "") {
+      bottom_bar(
+        "<img src='assets/icons/sleep.svg'>",
+        "<img src='assets/icons/play.svg'>",
+        ""
+      );
 
-    if (status.notKaiOS) top_bar("", "", "<img src='assets/icons/back.svg'>");
+      document
+        .querySelector("div.button-left")
+        .addEventListener("click", function (event) {
+          startTimer(settings.sleepTimer);
+        });
+    }
+
+    if (status.notKaiOS) {
+      top_bar("", "", "<img src='assets/icons/back.svg'>");
+    }
 
     document
       .querySelector("div.button-center")
@@ -1808,9 +1837,7 @@ var settingsView = {
         m(
           "div",
           {
-            tabindex: 1,
-
-            class: "item input-parent  flex ",
+            class: "item input-parent flex ",
           },
           [
             m(
@@ -1912,6 +1939,29 @@ var settingsView = {
               "Connect"
             ),
 
+        m("div", { class: "seperation" }),
+        m(
+          "div",
+          {
+            class: "item input-parent flex ",
+          },
+          [
+            m(
+              "label",
+              {
+                for: "sleep-timer",
+              },
+              "Sleep timer in minutes"
+            ),
+            m("input", {
+              id: "sleep-timer",
+              placeholder: "",
+              value: settings.sleepTimer / 1000 || "",
+              type: "number",
+            }),
+          ]
+        ),
+
         m(
           "button",
           {
@@ -1922,6 +1972,18 @@ var settingsView = {
                 side_toaster("URL not valid");
               settings.opml_url = document.getElementById("url-opml").value;
               settings.proxy_url = document.getElementById("url-proxy").value;
+              let sleepTimerInput =
+                document.getElementById("sleep-timer").value;
+              if (
+                sleepTimerInput &&
+                !isNaN(sleepTimerInput) &&
+                Number(sleepTimerInput) > 0
+              ) {
+                settings.sleepTimer = parseInt(sleepTimerInput, 10) * 1000;
+              } else {
+                settings.sleepTimer = ""; // Or leave it undefined if that's preferred
+              }
+
               status.mastodon_logged
                 ? null
                 : (settings.mastodon_server_url = document.getElementById(

application/sw.js

@@ -31,7 +31,7 @@ self.onsystemmessage = (evt) => {
   } catch (e) {}
 };
 if (!userAgent.includes("KaiOS")) {
-  const CACHE_NAME = "pwa-cache-v0.1092";
+  const CACHE_NAME = "pwa-cache-v0.1099";
   const FILE_LIST_URL = "/file-list.json"; // URL of the JSON file containing the array of files
 
   self.addEventListener("install", (event) => {

application/worker.js

@@ -0,0 +1,23 @@
+let timerId = null;
+let endTime = 0;
+
+self.onmessage = function (event) {
+  const { action, duration } = event.data;
+
+  if (action === "start") {
+    endTime = Date.now() + duration;
+    clearInterval(timerId); // Clear any previous timer
+    timerId = setInterval(() => {
+      const remainingTime = endTime - Date.now();
+      if (remainingTime <= 0) {
+        clearInterval(timerId);
+        timerId = null; // Reset timerId when the timer completes
+        self.postMessage({ action: "stop" });
+      }
+    }, 1000); // Check every second
+  } else if (action === "stop") {
+    clearInterval(timerId);
+    timerId = null; // Reset timerId so that a new "start" message works correctly
+    endTime = 0; // Reset endTime to prevent continuing after stopping
+  }
+};