JamesTheAwesomeDude/cgi-bin_v0.cgi

## cgi-bin_v0.cgi
#!/bin/sh

cd "$(dirname "${0}")/.."

case "${REQUEST_METHOD}" in
  GET)
	printf 'Status: %s\r\n' "200 OK"
	printf 'Content-Type: %s\r\n' "application/json"
	printf '\r\n'
	exec cat "X.v0.json"
	;;
  POST)
	printf 'Status: %s\r\n' "200 OK"
	printf 'Content-Type: %s\r\n' "application/json"
	printf '\r\n'
	cp -v "X.v0.json" "X.v0.json.$(date -u '+%Y%m%d%H%M%S').bak"
	cat > "X.v0.json"
	;;
  *)
	printf 'Status: %s\r\n' "405 Method Not Allowed"
	printf 'Content-Type: %s\r\n' "application/json"
	printf '\r\n'
esac

## index.php
<?php
if ($_SERVER["PHP_AUTH_USER"])
 setcookie('username',$_SERVER["PHP_AUTH_USER"]);
?>

<html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="test.css" type="text/css" />
<style type="text/css" id="cosmetics">
[data-id="0"]{background-color: Red !important;}
[data-id="1"]{background-color: Blue !important;}
[data-id="2"]{background-color: Lime !important;}
[data-id="3"]{background-color: Yellow !important;}

[data-id] .attr.data-id{display: none !important;}
[data-id]::before{//content: attr(data-id);}
</style>
<script type="text/javascript" src="test.js" onload="_main(event);" defer></script>
</head>
<body>
<p>DEBUG TOOLS:</p>
<ul>
<li><a href="javascript:(()=>{window.X=newGame();initFieldContainer()})();">CREATE NEW GAME</a></li>
<li><a href="javascript:clearSavedState();">clear old local state</a></li>
<li><a href="javascript:loadSavedState();">&#x2601;&#xfe0f; load saved state</a></li>
<li><a href="javascript:saveState();">&#x2601;&#xfe0f; save current state</a></li>
<li><a href="javascript:location.reload();">reload</a></li>
<li><a href="javascript:initFieldContainer();" style="font-weight: bold">redraw canvas</a></li>
<li><a href="javascript:((p)=>{In(window.X,p).ap+=1;})(whereAmI());">+1AP to you</a></li>
</ul>
<noscript>This page (currently) requires JavaScript to view.</noscript>
</body>
</html>

## test.css
#field .cell {
	text-align: center;
	width: 4em;
	height: 4em;
	border: 1pt solid black;
}

#field .inrange {}

#field .attr {text-shadow: 0 0 1pt Purple;}
#field .attr.data-id::after {content:"\A";white-space:pre;}
#field .attr:nth-child(even) {}

#field .attr.data-id {color: Black;}
#field .attr.data-hp {color: Fuchsia; font-weight: bold; font-size: large;}
#field .attr.data-ap {color: Aqua; font-weight: bold; font-size: x-large;}
#field .attr.data-r {color: Grey;}

## test.js

if(document.cookie.match(/(?:(?:^|.*;\s*)DEBUG\s*\=\s*([^;]*).*$)|^.*$/))
 window.DEBUG=true;

defaultBattlefieldParams={r:8,c:8,n:4,ap0:3,hp0:3,r0:2};

function _main(event){
	loadState();
	initFieldContainer();
}

function _try(f,a){
	try{return f.apply(null,a)}
	catch(e){
		alert(e);
		throw e
	}
}

function In(L,I,v){
	let cur,pre,Iw=Array.from(I);
	do cur=(pre=cur||L)[i=Iw.shift()]
	while(Iw.length);
	if(typeof v != 'undefined')
	 pre[i]=v;
	return cur;
}

function initFieldContainer(fc){
	if(typeof fc == 'undefined') (fc=(
	  (document.getElementById('fieldContainer'))
	 ||
	  (document.body.appendChild(document.createElement('div')))
	)).id='fieldContainer';
	fc.innerHTML='';
	fc.appendChild(renderField(X)).id='field';
	fc.querySelectorAll('.cell').forEach(e=>e.onclick=cellClickHandler);
	//return fc;
}

function cellClickHandler(event){
	y=parseInt(this.getAttribute('data-y'));
	x=parseInt(this.getAttribute('data-x'));
	t=[y,x];
	T=In(X,t);
	P=In(X,whereAmI());
	if(!confirm(`Would you like to act on ${t}?\n\nPlayer=${JSON.stringify(P)}\nTarget=${JSON.stringify(T)}`)) return;

	r=distR(t,whereAmI());
	if(r==0)
	 assumedAction='upg';
	else if(r==1&&!T)
	 assumedAction='mov';
	else if(r<=P.r)
	 assumedAction='gif';
	else assumedAction='';

	_try(takeAction,
	 [
	  prompt(
	   "What action would you like to take?\n(mov,gif,att,upg)",
	   assumedAction
	  ),
	  t
	 ]
	);
}

function newGame(pa=defaultBattlefieldParams){
	X=new2dArray(defaultBattlefieldParams['r'],defaultBattlefieldParams['c']);
	createPlayersIn(X,defaultBattlefieldParams['n'],defaultBattlefieldParams['hp0'],defaultBattlefieldParams['ap0'],defaultBattlefieldParams['r0']);
	return X;
}

function loadState(autoNew=true){
	var xhr=new XMLHttpRequest();
	xhr.open('GET',"cgi-bin/v0.cgi",false);
	xhr.send();
	try {r=JSON.parse(xhr.responseText)}
	catch (e) {r={}};
	X=r['X'];
	if(!(m=document.cookie.match((/(?:^|[^;]+)\s*(username)\s*=\s*([^;]+)/))))
     document.cookie='username='+(u=prompt("ENTER YOUR MINECRAFT USERNAME\n(CASE-SENSITIVE)"))
    else
     u=m[2];
	playerId=(r['pIds']||{})[u];
//	X=JSON.parse(window.localStorage.getItem('X'));
//	playerId=window.localStorage.getItem('playerId');

	if(X===null || typeof X == 'undefined'){
		if(autoNew){
		    X=newGame()
		} else throw 'loadStateError';
	}

	if((playerId===null || typeof playerId == 'undefined')&&autoNew){
		if(autoNew)
		 playerId=parseInt(prompt("ENTER YOUR ID"));
		else throw 'loadStateError';
	}

	window.X=X;
	window.playerId=playerId;
}

function saveState(X=window.X,playerId=window.playerId){
	var xhr=new XMLHttpRequest();
	xhr.open('POST',"cgi-bin/v0.cgi",false);
	xhr.setRequestHeader('Content-Type', 'application/json');
	xhr.responseType='application/json';
	xhr.send(JSON.stringify({'X':X,'pIds':{'squeegily':0,'drako365':1}}));
//	window.localStorage.setItem('X',JSON.stringify(X));
//	window.localStorage.setItem('playerId',playerId);
}

function clearSavedState(){
	window.localStorage.removeItem('X');
	window.localStorage.removeItem('playerId');
}

function locatePlayerById(id,X=window.X){
	for(row of X){
		for(cell of row){
			if(cell && cell.id==id)
			 return [X.indexOf(row),row.indexOf(cell)]
		}
	}
	throw 'playerNotFound';
}
function whereAmI(){
	return locatePlayerById(window.playerId);
}

function MOV(t,s=whereAmI(),X=window.X){
	if(!(P=In(X,s))) throw 'sourceEmpty';
	else if(In(X,t)) throw 'targetCollision';
	else if(!(P.ap>0)) throw 'actionpointDeficiency';
	else if(distR(s,t)!=1) throw 'actionrangeError:\n'+s+' to '+t+'\nis '+distR(s,t);//TODO
	else {
		In(X,t,In(X,s,null));
		P.ap-=1;
	}
}
function GIF(t,n=1,s=whereAmI(),X=window.X){
	if(!(P1=In(X,s))) throw 'sourceEmpty';
	else if(!(P2=In(X,t))) throw 'targetEmpty:\n'+JSON.stringify(P2);
	else if(!(P1.ap>=n)) throw 'actionpointDeficiency:\n'+JSON.stringify(P1.ap);
	else if(distR(s,t)>P1.r||n<1) throw 'actionrangeError';
	else if(P1==P2) throw 'selfGiftError';
	else {
		P2.ap+=n;
		P1.ap-=n;
	}
}
function ATT(t,n=1,allowSelfHarm=false,s=whereAmI(),X=window.X){
	if(!(P1=In(X,s))) throw 'sourceEmpty';
	else if(!(P2=In(X,t))) throw 'targetEmpty';
	else if(!(P1.ap>=n)) throw 'actionpointDeficiency:\n'+JSON.stringify(P1.ap);
	else if(distR(s,t)>P1.r) throw 'actionrangeError';
	else if(P2.hp<n) throw 'overkillError';
	else if(P1==P2&&!allowSelfHarm) throw 'selfHarmError';
	else {
		P2.hp-=n;
		P1.ap-=n;
		if(P2.hp<=0)
		 In(X,t,null)
	}
}
function UPG(n=1,p=whereAmI(),m=3,X=window.X){
	if(!(P=In(X,p))) throw 'sourceEmpty';
	else if(!(P.ap>=n)) throw 'actionpointDeficiency';
	else if(P.r>=m) throw 'maximumUpgradeReached';
	else {
		P.r+=1;
		P.ap-=1;
	}
}


function new2dArray(r,c){
	var X = new Array(r).fill().map(()=>Array(c).fill(null))
	return X;
}
function createPlayersIn(X,n,hp0,ap0,r0){
	for(let i=0;i<n;i++){
		do {
			y=getRandomInt(X.length);
			x=getRandomInt(X[y].length);
		} while(In(X,[y,x]));
		In(X,[y,x],P={id:i,hp:hp0,ap:ap0,r:r0});
	}
}

function distR(p1,p2){
	return Math.abs(p1[0]-p2[0])+Math.abs(p1[1]-p2[1]);
}

function getRandomInt(a,b){
	if(typeof b == 'undefined')
	 return Math.floor(Math.random()*(a));
	else
	 return Math.floor(Math.random()*(b-a))+a;
}

function renderField(X=window.X){
	e=document.createElement('table');

	y=0;
	for(row of X){
		tr=document.createElement('tr');
		x=0;
		for(cell of row){
			td=document.createElement('td');
			td.classList.add('cell');
			td.setAttribute('data-x',x);
			td.setAttribute('data-y',y);
			if(cell){
				for(k in cell){
					td.setAttribute('data-'+k,cell[k]);
					a=document.createElement('span');
					a.classList.add('attr','data-'+k);
					a.innerText=cell[k];
					//if(k=='id') a.innerText=(cell[k]+1);
					td.appendChild(a);
				}

			} else td.innerText='\u2205';
			tr.appendChild(td);
			x+=1;
		}
		e.appendChild(tr);
		y+=1;
	}
	return e;
}

function takeAction(x,t,X=window.X){
	if(x=='mov')
	 MOV(t);
	else if(x=='gif')
	 GIF(t);
	else if(x=='att')
	 ATT(t);
	else if(x=='upg')
	 UPG();
	else throw 'unrecognizedAction:\n'+x;
	saveState();
	location.reload();
}

function disburseAPs(X=window.X){
	for(row of F.X){
		for(cell of row){
			if(cell)
			 cell.ap+=1;
		}
	}
}
	#!/bin/sh

	cd "$(dirname "${0}")/.."

	case "${REQUEST_METHOD}" in
	GET)
	printf 'Status: %s\r\n' "200 OK"
	printf 'Content-Type: %s\r\n' "application/json"
	printf '\r\n'
	exec cat "X.v0.json"
	;;
	POST)
	printf 'Status: %s\r\n' "200 OK"
	printf 'Content-Type: %s\r\n' "application/json"
	printf '\r\n'
	cp -v "X.v0.json" "X.v0.json.$(date -u '+%Y%m%d%H%M%S').bak"
	cat > "X.v0.json"
	;;
	*)
	printf 'Status: %s\r\n' "405 Method Not Allowed"
	printf 'Content-Type: %s\r\n' "application/json"
	printf '\r\n'
	esac
	<?php
	if ($_SERVER["PHP_AUTH_USER"])
	setcookie('username',$_SERVER["PHP_AUTH_USER"]);
	?>

	<html>
	<head>
	<meta charset="UTF-8" />
	<link rel="stylesheet" href="test.css" type="text/css" />
	<style type="text/css" id="cosmetics">
	[data-id="0"]{background-color: Red !important;}
	[data-id="1"]{background-color: Blue !important;}
	[data-id="2"]{background-color: Lime !important;}
	[data-id="3"]{background-color: Yellow !important;}

	[data-id] .attr.data-id{display: none !important;}
	[data-id]::before{//content: attr(data-id);}
	</style>
	<script type="text/javascript" src="test.js" onload="_main(event);" defer></script>
	</head>
	<body>
	<p>DEBUG TOOLS:</p>
	<ul>
	<li><a href="javascript:(()=>{window.X=newGame();initFieldContainer()})();">CREATE NEW GAME</a></li>
	<li><a href="javascript:clearSavedState();">clear old local state</a></li>
	<li><a href="javascript:loadSavedState();">☁️ load saved state</a></li>
	<li><a href="javascript:saveState();">☁️ save current state</a></li>
	<li><a href="javascript:location.reload();">reload</a></li>
	<li><a href="javascript:initFieldContainer();" style="font-weight: bold">redraw canvas</a></li>
	<li><a href="javascript:((p)=>{In(window.X,p).ap+=1;})(whereAmI());">+1AP to you</a></li>
	</ul>
	<noscript>This page (currently) requires JavaScript to view.</noscript>
	</body>
	</html>
	#field .cell {
	text-align: center;
	width: 4em;
	height: 4em;
	border: 1pt solid black;
	}

	#field .inrange {}

	#field .attr {text-shadow: 0 0 1pt Purple;}
	#field .attr.data-id::after {content:"\A";white-space:pre;}
	#field .attr:nth-child(even) {}

	#field .attr.data-id {color: Black;}
	#field .attr.data-hp {color: Fuchsia; font-weight: bold; font-size: large;}
	#field .attr.data-ap {color: Aqua; font-weight: bold; font-size: x-large;}
	#field .attr.data-r {color: Grey;}

	if(document.cookie.match(/(?:(?:^\|.;\s)DEBUG\s\=\s([^;]).$)\|^.*$/))
	window.DEBUG=true;

	defaultBattlefieldParams={r:8,c:8,n:4,ap0:3,hp0:3,r0:2};

	function _main(event){
	loadState();
	initFieldContainer();
	}

	function _try(f,a){
	try{return f.apply(null,a)}
	catch(e){
	alert(e);
	throw e
	}
	}

	function In(L,I,v){
	let cur,pre,Iw=Array.from(I);
	do cur=(pre=cur\|\|L)[i=Iw.shift()]
	while(Iw.length);
	if(typeof v != 'undefined')
	pre[i]=v;
	return cur;
	}

	function initFieldContainer(fc){
	if(typeof fc == 'undefined') (fc=(
	(document.getElementById('fieldContainer'))
	\|\|
	(document.body.appendChild(document.createElement('div')))
	)).id='fieldContainer';
	fc.innerHTML='';
	fc.appendChild(renderField(X)).id='field';
	fc.querySelectorAll('.cell').forEach(e=>e.onclick=cellClickHandler);
	//return fc;
	}

	function cellClickHandler(event){
	y=parseInt(this.getAttribute('data-y'));
	x=parseInt(this.getAttribute('data-x'));
	t=[y,x];
	T=In(X,t);
	P=In(X,whereAmI());
	if(!confirm(`Would you like to act on ${t}?\n\nPlayer=${JSON.stringify(P)}\nTarget=${JSON.stringify(T)}`)) return;

	r=distR(t,whereAmI());
	if(r==0)
	assumedAction='upg';
	else if(r==1&&!T)
	assumedAction='mov';
	else if(r<=P.r)
	assumedAction='gif';
	else assumedAction='';

	_try(takeAction,
	[
	prompt(
	"What action would you like to take?\n(mov,gif,att,upg)",
	assumedAction
	),
	t
	]
	);
	}

	function newGame(pa=defaultBattlefieldParams){
	X=new2dArray(defaultBattlefieldParams['r'],defaultBattlefieldParams['c']);
	createPlayersIn(X,defaultBattlefieldParams['n'],defaultBattlefieldParams['hp0'],defaultBattlefieldParams['ap0'],defaultBattlefieldParams['r0']);
	return X;
	}

	function loadState(autoNew=true){
	var xhr=new XMLHttpRequest();
	xhr.open('GET',"cgi-bin/v0.cgi",false);
	xhr.send();
	try {r=JSON.parse(xhr.responseText)}
	catch (e) {r={}};
	X=r['X'];
	if(!(m=document.cookie.match((/(?:^\|[^;]+)\s(username)\s=\s*([^;]+)/))))
	document.cookie='username='+(u=prompt("ENTER YOUR MINECRAFT USERNAME\n(CASE-SENSITIVE)"))
	else
	u=m[2];
	playerId=(r['pIds']\|\|{})[u];
	// X=JSON.parse(window.localStorage.getItem('X'));
	// playerId=window.localStorage.getItem('playerId');

	if(X===null \|\| typeof X == 'undefined'){
	if(autoNew){
	X=newGame()
	} else throw 'loadStateError';
	}

	if((playerId===null \|\| typeof playerId == 'undefined')&&autoNew){
	if(autoNew)
	playerId=parseInt(prompt("ENTER YOUR ID"));
	else throw 'loadStateError';
	}

	window.X=X;
	window.playerId=playerId;
	}

	function saveState(X=window.X,playerId=window.playerId){
	var xhr=new XMLHttpRequest();
	xhr.open('POST',"cgi-bin/v0.cgi",false);
	xhr.setRequestHeader('Content-Type', 'application/json');
	xhr.responseType='application/json';
	xhr.send(JSON.stringify({'X':X,'pIds':{'squeegily':0,'drako365':1}}));
	// window.localStorage.setItem('X',JSON.stringify(X));
	// window.localStorage.setItem('playerId',playerId);
	}

	function clearSavedState(){
	window.localStorage.removeItem('X');
	window.localStorage.removeItem('playerId');
	}

	function locatePlayerById(id,X=window.X){
	for(row of X){
	for(cell of row){
	if(cell && cell.id==id)
	return [X.indexOf(row),row.indexOf(cell)]
	}
	}
	throw 'playerNotFound';
	}
	function whereAmI(){
	return locatePlayerById(window.playerId);
	}

	function MOV(t,s=whereAmI(),X=window.X){
	if(!(P=In(X,s))) throw 'sourceEmpty';
	else if(In(X,t)) throw 'targetCollision';
	else if(!(P.ap>0)) throw 'actionpointDeficiency';
	else if(distR(s,t)!=1) throw 'actionrangeError:\n'+s+' to '+t+'\nis '+distR(s,t);//TODO
	else {
	In(X,t,In(X,s,null));
	P.ap-=1;
	}
	}
	function GIF(t,n=1,s=whereAmI(),X=window.X){
	if(!(P1=In(X,s))) throw 'sourceEmpty';
	else if(!(P2=In(X,t))) throw 'targetEmpty:\n'+JSON.stringify(P2);
	else if(!(P1.ap>=n)) throw 'actionpointDeficiency:\n'+JSON.stringify(P1.ap);
	else if(distR(s,t)>P1.r\|\|n<1) throw 'actionrangeError';
	else if(P1==P2) throw 'selfGiftError';
	else {
	P2.ap+=n;
	P1.ap-=n;
	}
	}
	function ATT(t,n=1,allowSelfHarm=false,s=whereAmI(),X=window.X){
	if(!(P1=In(X,s))) throw 'sourceEmpty';
	else if(!(P2=In(X,t))) throw 'targetEmpty';
	else if(!(P1.ap>=n)) throw 'actionpointDeficiency:\n'+JSON.stringify(P1.ap);
	else if(distR(s,t)>P1.r) throw 'actionrangeError';
	else if(P2.hp<n) throw 'overkillError';
	else if(P1==P2&&!allowSelfHarm) throw 'selfHarmError';
	else {
	P2.hp-=n;
	P1.ap-=n;
	if(P2.hp<=0)
	In(X,t,null)
	}
	}
	function UPG(n=1,p=whereAmI(),m=3,X=window.X){
	if(!(P=In(X,p))) throw 'sourceEmpty';
	else if(!(P.ap>=n)) throw 'actionpointDeficiency';
	else if(P.r>=m) throw 'maximumUpgradeReached';
	else {
	P.r+=1;
	P.ap-=1;
	}
	}


	function new2dArray(r,c){
	var X = new Array(r).fill().map(()=>Array(c).fill(null))
	return X;
	}
	function createPlayersIn(X,n,hp0,ap0,r0){
	for(let i=0;i<n;i++){
	do {
	y=getRandomInt(X.length);
	x=getRandomInt(X[y].length);
	} while(In(X,[y,x]));
	In(X,[y,x],P={id:i,hp:hp0,ap:ap0,r:r0});
	}
	}

	function distR(p1,p2){
	return Math.abs(p1[0]-p2[0])+Math.abs(p1[1]-p2[1]);
	}

	function getRandomInt(a,b){
	if(typeof b == 'undefined')
	return Math.floor(Math.random()*(a));
	else
	return Math.floor(Math.random()*(b-a))+a;
	}

	function renderField(X=window.X){
	e=document.createElement('table');

	y=0;
	for(row of X){
	tr=document.createElement('tr');
	x=0;
	for(cell of row){
	td=document.createElement('td');
	td.classList.add('cell');
	td.setAttribute('data-x',x);
	td.setAttribute('data-y',y);
	if(cell){
	for(k in cell){
	td.setAttribute('data-'+k,cell[k]);
	a=document.createElement('span');
	a.classList.add('attr','data-'+k);
	a.innerText=cell[k];
	//if(k=='id') a.innerText=(cell[k]+1);
	td.appendChild(a);
	}

	} else td.innerText='\u2205';
	tr.appendChild(td);
	x+=1;
	}
	e.appendChild(tr);
	y+=1;
	}
	return e;
	}

	function takeAction(x,t,X=window.X){
	if(x=='mov')
	MOV(t);
	else if(x=='gif')
	GIF(t);
	else if(x=='att')
	ATT(t);
	else if(x=='upg')
	UPG();
	else throw 'unrecognizedAction:\n'+x;
	saveState();
	location.reload();
	}

	function disburseAPs(X=window.X){
	for(row of F.X){
	for(cell of row){
	if(cell)
	cell.ap+=1;
	}
	}
	}