nicolaslegland / image

// ==UserScript==
// @author      Nicolas Le Gland
// @copyright   2019, nicolaslegland (https://openuserjs.org/users/nicolaslegland)
// @description Improve image background.
// @downloadURL https://openuserjs.org/src/scripts/nicolaslegland/image.user.js
// @grant       none
// @homepageURL https://openuserjs.org/scripts/nicolaslegland/image
// @icon        https://www.google.com/chrome/static/images/favicons/favicon.ico
// @include     *.gif
// @include     *.jpg
// @include     *.jpeg
// @include     *.png
// @include     *.svg
// @installURL  https://openuserjs.org/src/scripts/nicolaslegland/image.user.js
// @license     GPL-3.0-or-later
// @name        image
// @run-at      document-end
// @supportURL  https://openuserjs.org/scripts/nicolaslegland/image/issues
// @updateURL   https://openuserjs.org/src/scripts/nicolaslegland/image.user.js
// @version     2
// ==/UserScript==

var background = 'url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgAQMAAABJtOi3AAAABlBMVEXu7u7///8o06qaAAAAFElEQVR42mNgYPj/n4GKBHVNYwAA7b0/wQxbBowAAAAASUVORK5CYII=\')';
var border = '1px solid #bbb';

var element, parent, style;
if (element = document.getElementsByTagName('img')[0])
{
    style = element.style;
    style.background = background;
    style.border = border;
    if (element = document.getElementsByTagName('body')[0])
    {
        style = element.style;
        style.background = '#fff';
    }
}

if (element = document.getElementsByTagName('svg')[0])
{
    style = element.style;
    style.background = background;
    style.border = border;
    style.top = style.left = '50%';
    style.position = 'absolute';
    style.transform = 'translate(-50%, -50%)';

    parent = document.createElement('html');
    element.parentNode.replaceChild(parent, element);
    parent.appendChild(element);

    parent = document.createElement('body');
    parent.setAttribute('style', 'background: #fff;');
    element.parentNode.replaceChild(parent, element);
    parent.appendChild(element);
}