UserJS - Post Counter, Nope Button, Highlight Qs & Yous

// Nope Button
var imageBlacklist = [] ;
function loadImageBlacklist() { JSON.parse(localStorage.imageBlacklist || "[]").forEach(addToImageBlaclist); }
function saveImageBlacklist() { localStorage.imageBlacklist = JSON.stringify(imageBlacklist); }
function addToImageBlaclist(md5) { if (md5 && -1 === imageBlacklist.indexOf(md5)) imageBlacklist.push(md5); }
function blacklistPostImages(post) { $(post).find('img.post-image').each(function (i, el) { var md5 = el.getAttribute('data-md5'); addToImageBlaclist(md5); el.remove(); }); }
function removeBlacklistedImages() { var removed = 0; $('img.post-image').each(function (i, el) { if (-1 !== imageBlacklist.indexOf(el.getAttribute('data-md5'))) { el.remove(); removed += 1; } }); return removed; }
function onNopeClicked(event) { event.preventDefault(); event.stopPropagation(); loadImageBlacklist(); var post = $(event.target).closest('.post'); blacklistPostImages(post); removeBlacklistedImages(); saveImageBlacklist(); }
function addNopeButtons() { $('.post').each(function(i, post) { if ($(post).find('.nope').length === 0) { $(post).prepend("<input type='button' class='nope' onClick='onNopeClicked(event)' value='Nope'></input>"); } }) }
setInterval(function () { loadImageBlacklist(); removeBlacklistedImages(); addNopeButtons(); }, 500);

/* Display a replies counter overlay in the top right corner */
$(function(){
  $('head').append('<style>#thread_stats_posts_ovl { '+
  'position:fixed;top:35px;right:35px;'+
  'font:38px sans-serif;opacity:0.5;color:#f60;}</style>');
  $('body').append('<div id="thread_stats_posts_ovl"/>');
  function copyStats() { $('#thread_stats_posts_ovl').
    text($('#thread_stats_posts').text());}
  $(document).on('new_post',copyStats); copyStats();});

// User Settings
var anonsw = {
    qflair: '', // Examples: REAL, &rarr;
    qcolor: '#ffc',
    youcolor: '#fcc',
    scrollcolor: 'rgba(153, 153, 153, 0.6)',
    scrollbackcolor: '#333',
    scrolltime: 400, // ms
    updateDelay: 200, // ms
    sidenavWidth: 20, // px

floodEnabled: true,
    floodThreshold: 14, // min # posts before beginning fade
    floodVanish: 15, // max # posts before completed fade/hide
    floodBehavior: 'hide', // hide, hide
    fadenametripregex: /^(Anon(ymous)?-.*|.*-!!mG7VJxZNCI)$/i,
    fadenametripfloodvalue: -1, // Effective post count for fading, or -1 for auto of floodThreshold+post count
    strikeThroughNameFags: true,

    rateHistoryLen: 50, // Data points on chart
    rateAvgLen: 10 // Number of data points to average for instantaneous rate
};

(function( anonsw_main, $, undefined ) {
    // House keeping variables
    var qposts = [];
    var allqposts = [];
    var currq = -1;
    var youposts = [];
    var curryou = -1;
    var qnavposts = [];
    var younavposts = [];
    var ctx;
    var	borderSz;
    var	scrollWd;
    var minheight;
    var ratehistory = [];

    // Case insensitive contains selector for finding yous. SO #8746882
    $.expr[":"].icontains = jQuery.expr.createPseudo(function (arg) {
        return function (elem) {
            return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
        };
    });

    // Get non-child text. SO #3442394
    function immediateText(el) {
        return el.contents().not(el.children()).text();
    }

    // Highlight (you) posts/references
    function highlightYous() {
        $(youposts).each(function() {
            $(this).css('background-color', anonsw.youcolor);
        });
        return $.Deferred().resolve();
    }

    // Remove invalid (you)'s
    function removeInvalidYous() {
        $('div.body:icontains("(You)")').each(function() {
            $(this).find(':not(small)').contents().filter(function() { return this.nodeType == 3 }).each(function() {
                this.textContent = this.textContent.replace(/\(+ *You *\)+/ig, "you");
            });
        });
        return $.Deferred().resolve();
    }

    // Highlight Q posts
    function highlightQ() {
        $(allqposts).each(function(idx,val) {
            if($(val).css('background-color') !== anonsw.qcolor) {
                if(anonsw.qflair !== "") {
                    $(val).find('p.intro > label > span.trip').first().prepend(anonsw.qflair + " ");
                }
                $(val).css('background-color', anonsw.qcolor);
            }
        });
        return $.Deferred().resolve();
    }

    // Set which posts are Q posts
    function setQPosts() {
        qposts = $.map($('div.post:not(.post-hover) > p.intro > label > span.trip:contains("!!mG7VJxZNCI")'), function(el) {
            return $(el).closest('div.post');
        });
        allqposts = $.map($('div.post:not(.post-hover) > p.intro > label > span.trip:contains("!!mG7VJxZNCI")'), function(el) {
            return $(el).closest('div.post');
        });
        return $.Deferred().resolve();
    }

    // Set which posts are (you) posts
    function setYouPosts() {
        youposts = $.map($('div.post:not(.post-hover) > p.intro > label span.name > span.own_post, div.post:not(.post-hover) > div.body > p.body-line > small:icontains("(You)")'), function(el) {
            return $(el).closest('div.post');
        });
        return $.Deferred().resolve();
    }

    // Inserts side navigation (bird's eye)
    function sidenav() {
        $('body').append('<canvas id="sidenav"></canvas>');
        var nav = $('#sidenav');
        $(nav).css('position', 'fixed');
        $(nav).css('top', $('div.boardlist').height());
        $(nav).css('right', 0);
        $(nav).css('width', anonsw.sidenavWidth);
        $(nav).css('height', $(window).height() - $('div.boardlist').height());
        $(nav).css('background-color', anonsw.scrollbackcolor);
        $('body').css('margin-right', anonsw.sidenavWidth);
        ctx = $('#sidenav').get(0).getContext('2d');
        //ctx.canvas.height = $(document).height() - $('div.boardlist').height();
        ctx.canvas.height = 2048;
        ctx.canvas.width = anonsw.sidenavWidth;
        borderSz = 1;
        scrollWd = ctx.canvas.width / 2;
    }

    // Set flood posts
    function setFloodPosts() {
        if(anonsw.floodEnabled) {
            var stats = {};
            var firstId = null;
            //console.log("==[ Name Fags ]=================================================");
            var posts = $('div.post:not(.post-hover)').not('.you');
            $(posts).each(function () {
                var id = $(this).find('p > span.poster_id').first().text();
                if(firstId != null) {
                    if (!(id in stats)) {
                        stats[id] = {count: 0, namefag: false, floodcount: 0};
                    }
                    stats[id].count++;
                    if(!stats[id].namefag) {
                        var name = immediateText($(this).find('p > label span.name').first());
                        var trip = $(this).find('p > label > span.trip').first().text();
                        stats[id].namefag = !anonsw.fadenametripregex.test(name+'-'+trip);
                        //if(stats[id].namefag) {
                        //	console.log(id + '=' + stats[id].namefag + ', ' + name + ', ' + trip);
                        //}
                    }
                    if(stats[id].namefag) {
                        if(anonsw.fadenametripfloodvalue < 0) {
                            stats[id].floodcount = anonsw.floodThreshold + stats[id].count;
                        } else {
                            stats[id].floodcount = anonsw.fadenametripfloodvalue;
                        }
                    } else {
                        stats[id].floodcount = stats[id].count;
                    }
                }
                if (firstId == null) {
                    firstId = id;
                }
            });
            $.each(stats, function (key, value) {
                if (key !== firstId) {
                    var ids = $('span.poster_id:contains("' + key + '")');
                    if (value.floodcount > anonsw.floodThreshold || value.namefag) {
                        if(anonsw.strikeThroughNameFags && value.namefag) {
                            $(ids).each(function() {
                                    $(this).closest('div.post').hide();
                            });
                        }
                        if (anonsw.floodBehavior === 'fade') {
                            var intensity = value.floodcount;
                            if (intensity > anonsw.floodVanish) {
                                intensity = anonsw.floodVanish;
                            }
                            intensity = ((anonsw.floodVanish - anonsw.floodThreshold) - (intensity - anonsw.floodThreshold)) / (anonsw.floodVanish - anonsw.floodThreshold);
                            if (intensity < 0.1) {
                                intensity = 0.1;
                            }
                            $(ids).each(function () {
                                $(this).closest('div.post').css('opacity', intensity);
                                $(this).closest('div.post').hover(function () {
                                    $(this).animate({opacity: 1.0}, anonsw.updateDelay);
                                }, function () {
                                    $(this).animate({opacity: intensity}, anonsw.updateDelay);
                                });
                            });
                        } else if (anonsw.floodBehavior === 'hide') {
                            if (value.count >= anonsw.floodVanish) {
                                $(ids).each(function () {
                                    $(this).closest('div.post').hide();
                                });
                            }
                        }
                    } else {
                        $(ids).each(function () {
                            $(this).closest('div.post').css('opacity', 1.0);
                        });
                    }
                }
            });
        }
        return $.Deferred().resolve();
    }

     // Update navigation
   function updateNav() {
        updateNavGraphics();
    }


    // Update navigation graphics
    function updateNavGraphics() {
        var sidenav = $('#sidenav');
        if(sidenav.length) {
            $(sidenav).css('height', $(window).height() - $('div.boardlist').height());
            minheight = ctx.canvas.height / ($(window).height() - $('div.boardlist').height()); // 1px
            ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);

            // Draw nav q posts
            qnavposts = [];
            ctx.fillStyle = anonsw.qcolor;
            for (i = 0; i < qposts.length; i++) {
                // TODO: check if we have already added post, don't draw it again
                var el = $(qposts).get(i);
                var height = $(el).height() / $(document).height() * ctx.canvas.height;
                if(height < minheight) height = minheight;
                qnavposts[i] = {
                    x : borderSz,
                    y : $(el).offset().top / $(document).height() * ctx.canvas.height,
                    width : ctx.canvas.width - borderSz*2,
                    height : height
                };
                ctx.fillRect(qnavposts[i].x, qnavposts[i].y, qnavposts[i].width, qnavposts[i].height);
            }

            // Draw nav you posts
            younavposts = [];
            ctx.fillStyle = anonsw.youcolor;
            for (i = 0; i < youposts.length; i++) {
                // TODO: check if we have already added post, don't add it again
                var el = $(youposts).get(i);
                var height = $(el).height() / $(document).height() * ctx.canvas.height;
                if(height < minheight) height = minheight;
                younavposts[i] = {
                    x : borderSz,
                    y : $(el).offset().top / $(document).height() * ctx.canvas.height,
                    width : ctx.canvas.width - borderSz*2,
                    height : height
                };
                ctx.fillRect(younavposts[i].x, younavposts[i].y, younavposts[i].width, younavposts[i].height);
            }

            // Update nav window
            ctx.fillStyle = anonsw.scrollcolor;
            ctx.fillRect(
                scrollWd / 2,
                $(window).scrollTop() / $(document).height() * ctx.canvas.height,
                scrollWd,
                $(window).height() / $(document).height() * ctx.canvas.height
            );

            // Add red marker at bottom of >750 posts
            if($('#thread_stats_posts').text() > 750) {
                var barHeight = (4 * 2048) / ($(window).height() - $('div.boardlist').height());
                ctx.fillStyle = '#f66';
                ctx.fillRect(
                    0,
                    ctx.canvas.height - barHeight,
                    ctx.canvas.width,
                    barHeight
                );
            }
        }
    }

    // Toggle post flooding
    anonsw_main.toggleFlood = function() {
        if(anonsw.floodEnabled) {
            anonsw.floodEnabled = false;
            $('.toggleFloodState').text('On');
            if(anonsw.floodBehavior === 'fade') {
                $('span.poster_id').each(function () {
                    $(this).closest('div.post').css('opacity', 1);
                    $(this).closest('div.post').off('mouseenter mouseleave');
                });
            } else if(anonsw.floodBehavior === 'hide') {
                $(this).closest('div.post').show();
            }
        } else {
            anonsw.floodEnabled = true;
            $('.toggleFloodState').text('Off');
            runq()
        }
    };

    // Helper to run snippets in the right order
    function runq() {
        setQPosts()
            .done(highlightQ)
            .done(removeInvalidYous)
            .done(setYouPosts)
            .done(highlightYous)
            .done(setFloodPosts)
            .done(updateNav);
    }

    anonsw_main.Q = function() {
        sidenav();
        runq();

        // Select the node that will be observed for mutations
        var targetNode = $('div.thread')[0];

        // Options for the observer (which mutations to observe)
        var config = { childList: true };

        // Callback function to execute when mutations are observed
        var callback = function(mutationsList) {
            for(var mutation in mutationsList) {
                if (mutationsList[mutation].type == 'childList') {
                    runq();
                    break;
                }
            }
        };

        // Create an observer instance linked to the callback function
        var observer = new MutationObserver(callback);

        // Start observing the target node for configured mutations
        observer.observe(targetNode, config);
    };
}( window.anonsw_main = window.anonsw_main || {}, jQuery ));

// Attach snippets to ready/change events
$(document).ready(anonsw_main.Q);