☰

Facebook YOUR Notifications Highlighter

Highlights the more interesting notifications for YOU.

当前为 2017-02-27 提交的版本，查看 最新版本。

// ==UserScript==
// @name         Facebook YOUR Notifications Highlighter
// @namespace    http://www.JamesKoss.com/
// @version      1.31
// @description  Highlights the more interesting notifications for YOU.
// @author       James Koss
// @match        https://www.facebook.com/*
// ==/UserScript==

(function() {
    'use strict';
    
    var first = true;
    var timed = false;
    var scrolled = false;
    
    // Update notifications on scrolling.
    // Not too often. Arbitrary delay.
    function onScrollNots() {
        if (scrolled === false) {
            scrolled = true;
            
            updateNotifications();
            // Delay until next check from scroll. Arbitrary delay.
            setTimeout(function() { scrolled = false; }, 1000);
        }
    }
    
    // After clicking the notification, remove highlight color and eventListener.
    function removeHighlight(e) {
        e.currentTarget.removeEventListener("click", removeHighlight, false);
        
        e.currentTarget.style.backgroundColor = "";
        if (e.currentTarget.paramA !== null) {
            e.currentTarget.paramA.style.backgroundColor = "";
        }
    }
    
    // Update relevant notifications with highlight.
    function updateNotifications() {
        // Delay before element updates, so they load first. Arbitrary delay!
        if (timed === false) {
            setTimeout(function(){ timed = true; updateNotifications(); }, 1000);
            return;
        }
        
        // On first viewing, add updating when scrolling the notifications.
        if (first === true) {
            first = false;
            var scrolledArea = document.querySelector('div[class="uiScrollableAreaWrap scrollable"]');
            scrolledArea.addEventListener("scroll", onScrollNots);
        }
        
        var notificationsHolder = document.querySelector('div[class="_33p"]');
        // Only check new notifications.
        var notificationsNew = notificationsHolder.querySelectorAll('li[class="_33c jewelItemNew"]');

        for (var i = 0; i < notificationsNew.length; i++) {
            var current = notificationsNew[i];
            
            var notificationParent = current.querySelector('div[class="_4l_v"]');
            var notificationYour = notificationParent.querySelectorAll('span');
            
            // match 1 for interest highlight, 2 for "Like" highlight.
            var match = false;
            for (var j=0; j < notificationYour.length; j++) {
                var cur = notificationYour[j];
                var t = cur.textContent;
                
                // Relevant text inside notification element.
                if (t.indexOf("replied to your") !== -1 ||
                    t.indexOf("commented on your") !== -1 ||
                    t.indexOf("shared your") !== -1 ||
                    t.indexOf("mentioned you") !== -1 ||
                    t.indexOf("tagged you") !== -1 ||
                    t.indexOf("made you") !== -1 ||
                    t.indexOf("also replied") !== -1 ||
                    (t.indexOf("replied to") !== -1 && t.indexOf("on your") !== -1)) {
                    match = 1;
                    break;
                } else if (t.indexOf("likes your") !== -1 ||
                          t.indexOf("like your") !== -1 ||
                          t.indexOf("liked your") !== -1) {
                    match = 2;
                    break;
                } else if (t.indexOf("approved your") !== -1) {
                    match = 3;
                    break;
                } else if (t.indexOf("needs review") !== -1) {
                    match = 4;
                    break;
                }
            }
            
            // No match.
            if (match === false) {
                continue;
            }
            
            // Select color by matching value.
            var color;
            switch(match) {
                case 1:
                    color = "#c3d4ef"; // darker blue
                    break;
                case 2:
                    color = "#faedf8"; // light pink
                    break;
                case 3:
                    color = "#d7f4d7"; // light green
                    break;
                case 4:
                    color = "#dec3ef"; // darker purple
                    break;
            }
            
            // Update the li & a elements backgrounds.
            var a = current.querySelector('a[class="_33e _1_0e"]');
            if (a !== null) {
                a.style.backgroundColor = color;
            }
            current.style.backgroundColor = color;
            
            current.paramA = a; // Pass to object, for highlight removal after clicked.
            current.addEventListener("click", removeHighlight, false);
        }
        
        timed = false;
    }
    
    // Right-Clicking the notifications button on FB.
    function onclickJewel(e) {
        if (e.which === 1) {
            updateNotifications();
        }
    }
    
    // Listen to a click on the notifications button on FB.
    var fbNotificationsJewel = document.getElementById("fbNotificationsJewel");
    fbNotificationsJewel.addEventListener("click", onclickJewel);
})();