function shuffle(array) {
    var i = array.length,
        j = 0,
        temp;

    while (i--) {

        j = Math.floor(Math.random() * (i+1));

        // swap randomly chosen element with current element
        temp = array[i];
        array[i] = array[j];
        array[j] = temp;

    }

    return array;
}

$.getJSON("?service=WebAsset&url=js/StartPageData/StartPage.json&contentType=application/json", function (json) {

    var arr = shuffle(Object.values(json.imageList[0]));

    localStorage.setItem("images", JSON.stringify(arr));
});

$(document).ready(function() {
var storedImages = JSON.parse(localStorage.getItem("images"));


// check for correct context and return if not (JH 2022-10-12)
if (!document.getElementById("box1")) {
	return;
}


document.getElementById("box1").innerHTML += "<a href=''><img class='img_src' id='img1' src=" + storedImages.slice(0,1) + " onerror='imgError(this);' /></a>";
document.getElementById("box2").innerHTML += "<a href=''><img class='img_src' id='img2' src=" + storedImages.slice(1,2) + " onerror='imgError(this);' /></a>";
document.getElementById("box3").innerHTML += "<a href=''><img class='img_src' id='img3' src=" + storedImages.slice(2,3) + " onerror='imgError(this);' /></a>";
document.getElementById("box4").innerHTML += "<a href=''><img class='img_src' id='img4' src=" + storedImages.slice(3,4) + " onerror='imgError(this);' /></a>";


let str = $('#img1');
let occur = $(str).attr('src');
let objOne = occur.substring(occur.indexOf('&objectId=')+ 1, occur.lastIndexOf("&resolution="));

//var link = document.getElementById('img1');
//var src = link.getAttribute("src").replace('superImageResolution', 'highImageResolution');
//link.setAttribute("src", src);

let str2 = $('#img2');
let occur2 = $(str2).attr('src');
let objTwo = occur2.substring(occur2.indexOf('&objectId=')+ 1, occur2.lastIndexOf("&resolution="));

let str3 = $('#img3');
let occur3 = $(str3).attr('src');
let objThree = occur3.substring(occur3.indexOf('&objectId=')+ 1, occur3.lastIndexOf("&resolution="));

let str4 = $('#img4');
let occur4 = $(str4).attr('src');
let objFour = occur4.substring(occur4.indexOf('&objectId=')+ 1, occur4.lastIndexOf("&resolution="));

var fancyLink1 = "?service=ExternalInterface&module=collection&" + objOne + "&viewType=detailView"
$('#box1 a').attr('href', fancyLink1);

var fancyLink2 = "?service=ExternalInterface&module=collection&" + objTwo + "&viewType=detailView"
$('#box2 a').attr('href', fancyLink2);

var fancyLink3 = "?service=ExternalInterface&module=collection&" + objThree + "&viewType=detailView"
$('#box3 a').attr('href', fancyLink3);

var fancyLink4 = "?service=ExternalInterface&module=collection&" + objFour + "&viewType=detailView"
$('#box4 a').attr('href', fancyLink4);

//var toReplace = $('#box1 .img_src').attr('src');

//var replaced = String(toReplace).replace('&resolution=superImageResolution&', '&resolution=highImageResolution&');

//$('.inner-box .img_src').each(function() {
//var num = Math.floor(Math.random() * storedImages.length),

//img = $(this);
//img.attr('src', 'https://emp-web-75.zetcom.ch/eMP/eMuseumPlus' + storedImages[num] + '');
   
//img.attr('src', 'https://emp-web-75.zetcom.ch/eMP/eMuseumPlus' + storedImages + '');

/* storedImages.forEach(function () 
    { document.getElementById("randImgs").innerHTML += "<div class='col-sm-3 front-box'><div class='inner-box image-box'><img class='img_src' src=" + storedImages.slice(0,1) + " /></div></div>"; });
*/
}); 
//});