var moveidx=0;
var neuidxhist=[];

var board=Array.apply(null,new Array(S*S)).map(function(){return 0;});
var fgcells=board.map(function(){return null;});
var neuidx;

var canclick=false;

function init(){
	var tr,td,y,x,e,span,
	    movelisttbody,
	    header=document.getElementById("header"),
	    status=document.getElementById("status"),
	    movelist=document.getElementById("movelist"),
	    bgtbody=document.getElementById("bgtbody");

	document.title="Game: "+PLAYERS[0]+" vs "+PLAYERS[1];

	header.appendChild(document.createTextNode("Game: "));
	span=document.createElement("span");
	span.classList.add("celltypeclr"); span.classList.add("celltypeclr_1");
	span.appendChild(document.createTextNode(PLAYERS[0]));
	header.appendChild(span);
	header.appendChild(document.createTextNode(" vs "));
	span=document.createElement("span");
	span.classList.add("celltypeclr"); span.classList.add("celltypeclr_2");
	span.appendChild(document.createTextNode(PLAYERS[1]));
	header.appendChild(span);

	status.appendChild(document.createTextNode("Game won by "));
	span=document.createElement("span");
	span.classList.add("celltypeclr"); span.classList.add("celltypeclr_"+WINNER);
	span.appendChild(document.createTextNode(PLAYERS[WINNER-1]));
	status.appendChild(span);
	status.appendChild(document.createTextNode("."));


	e=document.createElement("table");
	movelisttbody=document.createElement("tbody");
	tr=document.createElement("tr");
	td=document.createElement("td"); td.innerHTML="Player"; tr.appendChild(td);
	td=document.createElement("td"); td.innerHTML="Neutron"; tr.appendChild(td);
	td=document.createElement("td"); td.innerHTML="Stone"; tr.appendChild(td);
	movelisttbody.appendChild(tr);
	e.appendChild(movelisttbody);
	movelist.appendChild(e);

	tr=document.createElement("tr");
	td=document.createElement("td");
	td.setAttribute("colspan","3");
	td.innerHTML=" ";
	tr.appendChild(td);
	(function(tr){
		tr.addEventListener("click",function(ev){
			if(moveidx==0)return;
			while(moveidx>0)prevmove(true);
			setselectedmovelistline(0);
		});
	})(tr);
	tr.classList.add("selected");
	movelisttbody.appendChild(tr);

	MOVES.forEach(function(mv,i){
		var tr,td;
		tr=document.createElement("tr");

		td=document.createElement("td");
		td.innerHTML=i%2+1;
		tr.appendChild(td);

		td=document.createElement("td");
		if(mv[0]==-1)td.innerHTML=" ";
		else td.innerHTML=arrowfor(mv[0]);
		tr.appendChild(td);

		td=document.createElement("td");
		td.innerHTML=mv[1]+": "+arrowfor(mv[2]);
		tr.appendChild(td);

		tr.addEventListener("click",(function(target){return function(ev){
			if(moveidx==target)return;
			while(moveidx<target)nextmove(true);
			while(moveidx>target)prevmove(true);
			setselectedmovelistline(i+1);
		};})(i+1));

		movelisttbody.appendChild(tr);
	});


	for(y=0;y<S;y++){
		tr=document.createElement("tr");
		for(x=0;x<S;x++){
			td=document.createElement("td");
			td.classList.add("bgcell");
			td.innerHTML=S*y+x;
			tr.appendChild(td);
		}
		bgtbody.appendChild(tr);
	}
	for(x=0;x<S;x++){
		board[x]=1;
		e=makefgcell(x,1);
		fgcells[x]=e;
		document.body.appendChild(e);

		board[S*(S-1)+x]=2;
		e=makefgcell(S*(S-1)+x,2);
		fgcells[S*(S-1)+x]=e;
		document.body.appendChild(e);
	}
	neuidx=S*~~(S/2)+~~(S/2);
	board[neuidx]=3;
	e=makefgcell(neuidx,3);
	fgcells[neuidx]=e;
	document.body.appendChild(e);

	setnextenabled(true);
	setprevenabled(false);
	canclick=true;
}

function setselectedmovelistline(i){
	var movelist=document.getElementById("movelist");
	movelist.querySelectorAll("tr.selected")[0].classList.remove("selected");
	document.getElementById("movelist").getElementsByTagName("tr")[i+1].classList.add("selected");
}

function arrowfor(dir){
	return "&#x"+[2191,2197,2192,2198,2193,2199,2190,2196][dir]+";";
}

function bgcell(idx){
	return document.getElementById("bgtbody").children[idx/S|0].children[idx%S];
}
function fgcellposition(idx){
	var rect=bgcell(idx).getBoundingClientRect(),
	    scrolltop=window.pageYOffset||document.documentElement.scrollTop;
	return [rect.left,rect.top+scrolltop];
}
function movefgcell(e,idx){
	var pos=fgcellposition(idx);
	e.style.left=pos[0]+"px";
	e.style.top=pos[1]+"px";
	e.cell_index=idx;
}
function makefgcell(idx,type){ //type in [1,2,3]
	var pos=fgcellposition(idx),
	    e=document.createElement("div");
	e.classList.add("fgcell");
	e.classList.add("celltype_"+type);
	e.setAttribute("style","left:"+pos[0]+"px;top:"+pos[1]+"px;");
	e.cell_index=idx;
	e.appendChild(document.createElement("div"));
	return e;
}

var index_deltas=[[0,-1],[1,-1],[1,0],[1,1],[0,1],[-1,1],[-1,0],[-1,-1]];
function indexafterslide(from,dir,overshoot){
	var x=from%S,y=~~(from/S),x2,y2;
	while(true){
		x2=x+index_deltas[dir][0];
		y2=y+index_deltas[dir][1];
		if(x2<0||x2>=S||y2<0||y2>=S||board[S*y2+x2]!=0){
			if(overshoot)return S*y2+x2;
			else return S*y+x;
		}
		x=x2;
		y=y2;
	}
}

function setnextenabled(en){
	document.getElementById("nextmovebtn").disabled=!en;
}
function setprevenabled(en){
	document.getElementById("prevmovebtn").disabled=!en;
}

function nextmove(notimeout){
	var newidx;
	if(moveidx==MOVES.length||!canclick)return false;

	if(MOVES[moveidx][0]!=-1){
		neuidxhist.push(neuidx);
		newidx=indexafterslide(neuidx,MOVES[moveidx][0]);
		movefgcell(fgcells[neuidx],newidx);
		board[newidx]=board[neuidx];
		board[neuidx]=0;
		fgcells[newidx]=fgcells[neuidx];
		fgcells[neuidx]=null;
		neuidx=newidx;

		if(moveidx==MOVES.length-1)bgcell(neuidx).classList.add("win");
	}

	newidx=indexafterslide(MOVES[moveidx][1],MOVES[moveidx][2]);
	if(MOVES[moveidx][0]!=-1&&!notimeout){
		setTimeout(
			(function(e,idx){return function(){
				movefgcell(e,idx);
				canclick=true;
			};})(fgcells[MOVES[moveidx][1]],newidx),
			500
		);
		canclick=false;
	} else {
		movefgcell(fgcells[MOVES[moveidx][1]],newidx);
	}
	board[newidx]=board[MOVES[moveidx][1]];
	board[MOVES[moveidx][1]]=0;
	fgcells[newidx]=fgcells[MOVES[moveidx][1]];
	fgcells[MOVES[moveidx][1]]=null;

	moveidx++;
	setprevenabled(true);
	if(moveidx==MOVES.length)setnextenabled(false);
	if(!notimeout)setselectedmovelistline(moveidx);
	return true;
}
function prevmove(notimeout){
	var item,oldneuidx,newidx,winGlowIdxToRemove=null;
	if(moveidx==0||!canclick)return false;
	moveidx--;

	if(MOVES[moveidx][0]!=-1&&moveidx==MOVES.length-1)winGlowIdxToRemove=neuidx;

	newidx=indexafterslide(MOVES[moveidx][1],MOVES[moveidx][2],true);
	board[MOVES[moveidx][1]]=board[newidx];
	board[newidx]=0;
	fgcells[MOVES[moveidx][1]]=fgcells[newidx];
	fgcells[newidx]=null;
	movefgcell(fgcells[MOVES[moveidx][1]],MOVES[moveidx][1]);

	if(MOVES[moveidx][0]!=-1){
		oldneuidx=neuidxhist.pop();
		board[oldneuidx]=board[neuidx];
		board[neuidx]=0;
		fgcells[oldneuidx]=fgcells[neuidx];
		fgcells[neuidx]=null;
		if(notimeout){
			movefgcell(fgcells[oldneuidx],oldneuidx);
			if(winGlowIdxToRemove!=null)bgcell(winGlowIdxToRemove).classList.remove("win");
		} else {
			setTimeout(
				(function(e,idx){return function(){
					movefgcell(e,idx);
					canclick=true;
					if(winGlowIdxToRemove!=null)bgcell(winGlowIdxToRemove).classList.remove("win");
				};})(fgcells[oldneuidx],oldneuidx),
				500
			);
			canclick=false;
		}
		neuidx=oldneuidx;
	}

	setnextenabled(true);
	if(moveidx==0)setprevenabled(false);
	if(!notimeout)setselectedmovelistline(moveidx);
	return true;
}

window.addEventListener("load",init,false);