Instantly share code, notes, and snippets.
Last active
April 11, 2024 18:16
-
Star
(0)
0
You must be signed in to star a gist -
Fork
(0)
0
You must be signed in to fork a gist
-
Save Flashwalker/72c2d871984377075adbe622bb7f9fab to your computer and use it in GitHub Desktop.
Buttons for opening Yandex images on yandex.ru/images/search
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name yandex-image-buttons | |
// @namespace http://tampermonkey.net/ | |
// @version 0.3.5 | |
// @description Add buttons (open image & open same) to image viwer on yandex.ru/images/search | |
// @author Flashwalker | |
// @match http*://yandex.ru/images/search* | |
// @updateURL https://gist.github.com/Flashwalker/72c2d871984377075adbe622bb7f9fab/raw/yandex-image-buttons.user.js | |
// @downloadURL https://gist.github.com/Flashwalker/72c2d871984377075adbe622bb7f9fab/raw/yandex-image-buttons.user.js | |
// @homepage https://gist.github.com/Flashwalker/72c2d871984377075adbe622bb7f9fab | |
// @grant none | |
// ==/UserScript== | |
(function(window, undefined ){ | |
'use strict' | |
// Create buttons div | |
let myhackydiv = document.createElement('div') | |
myhackydiv.classList.add('myhackybuttons') | |
myhackydiv.innerHTML = '<ul class="myhackybtn_list"><li><button class="myhackybtn open"><div class="myhackyicon"></div><div class="myhackybtn_text"><span class="txt">Open</span></div></button></li><li><button class="myhackybtn same"><div class="myhackyicon"></div><div class="myhackybtn_text"><span class="txt">Same</span></div></button></li></ul>' | |
let binded = false | |
// Custom event function to be called on image thumb click | |
$("body").on("myCustomEvent", function(event, some_data) { | |
// Append my buttons div to the scene | |
// let myContainer = this.querySelector(".ImagesViewer-LayoutScene") | |
let myContainer = document.querySelector(".Modal-Content .ImagesViewer-LayoutScene") | |
myContainer.appendChild(myhackydiv) | |
// Bind actions to my buttons | |
let openimg = document.querySelector(".myhackybtn.open") | |
let sameimg = document.querySelector(".myhackybtn.same") | |
// Bind automation click events | |
let clickOpenImage = function(e){ | |
e.stopPropagation() | |
let btn1 = document.querySelector("a.MMViewerButtons-OpenImage") | |
let btn2 = document.querySelector(".OpenImageButton a.Button2") | |
if(btn1) { | |
btn1.click() | |
} else { | |
if(btn2) { btn2.click() } | |
} | |
let btn3 = document.querySelector("a.MMUnauthPopup-Skip") | |
if(btn3) { setTimeout(() => btn3.click(), 150) } | |
binded = true | |
} | |
let clickSameImages = function(e){ | |
e.stopPropagation() | |
let btn1 = document.querySelector("a.MMViewerButtons-SearchByImage") | |
let btn2 = document.querySelector("a.SearchByImageButton") | |
if(btn1) { | |
btn1.click() | |
} else { | |
if(btn2) { | |
btn2.click() | |
} | |
} | |
let btn3 = document.querySelector("a.MMUnauthPopup-CloseIcon") | |
if(btn3) { setTimeout(() => btn3.click(), 150) } | |
binded = true | |
} | |
openimg.removeEventListener('click', clickOpenImage) | |
sameimg.removeEventListener('click', clickSameImages) | |
if(!binded) { | |
openimg.addEventListener('click', clickOpenImage) | |
sameimg.addEventListener('click', clickSameImages) | |
} | |
}) | |
// Function which triggering my custom event after a short delay | |
function addMyButtons() { | |
setTimeout(function(){ | |
$(".Modal-Content").trigger("myCustomEvent", ["some_data"]) | |
}, 500) | |
} | |
if(!binded) { | |
// Bind click event on image thumb popup | |
$("body").on("click", ".Polaroid .Link", function() { | |
addMyButtons() | |
}) | |
// Bind click event on image thumb | |
$(".SerpItem").click(function() { | |
addMyButtons() | |
}) | |
} | |
// Create our new STYLE element | |
let mysheet = (function() { | |
// Create the <style> tag | |
let style = document.createElement("style") | |
// Add a media (and/or media query) here if you'd like! | |
// style.setAttribute("media", "screen") | |
// style.setAttribute("media", "only screen and (max-width : 1024px)") | |
// WebKit hack :( | |
style.appendChild(document.createTextNode("")) | |
// Add our <style> element to the page | |
document.head.appendChild(style) | |
return style.sheet | |
})() | |
// Crossbrowser function to add css rules | |
function addCSSRule(sheet, selector, rules, index) { | |
if("insertRule" in sheet) { | |
sheet.insertRule(selector + "{" + rules + "}", index) | |
} | |
else if("addRule" in sheet) { | |
sheet.addRule(selector, rules, index) | |
} | |
} | |
// Add css rules to our styleshit | |
addCSSRule(mysheet, ".myhackybuttons", "position: absolute; bottom: 20px; left: calc(50% - 130px); z-index: 999999; visibility: collapse; opacity: 0; transition: all 0.35s ease;") | |
addCSSRule(mysheet, ".ImagesViewer-LayoutScene[class]:hover .myhackybuttons", "visibility: visible; opacity: 1;") | |
addCSSRule(mysheet, ".myhackybuttons .myhackybtn_list, myhackybuttons .myhackybtn_list *", "box-sizing: border-box;font-size: 14px;") | |
addCSSRule(mysheet, ".myhackybuttons .myhackybtn_list", "list-style: none; text-align: center; width: 266px; background: rgba(0,0,0,0.3); border-radius: 50px; box-shadow: rgba(0, 0, 0, 0.65) 0px 6px 28px; margin: 0; padding: 0; overflow: hidden;") | |
addCSSRule(mysheet, ".myhackybuttons li", "display: inline-block; padding: 0; margin: 0; cursor: pointer") | |
addCSSRule(mysheet, ".myhackybuttons .myhackybtn", "display: flex; justify-content: center; align-items: center; margin: 0; overflow: hidden; padding: 10px 28px; cursor: pointer; background: none; border: none;"); | |
addCSSRule(mysheet, ".myhackybuttons li:last-child", "margin-right: 0;") | |
addCSSRule(mysheet, ".myhackybuttons .myhackyicon", "width: 1.37em; height: 1.37em;") | |
addCSSRule(mysheet, ".myhackybuttons .myhackybtn.open .myhackyicon", "transform: rotate(225deg); background: url(\"data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M8 1.5V15.5M8 15.5L15 8.5M8 15.5L1 8.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E %3C/svg%3E \") no-repeat;") | |
addCSSRule(mysheet, ".myhackybuttons .myhackybtn.same .myhackyicon", "background: url(\"data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M1 1.5H7.22222V7.72222H1V1.5Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E %3Cpath d='M10.7778 1.5H17V7.72222H10.7778V1.5Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E %3Cpath d='M10.7778 11.2778H17V17.5H10.7778V11.2778Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E %3Cpath d='M1 11.2778H7.22222V17.5H1V11.2778Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E %3C/svg%3E \") no-repeat;") | |
addCSSRule(mysheet, ".myhackybuttons .myhackybtn_text", "padding: 0 0 0 13px; overflow: hidden;") | |
addCSSRule(mysheet, ".myhackybuttons .txt", "color: white; font-family: sans-serif; font-weight: normal; font-size: 1.2em; line-height: 1.37em; text-align: left; vertical-align: middle;") | |
})() |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I fixed it. It was .userscript.js, but right is: .user.js