<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<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;
}

#tdhuhta {
background-color: yellow;
}

#dc {
background-color: pink;
}

.ev {
background-color: pink;
}
</style>


<script type='text/javascript'>
var zzprep='', pretemppt='';
var temppt=' title="Rectangle %i" href="#" target="_blank" onclick="if (1 == 3) { alert(99); }" ';
var emailb=location.search.split('emailb=')[1] ? '<input onclick="var prep=temppt; temppt=prompt(' + "'" + 'Enter standing order type parts of area element properties (%i is count) ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome' + "'" + ',temppt); if (temppt == null) { temppt=prep; } else { temppt=temppt.replace(/‘/g,String.fromCharCode(39)).replace(/”/g,String.fromCharCode(34)); }" title="Change standing order type parts of area element properties (%i is count) ... prefixed Javascript welcome" style="inline-block;background-color:yellow;" type=button value="⁉"></input> <input style="border:0px solid red;background-color:orange;" id=izzprep onclick="if (this.style.border.indexOf(' + "'" + '0px' + "'" + ') != -1) { this.style.border=' + "'" + '1px solid red' + "'" + '; this.style.display=' + "'" + 'none' + "'" + '; } else { pretemppt=temppt; zzprep=' + "'" + '' + "'" + '; var xprep=temppt.replace(/\%i/g,' + "'" + '' + "'" + ' + nrect); var zprep=prompt(' + "'" + 'Enter this area properties ... prefixed Javascript welcome' + "'" + ',xprep); if (zprep != null) { temppt=prefixta(zprep); setTimeout(resett,1000); } }" title="Prompt every image map area element about its properties" style="inline-block;" type=button value="❓"></input> <input title="Send email to email address at right" style="inline-block;background-color:lightgreen;" type=submit value="📧"></input> <input name=eto placeholder="Email address" style="inline-block;" type=text value=""></input> ' : '';
if (document.URL.indexOf('emailb') != -1) { emailb='<input onclick="var prep=temppt; temppt=prompt(' + "'" + 'Enter standing order type parts of area element properties (%i is count) ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome' + "'" + ',temppt); if (temppt == null) { temppt=prep; } else { temppt=temppt.replace(/‘/g,String.fromCharCode(39)).replace(/”/g,String.fromCharCode(34)); }" title="Change standing order type parts of area element properties (%i is count) ... prefixed Javascript welcome" style="inline-block;background-color:yellow;" type=button value="⁉"></input> <input style="border:0px solid red;background-color:orange;" id=izzprep onclick="if (this.style.border.indexOf(' + "'" + '0px' + "'" + ') != -1) { this.style.border=' + "'" + '1px solid red' + "'" + '; this.style.display=' + "'" + 'none' + "'" + '; } else { pretemppt=temppt; zzprep=' + "'" + '' + "'" + '; var xprep=temppt.replace(/\%i/g,' + "'" + '' + "'" + ' + nrect); var zprep=prompt(' + "'" + 'Enter this area properties ... prefixed Javascript welcome' + "'" + ',xprep); if (zprep != null) { temppt=prefixta(zprep); setTimeout(resett,1000); } }" title="Prompt every image map area element about its properties" style="inline-block;" type=button value="❓"></input> <input title="Send email to email address at right" style="inline-block;background-color:lightgreen;" type=submit value="📧"></input> <input name=eto placeholder="Email address" style="inline-block;" type=text value=""></input> '; }
if (('' + location.hash).indexOf('emailb') != -1) { emailb='<input onclick="var prep=temppt; temppt=prompt(' + "'" + 'Enter standing order type parts of area element properties (%i is count) ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome' + "'" + ',temppt); if (temppt == null) { temppt=prep; } else { temppt=temppt.replace(/‘/g,String.fromCharCode(39)).replace(/”/g,String.fromCharCode(34)); }" title="Change standing order type parts of area element properties (%i is count) ... prefixed Javascript welcome" style="inline-block;background-color:yellow;" type=button value="⁉"></input> <input style="border:0px solid red;background-color:orange;" id=izzprep onclick="if (this.style.border.indexOf(' + "'" + '0px' + "'" + ') != -1) { this.style.border=' + "'" + '1px solid red' + "'" + '; this.style.display=' + "'" + 'none' + "'" + '; } else { pretemppt=temppt; zzprep=' + "'" + '' + "'" + '; var xprep=temppt.replace(/\%i/g,' + "'" + '' + "'" + ' + nrect); var zprep=prompt(' + "'" + 'Enter this area properties ... prefixed Javascript welcome' + "'" + ',xprep); if (zprep != null) { temppt=prefixta(zprep); setTimeout(resett,1000); } }" title="Prompt every image map area element about its properties" style="inline-block;" type=button value="❓"></input> <input title="Send email to email address at right" style="inline-block;background-color:lightgreen;" type=submit value="📧"></input> <input name=eto placeholder="Email address" style="inline-block;" type=text value=""></input> '; }
emailb='<input onclick="var prep=temppt; temppt=prompt(' + "'" + 'Enter standing order type parts of area element properties (%i is count) ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome' + "'" + ',temppt); if (temppt == null) { temppt=prep; } else { temppt=temppt.replace(/‘/g,String.fromCharCode(39)).replace(/”/g,String.fromCharCode(34)); }" title="Change standing order type parts of area element properties (%i is count) ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome" style="inline-block;background-color:yellow;" type=button value="⁉"></input> <input style="border:0px solid red;background-color:orange;" id=izzprep onclick="if (this.style.border.indexOf(' + "'" + '0px' + "'" + ') != -1) { this.style.border=' + "'" + '1px solid red' + "'" + '; this.style.display=' + "'" + 'none' + "'" + '; } else { pretemppt=temppt; zzprep=' + "'" + '' + "'" + '; var xprep=temppt.replace(/\%i/g,' + "'" + '' + "'" + ' + nrect); var zprep=prompt(' + "'" + 'Enter this area properties ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome' + "'" + ',xprep); if (zprep != null) { temppt=prefixta(zprep); setTimeout(resett,1000); } }" title="Prompt every image map area element about its properties" style="inline-block;" type=button value="❓"></input> <input title="Send email to email address at right" style="inline-block;background-color:lightgreen;" type=submit value="📧"></input> <input name=eto placeholder="Email address" style="inline-block;" type=text value=""></input> ';
var factor=1;
var gscrollTop=0, gscrollLeft=0, wh='';
var gtop=0, gleft=0;
var ttable=null;
var jigsaw=false, topleft=true, jigsawrect=[0,0,0,0,0,0,0,0], jigsawxy=[], jigsawxyc='', nrect=1;
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 acol=cgcols[Math.floor(Math.random() * cgcols.length)];
var sfxa=[cgcols[Math.floor(Math.random() * cgcols.length)],cgcols[Math.floor(Math.random() * cgcols.length)]];
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 iourx=0,ioury=0;
var wlens=10;
var sfx=['0','1'];
var wlenb=20;
var vocabulary=[""];
var hangman=[""];
var mode=0;
var origphsuffix=" (and optionally keep the semicolon delimitation going for more numerical field Labels)";
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 xoffset=0, yoffset=0;
var xfactor=1, yfactor=1;
var numsets=0, iset=0, orignumsets=0;
var labelsuffix='';
var fufg=2;
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, dwt=0;
var preqh4='';

var memnames = ["Player 1", "Player 2"];
var memcard = ["", ""];
var memcardio = [null, null];
var thispicture = 0, memplayer = 1, memturn = 1;
var memtricks = [0, 0];
var memscores = [0, 0];
var memgoes = [0, 0];
var usedcards = [];
var deckcards = [];
var of100 = [];
var sdeckcards = [];
var defcard = "../Games/Memories/images/back01.gif";
var mypictures = new Array("../Games/Memories/images/01c.gif",
"../Games/Memories/images/01d.gif",
"../Games/Memories/images/01h.gif",
"../Games/Memories/images/01s.gif",
"../Games/Memories/images/02c.gif",
"../Games/Memories/images/02d.gif",
"../Games/Memories/images/02h.gif",
"../Games/Memories/images/02s.gif",
"../Games/Memories/images/03c.gif",
"../Games/Memories/images/03d.gif",
"../Games/Memories/images/03h.gif",
"../Games/Memories/images/03s.gif",
"../Games/Memories/images/04c.gif",
"../Games/Memories/images/04d.gif",
"../Games/Memories/images/04h.gif",
"../Games/Memories/images/04s.gif",
"../Games/Memories/images/05c.gif",
"../Games/Memories/images/05d.gif",
"../Games/Memories/images/05h.gif",
"../Games/Memories/images/05s.gif",
"../Games/Memories/images/06c.gif",
"../Games/Memories/images/06d.gif",
"../Games/Memories/images/06h.gif",
"../Games/Memories/images/06s.gif",
"../Games/Memories/images/07c.gif",
"../Games/Memories/images/07d.gif",
"../Games/Memories/images/07h.gif",
"../Games/Memories/images/07s.gif",
"../Games/Memories/images/08c.gif",
"../Games/Memories/images/08d.gif",
"../Games/Memories/images/08h.gif",
"../Games/Memories/images/08s.gif",
"../Games/Memories/images/09c.gif",
"../Games/Memories/images/09d.gif",
"../Games/Memories/images/09h.gif",
"../Games/Memories/images/09s.gif",
"../Games/Memories/images/10c.gif",
"../Games/Memories/images/10d.gif",
"../Games/Memories/images/10h.gif",
"../Games/Memories/images/10s.gif",
"../Games/Memories/images/11c.gif",
"../Games/Memories/images/11d.gif",
"../Games/Memories/images/11h.gif",
"../Games/Memories/images/11s.gif",
"../Games/Memories/images/12c.gif",
"../Games/Memories/images/12d.gif",
"../Games/Memories/images/12h.gif",
"../Games/Memories/images/12s.gif",
"../Games/Memories/images/13c.gif",
"../Games/Memories/images/13d.gif",
"../Games/Memories/images/13h.gif",
"../Games/Memories/images/13s.gif"
);

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 resett() {
temppt=pretemppt;
}

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 prefixta(indc) {
var outindc=indc.replace(/‘/g,"'").replace(/”/g,'"'), sbitsz, sbitszprefix='', scrstuff='';
if (indc.indexOf('/script') != -1) {
indc=' ' + outindc + ' ';
if (indc.indexOf('</scrip' + 't>') != -1) {
sbitsz=indc.split('</scrip' + 't>');
sbitszprefix=indc.split('<scrip' + 't')[0];
scrstuff=indc.substring(sbitszprefix.length, eval(indc.length - sbitszprefix.length - sbitsz[eval(-1 + sbitsz.length)].length + 1));
document.getElementById('tdhuhta').value=document.getElementById('tdhuhta').value.replace('</map>','</map>' + scrstuff.replace(String.fromCharCode(10),''));
document.getElementById('tdhuhta').innerHTML=document.getElementById('tdhuhta').innerHTML.replace('</map>','</map>' + scrstuff.replace(/\</g,'<').replace(/\>/g,'>').replace(String.fromCharCode(10),''));
} else {
sbitsz=indc.split('</scrip' + 't>');
sbitszprefix=indc.split('<scrip' + 't')[0];
scrstuff=indc.substring(sbitszprefix.length, eval(indc.length - sbitszprefix.length - sbitsz[eval(-1 + sbitsz.length)].length + 1));
document.getElementById('tdhuhta').value=document.getElementById('tdhuhta').value.replace('</map>','</map>' + scrstuff.replace(/\<\;/g,'<').replace(/\>\;/g,'>').replace(String.fromCharCode(10),''));
document.getElementById('tdhuhta').innerHTML=document.getElementById('tdhuhta').innerHTML.replace('</map>','</map>' + scrstuff.replace(String.fromCharCode(10),''));
}
outindc=indc.replace(scrstuff, '').trim();
}
return outindc;
}

function fixta(indc) {
var prefq='<map ' + document.getElementById('tdhuhta').value.split('<map ')[1].split('</map>')[0] + '</map>';
var suffq='<map ' + document.getElementById('tdhuhta').innerHTML.split('<map ')[1].split('</map>')[0] + '</map>';
document.getElementById('tdhuhta').value=document.getElementById('tdhuhta').value.replace(prefq,(indc.split('/map')[0] + '/map>').replace(/\<\;/g,'<').replace(/\>\;/g,'>').replace(String.fromCharCode(10),''));
//alert(indc);
//alert(document.getElementById('tdhuhta').value);
document.getElementById('tdhuhta').innerHTML=document.getElementById('tdhuhta').innerHTML.replace(suffq,(indc.split('/map')[0] + '/map>').replace(/\</g,'<').replace(/\>/g,'>').replace(String.fromCharCode(10),''));
//alert(document.getElementById('tdhuhta').innerHTML);
}

function scrollx(inv) {
xoff=eval(scrollxy().split(',')[0]);
return eval(inv + eval(Math.abs(factor) * eval('' + xoff)));
}

function scrolly(inv) {
yoff=eval(scrollxy().split(',')[1]);
return eval(inv + eval(Math.abs(factor) * eval('' + yoff)));
}

function scrollxy() {
var idocument=document.getElementById('ijigsaw');
var retval='0,0';
if (gscrollTop != 0 || gscrollLeft != 0) {
//document.title=(gscrollLeft + ',' + gscrollTop);
if (factor < 0 && 1 == 7) {
return (eval(ttable.left - gscrollLeft) + ',' + eval(ttable.top - gscrollTop));
} else {
return (gscrollLeft + ',' + gscrollTop);
}
} else if (idocument.offsetTop) {
//document.title=(idocument.offsetLeft + ',' + idocument.offsetTop);
return (idocument.offsetLeft + ',' + idocument.offsetTop);
} else if (idocument.scrollTop) {
//document.title=(idocument.scrollLeft + ',' + idocument.scrollTop);
return (idocument.scrollLeft + ',' + idocument.scrollTop);
} else if (idocument.scrollingElement) {
if (idocument.scrollingElement.scrollTop) {
//document.title=(idocument.scrollingElement.scrollLeft + ',' + idocument.scrollingElement.scrollTop);
return (idocument.scrollingElement.scrollLeft + ',' + idocument.scrollingElement.scrollTop);
}
if (idocument.documentElement.scrollTop) {
//document.title=(idocument.documentElement.scrollLeft + ',' + idocument.documentElement.scrollTop);
return (idocument.documentElement.scrollLeft + ',' + idocument.documentElement.scrollTop);
}
}
//document.title=retval;
return retval;
}

function xyi(evt, ismoving) {
//var jigsaw=false, topleft=true, jigsawrect=[0,0,0,0,0,0,0,0], jigsawxyc='', jigsawxy=[];
var avs=[],iavs=0;
if (ismoving != 0) {
//gscrollLeft='' + evt.target.scrollLeft;
//gscrollTop='' + evt.target.scrollTop;
//if (('' + gscrollLeft + ';' + gscrollTop) != '0;0' && ('' + gscrollLeft + ';' + gscrollTop) != ';') {
// document.title='' + gscrollLeft + ';' + gscrollTop;
//} else {
var qrect=evt.target.getBoundingClientRect();
if (('' + ('' + qrect.left).replace('px','') + ':' + ('' + qrect.top).replace('px','')) != '0;0') {
if (gtop == 0 && gleft == 0) {
gtop=eval(('' + ttable.top).replace('px',''));
gleft=eval(('' + ttable.left).replace('px',''));
}
gscrollLeft=gleft
gscrollLeft-=eval(('' + qrect.left).replace('px',''));
gscrollTop=gtop;
gscrollTop-=eval(('' + qrect.top).replace('px',''));
//document.title='' + gleft + ':' + gtop + ' ' + gscrollLeft + ';' + gscrollTop;
}
//}
}
if (evt.clientX) {
iourx = evt.clientX; // - elemLeft;
ioury = evt.clientY; // - elemLeft;
} else {
iourx = evt.pageX; // - elemLeft;
ioury = evt.pageX; // - elemLeft;
}
if (ismoving != 0) {
if (!topleft) {
if (document.getElementById('dv' + nrect)) {
document.getElementById('dv' + nrect).style.width='' + Math.abs(jigsawrect[0] - iourx) + 'px';
document.getElementById('dv' + nrect).style.height='' + Math.abs(jigsawrect[1] - ioury) + 'px';
if (eval('' + document.getElementById('dv' + nrect).style.width.replace('px','')) != 0 || eval('' + document.getElementById('dv' + nrect).style.height.replace('px','')) != 0) {
if (ismoving == 1 && navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) {
if (jigsawxyc == '') {
//document.getElementById('tdhuh').innerHTML='  <img src=""></img><br>  <map></map>';
jigsawxyc+=iourx + ',' + jigsawrect[3];
jigsawxyc+=',' + iourx + ',' + ioury;
jigsawxyc+=',' + jigsawrect[6] + ',' + ioury;
} else {
avs=jigsawxyc.split(',');
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(iourx - eval(avs[iavs])) <= 15 && Math.abs(ioury - eval(avs[1 + iavs])) <= 15) {
iourx=eval(avs[iavs]);
ioury=eval(avs[1 + iavs]);
}
}
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(iourx - eval(avs[iavs])) <= 15 && Math.abs(jigsawrect[3] - eval(avs[1 + iavs])) <= 15) {
iourx=eval(avs[iavs]);
}
}
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(jigsawrect[6] - eval(avs[iavs])) <= 15 && Math.abs(ioury - eval(avs[1 + iavs])) <= 15) {
ioury=eval(avs[1 + iavs]);
}
}
jigsawxyc+=',' + iourx + ',' + jigsawrect[3];
jigsawxyc+=',' + iourx + ',' + ioury;
jigsawxyc+=',' + jigsawrect[6] + ',' + ioury;
}
jigsawrect[4]=iourx;
jigsawrect[5]=ioury;
jigsawrect[2]=iourx;
jigsawrect[7]=ioury;
if (document.getElementById('dv' + nrect)) {
document.getElementById('dv' + nrect).style.width='' + Math.abs(jigsawrect[0] - jigsawrect[4]) + 'px';
document.getElementById('dv' + nrect).style.height='' + Math.abs(jigsawrect[1] - jigsawrect[5]) + 'px';
document.getElementById('dv' + nrect).style.border='5px dashed blue';
//document.getElementById('debug').innerHTML+='M';
} else {
document.getElementById('jigsawdiv').innerHTML+='<div id=dv' + nrect + ' onclick="xyi(event,0);" style="border:5px dashed blue;z-index:102;background-color:transparent;position:absolute;top:' + scrolly(jigsawrect[1]) + 'px;left:' + scrollx(jigsawrect[0]) +'px;height:' + Math.abs(jigsawrect[1] - jigsawrect[5]) + 'px;width:' + Math.abs(jigsawrect[0] - jigsawrect[4]) +'px;"></div>';
//document.getElementById('debug').innerHTML+='N';
}
document.getElementById('tdhuhta').rows='' + eval(4 + nrect);
factor=-1;
if (document.getElementById('izzprep').style.border.indexOf('0px') == -1) { document.getElementById('izzprep').click(); }
var xza='<area shape="rect" coords="' + Math.round(scrollx(eval(eval(jigsawrect[0]) - eval(('' + ttable.left).replace('px',''))))) + ',' + Math.round(scrolly(eval(eval(jigsawrect[1]) - eval(('' + ttable.top).replace('px',''))))) + ',' + Math.round(scrollx(eval(eval(jigsawrect[4]) - eval(('' + ttable.left).replace('px',''))))) + ',' + Math.round(scrolly(eval(eval(jigsawrect[5]) - eval(('' + ttable.top).replace('px',''))))) + '" ' + temppt.replace(/\%i/g,'' + nrect) + ' />' + String.fromCharCode(10) + '<area shape="default" nohref';
factor=1;
//alert(xza);
document.getElementById('tdhuhta').innerHTML=document.getElementById('tdhuhta').innerHTML.replace('<area shape="default" nohref', xza); //'<area shape="rect" title="Rectangle ' + nrect + '" coords="' + eval(eval(jigsawrect[0]) - eval(('' + evt.target.style.left).replace('px',''))) + ',' + eval(eval(jigsawrect[1]) - eval(('' + evt.target.style.top).replace('px',''))) + ',' + eval(eval(jigsawrect[4]) - eval(('' + evt.target.style.left).replace('px',''))) + ',' + eval(eval(jigsawrect[5]) - eval(('' + evt.target.style.top).replace('px',''))) + '" href="#" target="_blank" onclick="if (1 == 3) { alert(99); }" />' + String.fromCharCode(10) + '<area shape="default" nohref');
document.getElementById('tdhuhta').value=document.getElementById('tdhuhta').innerHTML.replace(/\<\;/g,'<').replace(/\>\;/g,'>');
if (document.getElementById('tdhuhta').innerHTML.split('<script') != -1) {
document.getElementById('dc').innerHTML='<map ' + document.getElementById('tdhuhta').innerHTML.split('<script')[0].split('<map ')[1].split('<img ')[0];
} else if (document.getElementById('tdhuhta').innerHTML.split('<script') != -1) {
document.getElementById('dc').innerHTML='<map ' + document.getElementById('tdhuhta').innerHTML.split('<script')[0].split('<map ')[1].split('<img ')[0];
} else {
document.getElementById('dc').innerHTML='<map ' + document.getElementById('tdhuhta').innerHTML.split('<img ')[0].split('<map ')[1];
}
nrect++;
topleft=true;
document.getElementById('tdhuhta').removeAttribute('readonly');
}
//document.title='' + ismoving;
}
//document.getElementById('debug').innerHTML+='m' + Math.floor(Math.abs(jigsawrect[0] - iourx));
if (1 == 2) { evt.preventDefault(); }
} else {
if (1 == 2) { evt.preventDefault(); }
}
}
} else if (topleft) {
if (jigsawxyc == '') { // usemap="#qd15107" width="560" height="637" alt="click map" border="0" /><map id="qd15107" name="qd15107"><area shape="default" nohref alt="" /></map>
//document.getElementById('tdhuh').innerHTML='  <img src=""></img><br>  <map></map>';
jigsawxyc+=iourx + ',' + ioury;
} else {
avs=jigsawxyc.split(',');
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(iourx - eval(avs[iavs])) <= 15 && Math.abs(ioury - eval(avs[1 + iavs])) <= 15) {
iourx=eval(avs[iavs]);
ioury=eval(avs[1 + iavs]);
}
}
jigsawxyc+=',' + iourx + ',' + ioury;
}
jigsawrect[0]=iourx;
jigsawrect[1]=ioury;
jigsawrect[3]=ioury;
jigsawrect[6]=iourx;
topleft=false;
document.getElementById('jigsawdiv').innerHTML+='<div id=dv' + nrect + ' onclick="xyi(event,0);" style="border:5px dashed orange;z-index:102;background-color:transparent;position:absolute;top:' + scrolly(jigsawrect[1]) + 'px;left:' + scrollx(jigsawrect[0]) +'px;height:0px;width:0px;"></div>';
//document.getElementById('debug').innerHTML=' 0';
} else {
if (jigsawxyc == '') {
//document.getElementById('tdhuh').innerHTML='  <img src=""></img><br>  <map></map>';
jigsawxyc+=iourx + ',' + jigsawrect[3];
jigsawxyc+=',' + iourx + ',' + ioury;
jigsawxyc+=',' + jigsawrect[6] + ',' + ioury;
} else {
avs=jigsawxyc.split(',');
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(iourx - eval(avs[iavs])) <= 15 && Math.abs(ioury - eval(avs[1 + iavs])) <= 15) {
iourx=eval(avs[iavs]);
ioury=eval(avs[1 + iavs]);
}
}
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(iourx - eval(avs[iavs])) <= 15 && Math.abs(jigsawrect[3] - eval(avs[1 + iavs])) <= 15) {
iourx=eval(avs[iavs]);
}
}
for (iavs=0; iavs<avs.length; iavs+=2) {
if (Math.abs(jigsawrect[6] - eval(avs[iavs])) <= 15 && Math.abs(ioury - eval(avs[1 + iavs])) <= 15) {
ioury=eval(avs[1 + iavs]);
}
}
jigsawxyc+=',' + iourx + ',' + jigsawrect[3];
jigsawxyc+=',' + iourx + ',' + ioury;
jigsawxyc+=',' + jigsawrect[6] + ',' + ioury;
}
jigsawrect[4]=iourx;
jigsawrect[5]=ioury;
jigsawrect[2]=iourx;
jigsawrect[7]=ioury;
if (document.getElementById('dv' + nrect)) {
document.getElementById('dv' + nrect).style.width='' + Math.abs(jigsawrect[0] - jigsawrect[4]) + 'px';
document.getElementById('dv' + nrect).style.height='' + Math.abs(jigsawrect[1] - jigsawrect[5]) + 'px';
document.getElementById('dv' + nrect).style.border='5px dashed blue';
//document.getElementById('debug').innerHTML+='M';
} else {
document.getElementById('jigsawdiv').innerHTML+='<div id=dv' + nrect + ' onclick="xyi(event,0);" style="border:5px dashed blue;z-index:102;background-color:transparent;position:absolute;top:' + scrolly(jigsawrect[1]) + 'px;left:' + scrollx(jigsawrect[0]) +'px;height:' + Math.abs(jigsawrect[1] - jigsawrect[5]) + 'px;width:' + Math.abs(jigsawrect[0] - jigsawrect[4]) +'px;"></div>';
//document.getElementById('debug').innerHTML+='N';
}
document.getElementById('tdhuhta').rows='' + eval(4 + nrect);
factor=-1;
if (document.getElementById('izzprep').style.border.indexOf('0px') == -1) { document.getElementById('izzprep').click(); }
var xza='<area shape="rect" coords="' + Math.round(scrollx(eval(eval(jigsawrect[0]) - eval(('' + ttable.left).replace('px',''))))) + ',' + Math.round(scrolly(eval(eval(jigsawrect[1]) - eval(('' + ttable.top).replace('px',''))))) + ',' + Math.round(scrollx(eval(eval(jigsawrect[4]) - eval(('' + ttable.left).replace('px',''))))) + ',' + Math.round(scrolly(eval(eval(jigsawrect[5]) - eval(('' + ttable.top).replace('px',''))))) + '" ' + temppt.replace(/\%i/g,'' + nrect) + ' />' + String.fromCharCode(10) + '<area shape="default" nohref';
factor=1;
//alert(xza);
document.getElementById('tdhuhta').innerHTML=document.getElementById('tdhuhta').innerHTML.replace('<area shape="default" nohref', xza); //'<area shape="rect" title="Rectangle ' + nrect + '" coords="' + eval(eval(jigsawrect[0]) - eval(('' + evt.target.style.left).replace('px',''))) + ',' + eval(eval(jigsawrect[1]) - eval(('' + evt.target.style.top).replace('px',''))) + ',' + eval(eval(jigsawrect[4]) - eval(('' + evt.target.style.left).replace('px',''))) + ',' + eval(eval(jigsawrect[5]) - eval(('' + evt.target.style.top).replace('px',''))) + '" href="#" target="_blank" onclick="if (1 == 3) { alert(99); }" />' + String.fromCharCode(10) + '<area shape="default" nohref');
document.getElementById('tdhuhta').value=document.getElementById('tdhuhta').innerHTML.replace(/\<\;/g,'<').replace(/\>\;/g,'>');
if (document.getElementById('tdhuhta').innerHTML.split('<script') != -1) {
document.getElementById('dc').innerHTML='<map ' + document.getElementById('tdhuhta').innerHTML.split('<script')[0].split('<map ')[1].split('<img ')[0];
} else if (document.getElementById('tdhuhta').innerHTML.split('<script') != -1) {
document.getElementById('dc').innerHTML='<map ' + document.getElementById('tdhuhta').innerHTML.split('<script')[0].split('<map ')[1].split('<img ')[0];
} else {
document.getElementById('dc').innerHTML='<map ' + document.getElementById('tdhuhta').innerHTML.split('<img ')[0].split('<map ')[1];
}
nrect++;
topleft=true;
document.getElementById('tdhuhta').removeAttribute('readonly');
}
//alert('' + iourx + ',' + ioury);
}

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', mgmore='', pee='p';
if (cwords.indexOf(',0.0)') != -1 || cwords.indexOf('(0.0,') != -1) { pee='b'; mgmore='margin-top:20px;'; minustwenty='-5'; }
if (cwords == '(0.0,0.0)') {
if (('' + location.hash).indexOf('=column') != -1) {
if ((' ' + maxy).length > 4) { minustwenty='-' + eval(eval((' ' + maxy).length) * 6); }
document.getElementById('daxes').innerHTML+='<b><su' + pee + ' style="margin-left:' + minustwenty + 'px;' + mgmore + 'position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + yoffset + '</su' + pee + '></b>';
} else {
document.getElementById('daxes').innerHTML+='<su' + pee + ' style="margin-left:10px;' + mgmore + 'position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + norepeat('' + axisword) + '</su' + pee + '>';
//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.replace('(0.0,','(0,').replace(',0.0)',',0)') == '(0,0)') {
if (('' + location.hash).indexOf('=column') != -1) {
if ((' ' + maxy).length > 4) { minustwenty='-' + eval(eval((' ' + maxy).length) * 6); }
document.getElementById('daxes').innerHTML+='<b><su' + pee + ' 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 + '</su' + pee + '></b>';
} else {
document.getElementById('daxes').innerHTML+='<su' + pee + ' 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) + '</su' + pee + '>';
//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.replace(',0.0)',',0)').indexOf(',0)') != -1) {
axisword=cwords.replace('(0.0,','(0,').replace(',0.0)',',0)').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.replace('(0.0,','(0,').indexOf('(0,') != -1) {
axisword=cwords.replace('(0.0,','(0,').replace(',0.0)',',0)').substring(3).split(')')[0];
if (('' + location.hash).indexOf('=column') != -1) {
if ((' ' + maxy).length > 4) { minustwenty='-' + eval(eval((' ' + maxy).length) * 6); }
//alert(cwords + ' --- ' + cwords.replace('(0.0,','(0,').replace(',0.0)',',0)').substring(3) + ' ... ' + axisword + ' + ' + yoffset);
document.getElementById('daxes').innerHTML+='<b><su' + pee + ' style="margin-left:' + minustwenty + 'px;' + mgmore + '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))) + '</su' + pee + '></b>';
} else {
document.getElementById('daxes').innerHTML+='<su' + pee + ' style="margin-left:10px;' + mgmore + 'position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + norepeat('' + axisword) + '</su' + pee + '>';
}
if (('' + location.hash).indexOf('=column') != -1 && eval('' + axisword) == eval(eval('' + yint) * 6)) {
document.getElementById('daxes').innerHTML+='<b><sup id=sylabel style="margin-left:-57px;position:absolute;left:' + document.getElementById('hr' + hrval).style.left.replace('px','') + 'px;top:' + document.getElementById('hr' + hrval).style.top.replace('px','') + 'px;">' + ylabel.replace(/\~/g,'<br>') + '</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',''));

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

document.getElementById('hr181').title=texttoo(181,'(' + eval(yint * 1) + ',0.0)');
document.getElementById('hr177').title=texttoo(177,'(' + eval(yint * 2) + ',0.0)');
document.getElementById('hr125').title=texttoo(125,'(' + eval(yint * 3) + ',0.0)');
document.getElementById('hr121').title=texttoo(121,'(' + eval(yint * 4) + ',0.0)');
document.getElementById('hr69').title=texttoo(69,'(' + eval(yint * 5) + ',0.0)');
document.getElementById('hr65').title=texttoo(65,'(' + eval(yint * 6) + ',0.0)');
document.getElementById('hr68').title=texttoo(68,'(' + eval(yint * 7) + ',0.0)');
document.getElementById('hr4').title=texttoo(4,'(' + eval(yint * 8) + ',0.0)');
document.getElementById('hr7').title=texttoo(7,'(' + eval(yint * 9) + ',0.0)');
} else {
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) {
var ifufg=2, divby=1, rest='', bc='';
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]);
xoffset=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);
dwt=eval('' + zerozeroy);
dwt-=dw;
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 == '') {
if (things.length > 2) {
fufg=things.length;
divby=eval(-1 + fufg);
for (var iii=3; iii<=things.length; iii++) {
sfx.push('' + iii);
sfxa.push(cgcols[Math.floor(Math.random() * cgcols.length)]);
labelsuffix+=" and " + things[eval(-1 + iii)];
}
}
if (fufg != 2 && document.getElementById('h1column').innerHTML == 'Bar') {
dwt=eval('' + zerozeroy);
//alert(dwt);
//alert(divby);
//alert(dw);
dwt-=eval(dw / divby);
//alert('new dwt=' + dwt);
}
xlabel=things[0];
ylabel=things[1] + labelsuffix;
if (xlabel.indexOf('~') != -1) { document.getElementById('sxlabel').style.marginTop='50px'; }

if (document.getElementById('h1column').innerHTML == 'Bar') {
xlabel=things[0] + labelsuffix;
ylabel=things[1];
document.getElementById('sylabel').innerHTML='<br><br><br>' + 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('sxlabel').innerHTML=yl;
document.getElementById('sxlabel').style.marginLeft='-57px';
document.getElementById('sxlabel').style.marginTop='-80px';
} else {
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 (document.getElementById('h1column').innerHTML == 'Bar') {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(things[1]) + ';' + encodeURIComponent(things[0]) + encodeURIComponent(labelsuffix.replace(/ and /g,';')) + '|'); }
} else {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(things[0]) + ';' + encodeURIComponent(things[1]) + encodeURIComponent(labelsuffix.replace(/ and /g,';')) + '|'); }
}
//alert(10);
iois.value='';
altnextph+=labelsuffix.replace(/ and /g,';');
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) {
//alert(ioisval);
rdw=dw;
divby=eval(-1 + fufg);
if (eval('' + things.length) == 2) {
yvalue=things[eval(-1 + things.length)];
xvalue=ioisval.replace(';' + yvalue, ''); //.replace(/\~/g,'<br>');
} else {
xvalue=things[0];
yvalue=things[1];
for (ifufg=2; ifufg<=fufg; ifufg++) {
if (document.getElementById('h1column').innerHTML == 'Bar') {
xvalue+=" and " + things[ifufg];
} else {
yvalue+=" and " + things[ifufg];
}
}
}
var xl='';
for (ifufg=2; ifufg<=fufg; ifufg++) {
if (ifufg == 2 && document.getElementById('h1column').innerHTML == 'Bar') {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(yvalue.replace(/ and /g,';')) + ';' + xvalue.replace(/ and /g,';') + '|'); }
} else if (ifufg == 2) {
if (jans == '') { if (eqplotsuffix == '') { eqplotsuffix='|'; } eqplotsuffix+=(encodeURIComponent(xvalue.replace(/ and /g,';')) + ';' + yvalue.replace(/ and /g,';') + '|'); }
}
xl='';
if (ifufg == 2) {
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>");
xl=(xvalue + ' ').substring(0,1);
for (var iiyu=1; iiyu<ylabel.length; iiyu++) {
xl+='<br>' + xvalue.substring(iiyu, eval(1 + iiyu));
}
} else {
xl=xvalue;
}
//alert(document.getElementById('h1column').innerHTML);
if (document.getElementById('h1column').innerHTML == 'Line' || document.getElementById('h1column').innerHTML == 'Area') { //xvalue.toLowerCase().indexOf('line') != -1) {
//alert('2:' + document.getElementById('h1column').innerHTML);
document.getElementById('h1column').innerHTML=document.getElementById('h1column').innerHTML; //'Line';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML=document.getElementById('h1column').innerHTML; }
if (ifufg == 2) { hrlgcnt++; }
document.getElementById('daxes').innerHTML+='<hr title="' + ylabel.split(' and ')[eval(-2 + ifufg)] + ': ' + yvalue.split(' and ')[0] + '" class="vertex" onclick="hrclick(this);" ' + tprefix + 'title=hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt + ' id=hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt + ' style="position:absolute;top:' + eval(zerozeroy + 14 - eval(eval(yfactor * eval(eval('' + yvalue.split(' and ')[0]) - eval('' + yoffset))))) + 'px;left:' + eval(eval('' + dwl) + eval(eval('' + dw) / 2)) + 'px;"></hr>';
//alert('xvalue=' + xvalue);
if (ifufg == 2) { 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.split(' and ')[0].split(';')[0] + '</sub></b>'; }
if (fufg != 2) { if (xvalue.indexOf(' and ') != -1 || xvalue.indexOf(';') != -1) { xvalue=xvalue.replace(xvalue.split(' and ')[0] + ' and ','').replace(xvalue.split(';')[0] + ';',''); } if (yvalue.indexOf(' and ') != -1 || yvalue.indexOf(';') != -1) { yvalue=yvalue.replace(yvalue.split(' and ')[0] + ' and ','').replace(yvalue.split(';')[0] + ';',''); } }
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' + sfx[eval(-1 + ifufg)] + lasthr).click();
document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).click();

if (document.getElementById('h1column').innerHTML == 'Area') { // thanks to https://stackoverflow.com/questions/41988955/absolute-positioning-of-svg-element-not-working and https://datavizcatalogue.com/methods/area_graph.html
if (fufg != 2) { acol=sfxa[eval(-1 + ifufg)]; }
var mintop=Math.min(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + lasthr).style.top.replace('px','')), eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).style.top.replace('px','')));
var minleft=Math.min(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + lasthr).style.left.replace('px','')), eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).style.left.replace('px','')));
var thisheight=Math.abs(zerozeroy - mintop);
var thiswidth=Math.abs(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + lasthr).style.left.replace('px','')) - eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).style.left.replace('px','')));
var az='<div class="svg-container" style="opacity:0.5;position:absolute;top:' + Math.floor(eval(14 + mintop)) + 'px;left:' + Math.floor(minleft) + 'px;width:' + Math.floor(thiswidth) + 'px;height:' + Math.floor(thisheight) + 'px;"><svg height="100%" width="100%"><polygon points="'; //0,0 ' + Math.floor(eval('' + dwl) + eval(eval('' + dw) / 2)) + ',0 ' + Math.floor(eval('' + dwl) + eval(eval('' + dw) / 2)) + ',' + Math.floor(eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset)))) + ' ' + Math.floor(eval('' + dwl) + eval(eval('' + dw) / 2)) + ',' + Math.floor(eval(yfactor * eval(eval('' + yvalue) - eval('' + yoffset)))) + '" style="fill:lime;stroke:purple;stroke-width:1" /></svg></div>';
az+='' + Math.floor(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + lasthr).style.left.replace('px','')) - minleft) + ',';
az+='' + Math.floor(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + lasthr).style.top.replace('px','')) - mintop) + ' ';
az+='' + Math.floor(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).style.left.replace('px','')) - minleft) + ',';
az+='' + Math.floor(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).style.top.replace('px','')) - mintop) + ' ';
az+='' + Math.floor(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + hrlgcnt).style.left.replace('px','')) - minleft) + ',';
az+='' + Math.floor(eval(eval(eval('' + zerozeroy)) - mintop)) + ' ';
az+='' + Math.floor(eval('' + document.getElementById('hrlg' + sfx[eval(-1 + ifufg)] + lasthr).style.left.replace('px','')) - minleft) + ',';
az+='' + Math.floor(eval(eval(eval('' + zerozeroy)) - mintop)) + ' ';
az+='" style="fill:' + acol + ';stroke:purple;stroke-width:1" /></svg></div>';
//alert(az);
document.getElementById('daxes').innerHTML+=az;
}


} //else {
//alert(' numsets=' + numsets + ' and orignumsets=' + orignumsets);
//}
if (ifufg == fufg) { lasthr=hrlgcnt; }
} else if (document.getElementById('h1column').innerHTML == 'Bar') { // yvalue.toLowerCase().indexOf('bar') != -1) {
bc=cgcols[Math.floor(Math.random() * cgcols.length)];
if (fufg != 2) {
bc=sfxa[eval(-1 + ifufg)];
//if (document.getElementById('daxes').innerHTML.replace('top: ','top:').indexOf("top:" + dwt + "px;") == -1) {
//alert('ifufg=' + ifufg + ' and xvalue=' + xvalue.split(' and ')[0].split(';')[0] + ' and divby=' + divby + ' width=' + eval(xfactor * eval(eval('' + xvalue.split(' and ')[0].split(';')[0]) - eval('' + xoffset))));
//}
}
document.getElementById('daxes').innerHTML+="<div onclick='alert(this.title);' title='" + xlabel.split(' and ')[eval(-2 + ifufg)] + ": " + xvalue.split(' and ')[0].split(';')[0] + "' style='background-color:" + bc + ";opacity:0.5;z-index:24;position:absolute;top:" + dwt + "px;left:" + eval(zerozerox + 14) + "px;height:" + eval(dw / divby) + "px;width:" + eval(xfactor * eval(eval('' + xvalue.split(' and ')[0].split(';')[0]) - eval('' + xoffset))) + "px;'></div>";
if (ifufg == 2) { document.getElementById('daxes').innerHTML+='<b><sub style="margin-top:20px;margin-left:-50px;position:absolute;top:' + dwt + 'px;left:' + zerozerox + 'px;">' + yvalue.split(' and ')[0].split(';')[0] + rest + '</sub></b>'; }
if (fufg != 2) { if (xvalue.indexOf(' and ') != -1 || xvalue.indexOf(';') != -1) { xvalue=xvalue.replace(xvalue.split(' and ')[0] + ' and ','').replace(xvalue.split(';')[0] + ';',''); } if (yvalue.indexOf(' and ') != -1 || yvalue.indexOf(';') != -1) { yvalue=yvalue.replace(yvalue.split(' and ')[0] + ' and ','').replace(yvalue.split(';')[0] + ';',''); } }
if (divby > 1) {
dwt-=eval(dw / divby); // 2
dwl+=eval(dw / divby); // 2
rdw=0; //eval(dw / divby);
}
} else {
bc=cgcols[Math.floor(Math.random() * cgcols.length)];
if (fufg != 2) { bc=sfxa[eval(-1 + ifufg)]; }
//alert('yvalue=' + yvalue);
document.getElementById('daxes').innerHTML+="<div onclick='alert(this.title);' title='" + ylabel.split(' and ')[eval(-2 + ifufg)] + ": " + yvalue.split(' and ')[0].split(';')[0] + "' style='background-color:" + bc + ";opacity:0.5;z-index:24;position:absolute;top:" + eval(zerozeroy + 14 - eval(eval(yfactor * eval(eval('' + yvalue.split(' and ')[0].split(';')[0]) - eval('' + yoffset))))) + "px;left:" + dwl + "px;width:" + eval(dw / divby) + "px;height:" + eval(yfactor * eval(eval('' + yvalue.split(' and ')[0].split(';')[0]) - eval('' + yoffset))) + "px;'></div>";
if (ifufg == 2) { document.getElementById('daxes').innerHTML+='<b><sub style="margin-top:20px;position:absolute;left:' + dwl + 'px;top:' + zerozeroy + 'px;">' + xvalue.split(' and ')[0].split(';')[0] + rest + '</sub></b>'; }
if (fufg != 2) { if (xvalue.indexOf(' and ') != -1 || xvalue.indexOf(';') != -1) { xvalue=xvalue.replace(xvalue.split(' and ')[0] + ' and ','').replace(xvalue.split(';')[0] + ';',''); } if (yvalue.indexOf(' and ') != -1 || yvalue.indexOf(';') != -1) { yvalue=yvalue.replace(yvalue.split(' and ')[0] + ' and ','').replace(yvalue.split(';')[0] + ';',''); } }
if (divby > 1) {
dwt-=eval(dw / divby); // 2
dwl+=eval(dw / divby); // 2
rdw=0; //eval(dw / divby);
}
}

}

eqplotsuffix=eqplotsuffix.replace(/\;undefined/g,'').replace(/\;\|/g,'|');
numsets--;
if (numsets == 0) { document.getElementById('daxes').innerHTML+='<style> hr.vertex { visibility:hidden; } </style>'; }
dwl+=rdw;
dwt-=rdw;
dwl+=5;
dwt-=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 nobuttons() {
jigsaw=true;
document.getElementById('myh1').innerHTML=document.getElementById('myh1').innerHTML.substring('Image Reveal Game or '.length);
//document.getElementById('button').value="Image Map";
document.getElementById('button').innerHTML="Image Map";
document.getElementById('button').style.backgroundColor='lightblue';
document.getElementById('button').title='Click over image for Image Map area element shape=rect definitions';
document.getElementById('anob').style.backgroundColor='green';
document.getElementById('myh1').style.position='absolute';
document.getElementById('myh1').style.top='0px';
document.getElementById('myh1').style.left='10px';
document.getElementById('myh3').style.position='absolute';
document.getElementById('myh3').style.top='60px';
document.getElementById('myh3').style.left='10px';
//document.getElementById('myh4').style.position='absolute';
document.getElementById('myh4').style.marginTop='120px';
//document.getElementById('myh4').style.left='0px';
var bts=document.getElementsByTagName('button');
for (var ibts=0; ibts<bts.length; ibts++) {
if (bts[ibts].innerHTML.replace(' ','') == '') { bts[ibts].style.display='none'; }
}
ttable=document.getElementById('toptable').getBoundingClientRect();
document.getElementById('jigsaw').style.position='absolute';
document.getElementById('jigsaw').style.top='' + ttable.top + 'px';
document.getElementById('jigsaw').style.left='' + ttable.left + 'px';
document.getElementById('jigsaw').style.width='100%';
document.getElementById('jigsaw').style.height='100vh';
document.getElementById('jigsaw').style.zIndex='100';
document.getElementById('jigsaw').style.backgroundColor='transparent';
//document.getElementById('jigsaw').style.border='2px solid red';
document.getElementById('myh4').innerHTML=document.getElementById('myh4').innerHTML.split(' of Player')[0].replace('Enjoy your two player game of Image Revealing','Welcome to Image Jigsaw Guillotine Mapping');
setTimeout(eh, 1000);
}

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';
}
if (('' + location.hash).replace(/\%7C/g,'|').indexOf('|Bar|') != -1) {
origph='Enter X-axis Label (numerical); Y-axis Label' + origphsuffix;
altph=origph;
altnextph='Enter X-axis Value; Y-axis Value (~ is line feed)';
firstp='Please enter Title, Number of data sets, X-axis minimum, X-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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
} 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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
} 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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
} 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.replace('Image Reveal Game','Image Reveal Game or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a>');
//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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
} 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.replace('Image Reveal Game','Image Reveal Game or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>');
//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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
} 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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
} 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><option value=Area>Area</option><option value=Bar>Bar</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';

if (('' + location.hash).replace(/\%7C/g,'|').indexOf('|Bar|') == -1) {
origph='Enter X-axis Label; Y-axis Label (numerical)' + origphsuffix;
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 or Area or Bar Graph</option><option id=iosos value=" + document.URL.split('#')[0].split('?')[0].replace('.html','.htm') + "#blank>Vertex Pointing or SOS (for two) Game or Memories Card 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 or Image Guillotine Jigsaw Map</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) or Memories Card';
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> <a onclick="osft=' + "'" + ' or Memories Card=' + "'" + '; sosize(' + "''" + ');" style=text-decoration:underline;cursor:pointer;>or Memories Card</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> <a onclick="osft=' + "'" + ' or Memories Card=' + "'" + '; sosize(' + "''" + ');" style=text-decoration:underline;cursor:pointer;>or Memories Card</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='Area'; }
} else if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('|Bar|') != -1) {
document.getElementById('h1column').innerHTML='Bar';
document.getElementById('graphsel').value='Bar';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Bar'; }
} else if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('|Area|') != -1) {
document.getElementById('h1column').innerHTML='Area';
document.getElementById('graphsel').value='Area';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Area'; }
}
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 if (document.getElementById('h1column').innerHTML == 'Area') {
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Area%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Area|');
} else if (document.getElementById('h1column').innerHTML == 'Bar') {
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Bar%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Bar|');
} 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('|');
var uptocoords=0, ijk=0, aijk, cijk='';
for (var ipbits=1; ipbits<pbits.length; ipbits++) {
//alert(ipbits);
//alert(pbits[ipbits]);
if (decodeURIComponent(pbits[ipbits]).indexOf(';') != -1) { uptocoords=true; }
if (decodeURIComponent(pbits[ipbits]).indexOf(',') != -1 || decodeURIComponent(pbits[ipbits]).indexOf(';') != -1) {
if (decodeURIComponent(pbits[ipbits]).indexOf(';') != -1 && uptocoords && document.getElementById('h1column').innerHTML == 'Bar') {
aijk=decodeURIComponent(pbits[ipbits]).split(';');
cijk=aijk[1] + ';' + aijk[0];
for (ijk=2; ijk<aijk.length; ijk++) {
cijk+=';' + aijk[ijk];
}
}
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=(pbits[ipbits] + '|');
if (cijk != '') { pbits[ipbits]=cijk; cijk=''; }
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|');
} else if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('|Area|') != -1) {
document.getElementById('h1column').innerHTML='Area';
document.getElementById('graphsel').value='Area';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Area'; }
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Area%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Area|');
} else if (decodeURIComponent('' + location.hash).replace(/\%7C/g,'|').indexOf('|Bar|') != -1) {
document.getElementById('h1column').innerHTML='Bar';
document.getElementById('graphsel').value='Bar';
if (document.getElementById('h1col')) { document.getElementById('h1col').innerHTML='Bar'; }
document.getElementById('aemail').href=document.getElementById('aemail').href.replace('Column%20Graph%','Bar%20Graph%');
aem=document.getElementById('aemail').href;
if (eqplotsuffix == '') { eqplotsuffix='|'; }
eqplotsuffix+=('Bar|');
}




}

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; }
var lh=('' + location.hash);
for (var ii=1; ii<=2; ii++) {
if (tv != 'Line' && decodeURIComponent(lh).indexOf('|Line|') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CLine\%7C/g,'%7C' + tv + '%7C').replace(/\|Line\|/g,'|' + tv + '|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CLine\%7C/g,'%7C' + tv + '%7C').replace(/\|Line\|/g,'|' + tv + '|');
}
} else if (tv != 'Area' && decodeURIComponent(lh).indexOf('|Area|') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CArea\%7C/g,'%7C' + tv + '%7C').replace(/\|Area\|/g,'|' + tv + '|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CArea\%7C/g,'%7C' + tv + '%7C').replace(/\|Area\|/g,'|' + tv + '|');
}
} else if (tv != 'Bar' && decodeURIComponent(lh).indexOf('|Bar|') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CBar\%7C/g,'%7C' + tv + '%7C').replace(/\|Bar\|/g,'|' + tv + '|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CBar\%7C/g,'%7C' + tv + '%7C').replace(/\|Bar\|/g,'|' + tv + '|');
}
} else if (tv != 'Column' && decodeURIComponent(lh).indexOf('|Column|') != -1) {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CColumn\%7C/g,'%7C' + tv + '%7C').replace(/\|Column\|/g,'|' + tv + '|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + lh.replace(/\%7CColumn\%7C/g,'%7C' + tv + '%7C').replace(/\|Column\|/g,'|' + tv + '|');
}
} else if (tv != 'Column' && decodeURIComponent(lh).indexOf('=column') != -1) {
if (decodeURIComponent(eqplotsuffix).indexOf('|') != -1 && decodeURIComponent(eqplotsuffix).indexOf(';') != -1 && ii == 1) {
ii=ii;
} else {
if (document.URL.indexOf('?') != -1) {
location.href=document.URL.split('#')[0] + '&rand=' + Math.floor(Math.random() * 12345678) + (lh + '|' + tv + '|');
} else {
location.href=document.URL.split('#')[0] + '?rand=' + Math.floor(Math.random() * 12345678) + (lh + '|' + tv + '|');
}
}
}
if (decodeURIComponent(eqplotsuffix).indexOf('|') != -1 && decodeURIComponent(eqplotsuffix).indexOf(';') != -1) {
lh='#blank=column' + eqplotsuffix;
//alert(lh);
} else {
lh="";
}
}
}

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 (jigsaw) {
//document.getElementById('jigsaw').innerHTML='<img id=ijigsaw src="' + inimis + '" style="z-index:100;position:absolute;left:' + document.getElementById('jigsaw').style.left + ';top:' + document.getElementById('jigsaw').style.top + ';" onclick="alert(65);"></img>';
document.getElementById('jigsaw').innerHTML='<img id=ijigsaw src="' + inimis + '" style="opacity:0.8;z-index:100;" title="Click top left then bottom right of rectangle area to map" ontouchmove="xyi(event,2);" onmousemove="xyi(event,1);" onclick="xyi(event,0);"></img>';
var ri=document.getElementById('ijigsaw').getBoundingClientRect();
wh=(' width="' + ('' + ri.width).replace('px','') + '" height="' + ('' + ri.height).replace('px','') + '"').replace(' width="0" height="0"','');
document.getElementById('ijigsaw').addEventListener("touchstart",function(event){});
//alert(document.getElementById('jigsaw').outerHTML);
if (document.getElementById('djigsaw').innerHTML.indexOf('<textarea') == -1) {
document.getElementById('djigsaw').innerHTML='  <form target="iemail" style="inline-block;" action="//www.rjmprogramming.com.au/HTMLCSS/emailhtml.php" method="POST"><input type=hidden style=display:inline-block; name=subj value="Image Map HTML Email Attachment"></input><span style="width:50%;float:right;">Click for image map below, and <a style=text-decoration:underline;cursor:pointer; onclick="document.getElementById(' + "'" + 'dc' + "'" + ').style.zIndex=pit(' + "'" + '300' + "'" + ');" class=ev>editable version</a> way below ...' + emailb + '</span><br><br><textarea name=hcont style="font-size:8px;z-index:120;float:right;" value="" onclick="woit(this.innerHTML);" id=tdhuhta cols=160 rows=4><HTML><body><map id="mijigsaw" name="mijigsaw">' + String.fromCharCode(10) + '<area shape="default" nohref alt="" />' + String.fromCharCode(10) + '</map>' + String.fromCharCode(10) + '<img' + wh + ' style="z-index:100;" usemap="#mijigsaw" alt="click map" border="0" id="ijigsaw" src="' + inimis + '"></img></body></html></textarea></form><br><div style="width:100%;float:right;display:block;"> </div><br><div style="width:98%;float:right;font-size:10px;" onblur="fixta(prefixta(this.innerHTML)); this.style.zIndex=' + "'" + '1' + "'" + ';" id=dc contenteditable=true></div>';
//document.getElementById('myh4').style.position='absolute';
//document.getElementById('myh4').style.top='120px';
//document.getElementById('myh4').style.left='0px';
document.getElementById('myh4').innerHTML=' ';

}
} else 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);
if (jigsaw) {
// alert(199);
//document.getElementById('jigsaw').innerHTML='<img id=ijigsaw src="' + inimis + '" style="z-index:100;position:absolute;left:' + document.getElementById('jigsaw').style.left + ';top:' + document.getElementById('jigsaw').style.top + ';" onclick="alert(65);"></img>';
var bti=btoa(infilecontents);


document.getElementById('jigsaw').innerHTML='<img id=ijigsaw src="data:image/png;base64,' + bti + '" style="opacity:0.8;z-index:100;" title="Click top left then bottom right of rectangle area to map" ontouchmove="xyi(event,2);" onmousemove="xyi(event,1);" onclick="xyi(event,0);"></img>';
var ri=document.getElementById('ijigsaw').getBoundingClientRect();
wh=(' width="' + ('' + ri.width).replace('px','') + '" height="' + ('' + ri.height).replace('px','') + '"').replace(' width="0" height="0"','');

if (document.getElementById('djigsaw').innerHTML.indexOf('<textarea') == -1) {
document.getElementById('djigsaw').innerHTML='  <form target="iemail" style="inline-block;" action="//www.rjmprogramming.com.au/HTMLCSS/emailhtml.php" method="POST"><input type=hidden style=display:inline-block; name=subj value="Image Map HTML Email Attachment"></input><span style="width:50%;float:right;">Click for image map below, and <a style=text-decoration:underline;cursor:pointer; onclick="document.getElementById(' + "'" + 'dc' + "'" + ').style.zIndex=pit(' + "'" + '300' + "'" + ');" class=ev>editable version</a> way below ...' + emailb + '</span><br><br><textarea name=hcont style="font-size:8px;z-index:120;float:right;" value="" onclick="woit(this.innerHTML);" id=tdhuhta cols=160 rows=4><html><BODY><map id="mijigsaw" name="mijigsaw">' + String.fromCharCode(10) + '<area shape="default" nohref alt="" />' + String.fromCharCode(10) + '</map>' + String.fromCharCode(10) + '<img' + wh + ' style="z-index:100;" usemap="#mijigsaw" alt="click map" border="0" id="ijigsaw" src="' + 'data:image/png;base64,' + bti + '"></img></body></html>' + String.fromCharCode(10) + '</textarea></form><br><div style="width:100%;float:right;display:block;"> </div><br><div style="width:98%;float:right;font-size:10px;" onblur="fixta(prefixta(this.innerHTML)); this.style.zIndex=' + "'" + '1' + "'" + ';" id=dc contenteditable=true></div>';
}

document.getElementById('ijigsaw').addEventListener("touchstart",function(event){});
//alert(document.getElementById('jigsaw').outerHTML);
//document.getElementById('myh4').style.position='absolute';
//document.getElementById('myh4').style.top='120px';
//document.getElementById('myh4').style.left='0px';
document.getElementById('myh4').innerHTML=' ';
} else {
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 latersrc() { // delayed scoring allowing for peek at second card picked by player
memcardio[1].src=memcard[1];
memcard[1]=memcard[1].split('/')[eval(-1 + memcard[1].split('/').length)];
if (memcard[0].substring(0,2) == memcard[1].substring(0,2)) {
memcardio[0].style.visibility='hidden';
memcardio[1].style.visibility='hidden';
memscores[eval(-1 + memplayer)]++;
memgoes[eval(-1 + memplayer)]++;
document.getElementById('qh4').innerHTML=preqh4 + 'Yay! <div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;" onblur="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;">' + memnames[eval(-1 + memplayer)] + '</div> <sup>' + memscores[eval(-1 + memplayer)] + '/' + memgoes[eval(-1 + memplayer)] + '</sup> (vs ' + '<div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;" onblur="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;">' + memnames[eval(1 - eval(memplayer - 1))] + '</div> <sup>' + memscores[eval(1 - eval(memplayer - 1))] + '/' + memgoes[eval(1 - eval(memplayer - 1))] + '</sup>) continue to try to pick pair(s)';
memturn=1;
if (eval(eval('' + memscores[0]) + eval('' + memscores[1])) >= 26) { alert(document.getElementById('qh4').textContent.split(' continue to try to pick pair(s)')[0] + ' ... ready for new game?').replace('Vertex Pointing or SOS (for two) or ',''); memories(''); }
} else {
memcardio[0].src=defcard;
memcardio[1].src=defcard;
memgoes[eval(-1 + memplayer)]++;
memplayer=eval(3 - memplayer);
document.getElementById('qh4').innerHTML=preqh4 + '<div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;" onblur="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;">' + memnames[eval(-1 + memplayer)] + '</div> <sup>' + memscores[eval(-1 + memplayer)] + '/' + memgoes[eval(-1 + memplayer)] + '</sup> (vs ' + '<div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;" onblur="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;">' + memnames[eval(1 - eval(memplayer - 1))] + '</div> <sup>' + memscores[eval(1 - eval(memplayer - 1))] + '/' + memgoes[eval(1 - eval(memplayer - 1))] + '</sup>) to try to pick pair(s)';
memturn=1;
}
}

function thissrc(imgio, cardurl) { // on a player click of a card
if (memturn == 1) {
memcardio[0]=imgio;
memcard[0]=cardurl.split('/')[eval(-1 + cardurl.split('/').length)];
imgio.src=cardurl;
memturn++;
} else {
memcardio[1]=imgio;
memcard[1]=cardurl; //.split('/')[eval(-1 + cardurl.split('/').length)];
imgio.src=cardurl;
if (1 == 1) {
setTimeout(latersrc, 1500);
} else {
if (memcard[0].substring(0,2) == cardurl.split('/')[eval(-1 + cardurl.split('/').length)].substring(0,2)) {
memcardio[0].style.visibility='hidden';
memcardio[1].style.visibility='hidden';
memscores[eval(-1 + memplayer)]++;
memgoes[eval(-1 + memplayer)]++;
document.getElementById('qh4').innerHTML=preqh4 + 'Yay! <div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;" onblur="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;">' + memnames[eval(-1 + memplayer)] + '</div> <sup>' + memscores[eval(-1 + memplayer)] + '/' + memgoes[eval(-1 + memplayer)] + '</sup> (vs ' + '<div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;" onblur="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;">' + memnames[eval(1 - eval(memplayer - 1))] + '</div> <sup>' + memscores[eval(1 - eval(memplayer - 1))] + '/' + memgoes[eval(1 - eval(memplayer - 1))] + '</sup>) continue to try to pick pair(s)';
memturn=1;
} else {
memcardio[0].src=defcard;
memcardio[1].src=defcard;
memgoes[eval(-1 + memplayer)]++;
memplayer=eval(3 - memplayer);
document.getElementById('qh4').innerHTML=preqh4 + '<div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;" onblur="memnames[' + eval(-1 + memplayer) + ']=this.innerHTML;">' + memnames[eval(-1 + memplayer)] + '</div> <sup>' + memscores[eval(-1 + memplayer)] + '/' + memgoes[eval(-1 + memplayer)] + '</sup> (vs ' + '<div style="display:inline-block;" contenteditable=true onchange="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;" onblur="memnames[' + eval(1 - eval(memplayer - 1)) + ']=this.innerHTML;">' + memnames[eval(1 - eval(memplayer - 1))] + '</div> <sup>' + memscores[eval(1 - eval(memplayer - 1))] + '/' + memgoes[eval(1 - eval(memplayer - 1))] + '</sup>) to try to pick pair(s)';
memturn=1;
}
}
}
}

function memories(inim) { // draw memories card 52 cards into 10 x 10 grid
//alert(osft);
var itds=0; tds=document.getElementsByTagName('td');
var sqsi=0, ioffset=0, bextras='', s1=0, s2=0, ainim=inim;
var ii, jj, mm, kk=0, nn=0, found=false, sqc=',-1,';
var beenhere=false;

if (inim == '') {
memplayer=1;
memturn=1;
memscores = [0, 0];
memgoes = [0, 0];
usedcards = [];
deckcards = [];
of100 = [];
if (preqh4 == '') {
document.getElementById('myh1').innerHTML='Memories Card Game';
document.getElementById('myh4').innerHTML=' ';
document.getElementById('daxes').innerHTML+='<style> hr.vertex { visibility:hidden; } </style>';
document.getElementById('qh4').innerHTML=document.getElementById('qh4').innerHTML.replace('On Each Set of 4 a Bezier Curve is Shown',memnames[0] + ' (vs ' + memnames[1] + ') go to find pair(s)');
preqh4=document.getElementById('qh4').innerHTML.split(memnames[0] + ' (vs ' + memnames[1] + ') go to find pair(s)')[0];
} else {
beenhere=true;
document.getElementById('qh4').innerHTML=preqh4 + memnames[0] + ' (vs ' + memnames[1] + ') go to find pair(s)';
}
for (ii=0; ii<52; ii++) {
found = true;
mm=-1;
while (sqc.indexOf(',' + mm + ',') != -1) {
mm = Math.floor((Math.random()*100)+0);
}
sqc+='' + mm + ',';
while (found) {
mm = Math.floor((Math.random()*52)+0);
found = false;
for (jj=0; jj<usedcards.length; jj++) {
if (usedcards[jj] == mypictures[mm]) found = true;
}
}
deckcards[kk] = mypictures[mm];
usedcards[kk] = mypictures[mm];
kk = kk+1;
}
usedcards = [];
of100=sqc.replace(',-1,','').split(',');
}

var typicalrect=tds[0].getBoundingClientRect();

for (var itrs=0; itrs<5; itrs++) {
for (var itds=eval(5 * itrs); itds<eval(5 + eval(5 * itrs)); itds++) {
thisrect=tds[itds].getBoundingClientRect();
if (beenhere) { tds[itds].innerHTML=''; }

tds[itds].style.verticalAlign='top';
sqsi=eval(2 * itds + ioffset);
if (inim == '') {
if (sqc.indexOf(',' + nn + ',') != -1) {
mm=eval(-1 + sqc.split(',' + nn + ',')[0].replace('-1,','').split(',').length);
tds[itds].innerHTML+='<img style="' + 'height:' + eval(eval('' + typicalrect.height) / 2) + 'px;width:' + eval(eval('' + typicalrect.width) / 2) + 'px;top:' + thisrect.top + 'px;left:' + thisrect.left + 'px;' + '" onclick="thissrc(this,' + "'" + deckcards[mm] + "'" + ');" data-title="' + deckcards[mm] + '" src="' + defcard + '"></img>';
}
nn++;
if (sqc.indexOf(',' + nn + ',') != -1) {
mm=eval(-1 + sqc.split(',' + nn + ',')[0].replace('-1,','').split(',').length);
tds[itds].innerHTML+='<img style="' + 'height:' + eval(eval('' + typicalrect.height) / 2) + 'px;width:' + eval(eval('' + typicalrect.width) / 2) + 'px;top:' + thisrect.top + 'px;left:' + eval(eval('' + thisrect.left) + eval('' + typicalrect.width) / 2) + 'px;' + '" onclick="thissrc(this,' + "'" + deckcards[mm] + "'" + ');" data-title="' + deckcards[mm] + '" src="' + defcard + '"></img>';
}
nn++;
if (sqc.indexOf(',' + nn + ',') != -1) {
mm=eval(-1 + sqc.split(',' + nn + ',')[0].replace('-1,','').split(',').length);
tds[itds].innerHTML+='<img style="' + 'height:' + eval(eval('' + typicalrect.height) / 2) + 'px;width:' + eval(eval('' + typicalrect.width) / 2) + 'px;top:' + eval(eval('' + thisrect.top) + eval('' + typicalrect.height) / 2) + 'px;left:' + thisrect.left + 'px;' + '" onclick="thissrc(this,' + "'" + deckcards[mm] + "'" + ');" data-title="' + deckcards[mm] + '" src="' + defcard + '"></img>';
}
nn++;
if (sqc.indexOf(',' + nn + ',') != -1) {
mm=eval(-1 + sqc.split(',' + nn + ',')[0].replace('-1,','').split(',').length);
tds[itds].innerHTML+='<img style="' + 'height:' + eval(eval('' + typicalrect.height) / 2) + 'px;width:' + eval(eval('' + typicalrect.width) / 2) + 'px;top:' + eval(eval('' + thisrect.top) + eval('' + typicalrect.height) / 2) + 'px;left:' + eval(eval('' + thisrect.left) + eval('' + typicalrect.width) / 2) + 'px;' + '" onclick="thissrc(this,' + "'" + deckcards[mm] + "'" + ');" data-title="' + deckcards[mm] + '" src="' + defcard + '"></img>';
}
nn++;
}
}
ioffset+=10;
}
}

function woit(tav){
if (tav != '') {
var wo=window.open('', '_blank', 'top=50,left=50,width=600,height=600');
wo.document.write(tav.replace(/\<\;/g,'<').replace(/\>\;/g,'>'));
}
}

function pit(inval) {
var prevpv=document.getElementById('dc').innerHTML.replace(/\<\;/g,'<').replace(/\>\;/g,'>');
var pv=prompt('Edit Image Map ... prefixed Javascript <scr' + 'ipt> ... </scr' + 'ipt> welcome?', prevpv);
if (pv == null) { return '1'; }
if (pv != prevpv) { document.getElementById('dc').innerHTML=pv.replace(/\</g,'<').replace(/\>/g,'>\;'); fixta(prefixta(document.getElementById('dc').innerHTML)); inval='1'; }
return inval;
}


function sosize(inim) {
//var hors=[], vers=[], diags=[];
if (osft.indexOf('Memories') != -1 && osft.indexOf('SOS') == -1) {
memories(inim);
} else {
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;
if (jigsaw) {
//document.getElementById('jigsaw').innerHTML='<img id=ijigsaw src="' + inimis + '" style="z-index:100;position:absolute;left:' + document.getElementById('jigsaw').style.left + ';top:' + document.getElementById('jigsaw').style.top + ';" onclick="alert(65);"></img>';


document.getElementById('jigsaw').innerHTML='<img id=ijigsaw src="' + inim + '" style="opacity:0.8;z-index:100;" title="Click top left then bottom right of rectangle area to map" ontouchmove="xyi(event,2);" onmousemove="xyi(event,1);" onclick="xyi(event,0);"></img>';
var ri=document.getElementById('ijigsaw').getBoundingClientRect();
wh=(' width="' + ('' + ri.width).replace('px','') + '" height="' + ('' + ri.height).replace('px','') + '"').replace(' width="0" height="0"','');


if (document.getElementById('djigsaw').innerHTML.indexOf('<textarea') == -1) {
document.getElementById('djigsaw').innerHTML='  <form target="iemail" style="inline-block;" action="//www.rjmprogramming.com.au/HTMLCSS/emailhtml.php" method="POST"><input type=hidden style=display:inline-block; name=subj value="Image Map HTML Email Attachment"></input><span style="width:50%;float:right;">Click for image map below, and <a style=text-decoration:underline;cursor:pointer; onclick="document.getElementById(' + "'" + 'dc' + "'" + ').style.zIndex=pit(' + "'" + '300' + "'" + ');" class=ev>editable version</a> way below ...' + emailb + '</span><br><br><textarea name=hcont style="font-size:8px;z-index:120;float:right;" value="" onclick="woit(this.innerHTML);" id=tdhuhta cols=160 rows=4><HTML><BODY><map id="mijigsaw" name="mijigsaw">' + String.fromCharCode(10) + '<area shape="default" nohref alt="" />' + String.fromCharCode(10) + '</map>' + String.fromCharCode(10) + '<img' + wh + ' usemap="#mijigsaw" alt="click map" border="0" id="ijigsaw" src="' + inim + '"></img></body></html>' + String.fromCharCode(10) + '</textarea></form><br><div style="width:100%;float:right;display:block;"> </div><br><div style="width:98%;float:right;font-size:10px;" onblur="fixta(prefixta(this.innerHTML)); this.style.zIndex=' + "'" + '1' + "'" + ';" id=dc contenteditable=true></div>';
}
document.getElementById('ijigsaw').addEventListener("touchstart",function(event){});
//alert(document.getElementById('jigsaw').outerHTML);
//document.getElementById('myh4').style.position='absolute';
//document.getElementById('myh4').style.top='120px';
//document.getElementById('myh4').style.left='0px';
document.getElementById('myh4').innerHTML=' ';
} else {
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 {
if (osft.indexOf('Memories') == -1 && osft.indexOf('SOS') != -1) { document.getElementById('myh1').innerHTML='SOS Game'; }
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 or <a id=anob onclick="nobuttons(); this.style.backgroundColor=' + "'green'" + ';" style=cursor:pointer;background-color:yellow;>Image Guillotine Jigsaw Map</a> <div id=xdjigsaw></div>';
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(); '>
<div style='display:block;width:100%;' id=djigsaw></div>
<h1 id=myh1>Tracing Square Line Drawing</h1>
<h3 id=myh3>RJM Programming - December, 2018<span id=debug></span></h3>
<h4 id=myh4>Hint: Click/touch a match then two vertices to reposition that match</h4>
<h4 id=qh4> </h4>
<table id=toptable><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=jigsaw style="-webkit-overflow-scrolling:touch;overflow:scroll;z-index:100;"></div>
<div id=jigsawdiv style="-webkit-overflow-scrolling:touch;overflow:scroll;z-index:102;"></div>
<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>
<input type=text style='position:absolute;top:-200px;left:-200px;' value=''></input>
<iframe id='iemail' name='iemail' style='display:none;' src=''></input>
</body>
</html>