<html>
<head>
<title>Canvas HTML Element Surd Board Game (with image copy) Tutorial ... RJM Programming ... April 2014 ... thanks to http://stackoverflow.com/questions/9880279/how-do-i-add-a-simple-onclick-event-handler-to-a-canvas-element</title>
<link href='//www.rjmprogramming.com.au/PHP/emboss_h1.css' rel='stylesheet' type='text/css'>
<script language="JavaScript">
var score = 0.0;
var goes = 0.0;
var realgoes = 0;
var actsym = '+';
var answeridea = '';
var sansweridea = '';
var operatoris = '';
var num1 = 0;
var denom1 = 0;
var num2 = 0;
var denom2 = 1;
var ndenom = 0;
var wrand = 0;
var w1rand = 0;
var w2rand = 0;
var w3rand = 0;
var w4rand = 0;
var luckofthedraw = 0;
var beenhere = 0;
var pstuff;
var myin;

var fromhereon = "0";

var alt1num1 = 0;
var alt1denom1 = 1;
var alt1num2 = 0;
var alt1denom2 = 1;
var alt1actsym = '+';
var alt2num1 = 0;
var alt2denom1 = 0;
var alt2num2 = 0;
var alt2denom2 = 1;
var calt2denom2 = "";
var calt2num2 = "";
var alt2actsym = '+';

function showall(three, inum1, idenom1, inum2, idenom2, ioper) {
var iis, xinline = 'inline';
try {
if (three == 0) {
iis = document.getElementById('guess');
iis.style.display = xinline;
if (three == 0 && (inum1 == 0 || idenom1 == 1 || idenom1 == 0)) xinline = 'none';
iis = document.getElementById('iguess');
iis.style.display = xinline;
iis = document.getElementById('guessr');
iis.style.display = xinline;
if (ioper != ' ') xinline = 'inline';
if (three == 0 && (ioper == ' ' || (inum2 == 0 || idenom2 == 0))) xinline = 'none';
iis = document.getElementById('iop');
iis.style.display = xinline;
iis = document.getElementById('guess2');
iis.style.display = xinline;
if (three == 0 && (ioper == ' ' || (inum2 == 0 || idenom2 == 1))) xinline = 'none';
iis = document.getElementById('iguess2');
iis.style.display = xinline;
iis = document.getElementById('guess2r');
iis.style.display = xinline;
}
if (three == 1) {
xinline = 'inline';
iis = document.getElementById('aguess');
iis.style.display = xinline;
if (three == 1 && (inum1 == 0 || idenom1 == 1 || idenom1 == 0)) xinline = 'none';
iis = document.getElementById('aiguess');
iis.style.display = xinline;
iis = document.getElementById('aguessr');
iis.style.display = xinline;
if (ioper != ' ') xinline = 'inline';
if (three == 1 && (ioper == ' ' || (inum2 == 0 || idenom2 == 0))) xinline = 'none';
iis = document.getElementById('aiop');
iis.style.display = xinline;
iis = document.getElementById('aguess2');
iis.style.display = xinline;
if (three == 1 && (ioper == ' ' || (inum2 == 0 || idenom2 == 1))) xinline = 'none';
iis = document.getElementById('aiguess2');
iis.style.display = xinline;
iis = document.getElementById('aguess2r');
iis.style.display = xinline;
}
if (three == 2) {
xinline = 'inline';
iis = document.getElementById('bguess');
iis.style.display = xinline;
if (three == 2 && (inum1 == 0 || idenom1 == 1 || idenom1 == 0)) xinline = 'none';
iis = document.getElementById('biguess');
iis.style.display = xinline;
iis = document.getElementById('bguessr');
iis.style.display = xinline;
if (ioper != ' ') xinline = 'inline';
if (three == 2 && (ioper == ' ' || (inum2 == 0 || idenom2 == 0))) xinline = 'none';
iis = document.getElementById('biop');
iis.style.display = xinline;
iis = document.getElementById('bguess2');
iis.style.display = xinline;
if (three == 2 && (ioper == ' ' || (inum2 == 0 || idenom2 == 1))) xinline = 'none';
iis = document.getElementById('biguess2');
iis.style.display = xinline;
iis = document.getElementById('bguess2r');
iis.style.display = xinline;
}
} catch (ee) {
}
}

function reduce(jnn, ind) {
var inn = jnn;
if (inn < 0) inn = -inn;
var retval = ind;
var iis, miis = ind;
if (miis < inn) miis = inn;
for (iis=(miis - 1); iis>=2; iis--) {
if (iis <= inn && iis <= ind && (inn % iis) == 0 && (ind % iis) == 0) return eval(ind + "/" + iis);
}
return retval;
}

function updatescore() {
var sis=document.getElementById('score');
sis.innerHTML = score.toString();
var gis=document.getElementById('goes');
gis.innerHTML = goes.toString();
}

function fansweridea(operatoris) {
if (denom1 == "-") denom1 = "-1";
if (denom2 == "-") denom2 = "-1";
var newerdenom = 0;
var newdenom = 0;
var newnum = 0;
var hval = 0, jj, kk = 1, factor = -1;
answeridea = "((" + num1 + " / " + denom1 + ") " + operatoris + " (" + num2 + " / " + denom2 + ")";
var iis = document.getElementById('guess');
iis.value = num1;
iis = document.getElementById('guessr');
iis.value = denom1;
iis = document.getElementById('guess2');
iis.value = num2;
iis = document.getElementById('guess2r');
iis.value = denom2;

alt1actsym = operatoris;
alt1num1 = num1;
alt1denom1 = denom1;
alt1num2 = num2;
alt1denom2 = denom2;
alt2actsym = operatoris;
alt2num1 = num1;
alt2denom1 = denom1;
alt2num2 = num2;
alt2denom2 = denom2;
calt2num2 = num2;
calt2denom2 = denom2;

if (num1 != 0) {
newerdenom = eval("0 + " + Math.abs(denom1));
newnum = num1;
newdenom = denom1;
for (hval=newerdenom; hval>=4; hval--) {
if (newnum == num1 || 1 == 1) {
for (jj=40; jj>=2; jj--) {
if (wrand == 1) kk = jj;
if (hval == eval(jj * jj * kk)) {
if ((newdenom % hval) == 0) {
if (wrand == 0) {
alt1num1 = eval(jj * alt1num1);
newnum = alt1num1;
alt2num1 = eval(jj * alt2num1);
alt1denom1 = eval((alt1denom1) / hval);
alt2denom1 = eval((alt2denom1) / hval);
newdenom = alt1denom1;
} else if (denom1 < 0) {
//alert(alt1num1);
alt1num1 = eval((factor * jj * alt1num1));
newnum = alt1num1;
//alert(alt1num1);
alt2num1 = eval((factor * factor * alt1num1));
alt1denom1 = eval((factor * alt1denom1) / hval);
alt2denom1 = eval((factor * alt2denom1) / hval);
newdenom = alt1denom1;
factor = 1;
} else {
alt1num1 = eval(jj * alt1num1);
newnum = alt1num1;
alt2num1 = eval(jj * alt2num1);
alt1denom1 = eval((alt1denom1) / hval);
alt2denom1 = eval((alt2denom1) / hval);
newdenom = alt1denom1;
}
}
}
}
}
}
}

factor = -1;
if (num2 != 0) {
newerdenom = eval("0 + " + Math.abs(denom2));
newnum = num2;
newdenom = denom2;
for (hval=newerdenom; hval>=4; hval--) {
if (newnum == num2 || 1 == 1) {
for (jj=40; jj>=2; jj--) {
if (wrand == 1) kk = jj;
if (hval == eval(jj * jj * kk)) {
if ((newdenom % hval) == 0) {
if (wrand == 0) {
alt1num2 = eval(jj * alt1num2);
newnum = alt1num2;
alt2num2 = eval(jj * alt2num2);
alt1denom2 = eval((alt1denom2) / hval);
alt2denom2 = eval((alt2denom2) / hval);
newdenom = alt1denom2;
} else if (denom2 < 0) {
alt1num2 = eval((factor * jj * alt1num2));
newnum = alt1num2;
alt2num2 = eval((factor * alt1num2));
if (operatoris == '+') {
alt2actsym = '-';
} else if (operatoris == '-') {
alt2actsym = '+';
}
alt1denom2 = eval((factor * alt1denom2) / hval);
alt2denom2 = eval((factor * alt2denom2) / hval);
newdenom = alt1denom2;
factor = 1;
} else {
alt1num2 = eval(jj * alt1num2);
newnum = alt1num2;
alt2num2 = eval(jj * alt2num2);
alt1denom2 = eval((alt1denom2) / hval);
alt2denom2 = eval((alt2denom2) / hval);
newdenom = alt1denom2;
}
}
}
}
}
}
}

// Now look for common denominator scenarios
if (alt1denom1 == alt1denom2 && alt2actsym != ' ') {
if (wrand == 0 || (alt2actsym != "/")) { // && alt2actsym != "*")) {
//alert("(" + alt1num1 + ") " + alt1actsym + " (" + alt1num2 + ")");
alt1num1 = eval("(" + alt1num1 + ") " + alt1actsym + " (" + alt1num2 + ")");
if (wrand == 0 && alt2actsym == "*") {
alt1num1 = eval("(" + alt1num1 + ") " + alt1actsym + " (" + alt1denom1 + ")");
alt1denom1 = 1;
alt2denom1 = 1;
} else if ((wrand == 0 || wrand == 1) && alt2actsym == "/") {
alt1denom1 = 1;
alt2denom1 = 1;
}
alt1num2 = 0;
alt2num1 = alt1num1;
alt2num2 = 0;
alt1actsym = ' ';
}
}
// End of "Now look for common denominator scenarios"


if (alt2num2 == 0) {
alt2actsym = ' ';
alt2denom2 = 1;
calt2num2 = " ";
calt2denom2 = " ";
}

if ((alt2denom1 == 1 || alt2denom1 == -1) && Math.abs(alt2denom2) != 1 && alt2num2 != 0 && (alt2actsym == "/" || alt2actsym == "*") && (wrand == 0 || (alt1denom1 == 1 || alt1denom1 == -1))) {
alt2num1 = eval("(" + alt2denom1 + " * " + alt2num1 + ") " + alt2actsym + " (" + alt2num2 + ")");
alt2denom1 = alt2denom2;
alt2actsym = ' ';
alt2num2 = 0;
alt2denom2 = 1;
calt2num2 = " ";
calt2denom2 = " ";
} else if ((alt2denom2 == 1 || alt2denom2 == -1) && Math.abs(alt2denom1) != 1 && alt2num1 != 0 && (alt2actsym == "/" || alt2actsym == "*") && (wrand == 0 || (alt1denom1 == 1 || alt1denom1 == -1))) {
alt2num1 = eval("(" + alt1num1 + ") " + alt2actsym + " (" + alt2denom2 + " * " + alt1num2 + ")");
alt2actsym = ' ';
alt2num2 = 0;
alt2denom2 = 1;
calt2num2 = " ";
calt2denom2 = " ";
}

iis = document.getElementById('aguess');
iis.value = alt1num1;
iis = document.getElementById('aguessr');
iis.value = alt1denom1;
iis = document.getElementById('aguess2');
iis.value = alt1num2;
iis = document.getElementById('aguess2r');
iis.value = alt1denom2;
iis = document.getElementById('aiop');
iis.value = alt1actsym;
iis = document.getElementById('aiguess');
iis.src = document.getElementById('iguess').src;
iis = document.getElementById('aiguess2');
iis.src = document.getElementById('iguess2').src;


iis = document.getElementById('bguess');
iis.value = alt2num1;
iis = document.getElementById('bguessr');
iis.value = alt2denom1;
iis = document.getElementById('bguess2');
iis.value = alt2num2;
iis = document.getElementById('bguess2r');
iis.value = alt2denom2;
iis = document.getElementById('biop');
iis.value = alt2actsym;
iis = document.getElementById('biguess');
iis.src = document.getElementById('iguess').src;
iis = document.getElementById('biguess2');
iis.src = document.getElementById('iguess2').src;

showall(1,alt1num1,alt1denom1,alt1num2,alt1denom2,alt1actsym);
showall(2,alt2num1,alt2denom1,alt2num2,alt2denom2,alt2actsym);

}

function checkget() {
showall(0,5,5,5,5,'+');
document.getElementById('adiv').style.display = 'none';
document.getElementById('bdiv').style.display = 'none';

if (window.location.search.indexOf("score") != (0 - 1)) {

var myprmstr = window.location.search.substr(1);
//alert(myprmstr);

var xpos = myprmstr.indexOf("goes");
if (xpos != -1) {
document.getElementById('myh1').innerHTML = document.getElementById('myh1').innerHTML.replace(' start ', ' resume ');

var gsuff = myprmstr.substr(xpos + 5);
goes = parseFloat(gsuff);
//alert(goes + ' ' + myprmstr.substr(xpos + 5));
myprmstr = myprmstr.substr(0, (xpos - 2));
}
xpos = myprmstr.indexOf("score");
if (xpos != -1) {
var ssuff = myprmstr.substr(xpos + 6);
score = parseFloat(ssuff);
}
updatescore();
}
}


function to_image_file() {
var ourcanvas = document.getElementById("canvaselement");
document.getElementById("ourimage").src = ourcanvas.toDataURL();
if (document.getElementById("fromhereon").value == "1") {
document.getElementById("ourimage").style.display = 'block';
document.getElementById("email").style.display = 'block';
document.getElementById("emailee").style.display = 'block';
document.getElementById("ourtable").border = 1;
Canvas2Image.saveAsPNG(ourcanvas);
} else {
document.getElementById("ourimage").style.display = 'none';
}
document.getElementById("fromhereon").value = fromhereon;
}
</script>
</head>
<body onload="checkget();">
<table><tr><td><h1 id='myh1'>Click for your maths question about <a target=_blank title='Surds mathematics page' href='http://www.mathsisfun.com/surds.html'>surds</a> ... Take fewest goes to reach score of 20</h1><p>Score <span style='color:green;' id="score">0</span> achieved via <span style='color:red;' id="goes">0</span> goes and your current answer is </td><td><div id='adiv' style='display:inline;'><input style='background-color: yellow;width:60px;' id="aguess" value="0"></input>
<img style='display:inline;background-color: yellow;' width=25 height=15 id="aiguess" src='images/gsqrt.gif'></img>
<input style='display:inline;background-color: yellow;width:60px;border-top: 5px solid green;margin-left:-8px;' id="aguessr" value="1"></input>
<select id='aiop' style="display:inline;"><option value='+'>+</option><option value='-'>-</option><option value='*'>*</option><option value='/'>/</option><option value=' '> </option></select>
<input style='display:inline;background-color: yellow;width:60px;' id="aguess2" value="0"></input>
<img style='display:inline;background-color: yellow;' width=25 height=15 id="aiguess2" src='images/gsqrt.gif'></img>
<input style='display:inline;background-color: yellow;width:60px;border-top: 5px solid green;margin-left:-8px;' id="aguess2r" value="1"></input><br></div>


<div id='bdiv' style='display:inline;'><input style='background-color: yellow;width:60px;' id="bguess" value="0"></input>
<img style='display:inline;background-color: yellow;' width=25 height=15 id="biguess" src='images/gsqrt.gif'></img>
<input style='display:inline;background-color: yellow;width:60px;border-top: 5px solid green;margin-left:-8px;' id="bguessr" value="1"></input>
<select id='biop' style="display:inline;"><option value='+'>+</option><option value='-'>-</option><option value='*'>*</option><option value='/'>/</option><option value=' '> </option></select>
<input style='display:inline;background-color: yellow;width:60px;' id="bguess2" value="0"></input>
<img style='display:inline;background-color: yellow;' width=25 height=15 id="biguess2" src='images/gsqrt.gif'></img>
<input style='display:inline;background-color: yellow;width:60px;border-top: 5px solid green;margin-left:-8px;' id="bguess2r" value="1"></input><br></div>

<input onchange='num1 = this.value; showall(0,num1,denom1,num2,denom2,actsym);' style='display:inline;background-color: pink;width:60px;' id="guess" value="0"></input>
<img style='background-color: pink;display:inline;' width=25 height=15 id="iguess" src='images/gsqrt.gif'></img>
<input onchange='denom1 = this.value; showall(0,num1,denom1,num2,denom2,actsym);' style='display:inline;background-color: pink;width:60px;border-top: 5px solid green;margin-left:-8px;' id="guessr" value="1"></input>
<select onchange='actsym = this.value; showall(0,num1,denom1,num2,denom2,actsym);' id='iop' style="display:inline;"><option value='+'>+</option><option value='-'>-</option><option value='*'>*</option><option value='/'>/</option><option value=' '> </option></select>
<input onchange='num2 = this.value; showall(0,num1,denom1,num2,denom2,actsym);' style='display:inline;background-color: pink;width:60px;' id="guess2" value="0"></input>
<img style='display:inline;background-color: pink;' width=25 height=15 id="iguess2" src='images/gsqrt.gif'></img>
<input onchange='denom2 = this.value; showall(0,num1,denom1,num2,denom2,actsym);' style='display:inline;background-color: pink;width:60px;border-top: 5px solid green;margin-left:-8px;' id="guess2r" value="1"></input>
<input type="button" onclick='assess("0");' style='background-color: yellow;' id="guessb" value="Am I correct simplifying to surd(s)?"></input>
</td></tr></table>

<input type="hidden" value="0" id="fromhereon"></input>

  <p id='pstuff' style="display:none;"></p>  <select id="difficulty" name="difficulty" style="display:none;"><option value="SuperEasy">Super Easy</option><option value="Easy" selected="selected">Easy</option><option value="Harder">Harder</option></select></p>
<table id='ourtable' cellpadding=3><tr><td><input type='button' id='mydrawb' style='display:none;' onclick=" fromhereon='1'; to_image_file(); " value="Draw Surd Chalkboard to Image Below"></input></td><td><a id='email' style='display:none; border: 3px solid green; background-color:yellow; padding: 3 3 3 3; ' href='mailto:user@user.com.qz?subject=Surd%20question%20for%20you%20...' title="Optionally Use Browser to Copy Image then Email Here with Paste Usage">Optionally Use Browser to Copy Image then Email Here with Paste Usage to ...</a></td><td><input type='text' id='emailee' style='display:none;' onchange=" document.getElementById('email').href='mailto:' + this.value + '?subject=Surd%20question%20for%20you%20...'; " value="user@user.com.qz"></input></td></tr></table>
<img id="ourimage" status='display:none;'></img>

<canvas style='border: 5px solid green; background-color: black; opacity: 0.3;' title='Click for your maths question about surds ... Take fewest goes to reach score of 20' id="canvaselement" width="1150" height="500" style="border: 1px solid green;" />
<script language="JavaScript">

var toggle = 0;
var goodx = 200;
var goody = 200;
var inidone = 0;
var curcard = 0;
var suffix = "";

var img;
var imgaction;

var scoretoget = 20;
var guessvalue = 0.0;

var elem = document.getElementById('canvaselement');
var elemLeft = elem.offsetLeft;
var elemTop = elem.offsetTop;
var context = elem.getContext('2d');
var elements = [];
var arr=['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'];


// Add event listener for `click` events.
elem.addEventListener('click', function(event) {
elem.style.backgroundImage = "none";
elem.style.opacity = 1.0;
var x = event.pageX - elemLeft;
var y = event.pageY - elemTop;

x = goodx;
y = goody;

var r = Math.floor((Math.random()*256)+0);
var g = Math.floor((Math.random()*256)+0);
var b = Math.floor((Math.random()*256)+0);
var thiscol ='#' + arr[(r-(r % 16)) / 16] + arr[r % 16] + arr[(g-(g % 16)) / 16] + arr[g % 16] + arr[(b-(b % 16)) / 16] + arr[b % 16];

elem.style.backgroundColor = thiscol;


if (toggle == 0) {
answeridea = '';
document.getElementById("mydrawb").style.display = 'block';
document.getElementById('guess').value = '';
document.getElementById('myh1').innerHTML = 'Change your answer and click button to check ... Take fewest goes to reach score of 20';
//context.drawImage(imgover,x,y);
add_question(x, y);
//if (document.getElementById("fromhereon").value == "1") {
to_image_file();
//}
} else {
document.getElementById('myh1').innerHTML = 'Click anywhere on chalkboard to reveal a new question ... Take fewest goes to reach score of 20';
goes = goes + 1.0;
realgoes = realgoes + 1.0;
score = score + assess("1");
if (score >= scoretoget) {
alert('Congratulations! You got there in ' + goes + ' goes. Is this your best?');
window.location = './surd_withimagecopy_chalkboard.html';
} else {
elem.width = elem.width;
}
}

toggle = 1 - toggle;
}, false);

function assess(myinis) {
myin = myinis;
document.getElementById('bdiv').style.display = 'inline';
setTimeout(assess2, 1000);
}

function assess2() {
var retval = 0, divtoshow='';
if (document.getElementById('guess').value == alt2num1) {
if (document.getElementById('guessr').value == alt2denom1) {
if (document.getElementById('iop').value == alt2actsym) {
if (document.getElementById('guess2').value == alt2num2) {
if (document.getElementById('guess2r').value == alt2denom2) {
divtoshow = 'bdiv';
retval = 1;
}
}
}
}
}
if (retval == 0 && document.getElementById('guess').value == alt1num1) {
if (document.getElementById('guessr').value == alt1denom1) {
if (document.getElementById('iop').value == alt1actsym) {
if (document.getElementById('guess2').value == alt1num2) {
if (document.getElementById('guess2r').value == alt1denom2) {
divtoshow = 'adiv';
retval = 1;
}
}
}
}
}


if (retval != 0) {
retval = 1;
if (myin == "0") {
document.getElementById('bdiv').style.display = 'none';
goes = goes + 1;
realgoes = realgoes + 1;
score = score + 1;
updatescore();
toggle = 0;
elem.width = elem.width;
answeridea = '';
document.getElementById('myh1').innerHTML = 'Change your answer and click button to check ... Take fewest goes to reach score of 20';
//context.drawImage(imgover,x,y);
add_question(x, y);
}
} else {
//alert('Sorry, but answer for ' + answeridea + ' = ' + therealanswer + ' ... click chalkboard for another question.');
var huh=prompt('Sorry, but suggested answer is shown ... am willing to concede you may have a correct answer we have not thought about, and if you answer Cancel, will trust your judgement on this ... remember to look at the "root" numbers to see if they can be simplified ... then try grouping likewise "root" numbers ... click chalkboard for another question.', '0');
if (huh == null) score = score + 1;
goes = goes + 1;
realgoes = realgoes + 1;
updatescore();
toggle = 0;
elem.width = elem.width;
answeridea = '';
document.getElementById('myh1').innerHTML = 'Change your answer and click button to check ... Take fewest goes to reach score of 20';
//context.drawImage(imgover,x,y);
add_question(x, y);
}

return retval;
}

function sepf() {
}

function setpstuff() {
pstuff.innerHTML = 'num1=' + num1 + " denom1=" + denom1 + ' num2=' + num2 + " denom2=" + denom2 + " toggle=" + toggle + " wrand=" + wrand + " actsym=" + actsym;
}

function add_question(inx, iny) {
//alert(99);
var zero = 0, thousand = 1000, hundred = 100;
var difficulty = document.getElementById("difficulty").value;
//alert(98);
var mrand = 0, srand=0, nrand=0, frand=0, xrand=0, lx=inx, ly=iny, nx=inx, ny=iny, mx, my, j, k, tn="", four=4;
showall(0,5,5,5,5,'+');
document.getElementById('adiv').style.display = 'none';
document.getElementById('bdiv').style.display = 'none';
pstuff = document.getElementById('pstuff');
pstuff.innerHTML = '';
beenhere = 0;
num1 = 0;
denom1 = 0;
num2 = 0;
denom2 = 1;
ndenom = 0;
luckofthedraw = Math.floor((Math.random()*9)+0);
if (luckofthedraw == 5) four = 2;
wrand = Math.floor((Math.random()*2)+0);

//wrand = 0;

w1rand = 0;
w1rand = Math.floor((Math.random()*2)+0);
//w1rand = 0;
w2rand = 0;
w3rand = 0;
w4rand = 0;
if (wrand == 1) {
w2rand = Math.floor((Math.random()*2)+0);
w4rand = Math.floor((Math.random()*2)+0);
//w2rand = 1;
//w4rand = 1;
}
if (difficulty.indexOf("Easy") != -1) {
xrand = Math.floor((Math.random()*four)+1); // 3
} else {
xrand = Math.floor((Math.random()*four)+1); // 6
}
//alert(xrand);
var oiop = document.getElementById('iop');
//alert(96);
//xrand = 3;
if (xrand == 6) {
imgaction = document.getElementById('power');
thousand = 12;
hundred = 12;
} else if (xrand == 5) {
imgaction = document.getElementById('mod');
zero = 1;
} else if (xrand == 4) {
imgaction = document.getElementById('divide');
zero = 1;
hundred = 12;
oiop.value = '/';
} else if (xrand == 3) {
imgaction = document.getElementById('multiply');
hundred = 12;
oiop.value = '*';
} else if (xrand == 2) {
imgaction = document.getElementById('minus');
oiop.value = '-';
} else {
imgaction = document.getElementById('plus');
oiop.value = '+';
}
//alert(95);
actsym = imgaction.title;
//alert("inx=" + inx + ' ' + "iny=" + iny);
context.drawImage(imgaction, inx, iny);
//alert("imgaction.style.width");
//alert(imgaction.width);
nx = eval(inx + imgaction.width + 15);
//alert(nx + ' ' + imgaction.width);
mx = nx;
my = eval(iny - imgaction.height - 15);
ly = eval(ly + imgaction.width + 15);
if (difficulty.indexOf("Easy") != -1) {
var ok = 0;
while (ok == 0) {
ok = 1;
num1 = 0;
denom1 = 0;
num2 = 0;
denom2 = 1;
ndenom = 0;
beenhere = 0;
tn = "";
try {
if (difficulty.indexOf("Super") != -1) {
mrand = Math.floor((Math.random()*10)+0);
} else {
mrand = Math.floor((Math.random()*1000)+0); // 100
if (mrand < 10) mrand = eval("110 + " + mrand);
}
tn = "" + mrand;
try {
placetn(mx, my, tn);
} catch (e1) {
//alert("via e1 is " + mrand + " " + e1.message);
ok = 0;
add_question(inx, iny);
return;
}

if (ok != 0) {
tn = "";
if (difficulty.indexOf("Super") != -1) {
mrand = Math.floor((Math.random()*10)+0); // zero
} else {
mrand = Math.floor((Math.random()*1000)+0); // hundred)+zero
if (mrand < 10) mrand = eval("110 + " + mrand);
if (mrand < 100 && xrand == 4) mrand = eval("100 + " + mrand);
}
//alert(tn + " vs " + mrand);
tn = "" + mrand;
try {
placetn(nx, ny, tn);
setpstuff();
} catch (e2) {
//alert("via e2 is " + e2.message);
ok = 0;
add_question(inx, iny);
return;
}
}
} catch (e) {
//alert(e.message);
ok = 0;
add_question(inx, iny);
return;
}
}
//alert("answeridea=" + answeridea);
} else {
srand = Math.floor((Math.random()*2)+1);
mrand = Math.floor((Math.random()*1000)+0);
frand = Math.floor((Math.random()*100)+0);
if (srand <= 1) {
tn = "" + mrand;
} else {
tn = "-" + mrand;
}
if (frand != 0) tn = tn + "." + frand;
placetn(mx, my, tn);
srand = Math.floor((Math.random()*2)+1);
mrand = Math.floor((Math.random()*thousand)+zero);
frand = Math.floor((Math.random()*100)+zero);
if (srand <= 1) {
tn = "" + mrand;
} else {
tn = "-" + mrand;
}
if (frand != 0) tn = tn + "." + frand;
placetn(nx, ny, tn);
}
img = document.getElementById('line');
for (k=0; k<8; k++) {
context.drawImage(img, lx, ly);
lx = eval(lx + img.width);
}

}

function placetn(px, py, ptn) {
var kk, kkk=0, myc='', prefix='', isone = 1;
if (beenhere == 1) isone = 2;
if (answeridea == '') {
answeridea = '(' + ptn + ') ' + actsym + ' ';
} else {
answeridea = answeridea + '(' + ptn + ')';
}
for (kk=0; kk<ptn.length; kk++) {
kkk = kkk + 1;
myc = ptn.substring(kk, (kk+1));
//alert(myc);
if (kk == 1 && myc == "0" && ptn.length == 3) {
if (denom1 == 0) {
denom1 = "";
} else {
denom2 = "";
isone = 2;
}
} else {
var oiop = document.getElementById('iop');
if (myc == '+') {
img = document.getElementById('plus');
beenhere = 1;
oiop.value = myc;
} else if (myc == '-') {
img = document.getElementById('minus');
beenhere = 1;
oiop.value = myc;
} else if (myc == '/') {
img = document.getElementById('divide');
beenhere = 1;
oiop.value = myc;
} else if (myc == '*') {
img = document.getElementById('multiply');
beenhere = 1;
oiop.value = myc;
} else if (myc == '**') {
img = document.getElementById('power');
beenhere = 1;
} else if (myc == '%') {
img = document.getElementById('mod');
beenhere = 1;
} else if (myc == '.') {
img = document.getElementById('dot');
beenhere = 1;
} else {
if (denom1 == 0 && w1rand == 1 && kk == 0 && isone == 1 && beenhere == 0) {
img = document.getElementById('minus');
context.drawImage(img, px, py);
try {
px = eval(px + img.width);
} catch (x1) {
alert("x1 is " + x1.message);
}
}
if (kk == 1 && myc == "0" && ptn.length == 2 && 1 == 2) myc = "1";
if (kk == 0 && beenhere != 0 && luckofthedraw == 5) myc = "0";
img = document.getElementById(prefix + myc);
if (kk == 0 && denom1 == 0) {
if (w1rand == 1) {
num1 = "-" + myc;
} else {
num1 = myc;
}
} else if (kk >= 2 && isone == 2) {
denom2 = denom2 + myc;
isone = 2;
} else if (kk >= 2 && isone == 1) {
denom1 = denom1 + myc;
isone = 2;
} else if (kk == 1 && w2rand == 1 && beenhere == 0) {
denom1 = denom1 + myc;
isone = 1;
} else if (kk == 1 && beenhere == 0) {
denom1 = myc;
isone = 1;
} else if (kk == 0 && beenhere != 0 && luckofthedraw == 5) {
num2 = 0;
} else if (kk == 0 && beenhere != 0) {
num2 = myc;
} else if (kk == 1 && w4rand == 1 && beenhere != 0) {
denom2 = denom2 + myc;
isone = 2;
} else if (kk == 1 && beenhere != 0) {
denom2 = myc;
isone = 2;
}
if (eval(kkk - ptn.length) == 0) fansweridea(actsym);
}
context.drawImage(img, px, py);
try {
px = eval(px + img.width);
} catch (x2) {
alert("x2 is " + x2.message);
}
if (kk == 0) {
prefix = "g";
var ig = document.getElementById('iguess');
var ig2 = document.getElementById('iguess2');
if (wrand == 0) {
img = document.getElementById('gsqrt');
ig.src = 'images/gsqrt.gif';
ig2.src = 'images/gsqrt.gif';
} else {
img = document.getElementById('gcurt');
ig.src = 'images/gcurt.gif';
ig2.src = 'images/gcurt.gif';
}
context.drawImage(img, px, py);
try {
px = eval(px + img.width);
} catch (x3) {
alert("x3 is " + x3.message);
}

if (beenhere == 0 && w2rand == 1) {
img = document.getElementById('gminus');
context.drawImage(img, px, py);
try {
px = eval(px + img.width);
} catch (x4) {
alert("x4 is " + x4.message);
}

denom1 = "-";
isone = 1;
} else if (w4rand == 1 && beenhere != 0) {
img = document.getElementById('gminus');
context.drawImage(img, px, py);
try {
px = eval(px + img.width);
} catch (x5) {
alert("x5 is " + x5.message);
}

denom2 = "-";
isone = 2;
}
if (ptn.length <= 1) {
img = document.getElementById('g1');
context.drawImage(img, px, py);
try {
px = eval(px + img.width);
} catch (x6) {
alert("x6 is " + x6.message);
}

if (denom1 == 0) {
denom1 = "1";
} else {
denom2 = "1";
fansweridea(actsym);
}
}
}
}
}
if (beenhere == 0) beenhere = 1;
}


updatescore();
</script>
<img id="0" alt="0" title="0" src="images/0.gif" style="display:none;"></img>
<img id="1" alt="1" title="1" src="images/1.gif" style="display:none;"></img>
<img id="2" alt="2" title="2" src="images/2.gif" style="display:none;"></img>
<img id="3" alt="3" title="3" src="images/3.gif" style="display:none;"></img>
<img id="4" alt="4" title="4" src="images/4.gif" style="display:none;"></img>
<img id="5" alt="5" title="5" src="images/5.gif" style="display:none;"></img>
<img id="6" alt="6" title="6" src="images/6.gif" style="display:none;"></img>
<img id="7" alt="7" title="7" src="images/7.gif" style="display:none;"></img>
<img id="8" alt="8" title="8" src="images/8.gif" style="display:none;"></img>
<img id="9" alt="9" title="9" src="images/9.gif" style="display:none;"></img>
<img id="slash" alt="slash" title="/" src="images/slash.gif" style="display:none;"></img>
<img id="gsqrt" alt="gsqrt" title="square root" src="images/gsqrt.gif" style="display:none;"></img>
<img id="gcurt" alt="gcurt" title="cube root" src="images/gcurt.gif" style="display:none;"></img>
<img id="plus" alt="+" title="+" src="images/plus.gif" style="display:none;"></img>
<img id="minus" alt="-" title="-" src="images/minus.gif" style="display:none;"></img>
<img id="gminus" alt="-" title="-" src="images/gminus.gif" style="display:none;"></img>
<img id="divide" alt="/" title="/" src="images/divide.gif" style="display:none;"></img>
<img id="multiply" alt="*" title="*" src="images/multiply.gif" style="display:none;"></img>
<img id="mod" alt="%" title="%" src="images/mod.gif" style="display:none;"></img>
<img id="power" alt="**" title="**" src="images/power.gif" style="display:none;"></img>
<img id="dot" alt="." title="." src="images/dot.gif" style="display:none;"></img>
<img id="line" alt="line" title="line" src="images/line.gif" style="display:none;"></img>
<img id="g0" alt="g0" title="0" src="images/g0.gif" style="display:none;"></img>
<img id="g1" alt="g1" title="1" src="images/g1.gif" style="display:none;"></img>
<img id="g2" alt="g2" title="2" src="images/g2.gif" style="display:none;"></img>
<img id="g3" alt="g3" title="3" src="images/g3.gif" style="display:none;"></img>
<img id="g4" alt="g4" title="4" src="images/g4.gif" style="display:none;"></img>
<img id="g5" alt="g5" title="5" src="images/g5.gif" style="display:none;"></img>
<img id="g6" alt="g6" title="6" src="images/g6.gif" style="display:none;"></img>
<img id="g7" alt="g7" title="7" src="images/g7.gif" style="display:none;"></img>
<img id="g8" alt="g8" title="8" src="images/g8.gif" style="display:none;"></img>
<img id="g9" alt="g9" title="9" src="images/g9.gif" style="display:none;"></img>

</body>
</html>