victorwesterlund.com/public/assets/js/modules/Background.mjs

export default class Background {
	constructor(target) {
		this.images = {
			dir: "assets/media/b64/",
			count: 2
		}

		this.image = null; // Will contain the original base64 image
		this.target = target ? target : document.body; // Set `background-image` of this element

		// Update the background with a new image every now and then
		this.updateBg = {
			_this: this,
			_delay: 5000,
			_interval: null,
			set running (state = true) {
				clearInterval(this._interval);
				if(state) this._interval = setInterval(() => this._this.randBg(), this._delay);
			},
			set delay (delay) {
				this._delay = delay;
			}
		}
	}

	// Update the target CSS background
	setBg(image = this.image) {
		this.target.style.setProperty("background-image", `url(${image})`);
	}

	// Genrate random int in range
	randInt(min, max) {
		return Math.round(Math.random() * (max - min) + min);
	}

	// Fetch a base64 encoded background image
	async fetchBg(id) {
		const url = new URL(window.location);

		url.pathname += this.images.dir;
		url.pathname += id + ".txt";

		const image = await fetch(url);
		if(!image.ok) throw new Error("Failed to fetch background image");

		return image.text();
	}

	// Load a random background from the image set
	async randBg() {
		const id = this.randInt(1, this.images.count);
		const image = await this.fetchBg(id);

		this.image = image;
		this.setBg(image);
	}
}