I created a Tampermonkey script to highlight one's own point messages in chat

bl4ckscor3 · May 25, 2020, 2:15pm

I wanted a way to easier find messages in chat that say how many points I have earned, so I quickly threw together a userscript for the Tampermonkey browser extension that highlights such messages. The script works for any user as it gets the account name from the top right and compares chat messages against that.
I have tested this with the Firefox, Google Chrome, and Vivaldi browsers using the Tampermonkey extension. I don’t know if Greasemonkey or other browsers work. The color cannot be changed via a setting in the UI, however you can edit the script to change the color (line 18).
I’d like to add, that due to the way the message detection works (if the message starts with the user’s name, highlight it), achievement messages are affected as well. I don’t think, that that’s a big deal, but if wanted, I can of course adjust the script to ignore certain messages.

Source code and installation how-to can be found here: https://github.com/bl4ckscor3/HighlightMyPoints

Maybe this is useful to some of you

Images:
2020-05-25_15-51-22 2020-05-25_16-01-00

bl4ckscor3 · June 2, 2020, 3:00pm

I just updated the script to be more performant. It now no longer checks every single chat message, but only new ones.

amy · July 15, 2020, 3:57pm

Awesome! We’re going to add your script to the official Eyewire Add-Ons blog. https://blog.eyewire.org/addons-player-scripts-in-eyewire/

KrzysztofKruk · July 15, 2020, 4:32pm

Great job!

A small suggestion: check for acc + " " instead of only acc. It will help you in a situation when one user is named e.g. “user” and other “user1”. Currently all “user1” messages will be also highlighted for “user”.

Also, you can use a MutationObserver() instead of setInterval(). It will only be called, when something has changed in the chat and will return you only the changed elements (new messages). You can see it being used for some chat markup here:

github.com

ChrisRaven/EWDLC/blob/bae1f9b6299eeb9d6d95b7386e21899a9728ae05/src/modules/tabbedChat/TabbedChat.js#L494




chatInput
    .focus(function () {
        filterMessages();
        $("#charLeft").fadeIn(200);
    })
    .focusout(function () {
        $("#charLeft").fadeOut(200);
    });


var mutationObserver = new MutationObserver(moCallback);
mutationObserver.observe(document.getElementsByClassName('chatMsgContainer')[0], {
    childList: true,
    attributres: false,
    characterData: false,
    subtree: false
});


function moCallback(records) {
    var record = records[0];
    if (!record.addedNodes) return;

bl4ckscor3 · July 15, 2020, 5:56pm

Thank you very much for your input, KrzysztofKruk! I can’t believe I did not think of adding the space for the account name check, haha. It’s a small detail but so easy to miss. Also thanks for telling me about MutationObserver, that actually fixes the messages not immediately getting highlighted upon being added to chat, which has always bothered me a tiny bit

amy: That is amazing! Great to hear you guys like my script

EDIT: Forgot to say that I updated the script with the two suggestions.

bl4ckscor3 · August 17, 2020, 9:38pm

I just updated the script to add settings for toggling on/off highlighting specific message types. You can see the settings in this screenshot, they are enabled by default:

The settings for scouting and reaping points are only visible to the applicable roles.

While it should be self explanatory, here’s a short demonstration of me turning the setting for normal point messages off after the first highlighted message. Note the second unhighlighted message telling me about earned points. The settings will not be applied to already sent messages. Only new messages will be affected by a setting change.

I also have planned to make the highlight color customizable per message type (so for instance you could have red normal point messages and green “/me”-messages), however I did not have the time to do this today so I will release a followup patch when I have that implemented.

bl4ckscor3 · August 18, 2020, 4:07pm

All right, this was completed earlier than I expected. There are now color pickers available for each option. They use the same picker as @KrzysztofKruk’s custom highlight plugin, however I chose to not style the pickers the same as with his settings, to make it clear to the user that they can select a color for the setting above the picker.

Short demonstration video:

I know of a bug where sometimes the colors get loaded as black, but I was not able to track it down so far.

bl4ckscor3 · August 23, 2020, 9:41am

Updated the script to fix a bug where retro point messages get shown with the color for normal point messages.