Shrink large images to a reasonable size.
// ==UserScript==
// @name F95 Constrain Images
// @namespace 1330126-edexal
// @match *://f95zone.to/threads/*
// @grant none
// @icon https://external-content.duckduckgo.com/ip3/f95zone.to.ico
// @license Unlicense
// @version 1.0.2
// @author Edexal
// @description Shrink large images to a reasonable size.
// @homepageURL https://sleazyfork.org/en/scripts/603069-f95-constrain-images
// @supportURL https://github.com/Edexaal/scripts/issues
// @require https://cdn.jsdelivr.net/gh/Edexaal/scripts@2f4f36215375a30485901a0374cb58a78412ddf3/_lib/utility.js
// ==/UserScript==
(() =>{
/*Configure values here:
* maxHeightAllowed: Max image height allowed before a resize is triggered for an image.
* maxWidth: Max image width when resize is triggered. In other words, the new image width will not be larger than the `maxWidth`.
* */
const CONFIG = {maxHeightAllowed: 700, maxWidth: 500};
const OBSERVER_STATS = {totalImages: 0, imagesObservedNum: 0};
function applySizeConstraint(el) {
if (el.height <= CONFIG.maxHeightAllowed) return;
el.width = Math.min(CONFIG.maxWidth, el.width);
}
function observeImages(records,obs) {
for (const record of records) {
if (record.target.classList.contains("lazyloaded")) {
applySizeConstraint(record.target);
if (++OBSERVER_STATS.imagesObservedNum === OBSERVER_STATS.totalImages){
obs.disconnect();
}
}
}
}
function initObserver(imageEls) {
const observer = new MutationObserver(observeImages);
const options = {attributeFilter: ['class']};
imageEls.forEach(img => observer.observe(img, options));
}
function run() {
const images = Edexal.$$('img.bbImage');
if (!images.length) return;
OBSERVER_STATS.totalImages = images.length;
initObserver(images);
}
run();
})();