needforsuv
commented
4 years ago color
// ==UserScript==
// @name Google image color (OCT19)
// @namespace https://github.com/danieljbingham/google-image-sizer
// @version 1.0.3.5
// @description re-implement Google Images color filter
// @author needforsuv Based on code from Daniel Bingham
// @include http*://*.google.tld/search*tbm=isch*
// @grant none
// ==/UserScript==
(function() {
//var sz= /[?&]tbs=(?:[^&]+,)?isz:([^&,]+)/.test(location.search) && RegExp.$1;
var icvar = /[?&]tbs=(?:[^&]+,)?ic(?::|%3A)([^&,]+)(?:,isc(?::|%3A)([^&,]+))?/.exec(location.search) || [];
var colors = [["ic_color", "color"]];
/*
Add colors for one of two possibilities for the Google Images layout
*/
function addColors() {
var e;
if (document.getElementById('ic_trans')) {
addColorsIc();
}
else if (e=document.querySelector('.qcTKEe')) {
e=e.querySelector(':scope [data-index="1"]'); //color index!!! fixed? only changes for filetype and AR
const obs = new MutationObserver(function(mutL){
for (let mut of mutL) {
if ((mut.type=='attributes') && (mut.attributeName=='class') && mut.target.classList.contains('iWO5td')) {
addColorsGCard();
return;
}
}
});
obs.observe(e.parentNode, {subtree: true, attributes: true} );
}
else {
addColorsOnClick();
}
}
/*
Iterate through list of image colors and add them to the DOM (when 'ic' elements are present)
*/
//function addSizes() {
function addColorsIc() {
// var icon = document.getElementById("isz_i").parentNode.querySelector(':scope * + .hdtbItm:not([tabindex])');
var transp = document.getElementById("ic_trans").parentNode.querySelector(':scope * + .hdtbItm:not([tabindex])');
var parent = transp.parentNode;
var clone, child, chkAny=false;
for (var i=0; i < colors.length; i++) {
clone = transp.cloneNode(true);
clone.id = colors[i][0];
// if (sizes[i][1]==sz) {
if ((icvar[1]=='specific') && (colors[i][1] == icvar[2]) ) {
clone.classList.add('hdtbSel');
child=clone;
chkAny=true;
// parent.previousSibling.querySelector('.mn-hd-txt').innerHTML = "Larger than " + sizes[i][1].toUpperCase();
parent.previousSibling.querySelector('.mn-hd-txt').textContent = "" + colors[i][1].toUpperCase();
parent.previousSibling.classList.add('hdtb-tsel');
}
else {
child = clone.firstChild;
// child.href = child.href.replace(/(tbs=(?:[^&]+,)?)isz(:[^&,]+)/, "$1"+"isz:" + sizes[i][1]);
// child.href = child.href.replace(/(tbs=(?:[^&]+,)?)isz(:[^&,]+)(?:,islt:([^&,]+))?/, "$1" + "isz:lt,islt:" + sizes[i][1]);
child.href = child.href.replace(/(tbs=(?:[^&]+,)?)ic(:[^&,]+)/, "$1" + "ic:" + colors[i][1]);
}
// child.innerHTML = "Larger than " + sizes[i][1].toUpperCase();
child.textContent = "" + colors[i][1].toUpperCase();
parent.appendChild(clone);
}
var fc = parent.firstElementChild;
if (chkAny && fc.classList.contains('hdtbSel')) {
fc.classList.remove('hdtbSel');
child = transp.firstChild.cloneNode(true);
child.href = child.href.replace(/(tbs=(?:[^&]+,)?)ic(:[^&,]+)/, "$1");
// child.innerHTML = fc.innerHTML;
// fc.innerHTML='';
child.textContent = fc.textContent;
fc.textContent = '';
fc.appendChild(child);
}
}
// alternative version of layout
function addColorsGCard() {
var transp = document.querySelector(':scope .irf0hb > .Ix6LGe > a[href*="tbs="][href*="ic"]');
var parent = transp.parentNode;
if (parent.classList.contains('icvarDone')) return;
parent.classList.add('icvarDone');
transp.href=unescape(transp.href);
var cur = parent.querySelector('span.MfLWbb');
for (var i = 0; i < colors.length; i++) {
let clone = transp.cloneNode(true);
clone.id = colors[i][0];
if ((icvar[1]=='specific') && (colors[i][1] == icvar[2]) ) {
parent.removeChild(cur);
clone=cur;
}
else {
clone.href = clone.href.replace(/(tbs=(?:[^&]+,)?)ic(:[^&,]+)/, "$1" + "ic:" + colors[i][1]);
let al = clone.firstChild.firstChild.textContent = "" + colors[i][1].toUpperCase();
if (clone.attributes['aria-label']) clone.attributes['aria-label'].value = al;
}
parent.appendChild(clone);
}
}
/*
When colors nav is not already present in source code, add an event listener to add colors when the menu is clicked
*/
function addColorsOnClick() {
document.getElementById("hdtb-tls").addEventListener("click", function(){
document.querySelectorAll('[aria-label="Color"]').item(1).addEventListener("click", function(){
addColorsIc();
});
});
}
/*
Check the user is on google images
*/
function isImageUrl() {
return location.href.includes("tbm=isch");
}
/*
Check colors not there already
*/
/*function needSizes() {
return document.getElementById("isz_i").parentNode.childNodes.length < 6
}*/
function needColors() {
var nodes = document.querySelector('[aria-label="Black and white"]') || document.getElementById("ic_trans");
if (nodes) return nodes.parentNode.childNodes.length < 6;
else return document.querySelector('.qcTKEe') && true;
}
var maxTries=100;
function chk() {
// if (!document.getElementById('isz_i')) {
if (!document.getElementById('ic_trans') && (!document.querySelector('[aria-label="Black and white"]')) && (!document.querySelector('.qcTKEe'))) {
if (maxTries--) setTimeout(chk,100);
return;
}
if (needColors()) addColors();
}
if (isImageUrl()) chk();
})();
I might've missed the id #
type
// ==UserScript==
// @name Google image typer (OCT19)
// @namespace https://github.com/danieljbingham/google-image-sizer
// @version 1.0.3.5
// @description re-implement Google Images type filter
// @author needforsuv Based on code from Daniel Bingham
// @include http*://*.google.tld/search*tbm=isch*
// @grant none
// ==/UserScript==
(function() {
//var sz= /[?&]tbs=(?:[^&]+,)?isz:([^&,]+)/.test(location.search) && RegExp.$1;
var tp = /[?&]tbs=(?:[^&]+,)?itp(?::|%3A)([^&,]+)/.exec(location.search) || []; //order face photo CA LD Ani
var types = [["itp_face", "face"],["itp_photo", "photo"]];
/*
Add types for one of two possibilities for the Google Images layout
*/
function addTypes() {
var e;
if (document.getElementById('itp_animated')) {
addTypesItp();
}
else if (e=document.querySelector('.qcTKEe')) {
e=e.querySelector(':scope [data-index="3"]'); //type index!!! fixed? only changes for filetype and AR
const obs = new MutationObserver(function(mutL){
for (let mut of mutL) {
if ((mut.type=='attributes') && (mut.attributeName=='class') && mut.target.classList.contains('iWO5td')) {
addTypesGCard();
return;
}
}
});
obs.observe(e.parentNode, {subtree: true, attributes: true} );
}
else {
addTypesOnClick();
}
}
/*
Iterate through list of image types and add them to the DOM (when 'itp' elements are present)
*/
//function addSizes() {
function addTypesItp() {
// var icon = document.getElementById("isz_i").parentNode.querySelector(':scope * + .hdtbItm:not([tabindex])');
var animated = document.getElementById("itp_animated").parentNode.querySelector(':scope * + .hdtbItm:not([tabindex])');
var parent = animated.parentNode;
var clone, child, chkAny=false;
for (var i=0; i < types.length; i++) {
clone = animated.cloneNode(true);
clone.id = types[i][0];
// if (sizes[i][1]==sz) {
if (types[i][1]==tp) {
clone.classList.add('hdtbSel');
child=clone;
chkAny=true;
// parent.previousSibling.querySelector('.mn-hd-txt').innerHTML = "Larger than " + sizes[i][1].toUpperCase();
parent.previousSibling.querySelector('.mn-hd-txt').textContent = "" + types[i][1].toUpperCase();
parent.previousSibling.classList.add('hdtb-tsel');
}
else {
child = clone.firstChild;
// child.href = child.href.replace(/(tbs=(?:[^&]+,)?)isz(:[^&,]+)/, "$1"+"isz:" + sizes[i][1]);
// child.href = child.href.replace(/(tbs=(?:[^&]+,)?)isz(:[^&,]+)(?:,islt:([^&,]+))?/, "$1" + "isz:lt,islt:" + sizes[i][1]);
child.href = child.href.replace(/(tbs=(?:[^&]+,)?)itp(:[^&,]+)/, "$1" + "itp:" + types[i][1]);
}
// child.innerHTML = "Larger than " + sizes[i][1].toUpperCase();
child.textContent = "" + types[i][1].toUpperCase();
parent.appendChild(clone);
}
var fc = parent.firstElementChild;
if (chkAny && fc.classList.contains('hdtbSel')) {
fc.classList.remove('hdtbSel');
child = animated.firstChild.cloneNode(true);
child.href = child.href.replace(/(tbs=(?:[^&]+,)?)itp(:[^&,]+)/, "$1");
// child.innerHTML = fc.innerHTML;
// fc.innerHTML='';
child.textContent = fc.textContent;
fc.textContent = '';
fc.appendChild(child);
}
}
// alternative version of layout
function addTypesGCard() {
var animated = document.querySelector(':scope .irf0hb > .Ix6LGe > a[href*="tbs="][href*="itp"]');
var parent = animated.parentNode;
if (parent.classList.contains('tpDone')) return;
parent.classList.add('tpDone');
animated.href=unescape(animated.href);
var cur = parent.querySelector('span.MfLWbb');
for (var i = 0; i < types.length; i++) {
let clone = animated.cloneNode(true);
clone.id = types[i][0];
// if ((icvar[1]=='specific') && (colors[i][1] == icvar[2]) ) {
if (types[i][1]==tp) {
parent.removeChild(cur);
clone=cur;
}
else {
clone.href = clone.href.replace(/(tbs=(?:[^&]+,)?)itp(:[^&,]+)/, "$1" + "itp:" + types[i][1]);
let al = clone.firstChild.firstChild.textContent = "" + types[i][1].toUpperCase();
if (clone.attributes['aria-label']) clone.attributes['aria-label'].value = al;
}
parent.appendChild(clone);
}
}
/*
When types nav is not already present in source code, add an event listener to add types when the menu is clicked
*/
function addTypesOnClick() {
document.getElementById("hdtb-tls").addEventListener("click", function(){
document.querySelectorAll('[aria-label="Type"]').item(3).addEventListener("click", function(){
addTypesItp();
});
});
}
/*
Check the user is on google images
*/
function isImageUrl() {
return location.href.includes("tbm=isch");
}
/*
Check types not there already
*/
/*function needSizes() {
return document.getElementById("isz_i").parentNode.childNodes.length < 6
}*/
function needTypes() {
var nodes = document.querySelector('[aria-label="GIF"]') || document.getElementById("itp_animated");
if (nodes) return nodes.parentNode.childNodes.length < 6;
else return document.querySelector('.qcTKEe') && true;
}
var maxTries=100;
function chk() {
// if (!document.getElementById('isz_i')) {
if (!document.getElementById('itp_animated') && (!document.querySelector('[aria-label="GIF"]')) && (!document.querySelector('.qcTKEe'))) {
if (maxTries--) setTimeout(chk,100);
return;
}
if (needTypes()) addTypes();
}
if (isImageUrl()) chk();
})();
There's a few options still missing, and it would be AWESOME if you added them the extension to improve functionality.
It should only take you a few minutes to half an hour, but PLEASE help me!
The version with ISZ made it super easy for me to add back the options for color and type as well, but I've butted my head against a wall for hours trying to get my head around this 'new and improved' google images version and it's proving quite hard (I can't get it to work at all).
These are the options missing for color and type: FULL COLOR (useful for NOT b+w images), and the ones missing for type are Face and Photo, which are also SUPER helpful for locating specific shots instead of art, etc.
As for the sizes, it's missing these smaller image options (which I've already added back in for my own use, so it's of lesser priority).
this is the code for color and type on the isz type google images