TIC TAC TOE

[Total: 0    Average: 0/5]

This is a simple version of tic tac toe.

Body Code:

<script>
var _url = document.location.toString().split("?");
var _parm = _url[1]?_url[1]:"";
var _P0n = "";
var _P0v = 0;
var _P1n = "";
var _P1v = 0;
if (_parm != "") {
  _P0n=_parm.split("&")[0].split("=")[0].toLowerCase();
  _P0v=parseInt(_parm.split("&")[0].split("=")[1]);
  if(_parm.split("&")[1]) {
    _P1n = _parm.split("&")[1].split("=")[0].toLowerCase();
	_P1v = parseInt(_parm.split("&")[1].split("=")[1]);
  } else {
    _P1n ="";
  }
} else {
  _P0n="";
  _P1n="";
}

var MATRIX_SIZE   = 3;
var AMOUNT_TO_WIN = 4;
var PARAM_SIZE = "size".toLowerCase();
var PARAM_WIN  = "win".toLowerCase();
if (_P0n==PARAM_SIZE) {MATRIX_SIZE=_P0v;}
if (_P1n==PARAM_SIZE) {MATRIX_SIZE=_P1v;}
if (_P0n==PARAM_WIN) {AMOUNT_TO_WIN=_P0v;}
if (_P1n==PARAM_WIN) {AMOUNT_TO_WIN=_P1v;}

//////////////////////////////

if(MATRIX_SIZE<3)MATRIX_SIZE=3;
if(MATRIX_SIZE>10)MATRIX_SIZE=10;
if(AMOUNT_TO_WIN>MATRIX_SIZE)AMOUNT_TO_WIN=MATRIX_SIZE;
if(AMOUNT_TO_WIN<3)AMOUNT_TO_WIN=3;

document.write("<BR>"+AMOUNT_TO_WIN+" in a row wins!<BR>");
var tbo = '';
    tbo += '<form name=table1>';
    tbo += '<table>';
	for (var i=0;i<MATRIX_SIZE;i++) {
	  tbo += '<TR>';
	  for(var j=0;j<MATRIX_SIZE;j++) {
	    var _c = parseInt(i)*parseInt(MATRIX_SIZE)+parseInt(j);
		tbo += '<td><input name=s'+_c+' type=text size=1 value=" " onfocus="clicked(table1.s'+_c+');blur()"></td>';
	  }
	  tbo += '</tr>';
	}
	tbo += '</table>';
	tbo += '<table><tr><td>Restart Game with: <input type=button value="Player is X" onclick=setPlayers("X","O")></td>';
	tbo += '<td><input type=button value="Computer is X" onclick=setPlayers("O","X")></td></tr>';
	tbo += '<tr><td>Player is: <input name=pis type=text size=1 value="X" onfocus=blur()></td>';
	tbo += '<td>Computer is: <input name=cis type=text size=1 value="O" onfocus=blur()></td></tr>';
	tbo += '</table>';
	tbo += '<table><tr><td>Won: <input type=text value="0" name=gameswon size=2></td>';
	tbo += '<td>Ties: <input type=text value="0" name=gamestied size=2></td>';
	tbo += '<td>Lost: <input type=text value="0" name=gameslost size=2></td></tr></table>';
	tbo += 'Set Matrix Size: ';
	var XX="";
	for(var i=3;i<11;i++) {
	  if(i==MATRIX_SIZE) {
	    tbo += ' '+i+'x'+j+' ';
	  } else {
	    tbo += '<input type=button value="'+i+'x'+i+'"';
		XX =_url[0]+"?"+PARAM_SIZE+'='+i+"&"+PARAM_WIN+'='+AMOUNT_TO_WIN;
		tbo += ' onclick="document.location=''+XX+''">&nbsp;';
	  }
	}
	tbo += '<BR>Amount In a Row Wins: ';
	for(var i=3;i<11;i++) {
	  if(i==AMOUNT_TO_WIN) {
	    tbo += ' '+i+' ';
	  } else {
	    tbo += '<input type=button value='+i+' ';
		XX = _url[0]+"?"+PARAM_SIZE+'='+MATRIX_SIZE+'&'+PARAM_WIN+'='+i;
		tbo += ' onclick="document.location=''+XX+''">&nbsp;';
	  }
	}
	tbo += '</form>';
document.write(tbo);
/////////////////////////////////////////////

var PLAYER="X";
var COMPUTER="O";
var BLANK=" ";
var ROWS = new Array();
var COLS = new Array();
var DIAG = new Array();

DIAG[0]=new Array();
DIAG[1]=new Array();
for(var _i=0;_i<MATRIX_SIZE;_i++) {
  DIAG[0][_i]=_i*MATRIX_SIZE+_i;
  DIAG[1][_i]=(MATRIX_SIZE-1)*(_i+1);
}
for (var i=1;i<=(MATRIX_SIZE-AMOUNT_TO_WIN);i++) {
  var n=2+((i-1)*4);
  DIAG[n+0]=new Array();
  DIAG[n+1]=new Array();
  DIAG[n+2]=new Array();
  DIAG[n+3]=new Array();
  for (var j=1;j<=(MATRIX_SIZE-i);j++) {
    DIAG[n+0][j-1]=(MATRIX_SIZE+1)*(j-1)+i;
	DIAG[n+1][j-1]=(MATRIX_SIZE+1)*(j-1)+(i*MATRIX_SIZE);
	DIAG[n+2][j-1]=(MATRIX_SIZE-1)*(j)-i;
	DIAG[n+3][j-1]=DIAG[n+2][j-1]+(MATRIX_SIZE+1)*(i);
  }
}

for(var i=0;i<MATRIX_SIZE;i++) {
  ROWS[i]=new Array();
  COLS[i]=new Array();
  for (var j=0;j<MATRIX_SIZE;j++) {
    ROWS[i][j]=i*MATRIX_SIZE+j;
	COLS[i][j]=i+j*MATRIX_SIZE;
  }
}

//////////////////////////////

function setPlayers(_p,_c) {
  PLAYER=document.table1.pis.value=_p;
  COMPUTER=document.table1.cis.value=_c;
  resetBoard();
  if(COMPUTER=="X") {
    computerMove();
  }
}

var GAMEOVER = false;

function clicked(_s) {
  if(_s.value!=BLANK || GAMEOVER) return;
  _s.value=PLAYER;
  postMoveLogic();
  computerMove();
}

function postMoveLogic() {
  var _status = gameOver();
  if (_status == BLANK) { document.table1.gamestied.value++;GAMEOVER=true; }
  if (_status == PLAYER) { document.table1.gameswon.value++;GAMEOVER=true; }
  if (_status == COMPUTER) { document.table1.gameslost.value++;GAMEOVER=true; }
}

function resetBoard() {
  for (var i=0;i<MATRIX_SIZE;i++) {
    for (var j=0;j<MATRIX_SIZE;j++) {
	  var _a = parseInt(i)*parseInt(MATRIX_SIZE)+parseInt(j);
	  eval("document.table1.s"+_a+".value=BLANK");
	}
  }
  GAMEOVER=false;
}

function gameOver() {
  var _ret = -1;
  var spotsTaken=true;
  for (var i=0;i<MATRIX_SIZE;i++) {
    for (var j=0;j<MATRIX_SIZE;j++) {
	  var _a = parseInt(i)*parseInt(MATRIX_SIZE)+parseInt(j);
	  var _b = eval("document.table1.s"+_a+".value");
	  eval("var _s"+_a+"='"+_b+"'");
	  if(eval("_s"+_a)==BLANK) {
	    spotsTaken=false;
	  }
	}
  }
  
  if(spotsTaken) return (BLANK);
  for(var i=0;i<MATRIX_SIZE;i++) {
    if (AmountInARow(ROWS[i])) return (whoHasWon);
	if (AmountInARow(COLS[i])) return (whoHasWon);
  }
  for(var i=0;i<DIAG.length;i++) {
    if(AmountInARow(DIAG[i])) return (whoHasWon);
  }
  return (_ret);
}

function allTheseMatch(_v) {
  var _ret = true;
  for(var i=1;i<_v.length;i++) {
    var _a=eval("document.table1.s"+_v[i-1]+".value");
	var _b=eval("document.table1.s"+_v[i]+".value");
	if (_a != _b) _ret = false;
  }
  return (_ret);
}

var OneAwaySpot=-1;

function oneFromWin(_who,_a) {
  for(var i=0;i<(_a.length-AMOUNT_TO_WIN+1);i++) {
    var _newA = new Array();
	for (var j=0;j<AMOUNT_TO_WIN;j++) {
	  _newA[j]=_a[i+j];
	}
	if(oneAway(_who,_newA)) {return true;}
  }
}

var whoHasWon=-1;
function AmountInARow(_a) {
  whoHasWon=-1;
  for(var i=0;i<(_a.length-AMOUNT_TO_WIN+1);i++) {
    var _newA = new Array();
	for (j=0;j<AMOUNT_TO_WIN;j++) {
	  var _TEMP = parseInt(i)+parseInt(j);
	  _newA[j]=eval("document.table1.s"+_a[_TEMP]+".value");
	}
	if (_newA[0]!=BLANK && arrayIsEqual(_newA)) {
	  whoHasWon = _newA[0];
	  return true;
	}
  }
  return false;
}

function oneAway(_who,_a) {
  OneAwaySpot=-1;
  var _ret = false;
  var _aTemp = new Array();
  for (var i=0;i<_a.length;i++) {
    var _y = eval("document.table1.s"+_a[i]+".value");
	if (_y !=BLANK) {
	  _aTemp[_aTemp.length?_aTemp.length:0]=_a[i];
	} else {
	  OneAwaySpot = _a[i];
	}
  }
  if (_aTemp.length && _aTemp.length == _a.length-1) {
    _ret = true;
	var _latchValue = eval("document.table1.s"+_aTemp[0]+".value");
	for (var i=1;i<_aTemp.length;i++) {
	  var _y = eval("document.table1.s"+_aTemp[i]+".value");
	  if(_latchValue != _y || _y != _who) {
	    _ret = false;
	  }
	}
  }
  return (_ret);
}

function determineComputerMove() {
  var firstMove=true;
  for(var i=0;i<MATRIX_SIZE;i++) {
    for (var j=0;j<MATRIX_SIZE;j++) {
	  var _a=parseInt(i)*parseInt(MATRIX_SIZE)+parseInt(j);
	  var _b=eval("document.table1.s"+_a+".value");
	  eval("var _s"+_a+"='"+_b+"'");
	  if(eval("_s"+_a) !=BLANK)
	    firstMove = false;
	}
  }
  if (firstMove && (MATRIX_SIZE%2==1)) return (MATRIX_SIZE*MATRIX_SIZE-1)/2;
  for(var i=0;i<MATRIX_SIZE;i++) {
    if(oneFromWin(COMPUTER,ROWS[i])) return (OneAwaySpot);
    if(oneFromWin(COMPUTER,COLS[i])) return (OneAwaySpot);
  }
  for(var i=0;i<DIAG.length;i++) {
    if(oneFromWin(COMPUTER,DIAG[i])) return (OneAwaySpot);
  }
  for(var i=0;i<MATRIX_SIZE;i++) {
    if(oneFromWin(PLAYER,ROWS[i])) return (OneAwaySpot);
    if(oneFromWin(PLAYER,COLS[i])) return (OneAwaySpot);
  }
  for(var i=0;i<DIAG.length;i++) {
    if(oneFromWin(PLAYER,DIAG[i])) return (OneAwaySpot);
  }
  var _spot = Math.round(Math.random()*(MATRIX_SIZE*MATRIX_SIZE-1));
  while(eval("_s"+_spot) !=BLANK) {
    _spot=(++_spot)%(MATRIX_SIZE*MATRIX_SIZE);
  }
  return (_spot);
}

function computerMove() {
  if(GAMEOVER) return;
  var _spot = determineComputerMove();
  eval("document.table1.s"+_spot+".value=COMPUTER");
  postMoveLogic();
}

function arrayIsEqual(_a) {
  var _first=_a[0];
  for(var i=1;i<_a.length;i++) {
    if(_first != _a[i]) { return false; }
  }
  return true;
}

function isEqual() {
  var _ret = true;
  for(var i=1;i<arguments.length;i++) {
    if(arguments[i-1]!=arguments[i]) _ret = false;
  }
  return (_ret);
}

</script>
<BR>
<a href="http://www.js-examples.com/">JS-Examples</a>

Times Viewed: 30

Leave a Reply

Your email address will not be published. Required fields are marked *