From 1187776c99dd3a82551ab6d247ad09a2715923b3 Mon Sep 17 00:00:00 2001
From: Alex Collins <alex_collins@intuit.com>
Date: Mon, 27 Jan 2025 10:19:58 -0800
Subject: [PATCH] feat: pause log following on mouse over

---
 internal/index.html | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/internal/index.html b/internal/index.html
index bb161c0..148e764 100644
--- a/internal/index.html
+++ b/internal/index.html
@@ -13,6 +13,7 @@
             padding: 0;
             overflow: hidden;
         }
+
         body > div {
             margin: 16px;
         }
@@ -60,7 +61,7 @@
         <iframe id="logs" src='data:text/html,<p>Click on a task to see logs</p>'
                 onload="this.contentWindow.scrollTo(0, this.contentWindow.document.body.scrollHeight);"></iframe>
     </div>
-    <div><label><input type="checkbox" id="follow" checked>Follow</label></div>
+    <div id="follow"></div>
 </div>
 
 <script id="js">
@@ -132,6 +133,7 @@
                         name.textContent = n;
                         message.textContent = g.node(n).message;
                         logs.src = `/logs/${n}`;
+                        follow.innerHTML = 'Following logs';
                     });
 
                 // set the width and height of the svg to that of the graph
@@ -175,7 +177,7 @@
         );
 
     setInterval(() => {
-        if (follow.checked && !logs.src.startsWith('data:')) {
+        if (follow.innerHTML.includes( 'Following') && !logs.src.startsWith('data:')) {
             // update the src causing a reload, and also scroll to the bottom
             const x = logs.src;
             logs.src = '';
@@ -183,6 +185,9 @@
         }
     }, 3000);
 
+    logs.addEventListener('mouseover', () => follow.innerHTML = 'Paused logs');
+    logs.addEventListener('mouseout', () => follow.innerHTML = 'Following logs');
+
     const resize = () => {
         const innerWidth = window.innerWidth - 32;
         const innerHeight = window.innerHeight - 32 - 32 - 16 - 16 - 8;