blankie
/
userscripts
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Update Image Loader Placeholder Remover to 1.20.0 

- Add support for data-srcset
This commit is contained in:
blankie 2023-09-09 15:00:55 +10:00
parent 51fb9fac1f
commit 505e5fd682
Signed by: blankie
GPG Key ID: CC15FC822C7F61F5
1 changed files with 53 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
Image Loader Placeholder Remover.user.js
View File

@ -3,7 +3,7 @@
// @namespace blankie-scripts
// @match http*://*/*
// @grant none
// @version 1.19.2
// @version 1.20.0
// @author blankie
// @run-at document-end
// @description Removes image loading placeholders
@ -11,10 +11,16 @@
"use strict";
const URL_RE_STR = "(?:https?://|\\.{0,2}/)\\S+";
const URL_RE = new RegExp(`^${URL_RE_STR}$`);
const SRCSET_COMPONENT = `${URL_RE_STR}(?:\\s+\\d+w|\\s+\\d+(?:\\.\\d+)?x)?`;
const SRCSET_RE = new RegExp(`^${SRCSET_COMPONENT}(?:,\\s*${SRCSET_COMPONENT})*$`);
function isUrlLike(url) {
// Example of ./path:
// - https://projects.apnews.com/features/2023/missing-students-chronic-absenteeism/index.html
return url && /^(?:https?:\/\/|\.{0,2}\/)\S+$/.test(url);
return url && URL_RE.test(url);
}
function findUrl(element) {
if (window.location.host === "www.vice.com") {
@ -78,6 +84,19 @@ function findUrl(element) {
return null;
}
function findSrcset(element) {
for (let attr of element.attributes) {
// Examples of data-srcset:
// - https://www.cbsnews.com/
// - https://www.cbsnews.com/news/leonard-mack-exonerated-47-years-after-wrongful-rape-conviction/
if (/srcset/.test(attr.name) && attr.name !== "srcset" && SRCSET_RE.test(attr.value)) {
return attr.value;
}
}
return null;
}
function getLazyloaderClasses(element) {
let classes = [];
@ -260,34 +279,43 @@ function removePlaceholder(img) {
img.parentElement.style.filter = img.parentElement.style.filter.replaceAll(/blur\(.+?\)/g, "blur(0)");
}
let srcset = findSrcset(img);
let url = findUrl(img);
if (!url) {
if (!url && !srcset) {
return;
}
let originalUrl = url;
if (window.location.host === "www.vice.com") {
img.style.filter = "none";
picture.style.opacity = 1;
let originalUrl = !srcset ? url : null;
let urlObject = new URL(url, window.location);
urlObject.search = "";
originalUrl = urlObject.href;
urlObject.search = "?resize=1024:*";
url = urlObject.href;
} else if (window.location.host === "closeronline.co.uk") {
let urlObject = new URL(url, window.location);
urlObject.search = "";
originalUrl = urlObject.href;
img.closest(".image-container").querySelector(".image-loading").remove();
} else if (window.location.host === "theconversation.com") {
let urlObject = new URL(url, window.location);
urlObject.search = "";
originalUrl = urlObject.href;
if (url) {
if (window.location.host === "www.vice.com") {
img.style.filter = "none";
picture.style.opacity = 1;
let urlObject = new URL(url, window.location);
urlObject.search = "";
originalUrl = urlObject.href;
urlObject.search = "?resize=1024:*";
url = urlObject.href;
} else if (window.location.host === "closeronline.co.uk") {
let urlObject = new URL(url, window.location);
urlObject.search = "";
originalUrl = urlObject.href;
img.closest(".image-container").querySelector(".image-loading").remove();
} else if (window.location.host === "theconversation.com") {
let urlObject = new URL(url, window.location);
urlObject.search = "";
originalUrl = urlObject.href;
}
}
unhideElement(img, getLazyloaderClasses(img));
img.src = url;
if (srcset) {
img.srcset = srcset;
}
if (url) {
img.src = url;
}
// apparently, remaining <source>s can fuck up image rendering (firefox still thinks that the <img> contains an empty image?)
// https://gizmodo.com/reddit-news-blackout-protest-is-finally-over-reddit-won-1850707509
@ -298,7 +326,9 @@ function removePlaceholder(img) {
}
}
wrapImage(img, originalUrl);
if (originalUrl) {
wrapImage(img, originalUrl);
}
}