/*
 * This is a JavaScript Scratchpad.
 *
 * Enter some JavaScript, then Right Click or choose from the Execute Menu:
 * 1. Run to evaluate the selected text (Cmd-R),
 * 2. Inspect to bring up an Object Inspector on the result (Cmd-I), or,
 * 3. Display to insert the result in a comment after the selection. (Cmd-L)
 
 TicTacToe - RJM Programming - November, 2014
 tictactoe.js
 Usage: Firefox Scratchpad tool
 */

var between=location.search.split('between=')[1] ? decodeURIComponent(location.search.split('between=')[1].split('&')[0]) : '1.0';
var idvsclass=location.search.split('idvsclass=')[1] ? decodeURIComponent(location.search.split('idvsclass=')[1].split('&')[0]) : 'id';
var exbidvsclass=location.search.split('idvsclass=')[1] ? '&idvsclass=' + decodeURIComponent(location.search.split('idvsclass=')[1].split('&')[0]) : '';
var atend='?reflexes=y' + exbidvsclass + '&between=';
var obetween=null;
var threedots=location.search.split('idvsclass=')[1] ? "<select onchange='if (this.value.length > 0) { location.href=(document.URL.replace(\"idvsclass=\",\"idvsxclass=\") + \"&idvsclass=\" + this.value).replace(\".html&\",\".html?\").replace(\".htm&\",\".htm?\");  } '><option value=''>...</option><option value=class>class</option><option value=id>id</option></select>" : "<select onchange='if (this.value.length > 0) { location.href=(document.URL.replace(\"idvsclass=\",\"idvsxclass=\") + \"&idvsclass=\" + this.value).replace(\".html&\",\".html?\").replace(\".htm&\",\".htm?\");  } '><option value=''>...</option><option value=id>id</option><option value=class>class</option></select>";
var letter='X';
var idprefix='';
var cgoes="";
var v11=0;
var v12=0;
var v13=0;
var v21=0;
var v22=0;
var v23=0;
var v31=0;
var v32=0;
var v33=0;
var cscore=0;
var dscore=0;
var yscore=0;
var scols=['red','olive','orange','brown','green','blue','magenta','pink','purple'];
var scolsofar=',,';
var stylebits=location.search.split('idvsclass=')[1] ? '<style> .zt11 { border:5px solid ' + randc() + '; } .zt12 { border:5px solid ' + randc() + '; } .zt13 { border:5px solid ' + randc() + '; } .zt21 { border:5px solid ' + randc() + '; } .zt22 { border:5px solid ' + randc() + '; } .zt23 { border:5px solid ' + randc() + '; } .zt31 { border:5px solid ' + randc() + '; } .zt32 { border:5px solid ' + randc() + '; } .zt33 { border:5px solid ' + randc() + '; }  </style>' : '';


function isok(iou) {
 if (iou.value == '') {
   if (iou.placeholder == letter) {
     if (letter == 'X') {
       letter='X'; //'O';
     } else {
       letter='X';
     }
     return true;
   } else {
     return false;
   }
 } else {
   return false;
 }
}

function newgame() {
 cgoes="";
 v11=0;
 v12=0;
 v13=0;
 v21=0;
 v22=0;
 v23=0;
 v31=0;
 v32=0;
 v33=0;
 var huh;
 if (!document.getElementById("11")) { // must be class approach
 var ils=document.getElementsByTagName('img');
 for (var jils=0; jils<ils.length; jils++) {
 ils[jils].src="//www.rjmprogramming.com.au/wordpress/ttnone.png";
 }
 } else {
 huh = document.getElementById("11");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("12");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("13");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("21");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("22");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("23");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("31");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("32");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 huh = document.getElementById("33");
 huh.src = "//www.rjmprogramming.com.au/wordpress/ttnone.png";
 }
 if (idprefix != '') {
   var ims=document.getElementsByTagName('input');
   for (var jms=0; jms<ims.length; jms++) {
     ims[jms].value='';
   } 
 } else {
   var zims=document.getElementsByTagName('input');
   for (var zjms=0; zjms<zims.length; zjms++) {
     zims[zjms].style.display='none';
   } 
   var xims=document.getElementsByTagName('input');
   for (var xjms=0; xjms<xims.length; xjms++) {
     xims[xjms].style.display='block';
   } 
 }
}

function doit(imgo) {
  var wi = 0;
  var nxt;
  var suffix = '' + imgo.id;
  var parentclass='', childsclass='';
  if (suffix == '') { // we are using class instead
    suffix = '' + imgo.className;
    if (suffix != '') {
      if (suffix.indexOf(' ') != -1) {
        var sarr=suffix.split(' ');
        for (var isarr=0; isarr<sarr.length; isarr++) {
          if ((sarr[isarr] + ' ').substring(0,1) == 't' || ((sarr[isarr] + ' ').substring(0,1) >= '0' && (sarr[isarr] + ' ').substring(0,1) <= '9')) {
            childclass=sarr[isarr];
          } else if (parentclass == '') {
            parentclass=sarr[isarr];
          } else {
            parentclass+=' ' + sarr[isarr];
          }
        }
        suffix=childclass;
      }
    } 
  }
  if (idprefix != '') {
    suffix=suffix.replace(idprefix,'');
  }
  if (cgoes.indexOf(";" + suffix + ";") != -1) {
   alert(cvgoes + "Huh?");
  } else {
  if (idprefix != '') {
  imgo.value = "X";
  } else {
  imgo.src = "//www.rjmprogramming.com.au/wordpress/ttcross.png";
  }
  cgoes = cgoes + ";" + suffix + ";";
switch(suffix)
{
case '11':
  v11 = 1;
  if (eval(v11 + v12 + v13) == 3 || eval(v11 + v21 + v31) == 3 || eval(v11 + v22 + v33) == 3) wi = 1;
  break;
case '12':
  v12 = 1;
  if (eval(v11 + v12 + v13) == 3 || eval(v12 + v22 + v32) == 3) wi = 1;
  break;
case '13':
  v13 = 1;
  if (eval(v11 + v12 + v13) == 3 || eval(v13 + v23 + v33) == 3 || eval(v13 + v22 + v31) == 3) wi = 1;
  break;
case '21':
  v21 = 1;
  if (eval(v21 + v22 + v23) == 3 || eval(v11 + v21 + v31) == 3) wi = 1;
  break;
case '22':
  v22 = 1;
  if (eval(v21 + v22 + v23) == 3 || eval(v12 + v22 + v32) == 3 || eval(v11 + v22 + v33) == 3 || eval(v13 + v22 + v31) == 3) wi = 1;
  break;
case '23':
  v23 = 1;
  if (eval(v21 + v22 + v23) == 3 || eval(v13 + v23 + v33) == 3) wi = 1;
  break;
case '31':
  v31 = 1;
  if (eval(v31 + v32 + v33) == 3 || eval(v13 + v22 + v31) == 3 || eval(v11 + v21 + v31) == 3) wi = 1;
  break;
case '32':
  v32 = 1;
  if (eval(v31 + v32 + v33) == 3 || eval(v12 + v22 + v32) == 3) wi = 1;
  break;
case '33':
  v33 = 1;
  if (eval(v31 + v32 + v33) == 3 || eval(v13 + v23 + v33) == 3 || eval(v11 + v22 + v33) == 3) wi = 1;
  break;

default:
  break;
}

if (wi == 1) {
   yscore = yscore + 1;
   alert("Congratulations!   You win.  Scores: Computer " + cscore + " vs You " + yscore + " (" + dscore + " draws)");
   newgame();

} else if (wi == 0) {
 if (v22 == 0 && (eval(v21 + v22 + v23) == -2 || eval(v12 + v22 + v32) == -2 || eval(v11 + v22 + v33) == -2 || eval(v13 + v22 + v31) == -2)) {
   v22 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '22');
 } else if (v11 == 0 && (eval(v11 + v12 + v13) == -2 || eval(v11 + v21 + v31) == -2 || eval(v11 + v22 + v33) == -2)) {
   v11 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '11');
 } else if (v13 == 0 && (eval(v11 + v12 + v13) == -2 || eval(v13 + v23 + v33) == -2 || eval(v13 + v22 + v31) == -2)) {
   v13 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '13');
 } else if (v31 == 0 && (eval(v31 + v32 + v33) == -2 || eval(v13 + v22 + v31) == -2 || eval(v11 + v21 + v31) == -2)) {
   v31 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '31');
 } else if (v33 == 0 && (eval(v31 + v32 + v33) == -2 || eval(v13 + v23 + v33) == -2 || eval(v11 + v22 + v33) == -2)) {
   v33 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '33');
   
   
 } else if (v12 == 0 && (eval(v11 + v12 + v13) == -2 || eval(v12 + v22 + v32) == -2)) {
   v12 = -1;
   wi = -1;   
   nxt = documentgetElementById(idprefix + '12');
 } else if (v21 == 0 && (eval(v21 + v22 + v23) == -2 || eval(v11 + v21 + v31) == -2)) {
   v21 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '21');
 } else if (v23 == 0 && (eval(v21 + v22 + v23) == -2 || eval(v13 + v23 + v33) == -2)) {
   v23 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '23');
 } else if (v32 == 0 && (eval(v31 + v32 + v33) == -2 || eval(v12 + v22 + v32) == -2)) {
   v32 = -1;
   wi = -1;
   nxt = documentgetElementById(idprefix + '32');
 }  
 if (wi != 0) { 
   if (idprefix != '') {
   nxt.value = "O";
   } else {
   nxt.src = "//www.rjmprogramming.com.au/wordpress/ttcircle.png";
   }
  if (idprefix != '') {
      cgoes = cgoes + ";" + nxt.id.replace(idprefix,'') + ";";
  } else {
      cgoes = cgoes + ";" + nxt.id + ";";
  }

   cscore = cscore + 1;
   alert("Computer wins!   Bad luck.  Scores: Computer " + cscore + " vs You " + yscore + " (" + dscore + " draws)");
   newgame();
 } 
 if (wi == 0) {
    if (v22 == 0 && (eval(v21 + v22 + v23) == 2 || eval(v12 + v22 + v32) == 2 || eval(v11 + v22 + v33) == 2 || eval(v13 + v22 + v31) == 2)) {
   v22 = -1;
   nxt = documentgetElementById(idprefix + '22');
 } else if (v11 == 0 && (eval(v11 + v12 + v13) == 2 || eval(v11 + v21 + v31) == 2 || eval(v11 + v22 + v33) == 2)) {
   v11 = -1;
   nxt = documentgetElementById(idprefix + '11');
 } else if (v13 == 0 && (eval(v11 + v12 + v13) == 2 || eval(v13 + v23 + v33) == 2 || eval(v13 + v22 + v31) == 2)) {
   v13 = -1;
   nxt = documentgetElementById(idprefix + '13');
 } else if (v31 == 0 && (eval(v31 + v32 + v33) == 2 || eval(v13 + v22 + v31) == 2 || eval(v11 + v21 + v31) == 2)) {
   v31 = -1;
   nxt = documentgetElementById(idprefix + '31');
 } else if (v33 == 0 && (eval(v31 + v32 + v33) == 2 || eval(v13 + v23 + v33) == 2 || eval(v11 + v22 + v33) == 2)) {
   v33 = -1;
   nxt = documentgetElementById(idprefix + '33');
   
   
 } else if (v12 == 0 && (eval(v11 + v12 + v13) == 2 || eval(v12 + v22 + v32) == 2)) {
   v12 = -1;
   nxt = documentgetElementById(idprefix + '12');
 } else if (v21 == 0 && (eval(v21 + v22 + v23) == 2 || eval(v11 + v21 + v31) == 2)) {
   v21 = -1;
   nxt = documentgetElementById(idprefix + '21');
 } else if (v23 == 0 && (eval(v21 + v22 + v23) == 2 || eval(v13 + v23 + v33) == 2)) {
   v23 = -1;
   nxt = documentgetElementById(idprefix + '23');
 } else if (v32 == 0 && (eval(v31 + v32 + v33) == 2 || eval(v12 + v22 + v32) == 2)) {
   v32 = -1;
   nxt = documentgetElementById(idprefix + '32');
 } else if (v22 == 0) {
     v22 = -1;
   nxt = documentgetElementById(idprefix + '22');
   } else if (v11 == 0) {
     v11 = -1;
   nxt = documentgetElementById(idprefix + '11');
   } else if (v13 == 0) {
     v13 = -1;
   nxt = documentgetElementById(idprefix + '13');
   } else if (v31 == 0) {
     v31 = -1;
   nxt = documentgetElementById(idprefix + '31');
   } else if (v33 == 0) {
     v33 = -1;
   nxt = documentgetElementById(idprefix + '33');
   } else if (v12 == 0) {
     v12 = -1;
   nxt = documentgetElementById(idprefix + '12');
   } else if (v21 == 0) {
     v21 = -1;
   nxt = documentgetElementById(idprefix + '21');
   } else if (v23 == 0) {
     v23 = -1;
   nxt = documentgetElementById(idprefix + '23');
   } else if (v32 == 0) {
     v32 = -1;
   nxt = documentgetElementById(idprefix + '32');
   } else {
   dscore = dscore + 1;
   alert("It is a draw.   Well played.  Scores: Computer " + cscore + " vs You " + yscore + " (" + dscore + " draws)");
   newgame();
   }
   if (idprefix != '') {
   nxt.value = "O";
   } else {
   nxt.src = "//www.rjmprogramming.com.au/wordpress/ttcircle.png";
   }
  if (idprefix != '') {
      if (('' + nxt.id) == '') {
      cgoes = cgoes + ";" + nxt.className.split(' ')[0].replace(idprefix,'') + ";";
      } else {
      cgoes = cgoes + ";" + nxt.id.replace(idprefix,'') + ";";
      }
  } else {
      if (('' + nxt.id) == '') {
      cgoes = cgoes + ";" + nxt.className.split(' ')[0];
      } else {
      cgoes = cgoes + ";" + nxt.id + ";";
      }
  }

 }
}
}
}

 function randp() {
   var ir=0,ims=document.getElementsByTagName('input');
   for (var jms=0; jms<ims.length; jms++) {
     if (ims[jms].value == '') {
       ir=Math.floor(Math.random() * 2);
       if (ir == 0) {
         ims[jms].placeholder='O';
       } else {
         ims[jms].placeholder='X';
       }
     }
   } 
   setTimeout(randp,Math.floor(eval(eval(between) * 1000)));
 }


 function randc() {
   var cchoice='';
   while (scolsofar.indexOf(',' + cchoice + ',') != -1) {
     cchoice=scols[Math.floor(Math.random() * scols.length)];
   }
   scolsofar+=cchoice + ',';
   return cchoice;
 }
 
 function documentgetElementById(inid) {
   var reto=document.getElementById(inid);
   if (!reto) {
     var alles=document.getElementsByTagName('*');
     //alert(alles.length);
     for (var ialles=0; ialles<alles.length; ialles++) {
      if (('' + alles[ialles].className).indexOf(inid) != -1) { reto=alles[ialles];  }
     }
   }
   //if (reto) { alert('cgoes=' + cgoes + ' look for ' + inid + ' ... ' + reto.outerHTML); } else { alert('oops'); }
   return reto;
 }
 
 function classy(inb) {
 var inbsuffix='';
 if (idvsclass == 'class') { inbsuffix=' ' + 'z' + inb; }
 return inb + inbsuffix;
 }

 function ph() { 
 document.body.style.backgroundColor='yellow';
 obetween=documentgetElementById('between');
 obetween.value=between;
 if (document.URL.indexOf('reflexes=') != -1) {
   var tdims=document.getElementsByTagName('td');
   var ims=document.getElementsByTagName('img');
   idprefix='it';
   for (var jms=0; jms<ims.length; jms++) {
     if (!document.getElementById('t' + ims[jms].id)) {  // we must be using the class way
     tdims[jms].innerHTML+=(ims[jms].outerHTML + '</input>').replace(' onclick="doit(this);"',' onclick="if (isok(this)) { doit(this); }"').replace('<img ','<input readonly type=text placeholder="O" style="text-align:center;background:URL(' + ims[jms].src + ');font-size:' + ims[jms].width + 'px;width:' + ims[jms].width + 'px;height:' + ims[jms].height + 'px;" ').replace(' class="',' class="it').replace(" class='"," class='it").replace(' src=',' data-src=');
     } else {
     document.getElementById('t' + ims[jms].id).innerHTML+=(ims[jms].outerHTML + '</input>').replace(' onclick="doit(this);"',' onclick="if (isok(this)) { doit(this); }"').replace('<img ','<input readonly type=text placeholder="O" style="text-align:center;background:URL(' + ims[jms].src + ');font-size:' + ims[jms].width + 'px;width:' + ims[jms].width + 'px;height:' + ims[jms].height + 'px;" ').replace(' id="',' id="it').replace(" id='"," id='it").replace(' src=',' data-src=');
     }
     ims[jms].style.display='none'; //visibility='hidden';
   }
   randp();
 }
 }  

 var hcont = '<h1 align="center">You say Tic Tac Toe ' + threedots + ' I say Noughts and Crosses</h1>';
 var hcont2 =  '   <table align="center" title="Click a box to make your move in Noughts and Crosses game against Computer" ondblclick=window.open("//www.rjmprogramming.com.au/Games/Noughtsandcrosses/","_blank");>';
 var hcont3 =  '<tbody style="background-color:pink;">';
 var hcont4 =  '<tr>';
 var hcont5 =  '<td placeholder="" style="border-right: 2px solid red;border-bottom: 2px solid red;" ' + idvsclass + '="' + classy('t11') + '"><img ' + idvsclass + '="11" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont6 =  '<td placeholder="" style="border-bottom: 2px solid red;" ' + idvsclass + '="' + classy('t12') + '"><img ' + idvsclass + '="12" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont7 =  '<td placeholder="" style="border-left: 2px solid red;border-bottom: 2px solid red;" ' + idvsclass + '="' + classy('t13') + '"><img ' + idvsclass + '="13" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont8 =  '</tr>';
 var hcont9 =  '<tr>';
 var hcont10 =  '<td placeholder="" style="border-right: 2px solid red;" ' + idvsclass + '="' + classy('t21') + '"><img ' + idvsclass + '="21" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont11 =  '<td placeholder="" ' + idvsclass + '="' + classy('t22') + '"><img ' + idvsclass + '="22" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont12 =  '<td placeholder="" style="border-left: 2px solid red;" ' + idvsclass + '="' + classy('t23') + '"><img ' + idvsclass + '="23" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont13 =  '</tr>';
 var hcont14 =  '<tr>';
 var hcont15 =  '<td placeholder="" style="border-right: 2px solid red;border-top: 2px solid red;" ' + idvsclass + '="' + classy('t31') + '"><img ' + idvsclass + '="31" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont16 =  '<td placeholder="" style="border-top: 2px solid red;" ' + idvsclass + '="' + classy('t32') + '"><img ' + idvsclass + '="32" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont17 =  '<td placeholder="" style="border-left: 2px solid red;border-top: 2px solid red;" ' + idvsclass + '="' + classy('t33') + '"><img ' + idvsclass + '="33" src="//www.rjmprogramming.com.au/wordpress/ttnone.png" onclick="doit(this);" /></td>';
 var hcont18 =  '</tr>';
 var hcont19 =  '</tbody>';
 var hcont20 =  '</table>';
 var hcont21 =  '<div align="center"><br><a style="text-decoration:none;cursor:pointer;border:1px solid red;padding:5px 5px 5px 5px;background-color:#f0f0f0;" title="Coward way out?" onclick="location.href=document.URL.split(String.fromCharCode(35))[0].split(String.fromCharCode(63))[0];">New game</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a style="text-decoration:none;cursor:pointer;border:1px solid blue;padding:5px 5px 5px 5px;background-color:#f0f0f0;" title="Coward way out?" onclick="location.href=document.URL.split(String.fromCharCode(35))[0].split(String.fromCharCode(63))[0] + atend + obetween.value;">New Fast Reflexes ... you are X ... game </a><select onchange=between=this.value; style=display:inline; ' + idvsclass + '=between name=between><option value=0.1>0.1 second</option><option value=0.2>0.2 second</option><option value=0.5>0.5 second</option><option value=1.0 selected>1 second</option><option value=2.0>2.0 second</option><option value=5.0>5.0 second</option></select><span> between</span></div>' + stylebits;
 
   setTimeout(ph, 800); 
 
 //hcont +=  '</body>';

 document.body = document.createElement('BODY');
 document.body.innerHTML = hcont + hcont2 + hcont3 + hcont4 + hcont5 + hcont6 + hcont7 + hcont8 + hcont9 + hcont10 + hcont11 + hcont12 + hcont13 + hcont14 + hcont15 + hcont16 + hcont17 + hcont18 + hcont19 + hcont20 + hcont21;