Google Images View Button

At the Google Images preview pan the script adds a button that opens an image in a new tab

Versión del día 25/02/2025. Echa un vistazo a la versión más reciente.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Necesitará instalar una extensión como Tampermonkey para instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name          Google Images View Button
// @description   At the Google Images preview pan the script adds a button that opens an image in a new tab
// @author        Konf
// @namespace     https://greatest.deepsurf.us/users/424058
// @icon          https://www.google.com/s2/favicons?sz=64&domain=google.com
// @version       1.0.0
// @match         *://*.google.com/search*
// @match         *://*.google.ad/search*
// @match         *://*.google.ae/search*
// @match         *://*.google.com.af/search*
// @match         *://*.google.com.ag/search*
// @match         *://*.google.com.ai/search*
// @match         *://*.google.al/search*
// @match         *://*.google.am/search*
// @match         *://*.google.co.ao/search*
// @match         *://*.google.com.ar/search*
// @match         *://*.google.as/search*
// @match         *://*.google.at/search*
// @match         *://*.google.com.au/search*
// @match         *://*.google.az/search*
// @match         *://*.google.ba/search*
// @match         *://*.google.com.bd/search*
// @match         *://*.google.be/search*
// @match         *://*.google.bf/search*
// @match         *://*.google.bg/search*
// @match         *://*.google.com.bh/search*
// @match         *://*.google.bi/search*
// @match         *://*.google.bj/search*
// @match         *://*.google.com.bn/search*
// @match         *://*.google.com.bo/search*
// @match         *://*.google.com.br/search*
// @match         *://*.google.bs/search*
// @match         *://*.google.bt/search*
// @match         *://*.google.co.bw/search*
// @match         *://*.google.by/search*
// @match         *://*.google.com.bz/search*
// @match         *://*.google.ca/search*
// @match         *://*.google.cd/search*
// @match         *://*.google.cf/search*
// @match         *://*.google.cg/search*
// @match         *://*.google.ch/search*
// @match         *://*.google.ci/search*
// @match         *://*.google.co.ck/search*
// @match         *://*.google.cl/search*
// @match         *://*.google.cm/search*
// @match         *://*.google.cn/search*
// @match         *://*.google.com.co/search*
// @match         *://*.google.co.cr/search*
// @match         *://*.google.com.cu/search*
// @match         *://*.google.cv/search*
// @match         *://*.google.com.cy/search*
// @match         *://*.google.cz/search*
// @match         *://*.google.de/search*
// @match         *://*.google.dj/search*
// @match         *://*.google.dk/search*
// @match         *://*.google.dm/search*
// @match         *://*.google.com.do/search*
// @match         *://*.google.dz/search*
// @match         *://*.google.com.ec/search*
// @match         *://*.google.ee/search*
// @match         *://*.google.com.eg/search*
// @match         *://*.google.es/search*
// @match         *://*.google.com.et/search*
// @match         *://*.google.fi/search*
// @match         *://*.google.com.fj/search*
// @match         *://*.google.fm/search*
// @match         *://*.google.fr/search*
// @match         *://*.google.ga/search*
// @match         *://*.google.ge/search*
// @match         *://*.google.gg/search*
// @match         *://*.google.com.gh/search*
// @match         *://*.google.com.gi/search*
// @match         *://*.google.gl/search*
// @match         *://*.google.gm/search*
// @match         *://*.google.gr/search*
// @match         *://*.google.com.gt/search*
// @match         *://*.google.gy/search*
// @match         *://*.google.hk/search*
// @match         *://*.google.com.hk/search*
// @match         *://*.google.hn/search*
// @match         *://*.google.hr/search*
// @match         *://*.google.ht/search*
// @match         *://*.google.hu/search*
// @match         *://*.google.co.id/search*
// @match         *://*.google.ie/search*
// @match         *://*.google.co.il/search*
// @match         *://*.google.im/search*
// @match         *://*.google.co.in/search*
// @match         *://*.google.iq/search*
// @match         *://*.google.is/search*
// @match         *://*.google.it/search*
// @match         *://*.google.je/search*
// @match         *://*.google.com.jm/search*
// @match         *://*.google.jo/search*
// @match         *://*.google.jp/search*
// @match         *://*.google.co.jp/search*
// @match         *://*.google.co.ke/search*
// @match         *://*.google.com.kh/search*
// @match         *://*.google.ki/search*
// @match         *://*.google.kg/search*
// @match         *://*.google.co.kr/search*
// @match         *://*.google.com.kw/search*
// @match         *://*.google.kz/search*
// @match         *://*.google.la/search*
// @match         *://*.google.com.lb/search*
// @match         *://*.google.li/search*
// @match         *://*.google.lk/search*
// @match         *://*.google.co.ls/search*
// @match         *://*.google.lt/search*
// @match         *://*.google.lu/search*
// @match         *://*.google.lv/search*
// @match         *://*.google.com.ly/search*
// @match         *://*.google.co.ma/search*
// @match         *://*.google.md/search*
// @match         *://*.google.me/search*
// @match         *://*.google.mg/search*
// @match         *://*.google.mk/search*
// @match         *://*.google.ml/search*
// @match         *://*.google.com.mm/search*
// @match         *://*.google.mn/search*
// @match         *://*.google.ms/search*
// @match         *://*.google.com.mt/search*
// @match         *://*.google.mu/search*
// @match         *://*.google.mv/search*
// @match         *://*.google.mw/search*
// @match         *://*.google.com.mx/search*
// @match         *://*.google.com.my/search*
// @match         *://*.google.co.mz/search*
// @match         *://*.google.com.na/search*
// @match         *://*.google.com.ng/search*
// @match         *://*.google.com.ni/search*
// @match         *://*.google.ne/search*
// @match         *://*.google.nl/search*
// @match         *://*.google.no/search*
// @match         *://*.google.com.np/search*
// @match         *://*.google.nr/search*
// @match         *://*.google.nu/search*
// @match         *://*.google.co.nz/search*
// @match         *://*.google.com.om/search*
// @match         *://*.google.com.pa/search*
// @match         *://*.google.com.pe/search*
// @match         *://*.google.com.pg/search*
// @match         *://*.google.com.ph/search*
// @match         *://*.google.com.pk/search*
// @match         *://*.google.pl/search*
// @match         *://*.google.pn/search*
// @match         *://*.google.com.pr/search*
// @match         *://*.google.ps/search*
// @match         *://*.google.pt/search*
// @match         *://*.google.com.py/search*
// @match         *://*.google.com.qa/search*
// @match         *://*.google.ro/search*
// @match         *://*.google.ru/search*
// @match         *://*.google.rw/search*
// @match         *://*.google.com.sa/search*
// @match         *://*.google.com.sb/search*
// @match         *://*.google.sc/search*
// @match         *://*.google.se/search*
// @match         *://*.google.com.sg/search*
// @match         *://*.google.sh/search*
// @match         *://*.google.si/search*
// @match         *://*.google.sk/search*
// @match         *://*.google.com.sl/search*
// @match         *://*.google.sn/search*
// @match         *://*.google.so/search*
// @match         *://*.google.sm/search*
// @match         *://*.google.sr/search*
// @match         *://*.google.st/search*
// @match         *://*.google.com.sv/search*
// @match         *://*.google.td/search*
// @match         *://*.google.tg/search*
// @match         *://*.google.co.th/search*
// @match         *://*.google.com.tj/search*
// @match         *://*.google.tl/search*
// @match         *://*.google.tm/search*
// @match         *://*.google.tn/search*
// @match         *://*.google.to/search*
// @match         *://*.google.com.tr/search*
// @match         *://*.google.tt/search*
// @match         *://*.google.com.tw/search*
// @match         *://*.google.co.tz/search*
// @match         *://*.google.com.ua/search*
// @match         *://*.google.co.ug/search*
// @match         *://*.google.co.uk/search*
// @match         *://*.google.com.uy/search*
// @match         *://*.google.co.uz/search*
// @match         *://*.google.com.vc/search*
// @match         *://*.google.co.ve/search*
// @match         *://*.google.vg/search*
// @match         *://*.google.co.vi/search*
// @match         *://*.google.com.vn/search*
// @match         *://*.google.vu/search*
// @match         *://*.google.ws/search*
// @match         *://*.google.rs/search*
// @match         *://*.google.co.za/search*
// @match         *://*.google.co.zm/search*
// @match         *://*.google.co.zw/search*
// @match         *://*.google.cat/search*
// @compatible    Chrome
// @compatible    Opera
// @compatible    Firefox
// @require       https://cdnjs.cloudflare.com/ajax/libs/arrive/2.5.1/arrive.min.js#sha512-S6/M9HI1VpYN4XEK7JQjSyroulxrXPBX82ckxB/vWa9jR1XVaiFgSNRSDrgQ0U/FmFwkkhhIPq33ZKE5ZoDBHQ==
// @run-at        document-body
// @grant         GM_addStyle
// @grant         GM_setValue
// @grant         GM_getValue
// @grant         GM_registerMenuCommand
// @grant         GM_unregisterMenuCommand
// @noframes
// ==/UserScript==

/**
 * Hi! Don't change (or even resave) anything here because
 * by doing this in Tampermonkey you will turn off updates
 * of the script (idk about other script managers).
 * This could be restored in settings but it might be hard to find,
 * so better to reinstall the script if you're not sure
*/

/* jshint esversion: 11 */

(function() {
  'use strict';

  let ignoreThumbnails = GM_getValue('ignoreThumbnails', true);

  (function(){
    let menuId = null;

    function updateMenu() {
      if (menuId) GM_unregisterMenuCommand(menuId);

      menuId = GM_registerMenuCommand(`Ignore thumbnails: ${ignoreThumbnails}`, () => {
        ignoreThumbnails = !ignoreThumbnails;

        GM_setValue('ignoreThumbnails', ignoreThumbnails);
        updateMenu();
      });
    }

    updateMenu();
  }());

  document.arrive('div[decode-data-ved][data-hveid="2"]', {
    existing: true,
  }, async (topContainer) => {
    waitForNode('a > img', {
      rootNode: topContainer,
      [`${ignoreThumbnails ? 'onceOnly' : 'existing'}`]: true,
    }, (image) => {
      // Recursion skip
      if (image.classList.contains('GIVB-icon')) return;

      let btn = image.parentElement.querySelector('a.GIVB-btn');

      if (btn) {
        btn.href = image.src;
        return;
      }

      const icon = document.createElement('img');

      btn = document.createElement('a');

      btn.addEventListener('click', (ev) => {
        ev.preventDefault();
        window.open(btn.href, '_blank');
      });

      btn.href = image.src;
      btn.title = 'Open in a new tab';
      btn.className = 'GIVB-btn';
      icon.className = 'GIVB-icon';
      icon.draggable = false;

      btn.append(icon);
      image.parentElement.append(btn);

      // https://icons8.com/icon/43740/linking
      // https://img.icons8.com/small/96/ffffff/external-link-squared.png
      icon.src = [
        'data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4A',
        'AAACXBIWXMAAAsTAAALEwEAmpwYAAAC9klEQVR4nO2dy04UQRSGawUmEFdGQRPjWnGJ+',
        'ARKiM8hlydxA2pivLyFlxF9EtGFibwAhkvEAOYznTkmxEz1MNBTp7rr/9bddbr+r6d6Z',
        'mBOhSCEEEIIIYQQQgghxDkAbgBrwCawBRzQfg5sLtWcVqs5ZndzAFeA58Ax3ecYeAPMh',
        'hwAloBdyuMnsOgd/gpwQrmcAMte4T8sPPx//AEepQ5/ttBlp245upZSwOvopcAvYB2YB',
        '6ZCywGmgHvABnBYM++XKd9qxt7t/ABuh44CzAHbkbkfAddTXMRazZ3f2fD/kxB7JayEc',
        'WMfSAaxHgoBeBrJoJei+LdI8flQCPSfCYPYSlF8P1K89Q/cswJMRzLYC+MmUhivuuMmt',
        'xwkwJCARIQIox7fGF6FcSK3HCTAkIBEhAijHt8YboUbApgA3ktAC8KvqBlrICkm4VPYI',
        'XwJcA5fAhoAmAQ+Dsk59gWjlqAEd/5n4JIE+IT/qQrfjtcroOHw3501fDtHArzCt/Mkw',
        'Ct8O1cCvMK38yXAK3wbQwK8wrdxJMArfBtLArzCt/EkwCt8G1MCvMK3cSXAK3wbWwK8w',
        'rfxJeCC4W+eN3yrIQE14b8dZ/hWRwK8wrdaEuAVvtWTAK/wraYEjBj+ZHBkVGGtKQy8G',
        'hJ+9WfGiabqXeA6OyvgJvA91zu/8wJqJGQTfucFDJCQVfhFCKgAbtkzwX3NL1JAzkiAM',
        'xLgjAQ4IwHOSIAzEuCMBDgjAc5IgDMS4IwEFCxgL1J7OhQCcDmSwW6K4l8jxUtqWbbg2',
        'bIs9pvbjVAIwLNIBh8821ZWrRzvhI4D3PVuW1nXuLVqajoXuh3+dk3j1jQt7Yf858Kh9',
        'dVc6MKDmX6HxPu27PyumfeLlBc1Yw2rRZ8d4GoyASbhQSE7ZgyjauG/lDT8UxKWC99D4',
        'AR47BL+KQmLhS5HO9UmFiGjTXyeDHlIdYUj28RnJuRG1T/f9pXpAV9q+ky3iX2bS8/ml',
        'sfuSUIIIYQQQgghhBAitI2/ZYk4Uk/wyKQAAAAASUVORK5CYII='
      ].join('');
    });
  });

  GM_addStyle([`
    .GIVB-btn {
      position: absolute;
      top: 16px;
      right: 16px;
      height: 36px;
      width: 36px;
      background-color: #0009;
      border-radius: 50%;
    }

    .GIVB-btn:hover {
      background-color: #000c;
    }

    .GIVB-icon {
      position: absolute;
      top: 6px;
      right: 6px;
      height: 24px;
      width: 24px;
    }
  `][0]);


  // utils > -----------------------------------------------------------------------

  function waitForNode(query, {
    callbackOnTimeout = false,
    existing = false,
    onceOnly = false,
    rootNode = document.documentElement,
    timeout,

    observerOptions = {
      childList: true,
      subtree: true,
    },
  }, callback) {
    if (!callback) throw new Error('Callback is needed');

    observerOptions = Object.assign({}, observerOptions);

    const handledNodes = new WeakSet();
    let existingNodes = rootNode.querySelectorAll(query);
    let timeoutId = null;

    if (existingNodes.length) {
      // Mark all as handled for a proper work when `existing` is false
      // to ignore them later on
      for (const node of existingNodes) {
        handledNodes.add(node);
      }

      if (existing) {
        if (onceOnly) {
          try {
            callback(existingNodes[0]);
          } catch (e) {
            console.error(e);
          }

          return;
        } else {
          for (const node of existingNodes) {
            try {
              callback(node);
            } catch (e) {
              console.error(e);
            }
          }
        }
      }
    }

    const observer = new MutationObserver((mutations, observer) => {
      for (const node of rootNode.querySelectorAll(query)) {
        if (handledNodes.has(node)) continue;

        handledNodes.add(node);

        try {
          callback(node);
        } catch (e) {
          console.error(e);
        }

        if (onceOnly) {
          observer.disconnect();

          if (timeoutId) clearTimeout(timeoutId);

          return;
        }
      }
    });

    observer.observe(rootNode, observerOptions);

    if (timeout !== undefined) {
      timeoutId = setTimeout(() => {
        observer.disconnect();

        if (callbackOnTimeout) {
          try {
            callback(null);
          } catch (e) {
            console.error(e);
          }
        }
      }, timeout);
    }
  }

  // < utils -----------------------------------------------------------------------
}());