Raw Source Toggle Dropdown

• Minified Source

DanielTepesKraus / Transparent Image Background Color Switch

// ==UserScript==
// @name        Transparent Image Background Color Switch
// @namespace   Transparent Image Background Color Switch
// @description Swaps the background colors of animated images between the light and dark themes
// @author       DanielTepesKraus | https://www.derpibooru.org/profiles/DanielTepesKraus
// @include      https://derpibooru.org/*
// @include      https://www.derpibooru.org/*
// @include      https://derpiboo.ru/*
// @include      https://www.derpiboo.ru/*
// @include      https://trixiebooru.org*
// @include      https://www.trixiebooru.org*
// @grant        none
// @version      2.1
// ==/UserScript==
/* jshint -W097 */
'use strict';


// ***** SET THIS TO 0 TO ONLY HAVE BUTTON ON APPLICABLE IMAGES *****


var AlwaysLink = 1;


// ******************************************************************



var isdark = 0;
var colorvalue = new Array("rgb(30, 34, 41)", "rgb(255, 255, 255)");
var linkset = 0

function colorswap(){
  if(document.getElementById('image-display').style.backgroundColor != colorvalue[isdark]){
    document.getElementById('image-display').style.backgroundColor = colorvalue[isdark];
    return;
    }else{
    document.getElementById('image-display').style.backgroundColor = 'transparent';
    }
}

[...document.querySelectorAll('.tag__name')].forEach(setLink);

function setLink(el) {
  if ((AlwaysLink == 1 || el.textContent == "transparent background" || el.textContent == "transparent" || el.textContent == "derpibooru theme illusion") && linkset === 0){
    linkset = 1
    document.getElementById('image-display').style.backgroundColor = 'transparent'
    var ToggleButton = document.createElement('span');
    document.getElementById("extrameta").appendChild(ToggleButton);
    document.getElementById("extrameta").innerHTML = document.getElementById("extrameta").innerHTML + "<a href='javascript:return_false;' id='ToggleLink'><span class='hide-mobile'><i class='fa fa-exchange'></i>Toggle BG Color</span></a>";
    var SetFunct = document.getElementById("ToggleLink");
    SetFunct.onclick = colorswap;
    var colormode = window.getComputedStyle(document.body, null).backgroundColor;
    if (colormode != 'rgb(255, 255, 255)'){
      isdark = 1
    }else{
      isdark = 0
    }
  }
}