var win = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15);
var pos = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15);
var data = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15);


function winCheck(){
    var success = true;
    for(var i = 0; i < win.length;i++){
    if(win[i] !== pos[i]){
            success = false;
            break;
    }
    }
    if (success){
        window.alert("win?");
    } else {
    window.alert("De schuifpuzzel is nog niet correct opgelost");
    }
}
function renderImg(){
    var img0 = document.createElement('img');
    var img1 = document.createElement('img');
    var img2 = document.createElement('img');
    var img3 = document.createElement('img');
    var img4  = document.createElement('img');
    var img5 = document.createElement('img');
    var img6 = document.createElement('img');
    var img7 = document.createElement('img');
    var img8 = document.createElement('img');
    var img9 = document.createElement('img');
    var img10 = document.createElement('img');
    var img11 = document.createElement('img');
    var img12 = document.createElement('img');
    var img13 = document.createElement('img');
    var img14 = document.createElement('img');
    var img15 = document.createElement('img');

    img0.src = data[0];
    img1.src = data[1];
    img2.src = data[2];
    img3.src = data[3];
    img4.src = data[4];
    img5.src = data[5];
    img6.src = data[6];
    img7.src = data[7];
    img8.src = data[8];
    img9.src = data[9];
    img10.src = data[10];
    img11.src = data[11];
    img12.src = data[12];
    img13.src = data[13];
    img14.src = data[14];
    img15.src = data[15];

    img0.setAttribute("id", "pos0");
    img1.setAttribute("id", "pos1");
    img2.setAttribute("id", "pos2");
    img3.setAttribute("id", "pos3");
    img4.setAttribute("id", "pos4");
    img5.setAttribute("id", "pos5");
    img6.setAttribute("id", "pos6");
    img7.setAttribute("id", "pos7");
    img8.setAttribute("id", "pos8");
    img9.setAttribute("id", "pos9");
    img10.setAttribute("id", "pos10");
    img11.setAttribute("id", "pos11");
    img12.setAttribute("id", "pos12");
    img13.setAttribute("id", "pos13");
    img14.setAttribute("id", "pos14");
    img15.setAttribute("id", "pos15");

    document.getElementById("pos0").innerHTML(img0);
    document.getElementById("pos1").innerHTML(img1);
    document.getElementById("pos2").innerHTML(img2);
    document.getElementById("pos3").innerHTML(img3);
    document.getElementById("pos4").innerHTML(img4);
    document.getElementById("pos5").innerHTML(img5);
    document.getElementById("pos6").innerHTML(img6);
    document.getElementById("pos7").innerHTML(img7);
    document.getElementById("pos8").innerHTML(img8);
    document.getElementById("pos9").innerHTML(img9);
    document.getElementById("pos10").innerHTML(img10);
    document.getElementById("pos11").innerHTML(img11);
    document.getElementById("pos12").innerHTML(img12);
    document.getElementById("pos13").innerHTML(img13);
    document.getElementById("pos14").innerHTML(img14);
    document.getElementById("pos15").innerHTML(img15);



}
function editImg(i, n){
    var holdImg = data[n];
    data[n] = data[n+i];
    data[n+i] = holdImg;
    renderImg();
}
function Check(n){
var hold = pos[n];
    if (pos[n-1] === 15 && pos[n] !== 0 && pos[n] !== 4 && pos[n] !== 8 && pos[n] !== 12){
        pos[n] = pos[n-1];
        pos[n-1] = hold;
                editImg(-1, n);
    } else if (pos[n+1] === 15 && pos[n] !== 3 && pos[n] !== 7 && pos[n] !== 11 && pos[n] !== 15){
        pos[n] = pos[n+1];
        pos[n+1] = hold;
                editImg(1, n);
    } else if (pos[n-4] === 15) {
        pos[n] = pos[n-4];
        pos[n-4] = hold;
                editImg(-4, n);
    } else if (pos[n+4] === 15) {
        pos[n] = pos[n+4];
        pos[n+4] = hold;
                editImg(4, n);
    } else {
        window.alert("Dit stukje kan niet worden verschoven.");
    }
    console.log(pos);
}