10c10
< var oimg=null;
---
> var oimg;
19d18
< var xxuuubits;
23c22
< xxuuubits=xxuubits[0].split('/');
---
> var xxuuubits=xxuubits[0].split('/');
25,27c24
< xxuubits=document.URL.split('.ht');
< xxuuubits=xxuubits[0].split('/');
< xxuworld=xxuuubits[eval(-1 + xxuuubits.length)].substring(0,1).toUpperCase() + xxuuubits[eval(-1 + xxuuubits.length)].substring(1).replace('_s',' S');
---
> xxuworld=xxlworld.substring(0,1).toUpperCase() + xxlworld.substring(1);
63c60
< toe.href = toe.href + (things[0] + "/~").replace("world.html/~", document.getElementById('myfname').value).replace(xxlworld + ".html/~", document.getElementById('myfname').value).replace("index.html/~", document.getElementById('myfname').value).replace("//~", "/" + document.getElementById('myfname').value).replace("/~", "/" + document.getElementById('myfname').value);
---
> toe.href = toe.href + (things[0] + "/~").replace("world.html/~", document.getElementById('myfname').value).replace("index.html/~", document.getElementById('myfname').value).replace("//~", "/" + document.getElementById('myfname').value).replace("/~", "/" + document.getElementById('myfname').value);
234,239c231,232
< if (eval(document.getElementById('rotation').value) != 0) {
< drawRotated(eval(document.getElementById('rotation').value));
< } else {
< context.drawImage(oimg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
< storecanvascommands("context.drawImage(oimg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
< }
---
> context.drawImage(oimg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
> storecanvascommands("context.drawImage(oimg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
244,249c237,238
< if (eval(document.getElementById('rotation').value) != 0) {
< drawRotated(eval(document.getElementById('rotation').value));
< } else {
< context.drawImage(oimg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
< storecanvascommands("context.drawImage(oimg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
< }
---
> context.drawImage(oimg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
> storecanvascommands("context.drawImage(oimg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
300,306c289,290
< if (eval(document.getElementById('rotation').value) != 0) {
< oimg = ximg;
< drawRotated(eval(document.getElementById('rotation').value));
< } else {
< context.drawImage(ximg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
< storecanvascommands("context.drawImage(ximg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
< }
---
> context.drawImage(ximg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
> storecanvascommands("context.drawImage(ximg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
360,366c344,345
< if (eval(document.getElementById('rotation').value) != 0) {
< oimg = ximg;
< drawRotated(eval(document.getElementById('rotation').value));
< } else {
< context.drawImage(ximg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
< storecanvascommands("context.drawImage(ximg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
< }
---
> context.drawImage(ximg,eval(document.getElementById("xoff").value),eval(document.getElementById("yoff").value));
> storecanvascommands("context.drawImage(ximg," + eval(document.getElementById("xoff").value) + "," + eval(document.getElementById("yoff").value) + ");", true);
515,562d493
< function drawRotated(degrees) { // thanks to http://stackoverflow.com/questions/17411991/html5-canvas-rotate-image
< if (document.getElementById('rof').value.indexOf('of ') != -1) {
< storecanvascommands("context.clearRect(" + 0 + "," + 0 + "," + elem.width + "," + elem.height + ");", false);
< context.clearRect(0,0,elem.width,elem.height);
< }
< //if (document.getElementById('rof').value == '' && oimg != null) {
< //storecanvascommands("context.clearRect(" + 0 + "," + 0 + "," + elem.width + "," + elem.height + ");", false);
< //context.clearRect(0,0,elem.width,elem.height);
<
< // save the unrotated context of the canvas so we can restore it later
< // the alternative is to untranslate & unrotate after drawing
< storecanvascommands("context.save();", false);
< context.save();
< //}
<
< // move to the center of the canvas
< storecanvascommands("context.translate(" + elem.width/2 + "," + elem.height/2 + ");", false);
< context.translate(elem.width/2,elem.height/2);
<
< // rotate the canvas to the specified degrees
< storecanvascommands("context.rotate(" + degrees*Math.PI/180 + ");", false);
< context.rotate(degrees*Math.PI/180);
<
< if (document.getElementById('rof').value != '') oimg = origimg;
< if (document.getElementById('rof').value == '' || oimg != null) {
< // draw the image
< // since the context is rotated, the image will be rotated also
< storecanvascommands("context.drawImage(oimg," + -oimg.width/2 + eval(document.getElementById("xoff").value) + "," + -oimg.height/2 + eval(document.getElementById("yoff").value) + ");", false);
< //context.drawImage(oimg,
< //eval(elem.width/2 + eval(document.getElementById("xoff").value) - Math.sin(degrees*Math.PI/180)*(oimg.height/1)*1),
< //eval(elem.height/2 + eval(document.getElementById("yoff").value) - Math.sin(degrees*Math.PI/180)*(oimg.width/1)*1));
< //alert(98);
< context.drawImage(oimg,-oimg.width/2 + eval(document.getElementById("xoff").value),-oimg.height/2 + eval(document.getElementById("yoff").value));
< //alert(980);
< document.getElementById('rof').value = '';
< oimg = null;
< }
<
< // we’re done with the rotating so restore the unrotated context
< storecanvascommands("context.restore();", false);
< context.restore();
< }
<
< function maybe(tv) {
< if (tv != "" && eval(document.getElementById("rotation").value) != 0) {
< drawRotated(eval(document.getElementById("rotation").value));
< }
< }
566d496
< //alert(9800);
572d501
< //alert(98);
583c512
< hstuff+=" 
... vs Image URL:
... Offset X: Y: Rotation:
![]()
";
---
> hstuff+="
... vs Image URL:
... Offset X: Offset Y:
![]()
";
585c514
< hstuff+="";
---
> hstuff+="";
587c516
< hstuff+=" ";
---
> hstuff+=" ";
590d518
< //alert(hstuff);
593d520
< //alert(980);
619d545
<
658d583
< elem.title='(' + x + ',' + y + ')';
665,677d589
<
< elem.addEventListener('mouseover', function(event) {
< var xx, yy;
< if (event.pageX || event.pageY) {
< xx = event.pageX - elemLeft;
< yy = event.pageY - elemTop;
< } else {
< xx = event.clientX - elemLeft;
< yy = event.clientY - elemTop;
< }
< elem.title='(' + xx + ',' + yy + ')';
< });
<
703d614
< elem.title='(' + x + ',' + y + ')';