Gelbooru Visited and Type Highlighter

Marks previously visited images on Gelbooru search pages, and extends animation highlighting from webm to also include gifs.

As of 2020-04-13. See the latest version.

// ==UserScript==
// @name         Gelbooru Visited and Type Highlighter
// @namespace    http://tampermonkey.net/
// @version      1.0.1
// @description  Marks previously visited images on Gelbooru search pages, and extends animation highlighting from webm to also include gifs.
// @author       Xerodusk
// @homepage     https://greasyfork.org/en/users/460331-xerodusk
// @match        https://gelbooru.com/index.php*
// @grant        none
// @icon         https://gelbooru.com/favicon.png
// ==/UserScript==
/* jshint esversion: 6 */

/*   configuration   */
var imgUnvistedColor = '#E1F5FE'; // Color for unvisted images (Note: MUST BE A VALID, NON-TRANSPARENT COLOR FOR *VISITED* COLOR TO WORK)
var imgVisitedColor = '#2E7D32'; // Color for visited images
var webmUnvistedColor = '#1565C0'; // Color for unvisted WebMs
var webmVisitedColor = '#C62828'; // Color for visited WebMs
var gifUnvisitedColor = '#FFD600'; // Color for unvisited gifs/pngs
var gifVisitedColor = '#6A1B9A'; // Color for visited gifs/pngs

/*-------------------*/

(function() {
    'use strict';

    let searchParams = new URLSearchParams(window.location.search);

    if (searchParams.has('page') && searchParams.has('s') && searchParams.get('page') === 'post') {
        if (searchParams.get('s') == 'list') { // Search page
            // Get search results area
            var galleryContainer = document.querySelector('.contain-push');
            var galleryLinks;
            if (!!galleryContainer) {
                // Get all image thumbnail links
                galleryLinks = galleryContainer.querySelectorAll('.thumbnail-preview a');
            }
            if (!!galleryLinks) {
                galleryLinks.forEach(galleryLink => {
                    let linkURL = new URL('https:' + galleryLink.getAttribute('href'));
                    // Set click to go to the original url to preserve next/previous feature
                    galleryLink.setAttribute('onclick', 'window.location = "' + linkURL + '";return false;');
                    // Remove the "tags" attribute so the link being used for this
                    // is constant for the same image across all searches it is included in
                    var searchParams = new URLSearchParams(linkURL.search);
                    searchParams.delete('tags');
                    var newLinkURL = new URL(linkURL);
                    newLinkURL.search = searchParams.toString();
                    galleryLink.href = newLinkURL;
                });
            }
            // Apply borders
            var css = document.createElement('style');
            css.innerHTML = `
			  .thumbnail-preview a .preview {
				  border-width: 3px;
				  border-style: solid;
				  border-color: ` + imgUnvistedColor + `;
				  margin: -3px;
			  }
			  .thumbnail-preview a:visited .preview {
				  border-color: ` + imgVisitedColor + `;
			  }
			  .thumbnail-preview a .preview.webm {
				  border-color: ` + webmUnvistedColor + ` !important;
			  }
			  .thumbnail-preview a:visited .preview.webm {
				  border-color: ` + webmVisitedColor + ` !important;
			  }
			  .thumbnail-preview a .preview[title*="animated_gif"],
			  .thumbnail-preview a .preview[title*="animated_png"],
			  .thumbnail-preview a .preview[title*="animated "]:not(.webm) {
				  border-color: ` + gifUnvisitedColor + `;
			  }
			  .thumbnail-preview a:visited .preview[title*="animated_gif"],
			  .thumbnail-preview a:visited .preview[title*="animated_png"],
			  .thumbnail-preview a:visited .preview[title*="animated "]:not(.webm) {
				  border-color: ` + gifVisitedColor + `;
			  }
			`;
            document.head.appendChild(css);
        } else if (searchParams.get('s') === 'view') { // Image page
            // Add URL without the "tags" attribute to the history
            // so as to make it match what the search results pages are modified for
            // (and avoid breaking back button functionality while we're at it)
            var url = new URL(window.location);
            searchParams.delete('tags');
            url.search = searchParams.toString();
            window.history.replaceState({}, '', '/' + url.href.substring(url.href.indexOf('/') + 1));
        }
    }
})();