<html>
<title>Random Backgrounds - RJM Programming - May, 2020 ... thanks to https://picsum.photos</title>
<head>
<style>

body {
margin: 0 0 0 0;
opacity:1.0;
/* -webkit-mask-image: radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.0) 50%);
mask-image: radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.0) 50%); */
-webkit-animation: fadeinout 15s infinite ease-in-out alternate;
animation: fadeinout 15s infinite ease-in-out alternate;
}

#overlay {
position:relative;
margin: 0 0 0 0;
top:0;
left:0;
width:100%;
height:100%;
opacity:1.0;
/* background:rgba(0,0,0,1.0); */
background-size: cover;
background-clip: text;
-webkit-background-clip: text;
/* color: transparent; */
font-size: 128px;
line-height: 1.2;
text-align: center;
}

@-webkit-keyframes fadeinout {
0%,100% { opacity: 0.95; }
50% { opacity: 0; }
}

@keyframes fadeinout {
0%,100% { opacity: 0.95; }
50% { opacity: 0; }
}

#wdiv {
display: inline-block;
font-size: 128px;
line-height: 1.2;
text-align: center;
background: url(https://picsum.photos/1000/1000?image=580);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-clip: text;
-webkit-background-clip: text;
color: transparent; /* rgba(255,0,0,0.2); */
-webkit-animation: fadeinout 15s infinite ease-in-out alternate;
animation: fadeinout 15s infinite ease-in-out alternate;

span { color: transparent; }
}

#ovimage {
/* -webkit-mask-image: radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.0) 50%);
mask-image: radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.0) 50%); */
position:absolute;
margin: 0 0 0 0;
top:0;
left:0;
width:100%;
height:100%;
opacity:1.0;
background:rgba(0,0,0,1.0);
-webkit-animation: fadeinout 15s infinite ease-in-out alternate;
animation: fadeinout 15s infinite ease-in-out alternate;
}

#ovJUNKerlay:before {
content: attr(data-hover);
}

/* html { height: 100%; display: flex; } */
/* body {
margin: auto;
max-width: 300px;
text-align: center;
} */
</style>
<script type='text/javascript'>
var svgmask='';
var isok=true;
var wois=null;
var presvgmask=location.search.split('svgmask=')[1] ? decodeURIComponent(location.search.split('svgmask=')[1].split('&')[0]) : '';
var onis='▪';
var offis='▫';
var titleis='There are image masking options with a click and thanks to https://picsum.photos for image background(s) ... ';
for (var i=1; i<=10; i++) {
titleis+=String.fromCodePoint(9643);
}

if (!String.fromCodePoint) { // thanks to http://xahlee.info/js/js_unicode_code_point.html
// ES6 Unicode Shims 0.1 , © 2012 Steven Levithan , MIT License
String.fromCodePoint = function fromCodePoint () {
var chars = [], point, offset, units, i;
for (i = 0; i < arguments.length; ++i) {
point = arguments[i];
offset = point - 0x10000;
units = point > 0xFFFF ? [0xD800 + (offset >> 10), 0xDC00 + (offset & 0x3FF)] : [point];
chars.push(String.fromCharCode.apply(null, units));
}
return chars.join("");
}
}

function preonl() {
var fillis='#ffffff';
if (1 == 2) {
document.getElementById('myiframe').src=document.URL.split('#')[0].split('?')[0] + '?random=' + Math.floor(Math.random() * 19876543);
document.body.title=titleis;
} else {
if (svgmask.indexOf(';') != -1) {
if (!document.getElementById('ovimage')) {
document.body.style.background='';
document.body.innerHTML+="<img id=ovimage src='https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + "'></img>";
document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('ovimage').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
}
document.getElementById('ovimage').src="https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543);
} else if (svgmask.toLowerCase().indexOf('triangle') == 0) {
if (svgmask.toLowerCase() != 'triangle') { fillis=svgmask.substring(8); }
document.getElementById('ovimage').style.display='none';
document.getElementById('overlay').innerHTML='<svg width="' + Math.floor(eval(screen.width * 0.8)) + '" height="' + Math.floor(eval(screen.height * 0.8)) + '"><mask id="svgmask1"><polygon fill="' + fillis + '" points="' + eval(screen.width / 2) + ' 0, ' + Math.floor(eval(screen.width * 0.8)) + ' ' + Math.floor(eval(screen.height * 0.8)) + ', 0 ' + Math.floor(eval(screen.height * 0.8)) + '"></polygon></mask><image xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="' + "https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + '" mask="url(#svgmask1)"></image></svg>';
document.getElementById('overlay').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('overlay').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
} else if (svgmask.toLowerCase().indexOf('star') == 0) {
if (svgmask.toLowerCase() != 'star') { fillis=svgmask.substring(4); }
document.getElementById('ovimage').style.display='none';
document.getElementById('overlay').innerHTML='<svg width="' + screen.width + '" height="' + screen.height + '"><mask id="svgmask2"><polygon fill="' + fillis + '" points="' + Math.floor(eval(100 * eval(screen.width / 250))) + ',' + Math.floor(eval(10 * eval(screen.height / 250))) + ' ' + Math.floor(eval(40 * eval(screen.width / 250))) + ',' + Math.floor(eval(198 * eval(screen.height / 250))) + ' ' + Math.floor(eval(190 * eval(screen.width / 250))) + ',' + Math.floor(eval(78 * eval(screen.height / 250))) + ' ' + Math.floor(eval(10 * eval(screen.width / 250))) + ',' + Math.floor(eval(78 * eval(screen.height / 250))) + ' ' + Math.floor(eval(160 * eval(screen.width / 250))) + ',' + Math.floor(eval(198 * eval(screen.height / 250))) + '"></polygon></mask><image xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="' + "https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + '" mask="url(#svgmask2)"></image></svg>';
document.getElementById('overlay').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('overlay').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
} else if (svgmask.trim() != '') {
document.body.style.background='';
document.getElementById('overlay').style.background='';
document.getElementById('wdiv').style.background='';
//document.getElementById('myh1').style.background="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + ")"; //" center center no-repeat";
if (document.getElementById('wdiv').innerHTML == '') {
document.getElementById('wdiv').innerHTML=svgmask;
document.getElementById('dstyle').innerHTML+='<style> html { height: 100%; display: flex; } </style>';
document.getElementById('wdiv').style.zIndex='345';
//document.getElementById('overlay').style.display='inline-block';
//document.getElementById('overlay').style.color='transparent';
}
//document.getElementById('overlay').style.background="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + ") center center no-repeat";
document.getElementById('wdiv').style.backgroundImage="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + ")"; //" center center no-repeat";
} else {
//document.body.style.backgroundImage="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + ")";
document.getElementById('overlay').style.backgroundImage="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + "?random=" + Math.floor(Math.random() * 19876543) + ")";
}
document.body.title=titleis;
setTimeout(preonl, 15000);
}
}

function bonl() {
document.getElementById('overlay').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('overlay').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
document.getElementById('wdiv').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('wdiv').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
}

function odc() {
if (isok) {
if (presvgmask != '') {
svgmask=presvgmask;
presvgmask='';
} else {
svgmask=prompt('Optionally leave leftmost semicolon delimited CSS of masking SVG or optionally enter triangle or star or words to mask against (where <br> equates to a line feed).','radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.0) 50%); linear-gradient(black, transparent); radial-gradient(circle, black 50%, rgba(0, 0, 0, 0.0) 50%); ');
}
if (!svgmask) {
svgmask='';
} else if (svgmask) {
if (svgmask.indexOf(';') != -1) {
if (!document.getElementById('ovimage')) {
document.body.style.background='';
document.getElementById('overlay').style.background='';
document.body.innerHTML+='<img style="mask-image:' + svgmask.split(';')[0] + '; -webkit-mask-image:' + svgmask.split(';')[0] + ';" id=ovimage src=https://picsum.photos/' + ('' + screen.width).split('.')[0] + '/' + ('' + screen.height).split('.')[0] + '?random=' + Math.floor(Math.random() * 19876543) + '></img>';
document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('ovimage').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
} else {
location.href=document.URL.split('#')[0].split('?')[0] + '?svgmask=' + encodeURIComponent(svgmask.split(';')[0] + ';');
//document.getElementById('ovimage').style.setAttribute('-webkit-mask-image', svgmask.split(';')[0]);
//document.getElementById('ovimage').style.maskImage=svgmask.split(';')[0];
//document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
//document.getElementById('ovimage').onmousedown = function(evt) { isok=true; setTimeout(odc, 2000); };
}
//document.getElementById('ovimage').style.maskImage=svgmask.split(';')[0];
//document.getElementById('ovimage').style.setAttribute('-webkit-mask-image', svgmask.split(';')[0]);
} else if (svgmask.toLowerCase().indexOf('triangle') == 0) {
if (!document.getElementById('ovimage')) {
document.body.style.background='';
document.getElementById('overlay').style.background='';
document.body.innerHTML+='<img id=ovimage src=https://picsum.photos/' + ('' + screen.width).split('.')[0] + '/' + ('' + screen.height).split('.')[0] + '?random=' + Math.floor(Math.random() * 19876543) + '></img>';
document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('ovimage').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
document.body.innerHTML+='<img style="mask-image:url(#svgmask1); -webkit-mask-image:url(#svgmask1);" id=ovimage src=https://picsum.photos/' + ('' + screen.width).split('.')[0] + '/' + ('' + screen.height).split('.')[0] + '?random=' + Math.floor(Math.random() * 19876543) + '></img>';
} else {
//location.href=document.URL.split('#')[0].split('?')[0] + '?svgmask=' + encodeURIComponent(svgmask);
document.getElementById('ovimage').style.setAttribute('-webkit-mask-image', 'url(#svgmask1)');
document.getElementById('ovimage').style.maskImage='url(#svgmask1)';
document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('ovimage').onmousedown = function(evt) { isok=true; setTimeout(odc, 2000); };
}
document.body.style.background='';
document.getElementById('overlay').style.background='';
} else if (svgmask.toLowerCase().indexOf('star') == 0) {
if (!document.getElementById('ovimage')) {
document.body.style.background='';
document.getElementById('overlay').style.background='';
document.body.innerHTML+='<img id=ovimage src=https://picsum.photos/' + ('' + screen.width).split('.')[0] + '/' + ('' + screen.height).split('.')[0] + '?random=' + Math.floor(Math.random() * 19876543) + '></img>';
document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('ovimage').onclick = function(evt) { isok=true; setTimeout(odc, 2000); };
document.body.innerHTML+='<img style="mask-image:url(#svgmask2); -webkit-mask-image:url(#svgmask2);" id=ovimage src=https://picsum.photos/' + ('' + screen.width).split('.')[0] + '/' + ('' + screen.height).split('.')[0] + '?random=' + Math.floor(Math.random() * 19876543) + '></img>';
} else {
//location.href=document.URL.split('#')[0].split('?')[0] + '?svgmask=' + encodeURIComponent(svgmask);
document.getElementById('ovimage').style.setAttribute('-webkit-mask-image', 'url(#svgmask2)');
document.getElementById('ovimage').style.maskImage='url(#svgmask2)';
document.getElementById('ovimage').ondblclick = function(evt) { isok=false; if (wois) { if (!wois.closed) { wois.close(); } } wois=window.open(('' + document.body.style.background).split(')')[0].split('(')[1].replace("'","").replace("'","").replace('"','').replace('"',''), '_blank', 'left=0,top=0,width=' + screen.width + ',height=' + screen.height); };
document.getElementById('ovimage').onmousedown = function(evt) { isok=true; setTimeout(odc, 2000); };
}
document.body.style.background='';
document.getElementById('overlay').style.background='';
} else if (svgmask.trim() != '' && document.getElementById('ovimage')) {
location.href=document.URL.split('#')[0].split('?')[0] + '?svgmask=' + encodeURIComponent(svgmask);
}
}
}
}

function onl(iois) {
if (('' + iois.src).indexOf('?random=') != -1) {
if (iois != null) {
var aconto = (iois.contentWindow || iois.contentDocument);
if (aconto != null) {
document.getElementById('mybody').style.background="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + ") center center no-repeat";
setTimeout(preonl, 15000);
}
}
}
}

function progit() {
document.body.title=document.body.title.replace(String.fromCodePoint(9643), String.fromCodePoint(9642));
}

function prebonl() {
document.body.title=titleis;
document.getElementById('overlay').style.background="url(https://picsum.photos/" + ('' + screen.width).split('.')[0] + "/" + ('' + screen.height).split('.')[0] + ") center center no-repeat";
if (presvgmask != '') {
odc(); //document.getElementById('overlay').click();
}
}

setTimeout(preonl, 15000);
setInterval(progit, 1000);
</script>
</head>

<body onload='prebonl(); bonl();' title='' id=mybody><div id=wdiv></div><div id=overlay></div><iframe onload=onl(this); id=myiframe src='' style='display:none;'></iframe></body>
<div id=dstyle></div>
</html>