Gelbooru Visited and Type Highlighter

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

Pada tanggal 15 April 2020. Lihat %(latest_version_link).

// ==UserScript==
// @name         Gelbooru Visited and Type Highlighter
// @namespace    http://tampermonkey.net/
// @version      2.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);
    var galleryLinks, css;

    if (searchParams.has('page') && searchParams.has('s') && searchParams.get('page') === 'post') {
        if (searchParams.get('s') == 'list') { // Search page
            // Get search results area
            let galleryContainer = document.querySelector('.contain-push');
            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
            css = document.createElement('style');
            css.innerHTML = `
			  .thumbnail-preview a .preview {
				  border: 3px solid ` + 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');
            searchParams.delete('pool_id');
            url.search = searchParams.toString();
            window.history.replaceState({}, '', '/' + url.href.substring(url.href.indexOf('/') + 1));
        }
    } else if (searchParams.has('page') && searchParams.has('s') && searchParams.get('s') === 'show' && searchParams.get('page') === 'pool') { // Pool page
        // Get all image thumbnail links
        galleryLinks = document.querySelectorAll('.thumb a');
        if (!!galleryLinks) {
            galleryLinks.forEach(galleryLink => {
                let linkURL = new URL(window.location.protocol + window.location.hostname + '/' + 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 "pool" 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('pool_id');
                var newLinkURL = new URL(linkURL);
                newLinkURL.search = searchParams.toString();
                galleryLink.href = newLinkURL;
            });
        }
        // Apply borders
        css = document.createElement('style');
        css.innerHTML = `
		  #content h3 + div *:not(:first-child) {
			  display: none !important;
		  }
		  #content h3 + div *:first-child {
			  margin-bottom: calc(-1 * (1em + 2px));
			  height: calc(1em + 2px);
			  background-color: currentColor;
			  display: block;
			  content: "";
			  border-radius: 6px;
		  }
		  .thumb a {
			  border: 1px solid #f0f0f0;
			  padding: 5px;
			  display: inline-block;
			  margin: -6px;
		  }
		  .thumb a .preview {
			  border: 3px solid ` + imgUnvistedColor + `;
			  margin: -3px;
		  }
		  .thumb a:visited .preview {
			  border-color: ` + imgVisitedColor + `;
		  }
		  .thumb a .preview[title*=" webm "] {
			  border: 5px solid ` + webmUnvistedColor + ` !important;
			  margin: -6px !important;
		  }
		  .thumb a:visited .preview[title*=" webm "] {
			  border-color: ` + webmVisitedColor + ` !important;
		  }
		  .thumb a .preview[title*="animated_gif"],
		  .thumb a .preview[title*="animated_png"],
		  .thumb a .preview[title*="animated "]:not([title*=" webm "]) {
			  border-color: ` + gifUnvisitedColor + `;
		  }
		  .thumb a:visited .preview[title*="animated_gif"],
		  .thumb a:visited .preview[title*="animated_png"],
		  .thumb a:visited .preview[title*="animated "]:not([title*=" webm "]) {
			  border-color: ` + gifVisitedColor + `;
		  }
		`;
        document.head.appendChild(css);
    }
})();