Mercurial > code > home > repos > front-door-display

--- a/src/scheduleLcd.css	Thu Jun 06 14:46:07 2024 -0700
+++ b/src/scheduleLcd.css	Thu Jun 06 14:49:04 2024 -0700
@@ -1,9 +1,10 @@
 html,
 body {
-  width: 320px;
+  width: 480px;
   height: 320px;
-  font-size: 22px;
+  font-size: 25px;
   position: relative;
+  background: url(check.png);
 }
 .area {
   border: 1px solid gray;
--- a/src/scheduleLcd.html	Thu Jun 06 14:46:07 2024 -0700
+++ b/src/scheduleLcd.html	Thu Jun 06 14:49:04 2024 -0700
@@ -2,7 +2,8 @@
 <html>
   <head>
     <meta charset="utf-8" />
-    <title>scheduleLcd</title>
+    <title>scheduleLcd - for the lcd screen that sits by a gaming computer and
+    tells you how much time is left</title>
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <link rel="stylesheet" type="text/css" media="screen" href="./main.css" />
     <link
@@ -37,17 +38,13 @@
         <span style="display: inline-block; background: blue;">B</span>
       </div>
     </div>
-    <!-- <div class="area" style="left: 2px; top: 180px; width: 60px; height: 100px">
+    <div class="area" style="left: 2px; top: 180px; width: 60px; height: 100px">
       map
     </div>
     <div class="area" style="left: 66px; top: 180px; right: 2px; bottom: 2px">
       comingsoon
-    </div> -->
+      <img src="face-simone_00487_.png" style="height: 100%">
+    </div>

-    <bigast-loginbar></bigast-loginbar>
-    <script
-      type="module"
-      src="https://bigasterisk.com/lib/bigast/v2/loginBar.js"
-    ></script>
   </body>
 </html>
--- a/src/scheduleLcd.ts	Thu Jun 06 14:46:07 2024 -0700
+++ b/src/scheduleLcd.ts	Thu Jun 06 14:49:04 2024 -0700
@@ -1,5 +1,5 @@
 import { addHours, endOfToday, endOfTomorrow, format, isAfter, isBefore, isToday, isTomorrow, isWithinInterval, parseISO, startOfToday } from "date-fns";
-import { css, html, LitElement, TemplateResult } from "lit";
+import { html, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { sortBy } from "lodash";
 import { DataFactory, NamedNode, Parser, Quad_Predicate, Quad_Subject, Store, Term } from "n3";
@@ -10,49 +10,40 @@
 const EV = "http://bigasterisk.com/event#";
 const RDF = "http://www.w3.org/1999/02/22-rdf-syntax-ns#";

-function updateTime() {
-  document.querySelector("#time").innerText = new Date().toTimeString().slice(0, 8);
-}
-setInterval(updateTime, 1000)
-updateTime()
+const es = new EventSource("http://localhost:8005/events");
+es.addEventListener("message", (msg) => {
+  (document.querySelector("#time") as HTMLElement).innerText = JSON.parse(msg.data).time.label;
+});

-// Function to send a POST request
-function sendPostRequest(data) {
-  fetch('https://example.com/api', {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-    },
-    body: JSON.stringify(data),
-  })
-  .then(response => {
-    if (!response.ok) {
-      throw new Error('Network response was not ok');
-    }
-    return response.json();
-  })
-  .then(data => {
-    console.log('POST request successful');
-    // Handle response data if needed
-  })
-  .catch(error => {
-    console.error('There was a problem with the POST request:', error);
-  });
+function notifyWebScraperOnAllDomChanges() {
+  function sendPostRequest(data: any) {
+    fetch("https://example.com/api", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(data),
+    })
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error("Network response was not ok");
+        }
+        return response.json();
+      })
+      .then((data) => {
+        console.log("POST request successful");
+      })
+      .catch((error) => {
+        console.error("There was a problem with the POST request:", error);
+      });
+  }
+
+  function handleDomChanges(mutationsList: MutationRecord[], observer: MutationObserver): void {
+    sendPostRequest({ domChanges: mutationsList });
+  }
+
+  const observer = new MutationObserver(handleDomChanges);
+  observer.observe(document.body, { subtree: true, childList: true, attributes: true });
 }

-// Callback function to handle DOM changes
-function handleDomChanges(mutationsList, observer) {
-  // Send a POST request whenever the DOM changes
-  sendPostRequest({ domChanges: mutationsList });
-}
-
-// Create a MutationObserver instance
-const observer = new MutationObserver(handleDomChanges);
-
-// Start observing the DOM for changes
-observer.observe(document.body, { subtree: true, childList: true, attributes: true });
-
-
 function getLiteral(store: Store, graph: Term, subj: Quad_Subject, pred: Quad_Predicate, missing: string | null): string {
   let out = null;
   store.getObjects(subj, pred, graph).forEach((attr) => {
@@ -116,18 +107,16 @@

   async load() {
     const store = new Store();
-    const r = await fetch("/gcalendarwatch/graph/calendar/upcoming",
-
-    {
-      method: 'GET',
-      headers: {
-        Accept: 'application/json',
-        'X-Pomerium-Authorization': document.cookie.substring(
-          document.cookie.indexOf('=') + 1,
-        ),
-      },
-    }
-
+    const r = await fetch(
+      "/gcalendarwatch/graph/calendar/upcoming",
+
+      {
+        method: "GET",
+        headers: {
+          Accept: "application/json",
+          "X-Pomerium-Authorization": document.cookie.substring(document.cookie.indexOf("=") + 1),
+        },
+      }
     );
     const n3txt = await r.text();
     const parser = new Parser({ format: "application/trig" });
@@ -149,24 +138,6 @@
   }
   static styles = [
     shared,
-    css`
-      ol {
-        list-style-type: circle;
-        font-size: 16px;
-        background: #cd66bb2e;
-        padding: 9px;
-        width: fit-content;
-        position: relative;
-        top: -21px;
-        border-radius: 14px;
-      }
-      span.d {
-        opacity: 0.5;
-      }
-      span.t {
-        color: #50fa7b;
-      }
-    `,
   ];
   render() {
     return html`
--- a/web_to_mqtt.py	Thu Jun 06 14:46:07 2024 -0700
+++ b/web_to_mqtt.py	Thu Jun 06 14:49:04 2024 -0700
@@ -20,14 +20,14 @@
         screenshot_command = [
             "google-chrome",
             "--headless",
-            "--window-size=320,480",
+            "--window-size=480,320",
             f"--screenshot={out.name}",
             url,
         ]
         subprocess.run(screenshot_command,
                        stdout=subprocess.DEVNULL,
                        stderr=subprocess.DEVNULL)
-        return Image.open(out.name).convert('RGB')
+        return Image.open(out.name).convert('RGB').rotate(-90, expand=True)


 blockX = 32
@@ -81,11 +81,11 @@
     renderer = WebRenderer()
     async with aiomqtt.Client("mqtt2") as client:
         asyncio.create_task(sendDirty(client))
-        last_image = Image.new('RGB', (320, 480))
+        last_image = Image.new('RGB', (320,480))
         while True:
             last_image = await check_for_changes(renderer, client, last_image)
             # we could get the web page to tell us when any dom changes
-            await asyncio.sleep(1)
+            await asyncio.sleep(60)


 if __name__ == "__main__":