Make Twitter Images Opacity Lower.
目前為
// ==UserScript==
// @name Twitter: Hide Image
// @version 1.0.0
// @description Make Twitter Images Opacity Lower.
// @author Hayao-Gai
// @namespace https://github.com/HayaoGai
// @icon https://i.imgur.com/M9oO8K9.png
// @include https://twitter.com/*
// @grant none
// ==/UserScript==
/* jshint esversion: 6 */
(function() {
'use strict';
window.onload = () => {
for (let i = 0; i < 10; i++) setTimeout(hideImage, 500 * (i + 1));
observeSystem();
detectUrl();
};
function hideImage() {
document.querySelectorAll("img:not(.hide)").forEach(image => {
image.classList.add("hide");
// except emoji
if (image.draggable) {
const parent = image.parentElement;
const children = parent.childNodes;
children.forEach(div => {
if (div.nodeName === "DIV") {
div.style.transition = "opacity 0.3s";
div.style.opacity = 0.1;
addListener(image, div);
}
});
}
});
}
function addListener(image, div) {
// over
image.addEventListener("mouseover", () => {
div.style.opacity = 1;
});
// out
image.addEventListener("mouseout", () => {
div.style.opacity = 0.1;
});
}
function observeSystem() {
// error 1
if (document.querySelectorAll("section > h1").length === 0 || document.querySelectorAll("title").length === 0) {
setTimeout(observeSystem, 500);
return;
}
// target
const target1 = [...document.querySelectorAll("section > h1")[0].parentElement.childNodes].filter(child => child.tagName !== "H1")[0].childNodes[0].childNodes[0];
const target2 = document.querySelectorAll("title")[0];
// error 2
if (target1.className == "css-1dbjc4n r-1adg3ll") {
setTimeout(observeSystem, 500);
return;
}
// observer
const mutation = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
const observer = new mutation(hideImage);
const config = { attributes: true, childList: true, characterData: true };
observer.observe(target1, config); //timeline
observer.observe(target2, config); //trending
}
function detectUrl() {
// situation 1
window.addEventListener('locationchange', observeSystem);
// situation 2
history.pushState = ( f => function pushState(){
var ret = f.apply(this, arguments);
window.dispatchEvent(new Event('pushState'));
window.dispatchEvent(new Event('locationchange'));
return ret;
})(history.pushState);
// situation 3
history.replaceState = ( f => function replaceState(){
var ret = f.apply(this, arguments);
window.dispatchEvent(new Event('replaceState'));
window.dispatchEvent(new Event('locationchange'));
return ret;
})(history.replaceState);
// situation 4
window.addEventListener('popstate', () => window.dispatchEvent(new Event('locationchange')));
}
})();