Google Images View Button

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

Versione datata 25/02/2025. Vedi la nuova versione l'ultima versione.

Dovrai installare un'estensione come Tampermonkey, Greasemonkey o Violentmonkey per installare questo script.

You will need to install an extension such as Tampermonkey to install this script.

Dovrai installare un'estensione come Tampermonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Userscripts per installare questo script.

Dovrai installare un'estensione come ad esempio Tampermonkey per installare questo script.

Dovrai installare un gestore di script utente per installare questo script.

(Ho già un gestore di script utente, lasciamelo installare!)

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

(Ho già un gestore di stile utente, lasciamelo installare!)

// ==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 -----------------------------------------------------------------------
}());