Raw Source Toggle Dropdown

• Minified Source

Sauvegarde / Preload Adjacent Pictures

// ==UserScript==
// @name         Preload Adjacent Pictures
// @namespace    https://openuserjs.org/users/Sauvegarde
// @version      0.1
// @author       Sauvegarde
// @description  Preload previous/next picture in cache when you browse a gallery.
// @match        https://aryion.com/g4/view/*
// @grant        GM_xmlhttpRequest
// @iconURL      https://www.google.com/s2/favicons?domain=aryion.com
// @updateURL    https://openuserjs.org/meta/Sauvegarde/Preload_Adjacent_Pictures.meta.js
// @downloadURL  https://openuserjs.org/install/Sauvegarde/Preload_Adjacent_Pictures.user.js
// @copyright    2021, Sauvegarde (https://openuserjs.org/users/Sauvegarde)
// @license		 MIT
// ==/UserScript==

/* jshint esversion: 6 */

(function() {
    'use strict';
	const prev = document.querySelector("a#prev-link");
	const next = document.querySelector("a#next-link");
	preload(prev);
	preload(next);

	function preload(a) {
		if(a != null) {
			placeMarker(a, "⏳");
			GM_xmlhttpRequest({
				method: 'GET',
				url: a.href,
				onload: rsp => {
					// Creates a virtual container for the response
					const ctn = document.createElement("div");
					ctn.innerHTML = rsp.responseText;
					// Extracts the next picture's source from <noscript>
					const noscript = ctn.querySelector("noscript");
					if (noscript) {
						const imgSrc = "https:" + noscript.textContent.match(/src='(.*?)'/)[1];
						// Preload the picture in memory
						const image = new Image();
						image.addEventListener("load", () => {
							console.info(`Preloaded picture: ${imgSrc}`);
							placeMarker(a, "👍");
						});
						image.src = imgSrc;
					} else {
						console.info("Couldn't find a picture to load in response.");
						placeMarker(a, "");
					}
				},
				onerror: err => {
					console.error(err);
					placeMarker(a, "👎");
				}
			});
		}
	}

	function placeMarker(element, char) {
		const className = "preloader-marker";
		const parent = element.parentElement;
		let marker = parent.querySelector("." + className);
		if(marker) {
			marker.innerHTML = char;
		} else {
			marker = document.createElement("span");
			marker.className = className;
			marker.innerHTML = char;
			if(element.id == "next-link") {
				parent.insertBefore(marker, parent.firstChild);
			} else {
				parent.appendChild(marker);
			}
		}
	}
})();