jbrown123/unsplash_random.html

## unsplash_random.html
<html>
<head>
	<title>Unsplash images</title>
<script>
  // randomly cycle through unsplash images in the browser window every 5-30 seconds
  // this works great in full screen (F11) mode on wall monitors as random artwork
  //
  // tested on Chrome; should work on most modern browsers but don't blame me if it doesn't

  // I used info from the following sites to create this
	// https://stackoverflow.com/questions/3437786/get-the-size-of-the-screen-current-web-page-and-browser-window
	// https://source.unsplash.com/

	function t()
	{
		var w = window,
	    d = document,
	    e = d.documentElement,
	    g = d.body,
	    x = w.innerWidth || e.clientWidth || g.clientWidth,
	    y = w.innerHeight|| e.clientHeight|| g.clientHeight;

		/*
		console.log("w: " + w.innerWidth + "x" + w.innerHeight);
		console.log("e: " + e.clientWidth + "x" + e.clientHeight);
		console.log("g: " + g.clientWidth + "x" + g.clientHeight);
		console.log("s: " + screen.width + "x" + screen.height);
		*/

		var xhr = new XMLHttpRequest();
		xhr.open('GET', "https://source.unsplash.com/random/" + x + "x" + y);
		xhr.onload = function()
		{
		    if (xhr.status === 200)
		    {
				unsplash.src = xhr.responseURL;
		    }
		    else
		    {
		        console.log('Request failed.  Returned status of ' + xhr.status);
		    }
		};
		xhr.send();
	}

	function randomlyUpdate()
	{
		t();
		setTimeout(randomlyUpdate, 5000 + Math.floor(Math.random() * 25000));
	}

	window.onload = randomlyUpdate;
	window.onresize = t;

</script>
<style>
body {
	overflow: hidden;
	margin: 0;
	padding: 0;
}
</style>
</head>
<body>
<img id="unsplash" />
</body>
	<html>
	<head>
	<title>Unsplash images</title>
	<script>
	// randomly cycle through unsplash images in the browser window every 5-30 seconds
	// this works great in full screen (F11) mode on wall monitors as random artwork
	//
	// tested on Chrome; should work on most modern browsers but don't blame me if it doesn't

	// I used info from the following sites to create this
	// https://stackoverflow.com/questions/3437786/get-the-size-of-the-screen-current-web-page-and-browser-window
	// https://source.unsplash.com/

	function t()
	{
	var w = window,
	d = document,
	e = d.documentElement,
	g = d.body,
	x = w.innerWidth \|\| e.clientWidth \|\| g.clientWidth,
	y = w.innerHeight\|\| e.clientHeight\|\| g.clientHeight;

	/*
	console.log("w: " + w.innerWidth + "x" + w.innerHeight);
	console.log("e: " + e.clientWidth + "x" + e.clientHeight);
	console.log("g: " + g.clientWidth + "x" + g.clientHeight);
	console.log("s: " + screen.width + "x" + screen.height);
	*/

	var xhr = new XMLHttpRequest();
	xhr.open('GET', "https://source.unsplash.com/random/" + x + "x" + y);
	xhr.onload = function()
	{
	if (xhr.status === 200)
	{
	unsplash.src = xhr.responseURL;
	}
	else
	{
	console.log('Request failed. Returned status of ' + xhr.status);
	}
	};
	xhr.send();
	}

	function randomlyUpdate()
	{
	t();
	setTimeout(randomlyUpdate, 5000 + Math.floor(Math.random() * 25000));
	}

	window.onload = randomlyUpdate;
	window.onresize = t;

	</script>
	<style>
	body {
	overflow: hidden;
	margin: 0;
	padding: 0;
	}
	</style>
	</head>
	<body>
	<img id="unsplash" />
	</body>