7c7
< <script type='text/javascript' src='worldly.js?d=fddf' defer></script>
---
> <script type='text/javascript' src='world.js' defer></script>
21d20
< var saveemoji='', expat='';
26,31d24
< var fx=0, fy=0;
< var first=true;
< var arr=['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'];
< var xscalestuff="Scale Width: <input style='width:120px;' onchange='scalex=this.value;' min='0.0000001' id='scalex' type='number' value='1.0000000' step='0.0000001'></input> Height: <input style='width:120px;' onchange='scaley=this.value;' min='0.0000001' id='scaley' type='number' value='1.0000000' step='0.0000001'></input><br>Cropping X: <input style='width:100px;' onchange='cropx=this.value;' min='0.0' id='cropx' type='number' value='0.00' step='0.01'></input> Y: <input style='width:100px;' onchange='cropy=this.value;' min='0.01' id='cropy' type='number' value='0.00' step='0.01'></input><br>Cropping Width<select id='cselwidth'><option value='%'>%</option><option value='px'>px</option></select>: <input style='width:60px;' onchange='cropwidth=this.value;' min='0.01' id='cropwidth' type='number' value='100.00' step='0.01'></input> Height<select id='cselheight'><option value='%'>%</option><option value='px'>px</option></select>: <input style='width:60px;' onchange='cropheight=this.value;' min='0.01' id='cropheight' type='number' value='100.00' step='0.01'></input><br>";
< 
< 
68c61
< var twothousand=2000; //4000;
---
> var twothousand=2000;
76,79c69,72
< var ConBigFontSize = "24px";
< var ProBigFontSize = "24px";
< var ConNormalFontSize = "20px";
< var ProNormalFontSize = "20px";
---
> var ConBigFontSize = "18px";
> var ProBigFontSize = "18px";
> var ConNormalFontSize = "14px";
> var ProNormalFontSize = "14px";
125,127d117
< var grd, grdf, grds;
< var scratch=null, pattern=null, scratchc=null;
< 
133,146d122
< if (!String.fromCodePoint) {   // thanks to http://xahlee.info/js/js_unicode_code_point.html
< // ES6 Unicode Shims 0.1 , © 2012 Steven Levithan , MIT License
<     String.fromCodePoint = function fromCodePoint () {
<         var chars = [], point, offset, units, i;
<         for (i = 0; i < arguments.length; ++i) {
<             point = arguments[i];
<             offset = point - 0x10000;
<             units = point > 0xFFFF ? [0xD800 + (offset >> 10), 0xDC00 + (offset & 0x3FF)] : [point];
<             chars.push(String.fromCharCode.apply(null, units));
<         }
<         return chars.join("");
<     }
< }
< 
149,169d124
<   
<   pattern=null;
< 
<  if (proposed.indexOf(' ') == -1 || 1 == 1) {
< if (askidea == "Big") {
< context.shadowBlur = 1;
< context.shadowColor = "black";
< if (scratch && !pattern) {
<     pattern = context.createPattern(scratch, 'repeat');
< }
<     //return pattern;
< } else {
< context.shadowBlur = 2;
< context.shadowColor = "black";
< if (scratch && !pattern) {
<     pattern = context.createPattern(scratch, 'repeat');
< }
<     //return pattern;
< }
<  }
< 
307d261
<       omyfih = omyfih.replace(/eisnap/g, "qeisnap");
315c269
<       document.body.innerHTML = document.body.innerHTML.replace(fpc, '100%').replace(we600, 'width="' + dw + '"').replace(twp, '4' + '5%;display:none;') + "<form onsubmit='return false;' id='" + af + "' action='#' style='opacity:0.8; z-index:5; position:absolute; top: 10px; left: " + eval(dw - 300) + "px; border: 3px solid red; background-color: pink;'><h1>&nbsp;" + document.getElementById('myh1').innerHTML.replace('Game', 'Report').replace('gsc', 'qgsc').replace(/nofloat/g, 'float') + "</h1>" + omyfih + "</form>";
---
>       document.body.innerHTML = document.body.innerHTML.replace(fpc, '100%').replace(we600, 'width="' + dw + '"').replace(twp, '4' + '5%;display:none;') + "<form id='" + af + "' action='#' style='opacity:0.8; z-index:5; position:absolute; top: 10px; left: " + eval(dw - 300) + "px; border: 3px solid red; background-color: pink;'><h1>&nbsp;" + document.getElementById('myh1').innerHTML.replace('Game', 'Report').replace('gsc', 'qgsc').replace(/nofloat/g, 'float') + "</h1>" + omyfih + "</form>";
326,328d279
<       
<       
<       
347,437d297
< function measureTextHeight(ctx, left, top, width, height) {  // thanks to https://stackoverflow.com/questions/1134586/how-can-you-find-the-height-of-text-on-an-html-canvas
< 
<     // Draw the text in the specified area
<     //ctx.save();
<     //ctx.translate(left, top + Math.round(height * 0.8));
<     //ctx.mozDrawText('gM'); // This seems like tall text...  Doesn't it?
<     //ctx.restore();
< 
<     // Get the pixel data from the canvas
<     var data = ctx.getImageData(left, top, width, height).data,
<         first = false, 
<         last = false,
<         r = height,
<         c = 0;
< 
<     // Find the last line with a non-white pixel
<     while(!last && r) {
<         r--;
<         for(c = 0; c < width; c++) {
<             if(data[r * width * 4 + c * 4 + 3]) {
<                 last = r;
<                 break;
<             }
<         }
<     }
< 
<     // Find the first line with a non-white pixel
<     while(r) {
<         r--;
<         for(c = 0; c < width; c++) {
<             if(data[r * width * 4 + c * 4 + 3]) {
<                 first = r;
<                 break;
<             }
<         }
< 
<         // If we've got it then return the height
<         if(first != r) return last - first;
<     }
< 
<     // We screwed something up...  What do you expect from free code?
<     return 0;
< }
< 
< 
< function emojicodepoints() {
<   if (expat != '') {
<   saveemoji=prompt("Optionally use as background to circles Emoji Codepoint(s) eg. Your Answer Last Time (" + expat + ") or Australian Flag (" + String.fromCodePoint(127462) + String.fromCodePoint(127482) + ") would be 127462.127482", saveemoji);
<   } else {
<   saveemoji=prompt("Optionally use as background to circles Emoji Codepoint(s) eg. Australian Flag (" + String.fromCodePoint(127462) + String.fromCodePoint(127482) + ") would be 127462.127482", saveemoji);
<   }
<   if (saveemoji == null) { saveemoji=""; }
<   if (saveemoji.trim() != "") {  emojipattern(saveemoji); } else { scratch=null; }
< }
< 
< 
< function emojipattern(inpat) {
<   if (('' + inpat) != '') {
<   if (('' + inpat + ' ').substring(0,1) >= '0' && ('' + inpat + ' ').substring(0,1) <= '9') {
<     inpat=eval("String.fromCodePoint(" + inpat.replace(/\./g, ") + String.fromCodePoint(") + ")");
<     expat=inpat;
<     scratch=document.getElementById('scratch');
<     scratchc=scratch.getContext('2d');
<   } else {
<     scratch=document.getElementById('scratch');
<     scratchc=scratch.getContext('2d');
<     scratch.width=eval(24 * inpat.length);
<     scratch=document.getElementById('scratch');
<     scratchc=scratch.getContext('2d');
<   }
<   scratchc.font="24px Verdana";
<   scratchc.strokeStyle='blue';
<   scratchc.strokeText(inpat, 0, scratch.height); //String.fromCodePoint(127462) + String.fromCodePoint(127482), 0, scratch.height); //71);
<   scratchc.stroke();
<   var thi=measureTextHeight(scratchc, 0, 0, scratch.width, scratch.height); //scratchc.measureText(String.fromCodePoint(127462) + String.fromCodePoint(127482)).height;
<   var twi=scratchc.measureText(inpat).width;
<   //alert(thi);
<   scratch=document.getElementById('scratch');
<   scratchc=scratch.getContext('2d');
<   //alert('' + twi + ',' + thi);
<   scratch.width=twi;
<   scratch.height=thi;
<   scratch.style.width='' + twi + 'px';
<   scratch.style.height='' + thi + 'px';
<   scratchc.font="24px Verdana";
<   scratchc.strokeStyle='blue';
<   scratchc.strokeText(inpat, 0, scratch.height); //71);
<   scratchc.stroke();
<   }
< }
< 
439,440d298
<   saveemoji=(location.search.split('codepoints=')[1] ? decodeURIComponent(location.search.split('codepoints=')[1].split('&')[0]) : '');
<   emojipattern(saveemoji);
472,473d329
< context.shadowBlur = 7;
< context.shadowColor = "black";
479,480d334
< context.shadowBlur = 7;
< context.shadowColor = "black";
492,493d345
< context.shadowBlur = 7;
< context.shadowColor = "black";
645a498
>     //alert(toe.href);
651c504
<   //alert(toe.href);
---
>     //alert(toe.href);
655c508
<   //alert(1111);
---
>     //alert(1111);
720c573
<   var diameters=[0], thisxpro=35, thisxcon=eval(eval('' + threehundred) + 30), thisypro=90, thisycon=90, offs, iii;
---
>   var diameters=[0], thisxpro=5, thisxcon=threehundred, thisypro=90, thisycon=90, offs, iii;
748c601
<   context.moveTo(20, eval(offset + 40));
---
>   context.moveTo(0, eval(offset + 40));
763,764c616
<   context.strokeText("Definitely",55,eval(offset + 64));
< 
---
>   context.strokeText("Definitely",5,eval(offset + 60));
768c620,621
<   context.strokeText("Not so much",eval(threehundred + 55),eval(offset + 64));
---
>   context.strokeText("Not so much",eval(threehundred + 5),eval(offset + 60));
>   
772c625
<   context.moveTo(20, eval(offset + 70));
---
>   context.moveTo(0, eval(offset + 70));
817,821d669
< context.shadowBlur = 7;
< context.shadowColor = "black";
<         if (pattern) {
<           context.fillStyle = pattern;
<         }
832,836d679
< context.shadowBlur = 7;
< context.shadowColor = "black";
<         if (pattern) {
<           context.fillStyle = pattern;
<         }
844,845c687
<       thisycon = eval(thisycon + 25 - (diameters[ii] * magnification / 2.0)); //+ 30);
< 
---
>       thisycon = eval(thisycon + 15 - (diameters[ii] * magnification / 2.0)); //+ 30);
859c701
<       thisypro = eval(thisypro + 25 + (diameters[ii] * magnification / 2.0)); //+ 30);
---
>       thisypro = eval(thisypro + 15 + (diameters[ii] * magnification / 2.0)); //+ 30);
881c723
<         context.moveTo(20, eval(thisypro + 30));
---
>         context.moveTo(0, eval(thisypro + 30));
907,911d748
< context.shadowBlur = 7;
< context.shadowColor = "black";
<         if (pattern) {
<           context.fillStyle = pattern;
<         }
916c753
<         thisypro = eval(thisypro + 100);
---
>         thisypro = eval(thisypro + 60);
925c762
<         context.moveTo(20, eval(thisypro + 30));
---
>         context.moveTo(0, eval(thisypro + 30));
932c769
<         context.moveTo(20, eval(thisycon + 30));
---
>         context.moveTo(0, eval(thisycon + 30));
957,961d793
< context.shadowBlur = 7;
< context.shadowColor = "black";
<         if (pattern) {
<           context.fillStyle = pattern;
<         }
975c807
<         context.moveTo(20, eval(thisycon + 30));
---
>         context.moveTo(0, eval(thisycon + 30));
982d813
<   document.getElementById(q + 'eisnap').style.display = 'block'; 
1012,1127d842
< function emailhtmlit() {
<  var pemail=prompt("Who do you want to email to?  Comma separate a To emailee from optional From emailer.", document.getElementById('mylemail').value);
<  if (pemail != null) {
<    if (pemail.replace("fill.in.email@address", "").indexOf("@") != -1) {
<    document.getElementById('mylemail').value=pemail;
<   var zhr = new XMLHttpRequest();
<   var zform=new FormData();
<   zform.append('inline', encodeURIComponent('<body><img src="' + document.getElementById('canvaselement').toDataURL() + '"></img></body>'));
<   if (pemail.replace(/\;/g,',').indexOf(',') != -1) {
<   zform.append('to', pemail.replace(/\;/g,',').split(',')[0]);
<   zform.append('bcc', pemail.replace(/\;/g,',').split(',')[1]);
<   zform.append('subj', 'My Pros and Cons ... ' + topic.split('<')[0].split(String.fromCharCode(10))[0] + ' from ' + pemail.replace(/\;/g,',').split(',')[1]);
<   } else {
<   zform.append('to', pemail);
<   zform.append('subj', 'My Pros and Cons ... ' + topic.split('<')[0].split(String.fromCharCode(10))[0]);
<   }
<   zform.append('tdhuhta', encodeURIComponent('<body><img src="' + document.getElementById('canvaselement').toDataURL() + '"></img></body>'));
<   zhr.open('post', '//www.rjmprogramming.com.au/HTMLCSS/emailhtml.php', true);
<   zhr.send(zform);
<    }
<  }
< }
< 
< 
< function recxy(event) {
<        var isok=true;
<        //if (document.getElementById('dpf')) {
<        //  if (('' + document.getElementById('dpf').style.display).toLowerCase().indexOf('block') != -1) { alert('cliCk ' + wording + ' ' + bodyclick); }
<        //}
<        if (event.touches) { // thanks to https://stackoverflow.com/questions/24567441/how-do-i-detect-two-fingers-at-touchstart-in-javascript
<          if (event.touches.length > 1) {  isok=false; }
<        }
<        if (isok) { 
<        if (x == 0 && y == 0 && lastx == 0 && lasty == 0) {
< 
<        if (event.touches) {
<          var touches1 = event.changedTouches;
<          var first1 = touches1[0];
<          x = first1.clientX;
<          y = first1.clientY;
<        } else if (event.clientX || event.clientY) {
<        x = event.clientX; // - elemLeft;
<        y = event.clientY; // - elemTop;
<        } else {
<        x = event.pageX; // - elemLeft;
<        y = event.pageY; // - elemTop;
<        }
<        lastx=x;
<        lasty=y;
<        //document.title='lastx_one';
<        //if (document.getElementById('dpf')) {
<        //  if (('' + document.getElementById('dpf').style.display).toLowerCase().indexOf('block') != -1) { alert('Click ' + wording + ' ' + bodyclick); }
<        //}
<        //setTimeout(xthen, 2000);
<        //setTimeout(andthen, 1000);
<        } else {
<        
<        if (event.touches) {
<        //document.title='pre lastx_2';
<          var touches2 = event.changedTouches;
<          var first2 = touches2[0];
<          lastx=x;
<          lasty=y;
<        //document.title='lastx_2';
<          fx = first2.clientX;
<          fy = first2.clientY;
<        //setTimeout(xthen, 2000);
<        //setTimeout(andthen, 1000);
<        } else if (event.clientX || event.clientY) {
<        if (x != event.clientX || y != event.clientY) {
<        lastx=x;
<        lasty=y;
<        //document.title='lastX_2';
<        //if (document.getElementById('dpf')) {
<        //  if (('' + document.getElementById('dpf').style.display).toLowerCase().indexOf('block') != -1) { alert('ClIck ' + wording + ' ' + bodyclick); }
<        //}
<        //setTimeout(xthen, 2000);
<        //setTimeout(andthen, 1000);
<        //} else {
<        //document.title+=' ! ';
<        }
<        } else {
<        if (x != event.pageX || y != event.pageY) {
<        lastx=x;
<        lasty=y;
<        //document.title='LastX_2';
<        //if (document.getElementById('dpf')) {
<        //  if (('' + document.getElementById('dpf').style.display).toLowerCase().indexOf('block') != -1) { alert('clicK ' + wording + ' ' + bodyclick); }
<        //}
<        //setTimeout(xthen, 2000);
<        //setTimeout(andthen, 1000);
<        //} else {
<        //document.title+=' ? ';
<        }
<        }
<        
<        if (event.touches) {
<          var touches3 = event.changedTouches;
<          var first3 = touches3[0];
<          //lastx=x;
<          //lasty=y;
<          x = first3.clientX;
<          y = first3.clientY;
<        } else if (event.clientX || event.clientY) {
<        x = event.clientX; // - elemLeft;
<        y = event.clientY; // - elemTop;
<        } else {
<        x = event.pageX; // - elemLeft;
<        y = event.pageY; // - elemTop;
<        }
<        }
<        //alert('x=' + eval(sxoff + xoff + x) + ' and y=' + y);
<        }
<        
<  }
< 
1131c846
< <body data-ontouchdown='recxy(event);' data-onmousedown='recxy(event);' ontouchend=" setTimeout(later,2000); " >
---
> <body ontouchend=" setTimeout(later,2000); " >
1139c854
< <form onsubmit='return false;' id='myf' action='#' style='border: 3px solid red; background-color: pink;'>
---
> <form id='myf' action='#' style='border: 3px solid red; background-color: pink;'>
1144c859
< <label>&nbsp;Rating -10 to 10 (-ve <font color='red'><a href='#' id='bactcon' onclick=" fontcolours('Not so much',this); " title="Not so much colour and normal font / big font" style=" colour:red;font-family:verdana; "><font color='red'>Not so much</font></a></font>, &nbsp;+ve <font color='green'><a href='#' id='bactpro' onclick=" fontcolours('Definitely',this); " title="Definitely colour and normal font / big font" style=" colour:green;font-family:verdana; "><font color='green'>Definitely</font></a></font>, &nbsp;background Emoji <a href='#' id='ebactpro' onclick=" emojicodepoints(); " title="Emoji Codepoints eg. 127462.127482">Codepoint(s)</a></font>): <br>&nbsp;<input type='number' name='rating' id='rating' value='0'></input></label><br><br>
---
> <label>&nbsp;Rating -10 to 10 (negative <font color='red'><a href='#' id='bactcon' onclick=" fontcolours('Not so much',this); " title="Not so much colour and normal font / big font" style=" colour:red;font-family:verdana; "><font color='red'>Not so much</font></a></font>, &nbsp;positive <font color='green'><a href='#' id='bactpro' onclick=" fontcolours('Definitely',this); " title="Definitely colour and normal font / big font" style=" colour:green;font-family:verdana; "><font color='green'>Definitely</font></a></font>): <br>&nbsp;<input type='number' name='rating' id='rating' value='0'></input></label><br><br>
1150d864
< &nbsp;<input type='button' id='eisnap' value='HTML Email' onclick="emailhtmlit();" style="display:none;"></input>
1162c876
<     &nbsp;<img onload='thisim=this;' src='http://www.rjmprogramming.com.au/MarkItUp/image.png' onclick="  document.getElementById('file').click();  document.getElementById('file').style.display='inline-block'; if (1 == 2) { document.getElementById('file').click();  document.getElementById('file').style.display='block'; } document.getElementById('dpf').style.display='block'; " alt='Image' title='Image' id=imagefile></img><span id=spanimo></span><input style='display:none;' id='file' type='file' name='file' data-ucapture='user' accept='image/*' data-capture='camera'></input><div id=dpf style='display:BLOCK;'>&nbsp;&nbsp;<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><br>... vs Image URL: <input id='vsiurl' type='text' value='+' onblur='readUBlob(this.value,0,0);' style='width:60%;'></input><br>... Offset X: <input style='width:25%;' id='xoff' type='number' value='0'></input> Offset Y: <input style='width:25%;' id='yoff' type='number' value='0'></input> Rotation<select id='rof' onchange=' maybe(this.value); '><option value=''>in Degrees</option><option value=' of Canvas'> of Canvas</option><option value=' into Canvas'> into Canvas</option></select>: <input style='width:10%;' max='360' min='-360' id='rotation' type='number' value='0'></input><br>Scale Width: <input style='width:120px;' onchange='scalex=this.value;' min='0.0000001' id='scalex' type='number' value='1.0000000' step='0.0000001'></input> Height: <input style='width:120px;' onchange='scaley=this.value;' min='0.0000001' id='scaley' type='number' value='1.0000000' step='0.0000001'></input><br>Cropping X: <input style='width:100px;' onchange='cropx=this.value;' min='0.0' id='cropx' type='number' value='0.00' step='0.01'></input> Y: <input style='width:100px;' onchange='cropy=this.value;' min='0.00' id='cropy' type='number' value='0.00' step='0.01'></input><br>Cropping Width<select id='cselwidth'><option value='%'>%</option><option value='px'>px</option></select>: <input style='width:60px;' onchange='cropwidth=this.value;' min='0.01' id='cropwidth' type='number' value='100.00' step='0.01'></input> Height<select id='cselheight'><option value='%'>%</option><option value='px'>px</option></select>: <input style='width:60px;' onchange='cropheight=this.value;' min='0.01' id='cropheight' type='number' value='100.00' step='0.01'></input><br><br><button id=pcbut onclick='zeroone=1.0; readBlob(0,0);'>Place into Canvas</button><button id=ocbut data-id=oic onclick='zeroone=1.0; readOBlob(0,0);'>Overlay into Canvas</button><select id='imageclickmode' onchange=' if (eval(this.value) == 4) {  icover=true; icontain=false; document.getElementById("pcbut").click();  } else if (eval(this.value) == 6) {  icover=true; icontain=false; document.getElementById("ocbut").click();   } else if (eval(this.value) == 5) { icover=false; icontain=true; document.getElementById("pcbut").click(); } else if (eval(this.value) == 7) { icover=false; icontain=true; document.getElementById("ocbut").click(); } else { imageclickmode=dmyformit(eval(this.value)); } '><option value=0>Scaling as shown above</option><option value=1>Scaling to fit last two click/touch rectangle</option><option value=2>Scaling to suit last two click/touch rectangle width</option><option value=3>Scaling to suit last two click/touch rectangle height</option><option value=4>Cover Place</option><option value=5>Contain Place</option><option value=6>Cover Overlay</option><option value=7>Contain Overlay</option></select><button onclick="icover=true; icontain=false; document.getElementById('pcbut').click();">Cover Place</button><button onclick="icontain=true; icover=false; document.getElementById('pcbut').click();">Contain Place</button><button onclick="icover=true; icontain=false; document.getElementById('ocbut').click();">Cover Overlay</button><button onclick="icontain=true; icover=false; document.getElementById('ocbut').click();">Contain Overlay</button>&nbsp;&nbsp;<select id=phpsel onchange=phpselit(this.value);><option value=''>Image Filter ...</option><option value='emboss'>Emboss</option><option value='edge'>Edge</option><option value='negedge'>Negedge</option><option value='sharpen'>Sharpen</option><option value='boxblur'>Boxblur</option><option value='negate'>Negate</option><option value='colourizered'>Colourizered</option><option value='colourizegreen'>Colourizegreen</option><option value='colourizeblue'>Colourizeblue</option><option value='colourize'>Colourize</option><option value='pixellate'>Pixellate</option><option value='smooth'>Smooth</option><option value='contrast'>Contrast</option><option value='brightness'>Brightness</option><option value='sketchy'>Sketchy</option></select>&nbsp;&nbsp;Grayscale:&nbsp;<input id=chkgrayscale title=Grayscale type=checkbox onchange=oureval('dograyscale=',this.checked);></input>&nbsp;&nbsp;Inverse:&nbsp;<input id=chkinverse title=Inverse type=checkbox onchange=oureval('doinverse=',this.checked);></input>&nbsp;&nbsp;Flip:&nbsp;<input id=chkflip title=Flip type=checkbox onchange=oureval('doflip=',this.checked);></input>&nbsp;&nbsp;Flop:&nbsp;<input id=chkflop title=Flop type=checkbox onchange=oureval('doflop=',this.checked);></input></div><div id='byte_range' style='display:none;'></div><div id='byte_content' style='display:none;'></div><input id='fil' value='' type='hidden'></input><img id='spareimg' src='' style='display:none;'></img>
---
>     &nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/image.png' onclick=" if (1 == 2) { document.getElementById('file').click();  document.getElementById('file').style.display='block'; } document.getElementById('dpf').style.display='block'; " alt='Image' title='Image'></img><input style='display:none;' id='file' type='file' name='file'></input><div id=dpf style='display:BLOCK;'>&nbsp;&nbsp;<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><br>... vs Image URL: <input id='vsiurl' type='url' value='+' onblur='readUBlob(this.value,0,0);' style='width:60%;'></input><br>... Offset X: <input style='width:25%;' id='xoff' type='number' value='0'></input> Offset Y: <input style='width:25%;' id='yoff' type='number' value='0'></input><br><button onclick='readBlob(0,0);'>Place into Canvas</button><button onclick='readOBlob(0,0);'>Overlay into Canvas</button></div><div id='byte_range' style='display:none;'></div><div id='byte_content' style='display:none;'></div><input id='fil' value='' type='hidden'></input><img id='spareimg' src='' style='display:none;'></img>
1192d905
<     <iframe style='display:none;' id='myiframetwo' src='//www.rjmprogramming.com.au/HTMLCSS/world.php'></iframe><img onload=myiminteresting(this); style=display:none; id=myimx src=''></img><form target=myiframenine method=POST style=display:none; action='../PHP/gimp_guillotine_followup.php'><div id=phpaction style=display:none;></div><textarea name=duis id=duis style=display:none;></textarea><input id=bduis type=submit style=display:none; value=Act></input></form><iframe style='display:none;' name='myiframenine' id='myiframenine' src='../PHP/gimp_guillotine_followup.php'></iframe>
1201,1213d913
<   document.querySelector('.readBytesButtons').addEventListener('click', function(evt) {
<   alert(145);
<     alert(2);
<     //wnotc();
<     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);
< 
1257,1285c957,961
<        var prex=-10, prey=-10, touches, first;
<        if (event.touches) { // thanks to https://stackoverflow.com/questions/24567441/how-do-i-detect-two-fingers-at-touchstart-in-javascript
<          if (event.touches.length > 1) {
<             touches = event.changedTouches;
<             first = touches[0];
<             prex = first.clientX;
<             prey = first.clientY;
<          }
<        } else if ((event.pageX || event.pageY)) {
<        prex = event.pageX; // - elemLeft;
<        prey = event.pageY; // - elemTop;
<        } else if (1 == 1) {
<        prex = event.clientX; // - elemLeft;
<        prey = event.clientY; // - elemTop;
<        }
<      //alert('prepreclick ' + prex + ',' + prey);
<        if (eval(prex) <= eval(elem.width) && eval(prey) <= eval(elem.height)) { // && allowc) {
<      //alert('preclick ' + prex + ',' + prey);
<       if (x == 0 && y == 0 && lastx == 0 && lasty == 0) {
<               if (event.touches) { // thanks to https://stackoverflow.com/questions/24567441/how-do-i-detect-two-fingers-at-touchstart-in-javascript
<          if (event.touches.length > 1) {
<             touches = event.changedTouches;
<             first = touches[0];
<             x = first.clientX;
<             y = first.clientY;
<          }
<        } else if (event.pageX || event.pageY) {
<        x = event.pageX; // - elemLeft;
<        y = event.pageY; // - elemTop;
---
>        if (eval(x) <= eval(elem.width) && eval(y) <= eval(elem.height) && allowc) {
>        if (x == 0 && y == 0 && lastx == 0 && lasty == 0) {
>        if (event.pageX || event.pageY) {
>        x = event.pageX - elemLeft;
>        y = event.pageY - elemTop;
1287,1288c963,964
<        x = event.clientX; // - elemLeft;
<        y = event.clientY; // - elemTop;
---
>        x = event.clientX - elemLeft;
>        y = event.clientY - elemTop;
1296,1297c972,973
<        x = event.pageX; // - elemLeft;
<        y = event.pageY; // - elemTop;
---
>        x = event.pageX - elemLeft;
>        y = event.pageY - elemTop;
1299,1300c975,976
<        x = event.clientX; // - elemLeft;
<        y = event.clientY; // - elemTop;
---
>        x = event.clientX - elemLeft;
>        y = event.clientY - elemTop;
1304c980
<     //alert('click ' + x + ',' + y);
---
>     //alert('click');
1335,1336d1010
< <!--img id=scratch src=""></img-->
< <canvas id=scratch width=24 height=24 style="display:none;height:24px;width:24px;"></canvas>