<!doctype html>
<html>
<head>
<title>Tracing Square Line Drawing - RJM Programming - December, 2018 ... Thanks to https://medium.com/@dear_trudence/how-to-draw-vertical-and-diagonal-lines-with-html-and-css-9e8d7d9c59b2 and https://stackoverflow.com/questions/45693587/only-part-of-border-changes-the-color and https://stackoverflow.com/questions/16795548/rotate-and-translate and https://stackoverflow.com/questions/8672369/how-to-draw-a-line-between-two-divs and https://stackoverflow.com/questions/35335226/two-different-colors-with-linear-gradient-effect</title>
<style>
td.square {
width: 100px;
height: 100px;
}

.bicol {
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, pink 0%, pink 50%, yellow 51%, yellow 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, pink 0%,pink 50%,yellow 51%,yellow 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, pink 0%,pink 50%,yellow 51%,yellow 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=pink, endColorstr=yellow,GradientType=0 ); /* IE6-9 */
}

hr {
height: 4px;
border: 2px solid black;
background: linear-gradient(to right, yellow 80%, rgba(255,0,0,1) 20%);
border-radius: 5px;
}

hr.diagonal {
transform: rotate(45deg);
width: 144px;
}

hr.vertical {
transform: rotate(90deg) translateY(50px) translateX(50px) ;
width: 100px;
border-radius: 5px;
z-index: 1;
}

div.vertical {
width: 4px;
height: 100px;
z-index: 12;
border: 2px solid black;
border-radius: 5px;
background: linear-gradient(to left, yellow 80%, rgba(255,0,0,1) 20%);
}

#span::after {
content:'\000031\0020e3';
}

span.vertex:not(.nocont)::after {
content:'\000031\0020e3';
}

hr.vertex {
height: 4px;
width: 4px;
color: purple;
background-color: purple;
background: linear-gradient(to right, purple 80%, purple 20%);
border-radius: 5px;
z-index: 25;
}

#qh4 {
font-size: 12px;
}

input:not(.reveal) {
border-radius: 23px;
}

.reveal {
background-color: #4CAF50;
color: white;
padding: 30px 20px;
border: 1px solid red;
}

.face {
border-radius: 150px;
}

iframe {
z-index: 29;
}
</style>

<script type='text/javascript'>

var hors=[], vers=[], diags=[], sparescore=0;
var score1=' (0)', score2=' (0)';
var thisplayer=1;
var osft='';
var ourx=0, courx='', wourx='', lesscourx='';
var lastsquare=-1;
var tprefix='data-';
if (document.URL.indexOf('debug=') != -1) { tprefix=''; }
var isIE = (navigator.appName == 'Microsoft Internet Explorer' || (navigator.appName == "Netscape" && navigator.appVersion.indexOf('Edge') > -1));
var vertices_in_a_row=0, viar_left=[0.0,0.0], viar_top=[0.0,0.0];
var squares=[], lines=[], vertices=[];
var thisrect, hrcnt=0, hrlgcnt=0;
var lastdel=null, hro, v1=null, v2=null, onld=true;
var cgcols=['lime','maroon','blue','purple','navy','teal','fuchsia','olive','red','lightgreen','lightblue','purple','orange'];
var dval='', wording='';
var aurl='', burl='';
var inas=[], jinas=0;
var inanswer='';
var haveclickedvertex=false;
var vstr=';';
var score=0, goes=0, sqchoice=0, sqorig='';
var lasthr=0;
var bpointsx=[];
var bpointsy=[];
var wlens=10;
var wlenb=20;
var vocabulary=[""];
var hangman=[""];
var mode=0;
var clue='';
var maxanyone=7;
var availablescore=100;
var zerozerox=0, zerozeroy=0;
var xlen=0, ylen=0;
var minx=0; //Math.min(eval('' + inminx), eval('' + inmaxx));
var maxx=0; //Math.max(eval('' + inminx), eval('' + inmaxx));
var miny=0; //Math.min(eval('' + inminy), eval('' + inmaxy));
var maxy=0; //Math.max(eval('' + inminy), eval('' + inmaxy));
var yoffset=0;
var xfactor=1, yfactor=1;
var numsets=0, iset=0, orignumsets=0;
var graphtitle='';
var xint=0, yint=0;
var oiois=null;
var eqplotsuffix='';
var aem='';
var blk='';
var emeq='plot';
var firstp='Please enter minimum x,y and maximum x,y all separated by commas';
var origph='Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
var altph='Polynomial formula y=A*x*x + B*x + C ... please comma separate A,B,C';
var altnextph='';
var xlabel='X';
var ylabel='Y';
var xvalue='';
var yvalue='';
var dw=0;
var dwl=0;

var ihangman=0;
var hangmanc=[
" document.getElementById('dhangman').innerHTML+='<p id=phead class=face style=z-index:90;position:absolute;top:248px;left:142px;font-size:56px;>🙂</p>'; ",
" document.getElementById('hr77').click(); document.getElementById('hr137').click(); ",
" document.getElementById('hr119').click(); document.getElementById('hr77').click(); ",
" document.getElementById('hr131').click(); document.getElementById('hr77').click(); ",
" document.getElementById('hr137').click(); document.getElementById('hr234').click(); ",
" document.getElementById('hr137').click(); document.getElementById('hr246').click(); ",
" document.getElementById('hr235').click(); document.getElementById('hr256').click(); ",
" document.getElementById('hr260').click(); document.getElementById('hr256').click(); ",
" document.getElementById('hr230').click(); document.getElementById('hr235').click(); ",
" document.getElementById('hr235').click(); document.getElementById('hr20').click(); ",
" document.getElementById('hr290').style.display='none'; document.getElementById('hr260').click(); document.getElementById('hr235').click(); document.getElementById('phead').innerHTML='🤢'; document.getElementById('dhangman').innerHTML+='<p id=pnoose class=face style=background-color:blank;z-index:95;position:absolute;top:195px;left:168px;font-size:6px;>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀<br>🎀</p>'; "
];


var inquestions=["",
"10,22,23,9,70,126,128,139,150,149,93,36,82,138,-82,+25,+37,-138,+95,+37",
"126,70,9,10,22,34,35,93,149,150,139,127,83,82,24,-24,+140,+196,-82,+173,+185",
"70,72,71,180.124,+72,-61,-73,+285,-7,-68",
"9,10,11,12,70,71,72,24,82,83,-70,+7,+68,-72,80,+136",
"12,24,36,73.4,17.4,29.17,84.29,-287,+95,+29,-12,+84,+17",
"70,71,82,72,83,12,24,20.7,61.7,73.7,84.20,-285,+73,+20",
"11,12,70,126,128,139,150,149,94,83,127,71,82,23,22,-150,+117,+129,-149,+73,+84,-94,+140,+196",
"11,35,22,34,24,36,73.4,13.4,124.73,136.73,147.95,158.95,41.37,-285,+95,+41",
"11,35,22,34,24,36,73.4,13.4,124.73,136.73,147.95,158.95,41.37,-285,+73,+17,-286,+17,+13",
"11,22,23,24,139,73.117,151.84,196.151,185.117,-11,+140,+185,-22,+140,+73,-23,+140,+151",
"12,72,71,70,83,139,11,10,9,149,94,126,128,127,139,138,150,-71,+25,+37,-70,+25,+84,-83,+84,+95,-139,+95,+37"];
var inwordings=["",
"Get 2 rectangles to 2 squares by moving 2 matches. Which 2?",
"Get gap at bottom left closed up and leaving 2 squares by moving 2 matches. Which 2?",
"Turn Y-like figure upside down by moving 2 matches. Which 2?",
"Get four equal sized rectangles from these three equal sized squares by moving 2 matches. Which 2?",
"Get 1 parallelogram and 1 equilateral triangle by moving 2 matches. Which 2?",
"This house can become 2 by moving 1 match. Which 1?",
"Get 6 squares out of these 3 equal sized rectangles by moving 3 matches. Which 3?",
"Turn the dog around by moving 1 match. Which 1?",
"Make this dog look back by moving 2 matches. Which 2?",
"Make this pattern into a 3d cube by moving 3 matches. Which 3?",
"Change the L shape pattern into 4 equal sized squares by moving 4 matches. Which 4?"];

var sq=["Is the additive identity.",
"Is the multiplicative identity.",
"Is the only even prime.",
"Is the number of spatial dimensions we live in.",
"Is the smallest number of colours sufficient to colour all planar maps.",
"Is the number of Platonic solids.",
"Is the smallest perfect number.",
"Is the smallest number of sides of a regular polygon that is not constructible by straightedge and compass.",
"Is the largest cube in the Fibonacci sequence.",
"Is the maximum number of cubes that are needed to sum to any positive integer.",
"Is the base of our number system.",
"Is the largest known multiplicative persistence.",
"Is the smallest abundant number.",
"Is the number of Archimedian solids.",
"Is the smallest even number n with no solutions to phi(m) = n.",
"Is the smallest composite number n with the property that there is only one group of order n.",
"Is the only number of the form xy = yx with x and y being different integers.",
"Is the number of wallpaper groups.",
"Is the only positive number that is twice the sum of its digits.",
"Is the maximum number of 4th powers needed to sum to any number.",
"Is the number of rooted trees with 6 vertices.",
"Is the smallest number of distinct squares needed to tile a square.",
"Is the number of partitions of 8.",
"Is the smallest number of integer-sided boxes that tile a box so that no two boxes share a common length.",
"Is the largest number divisible by all numbers less than its square root.",
"Is the smallest square that can be written as a sum of 2 squares."];

function maybenocont(inv) {
if (inv.length > 0) { return ' nocont'; } else { return ''; }
}

function vplus(fb) {
var xf=eval(fb.split(',')[0]);
var yf=eval(fb.split(',')[1].split(';')[0]);
return fb + eval(xf) + ',' + eval(1 + yf) + ';' + eval(1 + xf) + ',' + eval(yf) + ';' + eval(1 + xf) + ',' + eval(1 + yf) + ';' + eval(xf) + ',' + eval(-1 + yf) + ';' + eval(-1 + xf) + ',' + eval(yf) + ';' + eval(-1 + xf) + ',' + eval(-1 + yf) + ';';
}

function ourmathround(inn) {
var oinn=Math.floor(Math.floor(eval('' + inn) + 23) / 47);
//if (('' + inn).indexOf('220.') != -1 || ('' + inn).indexOf('218.') != -1) { alert('inn=' + inn + ' and oinn=' + oinn + ' results in ' + '' + eval(eval('' + oinn) * 5)); }
//if (vstr != '') { alert(vstr); }
return '' + eval(eval('' + oinn) * 47);
}

function picksq() {
sqchoice=Math.floor(Math.random() * eval(0 - 1 + sq.length)) + 1;
document.getElementById('qh4').innerHTML=sqorig + ' ... Score: ' + score + '/' + goes + ' ... ' + sq[sqchoice];
}

function gridinfo(insq) {
if (insq.indexOf(' in square ') != -1) {
//alert('x' + location.hash);
document.getElementById('qh4').innerHTML+=insq;
} else {
//alert('z' + location.hash);
document.getElementById('qh4').innerHTML=sqorig + insq;
}
}

function pickone(what) {
var zero=1, choice=0;
if (('' + location.hash).indexOf('blank') == -1 && ('' + location.hash).indexOf('hangman') == -1 && ('' + location.hash).indexOf('square') == -1 && ('' + location.hash).indexOf('grid') == -1) {
choice=Math.floor(Math.random() * eval(0 - zero + inquestions.length)) + zero;
if (document.URL.indexOf('?') == -1 && ('' + location.hash) == '') {
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent(inwordings[choice]) + courx + '&question=' + encodeURIComponent(inquestions[choice]);
}
} else if (('' + location.hash).indexOf('blank') != -1) {
zero=0;
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent('Vertex Pointing' + osft + ' Game') + courx + '&question=%20' + '#blank' + lesscourx; //location.hash;
} else if (('' + location.hash).indexOf('square') != -1) {
zero=0;
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent('Square Pointing Game') + courx + '&question=%20' + '#square'; //location.hash;
} else if (('' + location.hash).indexOf('grid') != -1) {
zero=0;
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent('Grid Pointing Game') + courx + '&question=%20' + '#grid'; // + location.hash;
} else if (('' + location.hash).indexOf('hangman') != -1) {
if (('' + document.URL).indexOf('reveal') != -1) {
zero=0;
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent('Image Reveal Game') + courx + '&question=%20#hangman-00.0'; // + location.hash;
} else if (('' + document.URL).indexOf('mathsgrid') != -1) {
zero=0;
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent('Maths Grid Paper') + courx + '&question=%20#hangman-0.0'; // + location.hash;
} else {
zero=0;
//alert(location.hash);
location.href=document.URL.split('#')[0].split('?')[0] + '?wording=' + encodeURIComponent('Hangman Game') + courx + '&question=%20' + location.hash;
}
}
return what;
}

function acl() {
if (inas.length > 0 && inas.length > jinas) {
if (inas[jinas].indexOf('-') != -1) {
hrclick(document.getElementById('hr' + inas[jinas].replace('-','').replace('dr','').replace('hr','')));
jinas++;
setTimeout(acl, 2000);
} else {
hrclick(document.getElementById('hr' + inas[jinas].replace(' ','').replace('+','').replace('dr','').replace('hr','')));
jinas++;
setTimeout(acl, 2000);
}
}
}

// Thanks to https://stackoverflow.com/questions/16227300/how-to-draw-bezier-curves-with-native-javascript-code-without-ctx-beziercurveto
function placebezierpoint(t, p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) {
if (mode != 5) {
var cX = 3 * (p1x - p0x),
bX = 3 * (p2x - p1x) - cX,
aX = p3x - p0x - cX - bX;

var cY = 3 * (p1y - p0y),
bY = 3 * (p2y - p1y) - cY,
aY = p3y - p0y - cY - bY;

var x = (aX * Math.pow(t, 3)) + (bX * Math.pow(t, 2)) + (cX * t) + p0x;
var y = (aY * Math.pow(t, 3)) + (bY * Math.pow(t, 2)) + (cY * t) + p0y;
//alert('' + x + ' ' + y);
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="position:absolute;top:' + y + 'px;left:' + x + 'px;"></hr>';
hrcnt++;
}
//return {x: x, y: y};
}

function dobezier(x0, y0, x1, y1, x2, y2, x3, y3) {
if (mode != 5) {
var accuracy = 0.01; //this'll give the bezier 100 segments
//var p0 = {x: x0, y: y0}; //use whatever points you want obviously
//var p1 = {x: x1, y: y1};
//var p2 = {x: x2, y: y2};
//var p3 = {x: y3, y: y4};
//var p;

//alert(67);

document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="position:absolute;top:' + y0 + 'px;left:' + x0 + 'px;"></hr>';
hrcnt++;
//alert(67);
while (eval('' + accuracy) < 1.00) {
//alert(61);
placebezierpoint(accuracy, x0, y0, x1, y1, x2, y2, x3, y3); //p0, p1, p2, p3);
accuracy+=0.01;
//alert(167);
}
}
}

function hrclick(inhro) {
try {
//alert(inhro.id);
hro=document.getElementById(inhro.id.replace('dr','hr'));
if (hro != null) {
var topdiff=0.0, leftdiff=0.0;
//alert(hro.id);
var whro='';
whro=('' + hro.style.width).replace('px','');
//document.title=whro;
if (isNaN(whro)) {
whro=('' + hro.style.height).replace('px','');
//document.title+=' ** ' + whro;
}
//if (eval(('' + hro.style.width).replace('px','')) > 9 || inhro.outerHTML.indexOf('<div') != -1 || inhro.id != inhro.id.replace('dr','hr')) {
if (eval(whro) > 9 || inhro.outerHTML.indexOf('<div') != -1 || inhro.id != inhro.id.replace('dr','hr')) {
if (('' + location.hash).indexOf('grid') != -1) { gridinfo(' ... Element Type ' + hro.outerHTML.substring(1).split(' ')[0] + ' is ' + eval(whro) + ' pixels long'); }
if (!haveclickedvertex || vertices_in_a_row == 0) {
lastdel=hro;
//alert(hro.id + ' vs ' + inhro.id);
//inhro.style.width='0px';
//inhro.style.height='0px';
hro.style.display='none'; //visibility='hidden';
hro.style.visibility='hidden'; //visibility='hidden';
vertices_in_a_row=0;
}
} else if (vertices_in_a_row == 0) {
v1=inhro;
viar_left[0]=eval(('' + hro.style.left).replace('px',''));
viar_top[0]=eval(('' + hro.style.top).replace('px',''));
vertices_in_a_row=1;
document.getElementById('pout').innerHTML="<style> #" + inhro.id + "::after { content:'\\000031\\0020e3'; } </style>";
if (('' + location.hash).indexOf('blank') != -1 || ('' + location.hash).indexOf('hangman') != -1) {
if (bpointsx.length < 4) {
bpointsx.push(viar_left[0]);
bpointsy.push(viar_top[0]);
if (bpointsx.length >= 4 && (' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
//alert('square');
if (parent.document.getElementById('dback')) { parent.document.getElementById('dback').title='' + bpointsx[0] +',' + eval(-200 + bpointsy[0]) + ',' + bpointsx[1] +',' + eval(-200 + bpointsy[1]) + ',' + bpointsx[2] + ',' + eval(-200 + bpointsy[2]) + ',' + bpointsx[3] +',' + eval(-200 + bpointsy[3]); bpointsx=[]; bpointsy=[]; }
} else if (bpointsx.length >= 4 && ('' + location.hash).indexOf('blank') != -1 && ('' + location.hash).indexOf('=column') == -1 && ('' + location.hash).indexOf('=plot') == -1) { dobezier(bpointsx[0],bpointsy[0],bpointsx[1],bpointsy[1],bpointsx[2],bpointsy[2],bpointsx[3],bpointsy[3]); }
} else {
bpointsx[0]=bpointsx[1];
bpointsy[0]=bpointsy[1];
bpointsx[1]=bpointsx[2];
bpointsy[1]=bpointsy[2];
bpointsx[2]=bpointsx[3];
bpointsy[2]=bpointsy[3];
bpointsx[3]=viar_left[0];
bpointsy[3]=viar_top[0];
if (bpointsx.length >= 4 && (' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
//alert('square');
if (parent.document.getElementById('dback')) { parent.document.getElementById('dback').title='' + bpointsx[0] +',' + eval(-200 + bpointsy[0]) + ',' + bpointsx[1] +',' + eval(-200 + bpointsy[1]) + ',' + bpointsx[2] + ',' + eval(-200 + bpointsy[2]) + ',' + bpointsx[3] +',' + eval(-200 + bpointsy[3]); bpointsx=[]; bpointsy=[]; }
} else if (bpointsx.length >= 4 && ('' + location.hash).indexOf('blank') != -1 && ('' + location.hash).indexOf('=column') == -1 && ('' + location.hash).indexOf('=plot') == -1) { dobezier(bpointsx[0],bpointsy[0],bpointsx[1],bpointsy[1],bpointsx[2],bpointsy[2],bpointsx[3],bpointsy[3]); }
}
}
} else if (vertices_in_a_row == 1) {
v2=inhro;
viar_left[1]=eval(('' + hro.style.left).replace('px',''));
leftdiff=Math.abs(viar_left[1] - viar_left[0]);
viar_top[1]=eval(('' + hro.style.top).replace('px',''));
topdiff=Math.abs(viar_top[1] - viar_top[0]);
var thiswidth=Math.sqrt(eval(topdiff * topdiff) + eval(leftdiff * leftdiff));
if (!isIE) {
//alert(document.getElementById('hr' + fhr).outerHTML + ' to ' + document.getElementById('hr' + eval(1 + eval('' + fhr))).outerHTML + ' is ' + connect(document.getElementById('hr' + fhr), document.getElementById('hr' + eval(1 + eval('' + fhr)))).replace('<div ','<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical '));
document.getElementById('hrs').innerHTML+=connect(v1, v2).replace('<div ','<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical ').replace('<DIV ','<div onclick=alert(this.title); id=hr' + hrcnt + ' class=vertical ');
hrcnt++;
if (('' + location.hash).indexOf('blank') != -1 || ('' + location.hash).indexOf('hangman') != -1) {
if (bpointsx.length < 4) {
bpointsx.push(viar_left[1]);
bpointsy.push(viar_top[1]);
if (bpointsx.length >= 4 && (' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
//alert('square');
if (parent.document.getElementById('dback')) { parent.document.getElementById('dback').title='' + bpointsx[0] +',' + eval(-200 + bpointsy[0]) + ',' + bpointsx[1] +',' + eval(-200 + bpointsy[1]) + ',' + bpointsx[2] + ',' + eval(-200 + bpointsy[2]) + ',' + bpointsx[3] +',' + eval(-200 + bpointsy[3]); bpointsx=[]; bpointsy=[]; }
} else if (bpointsx.length >= 4 && ('' + location.hash).indexOf('blank') != -1 && ('' + location.hash).indexOf('=column') == -1 && ('' + location.hash).indexOf('=plot') == -1) { dobezier(bpointsx[0],bpointsy[0],bpointsx[1],bpointsy[1],bpointsx[2],bpointsy[2],bpointsx[3],bpointsy[3]); }
} else {
bpointsx[0]=bpointsx[1];
bpointsy[0]=bpointsy[1];
bpointsx[1]=bpointsx[2];
bpointsy[1]=bpointsy[2];
bpointsx[2]=bpointsx[3];
bpointsy[2]=bpointsy[3];
bpointsx[3]=viar_left[1];
bpointsy[3]=viar_top[1];
if (bpointsx.length >= 4 && (' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
//alert('square');
if (parent.document.getElementById('dback')) { parent.document.getElementById('dback').title='' + bpointsx[0] +',' + eval(-200 + bpointsy[0]) + ',' + bpointsx[1] +',' + eval(-200 + bpointsy[1]) + ',' + bpointsx[2] + ',' + eval(-200 + bpointsy[2]) + ',' + bpointsx[3] +',' + eval(-200 + bpointsy[3]); bpointsx=[]; bpointsy=[]; }
} else if (bpointsx.length >= 4 && ('' + location.hash).indexOf('blank') != -1 && ('' + location.hash).indexOf('=column') == -1 && ('' + location.hash).indexOf('=plot') == -1) { dobezier(bpointsx[0],bpointsy[0],bpointsx[1],bpointsy[1],bpointsx[2],bpointsy[2],bpointsx[3],bpointsy[3]); }
}
}
} else if (Math.abs(topdiff) < 3.0 && Math.abs(leftdiff) > 3.0) {
if (viar_left[1] > viar_left[0]) {
//alert(0);
document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;position:absolute;top:' + viar_top[0] + 'px;left:' + viar_left[0] + 'px;"></hr>';
hrcnt++;
} else {
//alert(100);
document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;position:absolute;top:' + viar_top[1] + 'px;left:' + viar_left[1] + 'px;"></hr>';
hrcnt++;
}
} else if (Math.abs(topdiff) > 3.0 && Math.abs(leftdiff) < 3.0) {
if (viar_top[1] > viar_top[0]) {
document.getElementById('hrs').innerHTML+='<hr class=vertical onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(90deg) translateY(' + Math.floor(eval(('' + thiswidth - 0) / 2)) + 'px) translateX(' + Math.floor(eval(('' + thiswidth - 0) / 2)) + 'px) ;position:absolute;top:' + viar_top[0] + 'px;left:' + viar_left[0] + 'px;"></hr>';
hrcnt++;
} else {
document.getElementById('hrs').innerHTML+='<hr class=vertical onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(90deg) translateY(' + Math.floor(eval(('' + thiswidth - 0) / 2)) + 'px) translateX(' + Math.floor(eval(('' + thiswidth - 0) / 2)) + 'px) ;position:absolute;top:' + viar_top[1] + 'px;left:' + viar_left[1] + 'px;"></hr>';
hrcnt++;
}
} else if (Math.abs(topdiff - leftdiff) < 3.0) {
if (viar_top[1] > viar_top[0] && viar_left[1] > viar_left[0]) {
//alert(45);
document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(45deg) translateY(' + Math.floor(eval(('' + topdiff - 10) / 2)) + 'px) translateX(' + Math.floor(eval(('' + leftdiff - 10) / 2)) + 'px) ;position:absolute;top:' + viar_top[0] + 'px;left:' + viar_left[0] + 'px;"></hr>';
hrcnt++;
} else if (viar_top[1] < viar_top[0] && viar_left[1] > viar_left[0]) {
//alert(-135);
document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(135deg) translateY(' + Math.floor(eval(('' + topdiff - 0) / 2)) + 'px) translateX(' + Math.floor(eval(('' + leftdiff - 0) / 2)) + 'px) ; transform-origin(' + eval(viar_left[1] - leftdiff / 2) + 'px ' + eval(viar_top[1] + topdiff / 2) + 'px);position:absolute;top:' + eval(viar_top[1] + topdiff / 2) + 'px;left:' + eval(viar_left[1] - leftdiff / 2) + 'px;"></hr>';
} else if (viar_top[1] > viar_top[0] && viar_left[1] < viar_left[0]) {
//alert(135);
document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(135deg) translateY(' + Math.floor(eval(('' + topdiff - 0) / 2)) + 'px) translateX(' + Math.floor(eval(('' + leftdiff - 0) / 2)) + 'px) ; transform-origin(' + eval(viar_left[0] - leftdiff / 2) + 'px ' + eval(viar_top[0] + topdiff / 2) + 'px);position:absolute;top:' + eval(viar_top[0] + topdiff / 2) + 'px;left:' + eval(viar_left[0] - leftdiff / 2) + 'px;"></hr>';
hrcnt++;
} else if (viar_top[1] < viar_top[0] && viar_left[1] < viar_left[0]) {
//alert(-45);


document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(45deg) translateY(' + Math.floor(eval(('' + topdiff - 10) / 2)) + 'px) translateX(' + Math.floor(eval(('' + leftdiff - 10) / 2)) + 'px) ;position:absolute;top:' + viar_top[1] + 'px;left:' + viar_left[1] + 'px;"></hr>';


// getting there below
//document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(45deg) translateX(' + Math.floor(eval(('' + leftdiff - 0) / 2)) + 'px) translateY(' + Math.floor(eval(('' + topdiff - 0) / 2)) + 'px) ; transform-origin(' + eval(viar_left[1] + leftdiff / 2) + 'px ' + eval(viar_top[1] + topdiff / 2) + 'px);position:absolute;top:' + eval(viar_top[1] + topdiff / 2) + 'px;left:' + eval(viar_left[1] + leftdiff / 2) + 'px;"></hr>';



//document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="width:' + thiswidth + 'px;transform: rotate(45deg) translateY(' + Math.floor(eval(('' + topdiff - 0) / 2)) + 'px) translateX(' + Math.floor(eval(('' + leftdiff - 0) / 2)) + 'px) ; transform-origin(' + eval(viar_left[1] + leftdiff / 2) + 'px ' + eval(viar_top[0] + topdiff / 2) + 'px);position:absolute;top:' + eval(viar_top[1] + topdiff / 2) + 'px;left:' + eval(viar_left[1] + leftdiff / 2) + 'px;"></hr>';
hrcnt++;
}
//document.getElementById('hrs').innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2) + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 1) + 'px;"></hr>';
//hrcnt++;
} else {
alert('Sorry, cannot draw this one.');
if (lastdel != null) {
lastdel.style.display='block';
}
}
//alert(leftdiff + ' ' + topdiff);
vertices_in_a_row=0;
}
//document.title='' + vertices_in_a_row;
} else {
hro=lastdel;
}
} catch(tres) {
}
}

function ina(inqs) {
// http://localhost:8888/square_hr_tracing.htm?debug=y&wording=hdgdyt%20dfh&inquestion=10,22,23,9,70,126,128,139,150,149,93,36,82,138,-82,+25,+37,-138,+95,+37
if (inanswer == '') {
if (inqs.indexOf(',-') != -1 || inqs.indexOf(',+') != -1 || inqs.indexOf(', ') != -1) {
var preurl=inqs.split(',-')[0].split(',+')[0].split(', ')[0];
var prest=inqs.replace(preurl + ',','').replace(preurl,'').replace(/\ /g,'+');
var ins=(preurl + '-').replace(',-','').replace('-','').split(',');
var inandouts=prest.split(',');
burl=pickone(document.URL);
aurl=document.URL.split('#')[0].replace('question=','q=') + '&question=' + encodeURIComponent(preurl) + '&answer=' + encodeURIComponent(prest);
//alert(prest + ' ... ' + aurl);
return preurl;
} else {
burl=pickone(document.URL);
aurl=document.URL;
}
} else {
burl=pickone(document.URL);
aurl=document.URL.replace('question=','q=').replace('answer=','question=');
}
return inqs;
}

function asocwc() {
courx='';
lesscourx='';
if (document.getElementById('selmode').value.indexOf('blank') != -1) {
lesscourx=('' + ourx).replace('px','');
courx='&ourx=' + lesscourx;
}
}

function socwc(evt) {
if (evt.clientX) {
ourx = evt.clientX; // - elemLeft;
} else {
ourx = evt.pageX; // - elemLeft;
}
setTimeout(asocwc, 2000);
}

function norepeat(cwhat) {
if (cwhat.indexOf('.11111') != -1) {
return cwhat.split('.')[0] + '.1';
} else if (cwhat.indexOf('.22222') != -1) {
return cwhat.split('.')[0] + '.2';
} else if (cwhat.indexOf('.33333') != -1) {
return cwhat.split('.')[0] + '.3';
} else if (cwhat.indexOf('.44444') != -1) {
return cwhat.split('.')[0] + '.4';
} else if (cwhat.indexOf('.55555') != -1) {
return cwhat.split('.')[0] + '.6';
} else if (cwhat.indexOf('.66666') != -1) {
return cwhat.split('.')[0] + '.7';
} else if (cwhat.indexOf('.77777') != -1) {
return cwhat.split('.')[0] + '.8';
} else if (cwhat.indexOf('.88888') != -1) {
return cwhat.split('.')[0] + '.9';
} else if (cwhat.indexOf('.99999') != -1) {
if (cwhat.indexOf('-') != -1) {
return eval(-1 + eval('' + cwhat.split('.')[0])) + '.0';
} else {
return eval(1 + eval('' + cwhat.split('.')[0])) + '.0';
}
}
return cwhat;
}

function texttoo(hrval, cwords) {
var axisword='0', minustwenty='-20', labo='70';
if (cwords == '(0,0)') {
if (('' + location.hash).indexOf('=column') != -1) {
if ((' ' + maxy).length > 4) { minustwenty='-' + eval(eval((' ' + maxy).length) * 6); }
document.getElementById('daxes').innerHTML+='<b><sup style="margin-top:-10px;margin-left:' + minustwenty + 'px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + yoffset + '</sup></b>';
} else {
document.getElementById('daxes').innerHTML+='<sup style="margin-top:-10px;margin-left:10px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + norepeat('' + axisword) + '</sup>';
//document.getElementById('daxes').innerHTML+='<sub style="margin-top:-10px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + axisword + '</sub>';
}
} else if (cwords.indexOf(',0)') != -1) {
axisword=cwords.substring(1).split(',')[0];
if (('' + location.hash).indexOf('=column') != -1) {
document.getElementById('daxes').innerHTML+='<sub style="margin-top:-10px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;"></sub>';
} else {
document.getElementById('daxes').innerHTML+='<sub style="margin-top:-10px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + norepeat('' + axisword) + '</sub>';
}
if (('' + location.hash).indexOf('=column') != -1 && eval('' + axisword) == eval(eval('' + yint) * 3)) {
if (xlabel.indexOf('~') != -1) { labo='50'; }
document.getElementById('daxes').innerHTML+='<b><sub id=sxlabel style="margin-top:' + labo + 'px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + xlabel.replace(/\~/g,'<br>') + '</sub></b>';
} else if (('' + location.hash).indexOf('=column') == -1 && eval('' + axisword) == xint) {
document.getElementById('daxes').innerHTML+='<sub id=sxlabel style="margin-top:20px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + xlabel + '</sub>';
}
} else if (cwords.indexOf('(0,') != -1) {
axisword=cwords.substring(3).split(')')[0];
if (('' + location.hash).indexOf('=column') != -1) {
if ((' ' + maxy).length > 4) { minustwenty='-' + eval(eval((' ' + maxy).length) * 6); }
document.getElementById('daxes').innerHTML+='<b><sup style="margin-left:' + minustwenty + 'px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + norepeat('' + eval(eval('' + axisword) + eval('' + yoffset))) + '</sup></b>';
} else {
document.getElementById('daxes').innerHTML+='<sup style="margin-left:10px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + norepeat('' + axisword) + '</sup>';
}
if (('' + location.hash).indexOf('=column') != -1 && eval('' + axisword) == eval(eval('' + yint) * 6)) {
document.getElementById('daxes').innerHTML+='<b><sup id=sylabel style="margin-left:-60px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + ylabel + '</sup></b>';
} else if (('' + location.hash).indexOf('=column') == -1 && eval('' + axisword) == yint) {
document.getElementById('daxes').innerHTML+='<sup id=sylabel style="margin-left:-10px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + ylabel + '</sup>';
}
}
return cwords;
}

function plotit(inminx, inminy, inmaxx, inmaxy) {
var cintx='', cinty='', oneupx=0, oneupy=0;
var i, j, xisneeded=false, yisneeded=false;
xint=0;
yint=0;
minx=Math.min(eval('' + inminx), eval('' + inmaxx));
maxx=Math.max(eval('' + inminx), eval('' + inmaxx));
miny=Math.min(eval('' + inminy), eval('' + inmaxy));
maxy=Math.max(eval('' + inminy), eval('' + inmaxy));
xlen=eval(eval('' + maxx) - eval('' + minx));
ylen=eval(eval('' + maxy) - eval('' + miny));
var xdiff=eval(eval('' + maxx) + eval('' + minx));
var ydiff=eval(eval('' + maxy) + eval('' + miny));
if (eval('' + minx) >= 0 && eval('' + miny) >= 0) {
zerozerox=eval('' + document.getElementById('hr233').style.left.replace('px',''));
zerozeroy=eval('' + document.getElementById('hr233').style.top.replace('px',''));
xint=eval(maxx / 9);
yint=eval(maxy / 9);
//alert('' + xint + ',' + yint);
cintx='' + Math.floor(xint);
cinty='' + Math.floor(yint);
oneupx=eval(eval('' + cintx.substring(0,1)) + 1);
oneupy=eval(eval('' + cinty.substring(0,1)) + 1);

for (i=1; i<cintx.length; i++) {
if (cintx.substring(i, eval(1 + i)) != '0') { xisneeded=true; }
if (cinty.substring(i, eval(1 + i)) != '0') { yisneeded=true; }
oneupx*=10;
oneupy*=10;
}

xfactor=eval(Math.abs(eval('' + document.getElementById('hr234').style.left.replace('px','')) - eval('' + document.getElementById('hr233').style.left.replace('px',''))) / xint);
yfactor=eval(Math.abs(eval('' + document.getElementById('hr181').style.top.replace('px','')) - eval('' + document.getElementById('hr233').style.top.replace('px',''))) / yint);
//alert('yint=' + yint + ' and yfactor so far=' + yfactor);
if (xisneeded) { xint=oneupx; xfactor=eval(Math.abs(eval('' + document.getElementById('hr234').style.left.replace('px','')) - eval('' + document.getElementById('hr233').style.left.replace('px',''))) / oneupx); }
if (yisneeded) { yint=oneupy; yfactor=eval(Math.abs(eval('' + document.getElementById('hr181').style.top.replace('px','')) - eval('' + document.getElementById('hr233').style.top.replace('px',''))) / oneupy); }
//alert('yint=' + yint + ' and yfactor later=' + yfactor + ' ... pxstuff=' + Math.abs(eval('' + document.getElementById('hr181').style.top.replace('px','')) - eval('' + document.getElementById('hr233').style.top.replace('px',''))) + ' ... via ' + document.getElementById('hr181').style.top.replace('px','') + ' and ' + document.getElementById('hr110').style.top.replace('px',''));

document.getElementById('hr233').title=texttoo(233,'(0,0)');
document.getElementById('hr234').title=texttoo(234,'(' + eval(xint * 1) + ',0)');
document.getElementById('hr245').title=texttoo(245,'(' + eval(xint * 2) + ',0)');
document.getElementById('hr246').title=texttoo(246,'(' + eval(xint * 3) + ',0)');
document.getElementById('hr256').title=texttoo(256,'(' + eval(xint * 4) + ',0)');
document.getElementById('hr257').title=texttoo(257,'(' + eval(xint * 5) + ',0)');
document.getElementById('hr267').title=texttoo(267,'(' + eval(xint * 6) + ',0)');
document.getElementById('hr268').title=texttoo(268,'(' + eval(xint * 7) + ',0)');
document.getElementById('hr278').title=texttoo(278,'(' + eval(xint * 8) + ',0)');
document.getElementById('hr279').title=texttoo(279,'(' + eval(xint * 9) + ',0)');

document.getElementById('hr181').title=texttoo(181,'(0,' + eval(yint * 1) + ')');
document.getElementById('hr177').title=texttoo(177,'(0,' + eval(yint * 2) + ')');
document.getElementById('hr125').title=texttoo(125,'(0,' + eval(yint * 3) + ')');
document.getElementById('hr121').title=texttoo(121,'(0,' + eval(yint * 4) + ')');
document.getElementById('hr69').title=texttoo(69,'(0,' + eval(yint * 5) + ')');
document.getElementById('hr65').title=texttoo(65,'(0,' + eval(yint * 6) + ')');
document.getElementById('hr68').title=texttoo(68,'(0,' + eval(yint * 7) + ')');
document.getElementById('hr4').title=texttoo(4,'(0,' + eval(yint * 8) + ')');
document.getElementById('hr7').title=texttoo(7,'(0,' + eval(yint * 9) + ')');


document.getElementById('hr279').click();
document.getElementById('hr233').click();
document.getElementById('hr7').click();
document.getElementById('hr233').click(); // (0,0)
document.getElementById('ashare').style.display='inline-block';
} else if (eval('' + maxx) <= 0 && eval('' + maxy) <= 0) {
zerozerox=eval('' + document.getElementById('hr53').style.left.replace('px',''));
zerozeroy=eval('' + document.getElementById('hr53').style.top.replace('px',''));
xint=eval(-minx / 9);
yint=eval(-maxy / 9);
//alert('' + xint + ',' + yint);
cintx='' + Math.floor(xint);
cinty='' + Math.floor(yint);
oneupx=eval(eval('' + cintx.substring(0,1)) + 1);
oneupy=eval(eval('' + cinty.substring(0,1)) + 1);

for (i=1; i<cintx.length; i++) {
if (cintx.substring(i, eval(1 + i)) != '0') { xisneeded=true; }
if (cinty.substring(i, eval(1 + i)) != '0') { yisneeded=true; }
oneupx*=10;
oneupy*=10;
}

xfactor=eval(Math.abs(eval('' + document.getElementById('hr42').style.left.replace('px','')) - eval('' + document.getElementById('hr41').style.left.replace('px',''))) / xint);
yfactor=eval(Math.abs(eval('' + document.getElementById('hr113').style.top.replace('px','')) - eval('' + document.getElementById('hr110').style.top.replace('px',''))) / yint);
if (xisneeded) { xint=oneupx; xfactor=eval(Math.abs(eval('' + document.getElementById('hr42').style.left.replace('px','')) - eval('' + document.getElementById('hr41').style.left.replace('px',''))) / oneupx); }
if (yisneeded) { yint=oneupy; yfactor=eval(Math.abs(eval('' + document.getElementById('hr113').style.top.replace('px','')) - eval('' + document.getElementById('hr110').style.top.replace('px',''))) / oneupy); }

document.getElementById('hr53').title=texttoo(53,'(0,0)');


document.getElementById('hr42').title=texttoo(42,'(' + eval(-xint * 1) + ',0)');
document.getElementById('hr41').title=texttoo(41,'(' + eval(-xint * 2) + ',0)');
document.getElementById('hr30').title=texttoo(30,'(' + eval(-xint * 3) + ',0)');
document.getElementById('hr29').title=texttoo(29,'(' + eval(-xint * 4) + ',0)');
document.getElementById('hr18').title=texttoo(18,'(' + eval(-xint * 5) + ',0)');
document.getElementById('hr17').title=texttoo(17,'(' + eval(-xint * 6) + ',0)');
document.getElementById('hr5').title=texttoo(5,'(' + eval(-xint * 7) + ',0)');
document.getElementById('hr4').title=texttoo(4,'(' + eval(-xint * 8) + ',0)');
document.getElementById('hr6').title=texttoo(6,'(' + eval(-xint * 9) + ',0)');

document.getElementById('hr113').title=texttoo(113,'(0,' + eval(-yint * 1) + ')');
document.getElementById('hr110').title=texttoo(110,'(0,' + eval(-yint * 2) + ')');
document.getElementById('hr114').title=texttoo(114,'(0,' + eval(-yint * 3) + ')');
document.getElementById('hr166').title=texttoo(166,'(0,' + eval(-yint * 4) + ')');
document.getElementById('hr170').title=texttoo(170,'(0,' + eval(-yint * 5) + ')');
document.getElementById('hr222').title=texttoo(222,'(0,' + eval(-yint * 6) + ')');
document.getElementById('hr226').title=texttoo(226,'(0,' + eval(-yint * 7) + ')');
document.getElementById('hr278').title=texttoo(278,'(0,' + eval(-yint * 8) + ')');
document.getElementById('hr282').title=texttoo(282,'(0,' + eval(-yint * 9) + ')');


document.getElementById('hr282').click();
document.getElementById('hr53').click(); // (0,0)
document.getElementById('hr6').click();
document.getElementById('hr53').click();
document.getElementById('ashare').style.display='inline-block';
} else {
//alert('' + xdiff + ',' + ydiff);
//if (Math.abs(xdiff) < eval(xlen / 10) && Math.abs(ydiff) < eval(ylen / 10)) { // hr144 is (0,0)
zerozerox=eval('' + document.getElementById('hr144').style.left.replace('px',''));
zerozeroy=eval('' + document.getElementById('hr144').style.top.replace('px',''));
xint=Math.max(eval(maxx / 5), eval(-minx / 5));
yint=Math.max(eval(maxy / 5), eval(-miny / 5));
//alert('' + xint + ',' + yint);
cintx='' + Math.floor(xint);
cinty='' + Math.floor(yint);
oneupx=eval(eval('' + cintx.substring(0,1)) + 1);
oneupy=eval(eval('' + cinty.substring(0,1)) + 1);

for (i=1; i<cintx.length; i++) {
if (cintx.substring(i, eval(1 + i)) != '0') { xisneeded=true; }
if (cinty.substring(i, eval(1 + i)) != '0') { yisneeded=true; }
oneupx*=10;
oneupy*=10;
}


xfactor=eval(Math.abs(eval('' + document.getElementById('hr145').style.left.replace('px','')) - eval('' + document.getElementById('hr144').style.left.replace('px',''))) / xint);
yfactor=eval(Math.abs(eval('' + document.getElementById('hr92').style.top.replace('px','')) - eval('' + document.getElementById('hr144').style.top.replace('px',''))) / yint);
if (xisneeded) { xint=oneupx; xfactor=eval(Math.abs(eval('' + document.getElementById('hr145').style.left.replace('px','')) - eval('' + document.getElementById('hr144').style.left.replace('px',''))) / oneupx); }
if (yisneeded) { yint=oneupy; yfactor=eval(Math.abs(eval('' + document.getElementById('hr92').style.top.replace('px','')) - eval('' + document.getElementById('hr144').style.top.replace('px',''))) / oneupy); }

document.getElementById('hr144').title=texttoo(144,'(0,0)');
document.getElementById('hr145').title=texttoo(145,'(' + eval(xint * 1) + ',0)');
document.getElementById('hr155').title=texttoo(155,'(' + eval(xint * 2) + ',0)');
document.getElementById('hr156').title=texttoo(156,'(' + eval(xint * 3) + ',0)');
document.getElementById('hr166').title=texttoo(166,'(' + eval(xint * 4) + ',0)');
document.getElementById('hr167').title=texttoo(167,'(' + eval(xint * 5) + ',0)');
document.getElementById('hr134').title=texttoo(134,'(' + eval(-xint * 1) + ',0)');
document.getElementById('hr133').title=texttoo(133,'(' + eval(-xint * 2) + ',0)');
document.getElementById('hr122').title=texttoo(122,'(' + eval(-xint * 3) + ',0)');
document.getElementById('hr121').title=texttoo(121,'(' + eval(-xint * 4) + ',0)');
document.getElementById('hr123').title=texttoo(123,'(' + eval(-xint * 5) + ',0)');

document.getElementById('hr92').title=texttoo(92,'(0,' + eval(yint * 1) + ')');
document.getElementById('hr88').title=texttoo(88,'(0,' + eval(yint * 2) + ')');
document.getElementById('hr91').title=texttoo(91,'(0,' + eval(yint * 3) + ')');
document.getElementById('hr29').title=texttoo(29,'(0,' + eval(yint * 4) + ')');
document.getElementById('hr32').title=texttoo(32,'(0,' + eval(yint * 5) + ')');
document.getElementById('hr148').title=texttoo(148,'(0,' + eval(-yint * 1) + ')');
document.getElementById('hr200').title=texttoo(200,'(0,' + eval(-yint * 2) + ')');
document.getElementById('hr204').title=texttoo(204,'(0,' + eval(-yint * 3) + ')');
document.getElementById('hr256').title=texttoo(256,'(0,' + eval(-yint * 4) + ')');
document.getElementById('hr260').title=texttoo(260,'(0,' + eval(-yint * 5) + ')');


document.getElementById('hr167').click();
document.getElementById('hr123').click();
document.getElementById('hr32').click();
document.getElementById('hr260').click();
document.getElementById('ashare').style.display='inline-block';
//}
}
}

function toggleplaceholder() {
if (oiois != null) {
if (oiois.value == '') {
if (oiois.placeholder != origph) { //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O') {
oiois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
} else {
oiois.placeholder=altph; //'Polynomial formula y=A*x*x + B*x + C ... please comma separate A,B,C';
}
setTimeout(toggleplaceholder, 5000);
} else {
oiois=null;
}
}
}

function emailit() {
if (1 == 7 && ('' + location.hash).indexOf('=column') != -1) {
document.getElementById('aemail').href=aem + encodeURIComponent(document.URL.split('?')[0].split('#')[0] + '?blank=' + encodeURIComponent(eqplotsuffix.substring(1)) + '#blank=' + emeq + eqplotsuffix.substring(0,1));
} else {
document.getElementById('aemail').href=aem + encodeURIComponent(document.URL.split('?')[0].split('#')[0] + '#blank=' + emeq + eqplotsuffix);
}
document.getElementById('aemail').click();
}

function preplot(inans) {
return plotthis(document.getElementById('iplot'), inans, inans);
}

function plotthis(iois, ioisval, jans) {
if (minx == 0 && miny == 0 && maxx == 0 && maxy == 0) {
if (ioisval == '') { ioisval=iois.value; }
var rangeis=ioisval.split(',');
var norangeis=ioisval.replace(/\ /g,',').split(',');
if (('' + location.hash).indexOf('=column') != -1) {
if (rangeis.length >= 4) {
//alert(0);
yoffset=eval('' + rangeis[2]);
//alert(yoffset);
miny=0;
maxy=eval(eval('' + rangeis[3]) - eval('' + rangeis[2]));
//alert(maxy);
maxx=maxy;
minx=0;
numsets=eval('' + rangeis[1]);
orignumsets=numsets;
graphtitle=rangeis[0];
//document.getElementById('myh1').innerHTML=graphtitle;
if (document.getElementById('h1column')) {
document.getElementById('myh1').innerHTML='<a onclick=emailit(); style=cursor:pointer;display:none;text-decoration:underline; id=ashare>Email </a><span id=h1column style=display:inline-block;>' + document.getElementById('h1column').innerHTML + '</span> Graph ' + graphtitle;
} else {
document.getElementById('myh1').innerHTML='<a onclick=emailit(); style=cursor:pointer;display:none;text-decoration:underline; id=ashare>Email </a><span id=h1column style=display:inline-block;>Column</span> Graph ' + graphtitle;
}
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(rangeis[0]) + ',' + rangeis[1] + ',' + rangeis[2] + ',' + rangeis[3] + '|'); }
//alert(99);
plotit(minx, miny, maxx, maxy);
document.getElementById('daxes').innerHTML+='<style> hr.vertex { width:1px; height: 1px; } </style>';
dw=eval(xfactor * eval(eval(eval('' + maxx) / numsets)));
dwl=eval('' + zerozerox);
iois.value='';
oiois=iois;
iois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
setTimeout(toggleplaceholder, 5000);
}
} else {
if (rangeis.length >= 4) {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(ioisval + '|'); }
plotit(rangeis[0], rangeis[1], rangeis[2], rangeis[3]);
iois.value='';
oiois=iois;
iois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
setTimeout(toggleplaceholder, 5000);
} else if (nosrangeis.length >= 4) {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(ioisval.replace(/\ /g,',') + '|'); }
plotit(nosrangeis[0], nosrangeis[1], nosrangeis[2], nosrangeis[3]);
iois.value='';
oiois=iois;
iois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
setTimeout(toggleplaceholder, 5000);
} else {
var crangeis=jans;
if (crangeis == '') { crangeis=prompt(firstp,''); }
if (crangeis == null) { crangeis=''; }
rangeis=crangeis.split(',');
if (rangeis.length >= 4) {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(crangeis.replace(/\ /g,',') + '|'); }
plotit(rangeis[0], rangeis[1], rangeis[2], rangeis[3]);
iois.value='';
iois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
}
}


// <hr class="vertex" onmouseover="alert(this.outerHTML);" onclick="hrclick(this);" data-title="hr391" id="hr391" title="(2,193)"
// style="position:absolute;top:268.359px;left:274px;">
// <hr class="vertex" onclick="hrclick(this);" data-title="hr144" id="hr144"
// style="position:absolute;top:461.359375px;left:272px;" title="(0,0)">
// <hr class="vertex" onclick="hrclick(this);" data-title="hr92" id="hr92"
// style="position:absolute;top:408.359375px;left:272px;" title="(0,40)">
}

} else if ((ioisval.indexOf(';') != -1 || iois.value.indexOf(';') != -1)) {
if (ioisval == '') { ioisval=iois.value; }
var things=ioisval.split(';');
if (things.length >= 2 && xlabel == '' && ylabel == '') {
xlabel=things[0];
ylabel=things[1];
if (xlabel.indexOf('~') != -1) { document.getElementById('sxlabel').style.marginTop='50px'; }
document.getElementById('sxlabel').innerHTML=xlabel.replace(/\~/g,'<br>');
var yl=(ylabel + ' ').substring(0,1);
for (var iyu=1; iyu<ylabel.length; iyu++) {
yl+='<br>' + ylabel.substring(iyu, eval(1 + iyu));
}
document.getElementById('sylabel').innerHTML=yl;
//alert(0);
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(things[0]) + ';' + encodeURIComponent(things[1]) + '|'); }
//alert(10);
iois.value='';
origph=altnextph;
altph=altnextph;
iois.placeholder=altnextph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
//alert(20);
} else if (things.length >= 2 && numsets > 0) {
yvalue=things[eval(-1 + things.length)];
xvalue=ioisval.replace(';' + yvalue, ''); //.replace(/\~/g,'<br>');
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(xvalue) + ';' + yvalue + '|'); }
xvalue=ioisval.replace(';' + yvalue, '').replace(/\~/g,'<br>');
//alert(zerozerox + ' ... ' + eval(yfactor * eval(eval('' + yvalue))) + ' ... yfactor=' + yfactor + " <div title='' style='background-color:rgba(255,0,0,0.5);z-index:24;position:absolute;top:" + eval(zerozeroy + 8 - eval(eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset))))) + "px;left:" + dwl + "px;width:" + dw + "px;height:" + eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset))) + "px;'></div>");
var xl=(xvalue + ' ').substring(0,1);
for (var iiyu=1; iiyu<ylabel.length; iiyu++) {
xl+='<br>' + xvalue.substring(iiyu, eval(1 + iiyu));
}
//alert(document.getElementById('h1column').innerHTML);
if (document.getElementById('h1column').innerHTML == 'Line') { //xvalue.toLowerCase().indexOf('line') != -1) {
//alert('2:' + document.getElementById('h1column').innerHTML);
document.getElementById('h1column').innerHTML='Line';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Line'; }
hrlgcnt++;
document.getElementById('daxes').innerHTML+='<hr title="' + ylabel + ': ' + yvalue + '" class="vertex" onclick="hrclick(this);" ' + tprefix + 'title=hrlg' + hrlgcnt + ' id=hrlg' + hrlgcnt + ' style="position:absolute;top:' + eval(zerozeroy + 14 - eval(eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset))))) + 'px;left:' + eval(eval('' + dwl) + eval(eval('' + dw) / 2)) + 'px;"></hr>';
document.getElementById('daxes').innerHTML+='<b><sub style="margin-top:20px;position:absolute;left:' + eval(eval('' + dwl) + eval(eval('' + dw) / 2)) + 'px;top:' + zerozeroy + 'px;">' + xvalue + '</sub></b>';
if (orignumsets != numsets) {
//alert(connect(document.getElementById('hrlg' + lasthr), document.getElementById('hrlg' + hrlgcnt)));
//document.getElementById('daxes').innerHTML+=connect(document.getElementById('hrlg' + lasthr), document.getElementById('hrlg' + hrlgcnt));
document.getElementById('hrlg' + lasthr).click();
document.getElementById('hrlg' + hrlgcnt).click();
} //else {
//alert(' numsets=' + numsets + ' and orignumsets=' + orignumsets);
//}
lasthr=hrlgcnt;
} else {
document.getElementById('daxes').innerHTML+="<div onclick='alert(this.title);' title='" + ylabel + ": " + yvalue + "' style='background-color:" + cgcols[Math.floor(Math.random() * cgcols.length)] + ";opacity:0.5;z-index:24;position:absolute;top:" + eval(zerozeroy + 14 - eval(eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset))))) + "px;left:" + dwl + "px;width:" + dw + "px;height:" + eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset))) + "px;'></div>";
document.getElementById('daxes').innerHTML+='<b><sub style="margin-top:20px;position:absolute;left:' + dwl + 'px;top:' + zerozeroy + 'px;">' + xvalue + '</sub></b>';
}
numsets--;
if (numsets == 0) { document.getElementById('daxes').innerHTML+='<style> hr.vertex { visibility:hidden; } </style>'; }
dwl+=dw;
dwl+=5;
iois.value='';
iois.placeholder=altnextph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
}
} else {
var gradient=0.0;
var offset=0.0;
if (ioisval == '') { ioisval=iois.value; }
var things=ioisval.split(',');
//alert(ioisval + ' ... things.length=' + things.length);
if (things.length >= 3) {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(ioisval + '|'); }
var rootsy=[0,0]; // thanks to http://www.biology.arizona.edu/biomath/tutorials/quadratic/roots.html
for (var kkk=minx; kkk<=maxx; kkk+=0.05) {
//alert(eval(eval(eval('' + kkk) * eval('' + kkk) * eval('' + things[0])) + (eval('' + kkk) * eval('' + things[1])) + eval('' + things[2]))));
if (eval(1.0 * eval('' + kkk)) > maxx || eval(1.0 * eval('' + kkk)) < minx) {
hrcnt=hrcnt;
} else if (eval(1.0 * eval(eval('' + kkk) + ',' + eval(eval(eval('' + kkk) * eval('' + kkk) * eval('' + things[0])) + (eval('' + kkk) * eval('' + things[1])) + eval('' + things[2]))) + eval('' + offset)) > maxy || eval(1.0 * eval(eval('' + kkk) + ',' + eval(eval(eval('' + kkk) * eval('' + kkk) * eval('' + things[0])) + (eval('' + kkk) * eval('' + things[1])) + eval('' + things[2]))) + eval('' + offset)) < miny) {
hrcnt=hrcnt;
} else if (eval('' + kkk) != 0 && Math.abs(eval(eval(eval('' + kkk) * eval('' + kkk) * eval('' + things[0])) + (eval('' + kkk) * eval('' + things[1])) + eval('' + things[2]))) > 0.05) {
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + things[0] + '*x*x ' + ('+' + things[1]).replace('+-','-').replace('-','- ') + '*x ' + ('+' + things[2]).replace('+-','-').replace('-','- ') + ' plot point (' + eval('' + kkk) + ',' + eval(eval(eval('' + kkk) * eval('' + kkk) * eval('' + things[0])) + (eval('' + kkk) * eval('' + things[1])) + eval('' + things[2])) + ')" style="border-color:orange;position:absolute;top:' + eval(zerozeroy - eval(yfactor * eval(eval('' + kkk) + ',' + eval(eval(eval('' + kkk) * eval('' + kkk) * eval('' + things[0])) + (eval('' + kkk) * eval('' + things[1])) + eval('' + things[2]))) + eval('' + offset))) + 'px;left:' + eval(zerozerox + eval(xfactor * eval('' + kkk))) + 'px;"></hr>';
}
}
if (eval('' + things[0]) != 0) {
//alert(eval(2.0 * eval(eval('' + things[0]))) + ' ... ' + eval(eval(eval('' + things[1]) * eval('' + things[1])) - eval(4.0 * eval('' + things[0]) * eval('' + things[2]))));
if (eval(eval('' + things[1]) * eval('' + things[1]) - eval(4.0 * eval('' + things[0]) * eval('' + things[2]))) >= 0) {
rootsy[0]=eval(eval(eval(('-' + things[1]).replace('--','')) + Math.sqrt(eval(eval(eval('' + things[1])) * eval(eval('' + things[1])) - eval(4.0 * eval(eval('' + things[0])) * eval(eval('' + things[2])))))) / eval(2.0 * eval(eval('' + things[0]))));
rootsy[1]=eval(eval(eval(('-' + things[1]).replace('--','')) - Math.sqrt(eval(eval(eval('' + things[1])) * eval(eval('' + things[1])) - eval(4.0 * eval(eval('' + things[0])) * eval(eval('' + things[2])))))) / eval(2.0 * eval(eval('' + things[0]))));
//alert('' + rootsy[0] + ' ' + rootsy[1]);
}
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + things[0] + '*x*x ' + ('+' + things[1]).replace('+-','-').replace('-','- ') + '*x ' + ('+' + things[2]).replace('+-','-').replace('-','- ') + ' plot point (' + eval('' + rootsy[0]) + ',0)" style="z-index:234;border-color:pink;position:absolute;left:' + eval(zerozerox + eval(xfactor * eval(eval('' + rootsy[0])))) + 'px;top:' + eval('' + zerozeroy) + 'px;"></hr>';
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + things[0] + '*x*x ' + ('+' + things[1]).replace('+-','-').replace('-','- ') + '*x ' + ('+' + things[2]).replace('+-','-').replace('-','- ') + ' plot point (' + eval('' + rootsy[1]) + ',0)" style="z-index:234;border-color:pink;position:absolute;left:' + eval(zerozerox + eval(xfactor * eval(eval('' + rootsy[1])))) + 'px;top:' + eval('' + zerozeroy) + 'px;"></hr>';
}
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + things[0] + '*x*x ' + ('+' + things[1]).replace('+-','-').replace('-','- ') + '*x ' + ('+' + things[2]).replace('+-','-').replace('-','- ') + ' plot point (0,' + eval('' + things[2]) + ')" style="z-index:234;border-color:pink;position:absolute;left:' + eval(zerozerox) + 'px;top:' + eval(zerozeroy - eval(yfactor * eval(eval('' + things[2])))) + 'px;"></hr>';
iois.value='';
iois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
oiois=iois;
setTimeout(toggleplaceholder, 5000);


} else if (things.length >= 1) {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(ioisval + '|'); }
gradient=eval('' + things[0]);
offset=eval('' + things[1]);
// y=6x + 12;
if (gradient != 0) {
//alert('' + xfactor + ' ' + yfactor);
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + gradient + '*x ' + ('+' + offset).replace('+-','-').replace('-','- ') + ' plot point (' + eval(-offset / eval('' + gradient)) + ',0)" style="z-index:134;border-color:pink;position:absolute;top:' + zerozeroy + 'px;left:' + eval(zerozerox - eval(xfactor * eval(offset / eval('' + gradient)))) + 'px;"></hr>';
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + gradient + '*x ' + ('+' + offset).replace('+-','-').replace('-','- ') + ' plot point (0,' + eval('' + offset) + ')" style="z-index:134;border-color:pink;position:absolute;top:' + eval(zerozeroy - eval(yfactor * eval('' + offset))) + 'px;left:' + zerozerox + 'px;"></hr>';

for (var kkk=minx; kkk<=maxx; kkk+=eval(eval('' + xlen) / Math.floor((80 * Math.abs(eval('' + gradient)))) )) {
if (eval(eval(eval('' + kkk) * eval('' + gradient)) + eval('' + offset)) > maxx || eval(eval(eval('' + kkk) * eval('' + gradient)) + eval('' + offset)) < minx) {
hrcnt=hrcnt;
} else if (eval('' + kkk) > maxy || eval('' + kkk) < miny) {
hrcnt=hrcnt;
} else {
hrcnt++;
document.getElementById('hrs').innerHTML+='<hr class="vertex" onclick="alert(this.title);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' title="y=' + gradient + '*x ' + ('+' + offset).replace('+-','-').replace('-','- ') + ' plot point (' + eval('' + kkk) + ',' + eval(eval(eval('' + kkk) * eval('' + gradient)) + eval('' + offset)) + ')" style="position:absolute;top:' + eval(zerozeroy - eval(yfactor * eval(eval(eval('' + kkk) * eval('' + gradient)) + eval('' + offset)))) + 'px;left:' + eval(zerozerox + eval(xfactor * eval('' + kkk))) + 'px;"></hr>';
}
}
iois.value='';
iois.placeholder=origph; //'Line formula y=Gx + O ... G is gradient, O is Y-offset ... please comma separate G,O';
oiois=iois;
setTimeout(toggleplaceholder, 5000);

}
}
}
return '';
}

function draw_hrs() {
var inqis='';
if (('' + location.hash).indexOf('=column') != -1) {
emeq='column';
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Plot%20Axes%','Column%20Graph%');
xlabel='';
ylabel='';
firstp='Please enter Title, Number of data sets, Y-axis minimum, Y-axis maximum';
}
aem=document.getElementById('aemail').href;
wourx=location.search.split('ourx=')[1] ? decodeURIComponent(location.search.split('ourx=')[1].split('&')[0]) : '';
if (('' + location.hash + '~').indexOf('blank') != -1 && ('' + location.hash + '~').indexOf('blank~') == -1) {
wourx=('' + location.hash + '~').split('blank')[1].split('~')[0];
}
lesscourx=wourx;
if (('' + location.hash).indexOf('hangman') != -1 || ('' + location.hash).indexOf('mathsgrid') != -1 || ('' + location.hash).indexOf('reveal') != -1) {
location.hash=location.hash.replace('mathsgrid','hangman').replace('reveal','hangman#hangman');
if (('' + location.hash).indexOf('.') != -1) {
goes=eval(('' + location.hash).split('.')[1]);
score=eval(('' + location.hash).split('.')[0].split('hangman')[1].replace('-',''));
} else if (document.URL.indexOf('?wording=') != -1 && ('' + location.hash).split('angma').length > 3) { // && ('' + location.hash).indexOf('hangman0.0') != -1) { // && ('' + location.hash).indexOf('00.0') != -1) {
sosize(' '); // sosize('word_wrap.jpg');
} else if (document.URL.indexOf('?wording=') != -1 && ('' + location.hash).split('angma').length > 2) { // && ('' + location.hash).indexOf('hangman0.0') != -1) { // && ('' + location.hash).indexOf('00.0') != -1) {
document.getElementById('myh1').innerHTML=' ';
document.getElementById('myh3').innerHTML=' ';
document.getElementById('myh4').innerHTML=' ';
document.getElementById('dhangman').innerHTML+="<iframe name=iback id=iback style='background-color:transparent;z-index:23;position:absolute;top:200px;left:0px;width:580px;height:100vh;' src=//www.rjmprogramming.com.au/HTMLCSS/user_of_signature_signature.html?rand=" + Math.floor(Math.random() * 123456) + "></iframe>";
document.getElementById('dhangman').innerHTML+="<iframe name=ifront id=ifront style='background-color:transparent;z-index:22;position:absolute;top:0px;left:0px;width:100%;height:100vh;' src=//www.rjmprogramming.com.au/HTMLCSS/square_hr_tracing.htm#hangman-0.0></iframe>";
document.getElementById('dhangman').innerHTML+="<div id=dback title='' style='background-color:transparent;z-index:24;position:absolute;top:200px;left:580px;'></div>";
//return;
}
}
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
document.getElementById('myh1').innerHTML='Maths Grid Paper';
}

// if (('' + location.hash).indexOf('blank') == -1 && ('' + location.hash).indexOf('square') == -1 && ('' + location.hash).indexOf('grid') == -1) {

if (document.URL.indexOf('?') == -1 && ('' + location.hash).indexOf('blank') == -1 && ('' + location.hash).indexOf('hangman') == -1 && ('' + location.hash).indexOf('square') == -1 && ('' + location.hash).indexOf('grid') == -1) { pickone(inqis); } else if (document.URL.indexOf('?') == -1 && (('' + location.hash).indexOf('blank') != -1 || ('' + location.hash).indexOf('hangman') != -1 || ('' + location.hash).indexOf('square') != -1 || ('' + location.hash).indexOf('grid') != -1)) { inqis=' '; pickone(inqis); }
wording=location.search.split('wording=')[1] ? decodeURIComponent(location.search.split('wording=')[1].split('&')[0]) : ' ';
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
wording='Maths Grid Paper';
}
inanswer=location.search.split('answer=')[1] ? decodeURIComponent(location.search.split('answer=')[1].split('&')[0]) : inqis;
var inquestion=location.search.split('question=')[1] ? ina(decodeURIComponent(location.search.split('question=')[1].split('&')[0])) : '';
var tds=document.getElementsByTagName('td');
var fhr=0, vdval='', thisv='', into='hrs', defvdval='', toff=6, loff=-2;
dval='';
for (var itds=0; itds<tds.length; itds++) {
tds[itds].id='td' + eval(1 + itds);
if (('' + location.hash).indexOf('grid') != -1) { into='td' + eval(1 + itds); }
if (('' + location.hash).indexOf('blank') != -1 || ('' + location.hash).indexOf('hangman') != -1 || ('' + location.hash).indexOf('square') != -1 || ('' + location.hash).indexOf('grid') != -1) {
if (('' + location.hash).indexOf('square') != -1) { if (eval(1 + itds) > 9) { document.getElementById('spout').innerHTML+="<style> #td" + eval(1 + itds) + "::after { content:'\\00003" + Math.floor(eval(eval(1 + itds) / 10)) + "\\0020e3\\00003" + eval(eval(1 + itds) % 10) + "\\0020e3'; } </style>"; } else { document.getElementById('spout').innerHTML+="<style> #td" + eval(1 + itds) + "::after { content:'\\00003" + eval(eval(1 + itds) % 10) + "\\0020e3'; } </style>"; } defvdval="visibility:hidden;"; tds[itds].style.border='1px solid red'; }
if (('' + location.hash).indexOf('grid') != -1) { tds[itds].style.border='1px solid brown'; }
tds[itds].onclick=function(event) { lastsquare=eval(('' + this.id).replace('td','')); goes++; if (lastsquare == sqchoice) { score++; } if (('' + location.hash).indexOf('square') != -1) { picksq(); } else if (('' + location.hash).indexOf('grid') != -1) { gridinfo(' in square number ' + lastsquare); } };
}
thisrect=tds[itds].getBoundingClientRect();
//squares.push(('' + thisrect.left).replace('px','') + "," + ('' + thisrect.top).replace('px','') + ";" + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px',''))));
//alert(('' + thisrect.left) + ' ' + ('' + thisrect.top) + ' ' + ('' + thisrect.width) + ' ' + ('' + thisrect.height) + ' ' + squares[0]);

fhr=hrcnt;

//vertices.push(('' + thisrect.left).replace('px','') + "," + ('' + thisrect.top).replace('px',''));
vdval=defvdval;
thisv=';' + ourmathround(eval(('' + thisrect.left).replace('px',''))) + "," + ourmathround(eval(('' + thisrect.top).replace('px',''))) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + thisrect.top + 'px;left:' + thisrect.left + 'px;"></hr>';
hrcnt++;


//vertices.push(('' + thisrect.left).replace('px','') + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px',''))));
vdval=defvdval;
thisv=';' + ourmathround(('' + thisrect.left).replace('px','')) + "," + ourmathround(eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')))) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px',''))) + 'px;left:' + thisrect.left + 'px;"></hr>';
hrcnt++;

//vertices.push(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px',''))));
vdval=defvdval;
thisv=';' + ourmathround(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')))) + "," + ourmathround(eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')))) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px',''))) + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + 'px;"></hr>';
hrcnt++;

//vertices.push(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + "," + ('' + thisrect.top).replace('px',''));
vdval=defvdval;
thisv=';' + ourmathround(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')))) + "," + ourmathround(('' + thisrect.top).replace('px','')) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
//if (hrcnt == 134 || hrcnt == 146) { alert(vdval + ' hr' + hrcnt + ': ' + thisv + ' ... ' + vstr); } // ?
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + thisrect.top + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + 'px;"></hr>';
hrcnt++;

//

//vertices.push(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2) + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2));
vdval=defvdval;
thisv=';' + ourmathround(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2)) + "," + ourmathround(eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2)) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2) + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2) + 'px;"></hr>';
hrcnt++;


//vertices.push(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 1) + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2));
vdval=defvdval;
thisv=';' + ourmathround(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 1)) + "," + ourmathround(eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2)) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2) + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 1) + 'px;"></hr>';
hrcnt++;



//vertices.push(('' + thisrect.left).replace('px','') + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2));
vdval=defvdval;
thisv=';' + ourmathround(('' + thisrect.left).replace('px','')) + "," + ourmathround(eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2)) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 2) + 'px;left:' + thisrect.left + 'px;"></hr>';
hrcnt++;



//vertices.push(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2) + "," + ('' + thisrect.top).replace('px',''));
vdval=defvdval;
thisv=';' + ourmathround(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2)) + "," + ourmathround(('' + thisrect.top).replace('px','')) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + thisrect.top + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2) + 'px;"></hr>';
hrcnt++;


//vertices.push(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2) + "," + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 1));
vdval=defvdval;
thisv=';' + ourmathround(eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2)) + "," + ourmathround(eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 1)) + ';';
if (vstr.indexOf(thisv) != -1) { vdval="visibility:hidden;"; } else { vstr+=vplus(thisv.substring(1)); }
document.getElementById(into).innerHTML+='<hr class="vertex' + maybenocont(vdval) + '" onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + vdval + 'position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px','')) / 1) + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px','')) / 2) + 'px;"></hr>';
hrcnt++;

if (eval(itds % 5) == 0) {
dval='';
if (inquestion != '') {
if (parent.document != document) {
if (parent.document.getElementById('myh1')) {
dval=dval;
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
document.getElementById('myh1').innerHTML='Maths Grid Paper';
} else {
document.getElementById('myh1').innerHTML='Chinese Brain Twisters Answer';
}
} else {
if (('' + location.hash).indexOf('blank') != -1 || ('' + location.hash).indexOf('hangman') != -1 || ('' + location.hash).indexOf('square') != -1 || ('' + location.hash).indexOf('grid') != -1) {
document.getElementById('myh1').innerHTML=wording;
//wording=' ';
} else {
if (document.getElementById('myh3').innerHTML.indexOf(' ... ') == -1) { document.getElementById('myh3').innerHTML+=' ... Thanks to Chinese Brain Twisters by Baifang ISBN: 0-471-59505-5'; }
document.getElementById('reveal').style.display='block';
document.getElementById('skip').style.display='block';
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
document.getElementById('myh1').innerHTML='Maths Grid Paper';
} else {
document.getElementById('myh1').innerHTML='Chinese Brain Twisters Question';
}
}
}
} else {
if (('' + location.hash).indexOf('blank') != -1 || ('' + location.hash).indexOf('hangman') != -1 || ('' + location.hash).indexOf('square') != -1 || ('' + location.hash).indexOf('grid') != -1) {
document.getElementById('myh1').innerHTML=wording;
//wording=' ';
} else {
if (document.getElementById('myh3').innerHTML.indexOf(' ... ') == -1) { document.getElementById('myh3').innerHTML+=' ... Thanks to Chinese Brain Twisters by Baifang ISBN: 0-471-59505-5'; }
document.getElementById('reveal').style.display='block';
document.getElementById('skip').style.display='block';
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
document.getElementById('myh1').innerHTML='Maths Grid Paper';
} else {
document.getElementById('myh1').innerHTML='Chinese Brain Twisters Question';
}
}
}
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
document.getElementById('qh4').innerHTML='Maths Grid Paper';
} else {
//alert('' + location.hash);
if (('' + location.hash).indexOf('=plot') != -1) {
document.getElementById('myh1').innerHTML='<a onclick=emailit(); style=cursor:pointer;display:none;text-decoration:underline; id=ashare>Email </a>Plot Axes - Linear or Polynomial Equation';
document.getElementById('qh4').innerHTML=wording.replace('Vertex Pointing' + osft + ' Game','Plot Axes ... <input style="width:460px;" type=text placeholder="' + firstp + '" onblur=plotthis(this,blk,blk); value="" id=iplot></input>');
document.getElementById('hr2').style.display='none';
document.getElementById('hr8').style.display='none';
document.getElementById('hr1').style.display='none';
document.getElementById('myh4').innerHTML=' ';
} else if (('' + location.hash).indexOf('=column') != -1) {
emeq='column';
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Plot%20Axes%','Column%20Graph%');
document.getElementById('myh1').innerHTML='<a onclick=emailit(); style=cursor:pointer;display:none;text-decoration:underline; id=ashare>Email </a><span id=h1column style=display:inline-block;>Column</span> Graph';
document.getElementById('qh4').innerHTML=wording.replace('Vertex Pointing' + osft + ' Game','<select onchange=changegtypeto(this.value); id=graphsel style=display:inline-block;><option value=Column>Column</option><option value=Line>Line</option></select> Graph ... <input style="width:460px;" type=text placeholder="' + firstp + '" onblur=plotthis(this,blk,blk); value="" id=iplot></input>');
document.getElementById('hr2').style.display='none';
document.getElementById('hr8').style.display='none';
document.getElementById('hr1').style.display='none';
document.getElementById('myh4').innerHTML=' <span id=h1col style=display:inline-block;>Column</span> Graph';

origph='Enter X-axis Label; Y-axis Label (numerical)';
altph=origph;
altnextph='Enter X-axis Value (~ is line feed); Y-axis Value';


} else {
document.getElementById('qh4').innerHTML=wording.replace('Vertex Pointing' + osft + ' Game','Vertex Pointing' + osft + ' Game ... On Each Set of 4 a Bezier Curve is Shown');
}
}
if (inquestion.indexOf('r') == -1) { inquestion='hr' + inquestion.replace(/\,/g,',hr'); }
if ((inquestion + ',').indexOf('r' + hrcnt + ',') == -1 && ('' + location.hash).indexOf('grid') == -1) { dval="display:none;visibility:hidden;"; }
}
//document.getElementById(into).innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical style="' + dval + 'position:absolute;top:' + thisrect.top + 'px;left:' + thisrect.left + 'px;"></hr>';
if (!isIE) {
//alert(document.getElementById('hr' + fhr).outerHTML + ' to ' + document.getElementById('hr' + eval(1 + eval('' + fhr))).outerHTML + ' is ' + connect(document.getElementById('hr' + fhr), document.getElementById('hr' + eval(1 + eval('' + fhr)))).replace('<div ','<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical '));
document.getElementById(into).innerHTML+=connect(document.getElementById('hr' + fhr), document.getElementById('hr' + eval(1 + eval('' + fhr)))).replace('<div ','<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical ');
} else {
document.getElementById(into).innerHTML+='<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical style="' + dval + 'position:absolute;top:' + eval(toff + eval('' + thisrect.top)) + 'px;left:' + eval(loff + eval('' + thisrect.left)) + 'px;"></div>';
}
hrcnt++;
}
if (itds < 5) {
dval='';
if (inquestion != '') {
if ((inquestion + ',').indexOf('r' + hrcnt + ',') == -1 && ('' + location.hash).indexOf('grid') == -1) { dval="display:none;visibility:hidden;"; }
}
document.getElementById(into).innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + dval + 'width:100px;position:absolute;top:' + thisrect.top + 'px;left:' + thisrect.left + 'px;"></hr>';
hrcnt++;
}
//document.getElementById(into).innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical style="' + dval + 'position:absolute;top:' + thisrect.top + 'px;left:' + eval(eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + 'px;"></hr>';
dval='';
if (inquestion != '') {
if ((inquestion + ',').indexOf('r' + hrcnt + ',') == -1 && ('' + location.hash).indexOf('grid') == -1) { dval="display:none;visibility:hidden;"; }
}
if (!isIE) {
//alert(document.getElementById('hr' + fhr).outerHTML + ' to ' + document.getElementById('hr' + eval(1 + eval('' + fhr))).outerHTML + ' is ' + connect(document.getElementById('hr' + fhr), document.getElementById('hr' + eval(1 + eval('' + fhr)))).replace('<div ','<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical '));
document.getElementById(into).innerHTML+=connect(document.getElementById('hr' + eval(3 + eval('' + fhr))), document.getElementById('hr' + eval(2 + eval('' + fhr)))).replace('<div ','<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical ');
} else {
document.getElementById(into).innerHTML+='<div onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' class=vertical style="' + dval + 'position:absolute;top:' + eval(toff + eval('' + thisrect.top)) + 'px;left:' + eval(loff + eval(('' + thisrect.left).replace('px','')) + eval(('' + thisrect.width).replace('px',''))) + 'px;"></div>';
}
hrcnt++;
dval='';
if (inquestion != '') {
if ((inquestion + ',').indexOf('r' + hrcnt + ',') == -1 && ('' + location.hash).indexOf('grid') == -1) { dval="display:none;visibility:hidden;"; }
}
document.getElementById(into).innerHTML+='<hr onclick="hrclick(this);" ' + tprefix + 'title=hr' + hrcnt + ' id=hr' + hrcnt + ' style="' + dval + 'width:100px;position:absolute;top:' + eval(eval(('' + thisrect.top).replace('px','')) + eval(('' + thisrect.height).replace('px',''))) + 'px;left:' + thisrect.left + 'px;"></hr>';
hrcnt++;

dval='';

}
onld=false;
dval='';

if (('' + location.hash).indexOf('grid') != -1) { document.getElementById('mytable').style.marginTop='8px'; document.getElementById('mytable').style.marginLeft='3px'; }

if (inquestion.indexOf('.') != -1) {
var xinas=inquestion.split(',');
for (ix=0; ix<xinas.length; ix++) {
if (xinas[ix].indexOf('.') != -1) {
hrclick(document.getElementById('hr' + xinas[ix].split('.')[0].replace('-','').replace('dr','').replace('hr','')));
hrclick(document.getElementById('hr' + xinas[ix].split('.')[1].replace('-','').replace('dr','').replace('hr','')));
}
}
}

document.getElementById('myh3').innerHTML = document.getElementById('myh3').innerHTML.replace(" - ","<select id=selmode style=width:35px; onclick=socwc(event); ontouchmove=socwc(event); onmousemove=socwc(event); onchange=selc(this.value);><option value=" + document.URL.split('#')[0] + location.hash + "> - </option><option value=" + (document.URL.split('#')[0].split('?')[0] + 'l').replace('.htmll','.html') + ">Tracing Square Line Drawing</option> <option value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + ">Chinese Brain Twisters</option><option id=paxes value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#blank=plot>Plot Axes - Linear or Polynomial Equation</option><option id=columns value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#blank=column>Column or Line Graph</option><option id=iosos value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#blank>Vertex Pointing or SOS (for two) Game</option><option value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#square>Square Pointing Game</option><option value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#grid>Grid Pointing Game</option><option value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#hangman>Hangman Game</option><option value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#mathsgrid#hangman>Maths Grid Paper</option><option value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#reveal#hangman>Image Reveal Game</option></select>");

inas=inanswer.split(',');
if (inas.length > 0) {
setTimeout(acl, 2000);
}

if (wourx != '' && wourx.indexOf('=column') == -1 && wourx.indexOf('=plot') == -1 && document.getElementById('selmode')) {
var rectw=document.getElementById('selmode').getBoundingClientRect();
//alert(wourx);
//alert(eval(eval('' + wourx) - eval('' + rectw.left)));
//document.title+=' ' + eval(eval('' + wourx) - eval('' + rectw.left));
if (eval(eval('' + wourx) - eval('' + rectw.left)) <= 20) { wourx=''; }
}
if (wourx != '' && wourx.indexOf('=column') == -1 && wourx.indexOf('=plot') == -1 && (' ' + location.hash).indexOf('blank') != -1) {
osft=' or SOS (for two)';
document.getElementById('qh4').innerHTML=document.getElementById('qh4').innerHTML.replace(' Game', osft + ' Game');
//alert(wourx);
setTimeout(presosize,2000);
}

sqorig=document.getElementById('qh4').innerHTML;

if (('' + location.hash).indexOf('square') != -1) { picksq(); }


if ((('' + location.hash).indexOf('hangman0.0') != -1 || ('' + location.hash).indexOf('hangman00.0') != -1) && document.URL.indexOf('?wording=') != -1) {
sqorig=sqorig; //alert('Grid Paper');
} else if (('' + location.hash).indexOf('hangman') != -1) {
playhangman();
}

//alert(document.getElementById('qh4').innerHTML);
sqorig=sqorig.replace('Pointing Game', 'Pointing <a onclick="osft=' + "'" + ' or SOS (for two)=' + "'" + '; sosize(' + "''" + ');" style=text-decoration:underline;cursor:pointer;>or SOS (for two)</a> Game');
document.getElementById('qh4').innerHTML=document.getElementById('qh4').innerHTML.replace('Pointing Game', 'Pointing <a onclick="osft=' + "'" + ' or SOS (for two)=' + "'" + '; sosize(' + "''" + ');" style=text-decoration:underline;cursor:pointer;>or SOS (for two)</a> Game');
//alert(document.getElementById('qh4').innerHTML);

if (('' + location.hash).replace(/\%7C/g,'|').indexOf('=plot|') != -1) {
//alert(0);
var pbits=('' + location.hash).replace(/\%7C/g,'|').split('|');
for (var ipbits=1; ipbits<pbits.length; ipbits++) {
//alert(ipbits);
if (pbits[ipbits].indexOf(',') != -1) {
//alert(pbits[ipbits]);
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=(pbits[ipbits] + '|');
if (!document.getElementById('ashare')) {
document.getElementById('myh1').innerHTML='<a onclick=emailit(); style=cursor:pointer;display:inline-block;text-decoration:underline; id=ashare>Email </a>Plot Axes - Linear or Polynomial Equation';
} else {
document.getElementById('ashare').style.display='inline-block';
}
preplot(pbits[ipbits]);
}
}
} else if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('=column|') != -1) {
if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('|Line|') != -1) {
document.getElementById('h1column').innerHTML='Line';
document.getElementById('graphsel').value='Line';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Line'; }
}
if (document.getElementById('h1column').innerHTML == 'Line') {
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Line%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Line|');
} else {
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Line%20Graph%','Column%20Graph%');
aem=document.getElementById('aemail').href;
}
//alert(0);
// http://localhost:8888/square_hr_tracing.htm#blank=column|ngfh,2,234,675|Country;Currency|Great%3Cbr%3EBritain;456|hgfjhfg;427|
var pbits=('' + location.hash + (location.search.split('blank=')[1] ? decodeURIComponent(location.search.split('blank=')[1].split('&')[0]) : '')).replace(/\%7C/g,'|').replace(/\%3Cbr\%3E/g,'~').replace(/\%7E/g,'~').split('|');
for (var ipbits=1; ipbits<pbits.length; ipbits++) {
//alert(ipbits);
//alert(pbits[ipbits]);
if (decodeURIComponent(pbits[ipbits]).indexOf(',') != -1 || decodeURIComponent(pbits[ipbits]).indexOf(';') != -1) {
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=(pbits[ipbits] + '|');
if (!document.getElementById('ashare')) {
document.getElementById('myh1').innerHTML='<a onclick=emailit(); style=cursor:pointer;display:inline-block;text-decoration:underline; id=ashare>Email </a><span id=h1column style=display:inline-block;>Column</span> Graph';
} else {
document.getElementById('ashare').style.display='inline-block';
}
preplot(decodeURIComponent(pbits[ipbits]));
//alert(pbits[ipbits]);
} else if (decodeURIComponent(pbits[ipbits]).toLowerCase() == 'line') {
document.getElementById('h1column').innerHTML='Line';
document.getElementById('graphsel').value='Line';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Line'; }
//emeq='line';
}
}
} else if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('|Line|') != -1) {
document.getElementById('h1column').innerHTML='Line';
document.getElementById('graphsel').value='Line';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Line'; }
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Line%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Line|');
}




}

function changegtypeto(tv) {
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=(tv + '|');
document.getElementById('graphsel').value=tv;
document.getElementById('h1column').innerHTML=tv;
if (tv == 'Line') {
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Line%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Line|');
} else {
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Line%20Graph%','Column%20Graph%');
aem=document.getElementById('aemail').href;
}
if ( document.getElementById('h1col')) { document.getElementById('h1col').innerHTML=tv; }
if (tv != 'Line' && decodeURIComponent(('' + location.hash)).indexOf('|Line|') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + ('' + location.hash).replace(/\%7CLine\%7C/g,'%7CColumn%7C').replace(/\|Line\|/g,'|Column|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + ('' + location.hash).replace(/\%7CLine\%7C/g,'%7CColumn%7C').replace(/\|Line\|/g,'|Column|');
}
} else if (tv != 'Column' && decodeURIComponent(('' + location.hash)).indexOf('|Column|') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + ('' + location.hash).replace(/\%7CColumn\%7C/g,'%7CLine%7C').replace(/\|Column\|/g,'|Line|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + ('' + location.hash).replace(/\%7CColumn\%7C/g,'%7CLine%7C').replace(/\|Column\|/g,'|Line|');
}
} else if (tv != 'Column' && decodeURIComponent(('' + location.hash)).indexOf('=column') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + ('' + location.hash + '|' + tv + '|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + ('' + location.hash + '|' + tv + '|');
}
}
}

function presosize() {
sosize('');
}

function myguess() {
var myg=prompt('Okay, Player' + eval(3 - thisplayer) + ', what is your guess regarding the contents of the image as it is being revealed?', '');
if (myg == null) { myg=''; }
var mygx=confirm('Okay, Player' + thisplayer + ', is Player' + eval(3 - thisplayer) + ' guess of ' + myg + ' a correct guess?');
if (mygx) {
//alert('score' + eval(3 - thisplayer) + '+=' + availablescore);
eval('sparescore=eval(score' + eval(3 - thisplayer) + '.split("(")[1].split(")")[0])');
sparescore+=availablescore
eval('score' + eval(3 - thisplayer) + '=" (' + sparescore + ')"');
//document.getElementById('myh4').innerHTML+=' ... image of Player1' + score1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player2' + score2;
thisplayer=eval(3 - thisplayer);
sosize(' '); // sosize('word_wrap.jpg');
}
}

function readUBlob(inimis,xis,yis) {
if (inimis.trim() != '') {
document.getElementById('mytable').style.background="url('" + inimis.trim() + "')";
document.getElementById('dpf').style.display='none';
}
}

function process(infilecontents) {
if (infilecontents != null) {
//alert(99);
document.getElementById('mytable').style.backgroundImage="URL('data:image/png;base64," + btoa(infilecontents) + "')";
//alert(999);
document.getElementById('dpf').style.display='none';
//alert(9999);
}
}

function readBlob(opt_startByte, opt_stopByte) {

//alert(33);
var files = document.getElementById("file").files;
//alert(333);
if (!files.length) {
alert("Please select a file!");
return;
} else {
w = files[0].name;
//document.getElementById("fil").value = w;
}

var file = files[0];
var start = parseInt(opt_startByte) || 0;
var stop = parseInt(opt_stopByte) || file.size - 1;

//alert(stop);

var reader = new FileReader();

// If we use onloadend, we need to check the readyState.
reader.onloadend = function(evt) {
if (evt.target.readyState == FileReader.DONE) { // DONE == 2
//alert(77);
process(evt.target.result);
//alert(777);
}
};

var blob = file.slice(start, stop + 1);
reader.readAsBinaryString(blob);
}

function eh() {
document.querySelector('.readBytesButtons').addEventListener('click', function(evt) {
//alert(2);
if (evt.target.tagName.toLowerCase() == 'button') {
var startByte = evt.target.getAttribute('data-startbyte');
var endByte = evt.target.getAttribute('data-endbyte');
//alert(22);
readBlob(startByte, endByte);
//alert(222);
}
}, false);
}

function sosize(inim) {
//var hors=[], vers=[], diags=[];
var itds=0; tds=document.getElementsByTagName('td');
var sqsi=0, ioffset=0, bextras='', s1=0, s2=0, ainim=inim;
if (inim != '') {
availablescore=100;
if (inim.trim() != '') {
inim=prompt('Okay, Player' + thisplayer + ' what is your image (to be revealed by Player' + eval(3 - thisplayer) + ') as a URL? Else if you answer with a blank you can browse for the image file.', inim);
}
eval('s1=score' + thisplayer);
eval('s2=score' + eval(3 - thisplayer));
//document.title+=' x';
document.getElementById('myh4').innerHTML='Enjoy your two player game of Image Revealing';
//document.title+=' y';
if (inim.trim() != '' && ainim.trim() != '') {
document.getElementById('myh4').innerHTML+=' ... image <div id=dpf style=display:NONE;><input style=display:inline-block; id=file type=file name=file></input><span class=readBytesButtons><button style=display:none; data-endbyte=4 data-startbyte=0>1-5</button><button style=display:none; data-endbyte=14 data-startbyte=5>6-15</button><button style=display:none; data-endbyte=7 data-startbyte=6>7-8</button><button name=button id=button value=Process data-endbyte=0 data-startbyte=0>Process</button></span> or URL <input id=vsiurl type=url onblur=readUBlob(this.value,0,0); value="' + inim.trim() + '"></input></div> of Player' + thisplayer + s1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player' + eval(3 - thisplayer) + s2;
document.getElementById('mytable').style.background="url('" + inim + "')";
} else {
document.getElementById('myh4').innerHTML+=' ... image <div id=dpf style=display:INLINE-BLOCK;><input style=display:inline-block; id=file type=file name=file></input><span class=readBytesButtons><button style=display:none; data-endbyte=4 data-startbyte=0>1-5</button><button style=display:none; data-endbyte=14 data-startbyte=5>6-15</button><button style=display:none; data-endbyte=7 data-startbyte=6>7-8</button><button name=button id=button value=Process data-endbyte=0 data-startbyte=0>Process</button></span> or URL <input id=vsiurl type=url onblur=readUBlob(this.value,0,0); value="' + inim.trim() + '"></input></div> of Player' + thisplayer + s1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player' + eval(3 - thisplayer) + s2;
}

setTimeout(eh, 1000);
//document.title+=' z';
//document.getElementById('myh4').innerHTML+=' ... image of Player' + thisplayer + s1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player' + eval(3 - thisplayer) + s2;
} else {
document.getElementById('myh4').innerHTML+=' ... turn of Player1' + score1 + ' versus Player2' + score2;
}
for (var itrs=0; itrs<5; itrs++) {
for (var itds=eval(5 * itrs); itds<eval(5 + eval(5 * itrs)); itds++) {
thisrect=tds[itds].getBoundingClientRect();

tds[itds].style.verticalAlign='top';
sqsi=eval(2 * itds + ioffset);
if (inim != '') {
if (itds == 0) {
document.getElementById('myh1').innerHTML='Image Reveal Game';
document.getElementById('qh4').innerHTML=' ';
}
bextras='position:absolute;height:' + eval(eval('' + thisrect.height) / 2) + 'px;width:' + eval(eval('' + thisrect.width) / 2) + 'px;top:' + thisrect.top + 'px;left:' + thisrect.left + 'px;';
tds[itds].innerHTML='<button title="Click/touch me to reveal 1/100th of image below" class=reveal title="" style="' + bextras + 'display:inline-block;' + '" id=sqsisqsi' + sqsi + ' onclick=sosmove(this); value=" "> </button>';
//sqsi++;
bextras='position:absolute;height:' + eval(eval('' + thisrect.height) / 2) + 'px;width:' + eval(eval('' + thisrect.width) / 2) + 'px;top:' + thisrect.top + 'px;left:' + eval(eval('' + thisrect.left) + eval('' + thisrect.width) / 2) + 'px;';
tds[itds].innerHTML+='<button title="Click/touch me to reveal 1/100th of image below" class=reveal title="" style="' + bextras + 'display:inline-block;' + '" id=sqsisqsi' + eval(1 + sqsi) + ' onclick=sosmove(this); value=" "> </button>';
//sqsi++;
bextras='position:absolute;height:' + eval(eval('' + thisrect.height) / 2) + 'px;width:' + eval(eval('' + thisrect.width) / 2) + 'px;top:' + eval(eval('' + thisrect.top) + eval('' + thisrect.height) / 2) + 'px;left:' + thisrect.left + 'px;';
tds[itds].innerHTML+='<button title="Click/touch me to reveal 1/100th of image below" class=reveal title="" style="' + bextras + 'display:inline-block;' + '" id=sqsisqsi' + eval(10 + sqsi) + ' onclick=sosmove(this); value=" "> </button>';
//sqsi++;
bextras='position:absolute;height:' + eval(eval('' + thisrect.height) / 2) + 'px;width:' + eval(eval('' + thisrect.width) / 2) + 'px;top:' + eval(eval('' + thisrect.top) + eval('' + thisrect.height) / 2) + 'px;left:' + eval(eval('' + thisrect.left) + eval('' + thisrect.width) / 2) + 'px;';
tds[itds].innerHTML+='<button title="Click/touch me to reveal 1/100th of image below" class=reveal title="" style="' + bextras + 'display:inline-block;' + '" id=sqsisqsi' + eval(11 + sqsi) + ' onclick=sosmove(this); value=" "> </button>';
} else {
//alert(sqsi);
tds[itds].innerHTML='<select title="" style=vertical-align:top;width:50%;height:50%;text-align:center; size=3 id=sqsi' + sqsi + ' onchange=sosmove(this);><option value=" "> </option><option value="S">S</option><option value="O">O</option></select>';
//sqsi++;
tds[itds].innerHTML+='<select title="" style=vertical-align:top;width:50%;height:50%;text-align:center; size=3 id=sqsi' + eval(1 + sqsi) + ' onchange=sosmove(this);><option value=" "> </option><option value="S">S</option><option value="O">O</option></select>';
//sqsi++;
tds[itds].innerHTML+='<br><select title="" style=vertical-align:bottom;width:50%;height:50%;text-align:center; size=3 id=sqsi' + eval(10 + sqsi) + ' onchange=sosmove(this);><option value=" "> </option><option value="S">S</option><option value="O">O</option></select>';
//sqsi++;
tds[itds].innerHTML+='<select title="" style=vertical-align:bottom;width:50%;height:50%;text-align:center; size=3 id=sqsi' + eval(11 + sqsi) + ' onchange=sosmove(this);><option value=" "> </option><option value="S">S</option><option value="O">O</option></select>';
//sqsi++;
//alert(tds[itds].innerHTML);
}
}
ioffset+=10;
}
}

function checkifsos(t1, t2, t3) { //, camv) {
//var score1=' (0)', score2=' (0)';
//var amv=camv.split('.')[0];
var retv=false;
if (t1 >= 0 && t1 < 100 && t2 >= 0 && t2 < 100 && t3 >= 0 && t3 < 100) {
if (document.getElementById('sqsi' + t1).value == 'S' && document.getElementById('sqsi' + t2).value == 'O' && document.getElementById('sqsi' + t3).value == 'S') {
if (thisplayer == 1) {
document.getElementById('sqsi' + t1).style.border='1px inset red';
document.getElementById('sqsi' + t2).style.border='1px inset red';
document.getElementById('sqsi' + t3).style.border='1px inset red';

if (document.getElementById('sqsi' + t1).title.indexOf('2') != -1) {
document.getElementById('sqsi' + t1).style.backgroundColor='';
document.getElementById('sqsi' + t1).className='bicol'; //style.backgroundColor="linear-gradient(top, pink, yellow)";
} else {
document.getElementById('sqsi' + t1).style.backgroundColor='pink';
}
if (document.getElementById('sqsi' + t2).title.indexOf('2') != -1) {
document.getElementById('sqsi' + t2).style.backgroundColor='';
document.getElementById('sqsi' + t2).className='bicol'; //style.backgroundColor="linear-gradient(top, pink, yellow)";
} else {
document.getElementById('sqsi' + t2).style.backgroundColor='pink';
}
if (document.getElementById('sqsi' + t3).title.indexOf('2') != -1) {
document.getElementById('sqsi' + t3).style.backgroundColor='';
document.getElementById('sqsi' + t3).className='bicol'; //style.backgroundColor="linear-gradient(top, pink, yellow)";
} else {
document.getElementById('sqsi' + t3).style.backgroundColor='pink';
}
document.getElementById('sqsi' + t1).title+='1';
document.getElementById('sqsi' + t2).title+='1';
document.getElementById('sqsi' + t3).title+='1';
} else {
document.getElementById('sqsi' + t1).style.border='1px inset olive';
document.getElementById('sqsi' + t2).style.border='1px inset olive';
document.getElementById('sqsi' + t3).style.border='1px inset olive';
if (document.getElementById('sqsi' + t1).title.indexOf('1') != -1) {
document.getElementById('sqsi' + t1).style.backgroundColor='';
document.getElementById('sqsi' + t1).className='bicol'; //style.backgroundColor="linear-gradient(top, pink, yellow)";
} else {
document.getElementById('sqsi' + t1).style.backgroundColor='yellow';
}
if (document.getElementById('sqsi' + t2).title.indexOf('1') != -1) {
document.getElementById('sqsi' + t2).style.backgroundColor='';
document.getElementById('sqsi' + t2).className='bicol'; //style.backgroundColor="linear-gradient(top, pink, yellow)";
} else {
document.getElementById('sqsi' + t2).style.backgroundColor='yellow';
}
if (document.getElementById('sqsi' + t3).title.indexOf('1') != -1) {
document.getElementById('sqsi' + t3).style.backgroundColor='';
document.getElementById('sqsi' + t3).className='bicol'; //style.backgroundColor="linear-gradient(top, pink, yellow)";
} else {
document.getElementById('sqsi' + t3).style.backgroundColor='yellow';
}
document.getElementById('sqsi' + t1).title+='2';
document.getElementById('sqsi' + t2).title+='2';
document.getElementById('sqsi' + t3).title+='2';
}
retv=true;
if (thisplayer == 1) {
score1=' (' + eval(eval(score1.split('(')[1].split(')')[0]) + 1) + ')';
} else {
score2=' (' + eval(eval(score2.split('(')[1].split(')')[0]) + 1) + ')';
}
}
}
return retv;
}

function sosmove(osel) {
if (osel.id.indexOf('sqsisqsi') != -1) {
availablescore--;
osel.style.visibility='hidden';
if (availablescore == 0) {
myguess();
}
} else {
var cosel=osel.value, anothergo=false, prevplayer=thisplayer;
var thistile=eval(osel.id.replace('sqsi',''));
var surrounds='';
var prevscore1=score1;
var prevscore2=score2;
if (cosel.trim() != '') {
osel.size=1;
osel.style.border='1px inset blue';
osel.innerHTML='<option value=' + cosel + '>' + cosel + '</option>';
document.getElementById('myh4').innerHTML=document.getElementById('myh4').innerHTML.replace(' Player1' + score1 + ' versus Player2' + score2,' Player02' + score2 + ' versus Player01' + score1).replace(' Player2' + score2 + ' versus Player1' + score1,' Player01' + score1 + ' versus Player02' + score2).replace(' Player0',' Player').replace(' Player0',' Player');
// hmiddle -1 me +1
// hend -2 -1 me
// hstart me +1 +2
// vmiddle -10 me +10
// vend -20 -10 me
// vstart me +10 +20
// ddmiddle -11 me +11
// ddend -22 -11 me
// ddstart me +11 +22
// udmiddle -9 me +9
// udend -18 -9 me
// udstart me +9 +18
if (eval(thistile % 10) > 0 && eval(thistile % 10) < 9) {
anothergo|=checkifsos(eval(-1 + thistile), thistile, eval(1 + thistile));
}
if (eval(thistile % 10) > 1) {
anothergo|=checkifsos(eval(-2 + thistile), eval(-1 + thistile), thistile);
}
if (eval(thistile % 10) < 8) {
anothergo|=checkifsos(thistile, eval(1 + thistile), eval(2 + thistile));
}

if (eval(thistile / 10) > 0 && eval(thistile / 10) < 9) {
anothergo|=checkifsos(eval(-10 + thistile), thistile, eval(10 + thistile));
}
if (eval(thistile / 10) > 1) {
anothergo|=checkifsos(eval(-20 + thistile), eval(-10 + thistile), thistile);
}
if (eval(thistile / 10) < 8) {
anothergo|=checkifsos(thistile, eval(10 + thistile), eval(20 + thistile));
}

if (eval(thistile % 10) > 0 && eval(thistile % 10) < 9 && eval(thistile / 10) > 0 && eval(thistile / 10) < 9) {
anothergo|=checkifsos(eval(-11 + thistile), thistile, eval(11 + thistile));
}
if (eval(thistile % 10) > 1 && eval(thistile / 10) > 2) {
anothergo|=checkifsos(eval(-22 + thistile), eval(-11 + thistile), thistile);
}
if (eval(thistile % 10) < 8 && eval(thistile / 10) < 8) {
anothergo|=checkifsos(thistile, eval(11 + thistile), eval(22 + thistile));
}

if (eval(thistile % 10) > 0 && eval(thistile % 10) < 9 && eval(thistile / 10) > 0 && eval(thistile / 10) < 9) {
anothergo|=checkifsos(eval(-9 + thistile), thistile, eval(9 + thistile));
}
if (eval(thistile % 10) >= 0 && eval(thistile / 10) < 8) {
anothergo|=checkifsos(eval(-18 + thistile), eval(-9 + thistile), thistile);
}
if (eval(thistile % 10) > 2 && eval(thistile / 10) < 8) {
anothergo|=checkifsos(thistile, eval(9 + thistile), eval(18 + thistile));
}


if (!anothergo) { thisplayer=eval(eval('' + 3) - eval('' + prevplayer)); } else { document.getElementById('myh4').innerHTML=document.getElementById('myh4').innerHTML.replace(' Player1' + prevscore1 + ' versus Player2' + prevscore2,' Player02' + score2 + ' versus Player01' + score1).replace(' Player2' + prevscore2 + ' versus Player1' + prevscore1,' Player01' + score1 + ' versus Player02' + score2).replace(' Player0',' Player').replace(' Player0',' Player'); }
}
}
}

function playhangman() {
if (vocabulary[0] == '') {
mode=5;
//alert('hangman');
document.getElementById('imyword').src='//www.rjmprogramming.com.au/PHP/surprise.php?min=' + eval(1 + 10) + '&max=' + eval(1 + 20) + '&phrase=y&youllneverfindthis=y' + Math.floor(Math.random() * 134567);
} else {
mode=5;
document.getElementById('imyword').src='//www.rjmprogramming.com.au/PHP/surprise.php?min=' + eval(1 + 10) + '&max=' + eval(1 + 20) + '&phrase=y&youllneverfindthis=y' + Math.floor(Math.random() * 134567);
//alert(vocabulary[0]);
}
}

function selc(tvi) {
asocwc();
if (courx != '') {
if (tvi.indexOf(courx) == -1 && tvi.indexOf('&') != -1) { tvi=tvi.replace('&', courx + '&'); } else if (tvi.indexOf(courx) == -1 && tvi.indexOf('#') != -1) { tvi=tvi + courx.split('=')[1]; }
}
if ((document.URL.split('#')[0] + location.hash) != tvi) { if (((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) || ('' + tvi).replace('hangman','blank').replace('vertex','blank').replace('#square','#blank').replace('#grid','#blank').indexOf('blank') != -1) { top.location.href=tvi; } else { location.href=tvi.replace('.htm#','.htm?rand=' + Math.floor(Math.random() * 123456) + '#').replace('.html#','.html?rand=' + Math.floor(Math.random() * 123456) + '#'); } }
}

function getOffset(el) { // thanks to https://stackoverflow.com/questions/8672369/how-to-draw-a-line-between-two-divs
var rect = el.getBoundingClientRect();
return {
left: rect.left + window.pageXOffset,
top: rect.top + window.pageYOffset,
width: rect.width || el.offsetWidth,
height: rect.height || el.offsetHeight
};
}

function connect(div1, div2) { //, color, thickness) { // draw a line connecting elements
var thickness = 0;
var titleextra="";
var ioff=-4;
if (!onld && 4 == 5) { ioff=0; }
var off1 = getOffset(div1);
var off2 = getOffset(div2);
// bottom right
var x1 = off1.left + off1.width;
var y1 = off1.top + off1.height;
// top right
var x2 = off2.left + off2.width;
var y2 = off2.top;
// distance
var length = Math.sqrt(((x2-x1) * (x2-x1)) + ((y2-y1) * (y2-y1)));
// center
var cx = ((x1 + x2) / 2) - (length / 2);
var cy = ((y1 + y2) / 2) - (thickness / 2);
// angle
var angle = Math.atan2((y1-y2),(x1-x2))*(180/Math.PI);
// make hr
if (div1.title.indexOf(': ') != -1 && div2.title.indexOf(': ') != -1) {
titleextra=' title="' + div1.title + ' to ' + div2.title + '"';
}
var htmlLine = ("<div" + titleextra).replace('<div ','<DIV ') + " style='" + dval + "padding:0px; margin:0px; height:4px; position:absolute; left:" + eval(ioff + cx) + "px; top:" + eval(ioff + cy) + "px; width:" + length + "px; -moz-transform:rotate(" + angle + "deg); -webkit-transform:rotate(" + angle + "deg); -o-transform:rotate(" + angle + "deg); -ms-transform:rotate(" + angle + "deg); transform:rotate(" + angle + "deg);' />";
//
// alert(htmlLine);
return htmlLine; //document.body.innerHTML += htmlLine;
}


function maybeontop(swhat,swhatshort) {
//alert(mode + ' swhatshort=' + swhatshort);
if (mode == 5) { // hangman
document.getElementById('sq').style.display='none';
//alert('<input onclick="alert(' + "'" + swhatshort + "'" + ');" type=button value="Player ' + curplayer + ' click reveals phrase while Player ' + eval(3 - curplayer) + ' turns away?"></input>');
document.getElementById('ontopsq').innerHTML='<input onclick=" document.getElementById(' + "'" + 'mya' + "'" + ').click(); clue=' + "'" + '?' + "'" + '; while (clue == ' + "'" + '?' + "'" + ') { clue=' + "''" + '; try { clue=prompt(' + "'" + swhatshort + " ... to leave a hint for your playing partner, enter one here optionally, and know that to read a helper window enter ?, and that it closes itself in one minute',''" + '); } catch { perr=true; } if (clue == ' + "'" + '?' + "'" + ') { prowoo(); } } if (clue == null) { clue=' + "''" + '; } cluey(' + "'" + swhatshort + "'" + '); " type=button value="Player ' + curplayer + ' click reveals phrase while Player ' + eval(3 - curplayer) + ' turns away?"></input>';
if (document.getElementById('ihangman')) {
document.getElementById('ihangman').src="//www.rjmprogramming.com.au/HTMLCSS/hangman_bg.html?curplayer=1&tosolve=" + encodeURIComponent(swhatshort) + "&clue=" + encodeURIComponent(clue);
} else {
document.getElementById('dhangman').innerHTML='<br><div id=shangman></div><br><iframe style="transform:scale(0.5);margin-left:-50%;margin-top:-200px;width:200%;height:720px;" id="ihangman" src="//www.rjmprogramming.com.au/HTMLCSS/hangman_bg.html?curplayer=' + curplayer + '&tosolve=' + encodeURIComponent(swhatshort) + "&clue=" + encodeURIComponent(clue) + '"></iframe><br>';
document.getElementById('dhangman').style.display='block';
}
lookforend();
}
return swhat;
}

function handon() {
location.href=document.URL.split('#')[0].split('?')[0] + '#hangman' + score + '.' + goes;
}

function hguess(gthis,othis) {
var ifnd=0, fnd=false, newval='';
for (ifnd=0; ifnd<vocabulary[0].length; ifnd++) {
if (vocabulary[0].substring(ifnd,eval(1 + ifnd)).toLowerCase() == gthis.toLowerCase()) {
fnd=true;
newval+=gthis;
} else {
newval+=document.getElementById('sletters').innerHTML.substring(ifnd,eval(1 + ifnd));
}
}
document.getElementById('sletters').innerHTML=newval;
document.getElementById('sletters').title=newval;
othis.style.visibility='hidden';

if (!fnd) {
eval(hangmanc[ihangman]);
ihangman++;
}
if (ihangman >= hangmanc.length) {
goes++;
newval='';
for (ifnd=0; ifnd<vocabulary[0].length; ifnd++) {
if (document.getElementById('sletters').innerHTML.substring(ifnd,eval(1 + ifnd)).toLowerCase() == "_") {
newval+='<font color=red>' + vocabulary[0].substring(ifnd,eval(1 + ifnd)) + '</font>';
} else {
newval+=document.getElementById('sletters').innerHTML.substring(ifnd,eval(1 + ifnd));
}
}
document.getElementById('sletters').innerHTML=newval;
document.getElementById('sletters').title=vocabulary[0];
setTimeout(handon, 5000);
} else if (document.getElementById('sletters').innerHTML.indexOf('_') != -1) {
} else {
score+=document.getElementById('sletters').innerHTML.length;
goes++;
setTimeout(handon, 5000);
}
}

function checkwi(iois) {
var okay=true, hiddenv='', hletters=' ', letters=['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z'];
if (iois != null) {
try {
var aconto = (iois.contentWindow || iois.contentDocument);
if (aconto != null) {
if (aconto.document) { aconto = aconto.document; }
if (aconto.body != null) {
vocabulary[0] = aconto.body.innerHTML.replace('</pre>','').replace('<pre>','');
if (vocabulary[0].indexOf('-') != -1) { okay=false; }
if (mode == 5) {
for (var iji=0; iji<letters.length; iji++) {
hletters+='<input style=inline-block; type=button onclick=hguess(this.value,this); value=' + letters[iji] + '>' + '' + '</input>';
if (letters[iji].toLowerCase() == 'm') { hletters+='<br>'; document.getElementById('qh4').innerHTML=' '; }
}
for (var ii=0; ii<vocabulary[0].length; ii++) {
if (vocabulary[0].substring(ii, eval(1 + ii)) == ' ') {
hiddenv+=' ';
} else {
hiddenv+='_';
}
}
if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
//document.title+=' a';
//document.getElementById('myh4').innerHTML='Enjoy your two player game of Image Revealing';
if (inim.trim() != '') {
document.getElementById('myh4').innerHTML='Enjoy your two player game of Image Revealing ... image <div id=dpf style=display:NONE;><input style=display:inline-block; id=file type=file name=file></input><span class=readBytesButtons><button style=display:none; data-endbyte=4 data-startbyte=0>1-5</button><button style=display:none; data-endbyte=14 data-startbyte=5>6-15</button><button style=display:none; data-endbyte=7 data-startbyte=6>7-8</button><button name=button id=button value=Process data-endbyte=0 data-startbyte=0>Process</button></span> or URL <input id=vsiurl type=url onblur=readUBlob(this.value,0,0); value="' + inim.trim() + '"></input></div> of Player' + thisplayer + score1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player' + eval(3 - thisplayer) + score2;
} else {
document.getElementById('myh4').innerHTML='Enjoy your two player game of Image Revealing ... image <div id=dpf style=display:INLINE-BLOCK;><input style=display:inline-block; id=file type=file name=file></input><span class=readBytesButtons><button style=display:none; data-endbyte=4 data-startbyte=0>1-5</button><button style=display:none; data-endbyte=14 data-startbyte=5>6-15</button><button style=display:none; data-endbyte=7 data-startbyte=6>7-8</button><button name=button id=button value=Process data-endbyte=0 data-startbyte=0>Process</button></span> or URL <input id=vsiurl type=url onblur=readUBlob(this.value,0,0); value="' + inim.trim() + '"></input></div> of Player' + thisplayer + score1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player' + eval(3 - thisplayer) + score2;
}
setTimeout(eh, 1000);

//document.title+=' b';
//document.getElementById('myh4').innerHTML+=' ... image <input style=display:inline-block; id=file type=file name=file></input><div id=dpf style=display:INLINE-BLOCK;><span class=readBytesButtons><button style=display:none; data-endbyte=4 data-startbyte=0>1-5</button><button style=display:none; data-endbyte=14 data-startbyte=5>6-15</button><button style=display:none; data-endbyte=7 data-startbyte=6>7-8</button><button name=button id=button value=Process>Process</button></span> or URL <input id=vsiurl type=url onblur=readUBlob(this.value,0,0); value="' + inim.trim() + '"></input></div> of Player' + thisplayer + score1 + ' versus <a onclick=myguess(); style=text-decoration:underline;cursor:pointer;>guess</a> of Player' + eval(3 - thisplayer) + score2;
//document.title+=' c';
//if (inim.trim() != '') { document.getElementById('dpf').style.display='none'; }
} else if ((' ' + location.hash).split('#').length > 2 || (' ' + location.hash).indexOf('hangman-0.0') != -1) {
document.getElementById('myh4').innerHTML='Enjoy scribbling <a style=text-decoration:underline;cursor:pointer; onclick="parent.document.getElementById(' + "'" + 'iback' + "'" + ').src=' + "'" + 'user_of_signature_signature.html?rand=' + "'" + ' + Math.floor(Math.random() * 123456);" title="Clear Maths Grid Paper below">away</a>! Four discrete vertex clicks define image extraction rectangle.';
} else {
document.getElementById('myh4').innerHTML='<span id=gscore>Score: ' + score + '/' + goes + '</span> <span id=hint title="' + vocabulary[0].length + ' long">Hint:</span> ' + '<span id=sletters data-title="' + vocabulary[0] + '" title="' + hiddenv + '">' + hiddenv + '</span>' + hletters;
}
//document.getElementById('qh4').innerHTML=hletters;
}
hangman[0] = maybeontop('', vocabulary[0]);
var ws=vocabulary[0].split(' ');
for (var iws=0; iws<ws.length; iws++) {
if (ws[iws].length > maxanyone) { okay=false; }
}
//if (mode == 4) questions[0] = vocabulary[0];
}
}
} catch(ee) {
if (vocabulary[0] == '' && mode == 5) { okay=false; }
}
}
//if (!okay) { document.getElementById('imyword').src='//www.rjmprogramming.com.au/PHP/surprise.php?min=' + eval(1 + wlens) + '&max=' + eval(1 + wlenb) + '&phrase=y&youllneverfindthis=y' + Math.floor(Math.random() * 134567); }
if (!okay) { document.getElementById('imyword').src='../PHP/surprise.php?min=' + eval(1 + wlens) + '&max=' + eval(1 + wlenb) + '&phrase=y&youllneverfindthis=y' + Math.floor(Math.random() * 134567); }
}



</script>
</head>
<body onload=' draw_hrs(); '>
<h1 id=myh1>Tracing Square Line Drawing</h1>
<h3 id=myh3>RJM Programming - December, 2018</h3>
<h4 id=myh4>Hint: Click/touch a match then two vertices to reposition that match</h4>
<h4 id=qh4> </h4>
<table><tr><th>
<table id=mytable>
<tbody>
<tr><td class=square></td><td class=square></td><td class=square></td><td class=square></td><td class=square></td></tr>
<tr><td class=square></td><td class=square></td><td class=square></td><td class=square></td><td class=square></td></tr>
<tr><td class=square></td><td class=square></td><td class=square></td><td class=square></td><td class=square></td></tr>
<tr><td class=square></td><td class=square></td><td class=square></td><td class=square></td><td class=square></td></tr>
<tr><td class=square></td><td class=square></td><td class=square></td><td class=square></td><td class=square></td></tr>
</tbody>
</table>
</th><th id='tdhuh' style='vertical-align:top;'> <input style='display:none;background-color:yellow;' type=button id=reveal value='Reveal Answer' onclick="if (this.value.indexOf('Reveal') != -1) { this.value='Another Teaser?'; location.href='#reveal'; document.getElementById('pout').innerHTML='<style> .vertex { opacity: 0.1; } </style>'; document.getElementById('tdandthen').innerHTML='<iframe src=' + aurl + ' style=width:560px;height:600px;background-color:#f0f0f0;></iframe>'; } else { this.value='Reveal Answer'; document.getElementById('tdandthen').innerHTML=''; location.href=burl.split('#')[0].split('?')[0]; } "></input> <br><input type=button id=skip value=Skip style=background-color:lightgreen;display:none; onclick="location.href=document.URL.split('#')[0].split('?')[0]; "></input></th><th id='tdandthen'></th></tr>
</table>
<div id=hrs></div>
<div id=pout></div>
<div id=spout></div>
<div id=daxes></div>
<iframe id='imyword' onload='checkwi(this);' src='//www.rjmprogramming.com.au/PHP/surprise.php?min=11&max=21&phrase=y&youllneverfindthis=y' title='Get a word' style='display:none;'></iframe>
<span id=sq></span><div id=ontopsq></div><div id=dhangman></div>
<a style='display:none;' id=aemail href='mailto:?subject=Plot%20Axes%20link%20below%20...&body='>Email</a>
</body>
</html>