From 6496127459453d085587dc3c0cefbcd09716d7a9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Magnus=20B=C3=B8rnes?= <magnus.bornes@ntnu.no>
Date: Wed, 23 Oct 2024 14:17:07 +0200
Subject: [PATCH] Update topdesk-highlight-summary.user.js.

Highlight dates and some formatting.
---
 topdesk-highlight-summary.user.js | 35 ++++++++++++++++++++++++-------
 1 file changed, 28 insertions(+), 7 deletions(-)

diff --git a/topdesk-highlight-summary.user.js b/topdesk-highlight-summary.user.js
index 611592c..e356516 100644
--- a/topdesk-highlight-summary.user.js
+++ b/topdesk-highlight-summary.user.js
@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         TOPdesk - Highlight Summary
 // @namespace    http://tampermonkey.net/
-// @version      1.0
+// @version      1.1
 // @description  Highlight the summary section in a box with rounded corners and white background
 // @author       Magnus Børnes (magnborn@ntnu.no)
 // @match        https://hjelp.ntnu.no/*
@@ -26,15 +26,22 @@
             // Match the summary text
             const summaryMatch = html.match(/<br>Summary: (.*?)\.<br><br>/);
 
-            if (summaryMatch) {
-                // Extract the summary text
-                const summaryText = summaryMatch[0];
+            if (summaryMatch && !div.querySelector('.highlighted-summary')) {
+                // Extract the summary text without "Summary: "
+                let summaryText = summaryMatch[1];
 
-                // Create a highlighted box
-                const highlightedBox = `<div style="border: 2px solid #000; border-radius: 10px; background-color: #fff; padding: 10px; margin: 10px 0;">${summaryText}</div>`;
+                // Make all dates bold
+                summaryText = summaryText.replace(/(\b(?:early|mid|late)?-?\s?(?:January|February|March|April|May|June|July|August|September|October|November|December)\s?\d{0,4}(?:\s\(\w+\s\d{4}\))?\b)/g, '<strong>$1</strong>');
+
+                // Create a highlighted box with a heading
+                const highlightedBox = `
+                    <div class="highlighted-summary" style="border: 1px solid #000; border-radius: 10px; background-color: #fff; padding: 10px; margin: 10px 0; max-width: 600px;">
+                        <h3>Summary</h3>
+                        <p>${summaryText}.</p>
+                    </div>`;
 
                 // Replace the summary text with the highlighted box
-                html = html.replace(summaryText, highlightedBox);
+                html = html.replace(summaryMatch[0], highlightedBox);
 
                 // Update the div's inner HTML
                 div.innerHTML = html;
@@ -44,4 +51,18 @@
 
     // Run the function to highlight the summary
     highlightSummary();
+
+    // Debounce function to limit the frequency of highlightSummary calls
+    function debounce(func, wait) {
+        let timeout;
+        return function(...args) {
+            clearTimeout(timeout);
+            timeout = setTimeout(() => func.apply(this, args), wait);
+        };
+    }
+
+    // Reapply the highlighting 1 second after the window is resized
+    window.addEventListener('resize', debounce(() => {
+        highlightSummary();
+    }, 1000));
 })();