Update Compass QoL Enhancer to 1.28.0

- Add a red background and important flag to priority news items

Compass QoL Enhancer.user.js

@@ -2,7 +2,7 @@
 // @name        Compass QoL Enhancer
 // @namespace   blankie-scripts
 // @match       http*://*.compass.education/*
-// @version     1.27.0
+// @version     1.28.0
 // @author      blankie
 // @description A userscript that adds small but useful features for Compass, such as the ability to close windows by clicking on the background
 // @inject-into page
@@ -131,16 +131,51 @@ function handleNewsItemClick(event) {
 }
 let NewsfeedItemWidget = getExtClass("Compass.widgets.NewsfeedItemWidget");
 if (NewsfeedItemWidget) {
-    let original = NewsfeedItemWidget.prototype.renderLayout;
+    function addImportantFlag(newsItem) {
+        let img = document.createElement("img");
+        img.src = `${newsItem.m_AssetPath}Pix/16x16/flag_orange.png`;
+        img.classList.add("priority-flag");
+        img.dataset.qtip = "This news item has been flagged as important";
+        newsItem.newsItemDetails.el.dom.querySelector("div > span > div > span").append(img);
+    }
+
+    let originalRenderLayout = NewsfeedItemWidget.prototype.renderLayout;
     NewsfeedItemWidget.prototype.renderLayout = function() {
-        original.apply(this, arguments);
+        originalRenderLayout.apply(this, arguments);
         // prevent clicking on text from expanding the item since this disrupts selecting text, and we're gonna extend this to the entire item anyway
         this.newsItemTextContainer.events.afterrender = true;
-        // Expand news feed items by clicking on them
         this.on("afterrender", function() {
+            // Expand news feed items by clicking on them
             this.el.on("click", handleNewsItemClick.bind(this), this.el);
+            // Add important flag to priority news items
+            if (this.priority) {
+                addImportantFlag(this);
+            }
         });
     }
+
+    // Highlight priority news items with red
+    let originalInitComponent = NewsfeedItemWidget.prototype.initComponent;
+    NewsfeedItemWidget.prototype.initComponent = function() {
+        if (this.priority) {
+            this.cls += " qol-priority-news-item";
+        }
+        originalInitComponent.apply(this, arguments);
+    };
+    let style = document.createElement("style");
+    style.textContent = `
+        .newLNF .newsfeed-newsItem.qol-priority-news-item {
+            background-color: rgb(255, 230, 230);
+        }
+        .newLNF .newsfeed-newsItem.qol-priority-news-item .fade {
+            background-image: -webkit-linear-gradient(top, transparent, rgb(255, 230, 230));
+        }
+        .qol-priority-news-item .priority-flag {
+            vertical-align: text-top;
+            margin-left: 0.25em;
+        }
+    `;
+    document.head.append(style);
 }
 
 // Make links in Looking Ahead actual links

README.md

@@ -55,6 +55,7 @@ A userscript that adds small but useful features for Compass. Features are:
   use [Link Hints] and ctrl-click to open them)
 - Class and news feed items can now be opened by simply clicking on their
   background
+- Prioritised news feed items now have a red background and important flag
 - Make links in Looking Ahead actual links (you can ctrl-click them and they
   now work with [Link Hints])
 - The context menu that only says "Copy" is now suppressed