// world.js
// RJM Programming
// March, 2016
// Help out world.html and others like it

var longhover="";
var firsthover=1;
var winois=null;
var onlyonce=true;
var ssuffix='', forlater='', naming=[];
var ovr=0;
var lasturl='';
var maptype='img';
var mapext='';
var start=0, stop=0;
var bmode=' an image ';
var imageclickmode=0;  // 0=scaling not based on click/touch, 1=fit to click/touch dimensions, 2=scale proportionally to fit width, 3=scale proportionally to fit height
var rotcmd='', xxtds;
var dmfcnt=0;
var ewtwo=0.0; ehtwo=0.0;
var zeroone=0.0;
var txtoffx=0.0, txtoffy=0.0;
var rotoffx=0.0, rotoffy=0.0;
var scalex=1.0, scaley=1.0;
var origih=0.0, origiw=0.0;
var curih=0.0, curiw=0.0;
var newih=0.0, newiw=0.0;
var cropx=0.00, cropy=0.00;
var cropwidth=100.00, cropheight=100.00;
var butnotfirst=0;
var fcont, w, isScribble=0, isSnapshot=0;
var xua = navigator.userAgent; 
var isiPad = /iPad/i.test(xua) || /iPhone OS 3_1_2/i.test(xua) || /Android/i.test(xua) || /iPhone OS 3_2_2/i.test(xua); 
var isTouch = /touch/i.test(xua) || /Touch/i.test(xua); 
var oimg=null;
var ximg;
var laststop = -1;
var foreachon=true;
var origimg;
var canvascommands = [];
var majors = [-1];
var xxlworld = 'world';
var xxuworld = 'World';
var xxuubits=document.referrer.split('.ht');
var xxuuubits, dot='.';
var iscontact=parent.document.URL.indexOf('Contact');
if (xxuubits.length == 1) {
  xxuubits=document.URL.split('.ht');
}
if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) dot=''; 
xxuuubits=xxuubits[0].split('/');
xxlworld=xxuuubits[eval(-1 + xxuuubits.length)];
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');



function cookievalue(cname) {
  var startcookie = document.cookie.split("; ");
  for (var i=0; i<startcookie.length; i++) {
    if (cname == startcookie[i].split("=")[0]) { 
      return decodeURIComponent(startcookie[i].split("=")[1]);
    }
  }
  return "";
}

function startsnapshot(ins) {
  var startdatauriimage;
  var startcookie = cookievalue("snapshot" + ssuffix);
  if (("" + ins).replace("-","") != ("" + ins)) {
    startdatauriimage = "";
    //if (document.getElementById('divannotation')) document.getElementById('divannotation').style.backgroundImage = '';
    var expiredate = new Date();
    expiredate.setYear(expiredate.getFullYear() - 1);
    document.cookie = "snapshot=; expires=" + expiredate.toGMTString() + "; path=/";
  } else if (startcookie != "") {
    isSnapshot=1;
    //document.getElementById('dsnapshot').innerHTML = '<strike>' + document.getElementById('dsnapshot').innerHTML + '</strike>';
    startdatauriimage = startcookie;
    laststop=0;
    var lines=startdatauriimage.split("\n");
    for (var ij=0; ij<lines.length; ij++) { 
     if (eval(1 + ij) != eval(lines.length)) {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     } else {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     }
    }
    //setcurrentsnapshot(startdatauriimage); 
    //redo();
   for (var iup=0; iup < canvascommands.length; iup++) {
     eval(reworked(canvascommands[iup]));
   }
  } else if (("" + ins).replace("-","") != ("" + ins)) {
    startdatauriimage = "";
    //if (document.getElementById('divannotation')) document.getElementById('divannotation').style.backgroundImage = '';
    var expiredate = new Date();
    expiredate.setYear(expiredate.getFullYear() - 1);
    document.cookie = "snapshot=; expires=" + expiredate.toGMTString() + "; path=/";
  } else {
    startdatauriimage = getchosensnapshot("2");
    setcurrentsnapshot(startdatauriimage); 
  }
}


function finishsnapshot() {
  var expiredate = new Date();
  expiredate.setYear(expiredate.getFullYear()+1);
  document.cookie = "snapshot=" + getcurrentsnapshot() + "; expires=" + expiredate.toGMTString() + "; path=/";
  //if (document.getElementById('divannotation')) document.getElementById('divannotation').style.backgroundImage = 'url(' + lasturl + ')';
}

function getchosensnapshot(setit) {
  if (("" + setit) != "") {
   if (document.getElementById('dsnapshot')) {
     if (forlater == '') {
       if (document.getElementById('dsnapshot').innerHTML.indexOf('<img') == -1) {
         document.getElementById('dsnapshot').innerHTML='';
       } else {
         naming=[];
       }
     }
     if (("" + ssuffix) == "1") {
       //alert(76);
       ssubmit="";
     }
   }
   var expiredate = new Date();
   expiredate.setYear(expiredate.getFullYear()+1);
   document.cookie = "snapshot=" + (cookieredo()) + "; expires=" + expiredate.toGMTString() + "; path=/";
   //if (document.getElementById('divannotation')) document.getElementById('divannotation').style.backgroundImage = 'url(' + lasturl + ')';
  }
  return (cookieredo()); // elem.toDataURL("image/png",0);
}

function querycurrentsnapshot(setit) {
 var iisuffix=1, imagedatauri = cookievalue('snapshot' + ('~' + ssuffix + '~').replace('~1~','').replace('~','').replace('~',''));
 if (setit != "" && ssuffix != '') {
    canvascommands=[];
    //alert('Imagedatauri=' + imagedatauri);
    var lines=imagedatauri.split("\n");
    laststop=0;
    for (var ij=0; ij<lines.length; ij++) { 
     isSnapshot=1;
     if (ij == 0) {
       if (forlater.indexOf('<option') == -1) forlater+='<select id=selcookie onchange=selcchange(this.value)><option value=>Snapshot menu below ...</option><option value=delete>Delete all snapshots</option><option value=add>Add new snapshot</option></select>';
     }
     //if (ij == 0) document.getElementById('dsnapshot').innerHTML = '<strike>' + document.getElementById('dsnapshot').innerHTML + '</strike>';
     if (eval(1 + ij) != eval(lines.length)) {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     } else {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     }
    }
    //setcurrentsnapshot(startdatauriimage); 
    //redo();
   for (var iup=0; iup < canvascommands.length; iup++) {
     eval(reworked(canvascommands[iup]));
   }
    if (document.getElementById('dsnapshot').innerHTML.indexOf('<option') == -1) xforlater();
} else if (setit != "" && cookievalue('snapshot2') == '') {
    naming=[];
    naming.push(nameof(1));
    var lines=imagedatauri.split("\n"), isuffix=1;
    laststop=0;
    for (var ij=0; ij<lines.length; ij++) { 
     isSnapshot=1;
     if (ij == 0) {
       if (forlater.indexOf('<option') == -1) { //document.getElementById('dsnapshot').innerHTML.indexOf('<option') == -1) {
       forlater+='<select id=selcookie onchange=selcchange(this.value)><option value=>Snapshot menu below ...</option><option value=delete>Delete all snapshots</option><option value=add>Add new snapshot</option></select>';
       if (forlater.indexOf('>Overlay snapshot ' + nameof(isuffix) + '<') == -1) forlater=forlater.replace('</select>','<option value=overlay' + isuffix + '>Overlay snapshot ' + nameof(isuffix) + '</option><option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option><option value=clear' + isuffix + '>Clear snapshot ' + nameof(isuffix) + '</option></select>');
       }
     }
     //if (ij == 0) document.getElementById('dsnapshot').innerHTML = '<strike>' + document.getElementById('dsnapshot').innerHTML + '</strike>';
     if (eval(1 + ij) != eval(lines.length)) {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     } else {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     }
    }
    //setcurrentsnapshot(startdatauriimage); 
    //redo();
   for (var iup=0; iup < canvascommands.length; iup++) {
     eval(reworked(canvascommands[iup]));
   }
    if (document.getElementById('dsnapshot').innerHTML.indexOf('<option') == -1) xforlater();
 } else if (setit != "") {
    while (imagedatauri != '') {
    naming.push(nameof(iisuffix));
    var lines=imagedatauri.split("\n"), isuffix=1;
    laststop=0;
    for (var ij=0; ij<lines.length; ij++) { 
     isSnapshot=1;
     if (ij == 0) {
       if (forlater.indexOf('<option') == -1) { //document.getElementById('dsnapshot').innerHTML.indexOf('<option') == -1) {
       forlater+='<select id=selcookie onchange=selcchange(this.value)><option value=>Snapshot menu below ...</option><option value=delete>Delete all snapshots</option><option value=add>Add new snapshot</option></select>';
       if (forlater.indexOf('>Overlay snapshot ' + nameof(isuffix) + '<') == -1) forlater=forlater.replace('</select>','<option value=overlay' + isuffix + '>Overlay snapshot ' + nameof(isuffix) + '</option><option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option><option value=clear' + isuffix + '>Clear snapshot ' + nameof(isuffix) + '</option></select>');
       } else {
       if (forlater.indexOf('>Overlay snapshot ' + nameof(isuffix) + '<') == -1) forlater=forlater.replace('</select>','<option value=overlay' + iisuffix + '>Overlay snapshot ' + nameof(iisuffix) + '</option><option value=name' + iisuffix + '>Name snapshot ' + nameof(iisuffix) + '</option><option value=clear' + iisuffix + '>Clear snapshot ' + nameof(iisuffix) + '</option></select>');
       }
     }
     //if (ij == 0) document.getElementById('dsnapshot').innerHTML = '<strike>' + document.getElementById('dsnapshot').innerHTML + '</strike>';
     if (eval(1 + ij) != eval(lines.length)) {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     } else {
       storecanvascommands(lines[ij], false);
       majors[laststop]=ij;
     }
    }
    //setcurrentsnapshot(startdatauriimage); 
    //redo();
    iisuffix++;
    imagedatauri=cookievalue("snapshot" + iisuffix);
    if (imagedatauri != '') forlater=forlater.replace('</select>','<option value=overlay' + iisuffix + '>Overlay snapshot ' + nameof(iisuffix) + '</option><option value=name' + iisuffix + '>Name snapshot ' + nameof(iisuffix) + '</option><option value=clear' + iisuffix + '>Clear snapshot ' + nameof(iisuffix) + '</option></select>');

    //alert('iisuffix=' + iisuffix + ' imagedatauri=' + imagedatauri);
    }
    if (document.getElementById('dsnapshot').innerHTML.indexOf('<option') == -1) xforlater();
}
 return imagedatauri;
}

function setcurrentsnapshot(imagedatauri) {
 var koff=-1;
 var imageoverlay = location.search.split('overlay=')[1] ? location.search.split('overlay=')[1].split('&')[0] : '';
 document.getElementById('myiframe').width='400px';
 var tds=document.getElementsByTagName('img');
 if (document.URL.indexOf('/india.') != -1) koff--;
 origimg=tds[eval(koff + tds.length)];
 origih=origimg.height;
 origiw=origimg.width;
 if (imagedatauri != '') {
   if (imageoverlay == '') {
     tds[eval(koff + tds.length)].src=(imagedatauri);
     tds=document.getElementsByTagName('img');
     origimg=tds[eval(koff + tds.length)];
     origih=origimg.height;
     origiw=origimg.width;
     context.clearRect(0, 0, elem.width, elem.height);
     elem.width=origiw;
     elem.height=origih;
     document.getElementById('myiframe').style.left=origiw + 'px';
     context.drawImage(tds[eval(koff + tds.length)],0,0);
   } else {
     tds[eval(koff + tds.length)].src=(imagedatauri);
     tds=document.getElementsByTagName('img');
     context.drawImage(tds[eval(koff + tds.length)],0,0);
   }
 }
}

function getcurrentsnapshot() {
  return (cookieredo()); //elem.toDataURL("image/png",0);
}


function dmyformit(newval) {
  var recbit='', audiobit='';
  if (bmode == ' an image ') {
  if (eval(newval) == 0) {
    dmfcnt=-Math.abs(dmfcnt);
  } else if (eval(newval) > 0) {
    dmfcnt=Math.abs(dmfcnt);
    if (dmfcnt == 0) dmfcnt=1;
  } else {
    if (eval(dmfcnt) > 0) {
      var dmisone=document.getElementById('mapcoords' + dmfcnt);
      var dmis=document.getElementById('dmyform');
      var dmxis=document.getElementById('dmyxform');
      if (dmis != null) {
        if (dmisone == null) {
          audiobit="<img id=iaudio" + dmfcnt + ' src="http://www.rjmprogramming.com.au/MarkItUp/mp.png" title="http://www.rjmprogramming.com.au/MarkItUp/html/sync.php?nochoose=y&aid=' + dmfcnt + '" onclick="  if (ovr != 0 || navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) { ovr=0;  bmode=' + "'" + ' an audio ' + "'" + ';  document.getElementById(' + "'" + 'file' + "'" + ').capture=' + "'" + 'capture' + "'" + '; document.getElementById(' + "'" + 'file' + "'" + ').click();   } else {  window.open(this.title,' + "'" + '_blank' + "','" + 'top=200,left=200,height=300,width=300' + "'" + '); } "></img><a title=Browse href=# onclick=" ovr=1; document.getElementById(' + "'" + 'iaudio' + dmfcnt +  "'" + ').click(); ">' + dot + '</a><iframe src="http://www.rjmprogramming.com.au/HTMLCSS/world.php?lookfor=' + dmfcnt + '" title="Audio listener ' + dmfcnt + '" style="display:none"></iframe>';
          //audiobit="<iframe width=500 height=500 id=iaudio" + dmfcnt + ' src="http://www.rjmprogramming.com.au/MarkItUp/html/sync.php?nochoose=y&aid=' + dmfcnt + '" onclick=" if (1 == 2) { window.open(this.title,' + "'" + '_blank' + "'" + ',top=200,left=200,height=300,width=300); }"></iframe>';
          recbit='<br>Url ' + dmfcnt + ": <input onblur=\" document.getElementById('mapxclick" + dmfcnt + "').value=this.value; \" name=mapclick" + dmfcnt + ' id=mapclick' + dmfcnt + " type=url value=></input> at <input onblur=\" document.getElementById('mapxcoords" + dmfcnt + "').value=this.value; \" name=mapcoords" + dmfcnt + ' id=mapcoords' + dmfcnt + ' type=text value=' + x + ',' + y + ',' + lastx + ',' + lasty + '></input><input name=mapaudio' + dmfcnt + ' id=mapxaudio' + dmfcnt + ' type=hidden value=></input><input name=mapext' + dmfcnt + ' id=mapxext' + dmfcnt + ' type=hidden value=' + mapext + '></input><input name=maptype' + dmfcnt + ' id=mapxtype' + dmfcnt + ' type=hidden value=' + maptype + '></input>' + audiobit;
          dmis.innerHTML+=recbit;
          recbit="<input name=mapclick" + dmfcnt + ' id=mapxclick' + dmfcnt + ' type=hidden value=></input><input name=mapcoords' + dmfcnt + ' id=mapxcoords' + dmfcnt + ' type=hidden value=' + x + ',' + y + ',' + lastx + ',' + lasty + '></input></input><input name=mapaudio' + dmfcnt + ' id=mapaudio' + dmfcnt + ' type=hidden value=></input><input name=mapext' + dmfcnt + ' id=mapext' + dmfcnt + ' type=hidden value=' + mapext + '></input><input name=maptype' + dmfcnt + ' id=maptype' + dmfcnt + ' type=hidden value=' + maptype + '></input>';
          dmxis.innerHTML+=recbit;
          dmisone=document.getElementById('mapcoords' + dmfcnt);
        }
        dmfcnt++;
      }
    }
  }
  }
}

function postpostnewiw(proposediw, oh, ow, oheight, ycrop) {
 var deg;
 deg=eval(document.getElementById('rotation').value);
 var xx=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lasty - y) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lastx - x);
 var yy=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lastx - x) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lasty - y);
 if (imageclickmode == 0 || xx == 0.0) return proposediw;
 if (imageclickmode == 1) {
   //alert("proposediw=" + proposediw + " vs returned=" + xx);
   return Math.abs(lastx - x); //Math.abs(xx);
 }
 if (imageclickmode == 2) return Math.abs(lastx - x); //Math.abs(xx);
   //alert("Math.abs(lasty - y)=" + Math.abs(lasty - y) + " and proposedH=" + Math.abs(oh) + " and Math.abs(lastx - x)=" + Math.abs(lastx - x) + " so newiw becomes=" +  eval( (Math.abs(lasty - y) / Math.abs(oh)) * Math.abs(lastx - x)));
 return eval( (Math.abs(yy) / Math.abs(oh)) * Math.abs(ow)); //lastx - x));
}

function postpostnewih(proposedih, ow, oh, owidth, xcrop) {
 var deg;
 deg=eval(document.getElementById('rotation').value);
 var xx=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lasty - y) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lastx - x);
 var yy=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lastx - x) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lasty - y);
 if (imageclickmode == 0 || yy == 0.0) return proposedih;
 if (imageclickmode == 1)  {
   //alert("proposedih=" + proposedih + " vs returned=" + yy);
   return Math.abs(lasty - y); //Math.abs(yy);
 }
 if (imageclickmode == 3) return Math.abs(lasty - y); //Math.abs(yy);
 return eval( (Math.abs(xx) / Math.abs(ow)) * Math.abs(oh)); //lasty - y));
}


function offymaybe(pxoff, nh, nw) {
    var deg;
    if (imageclickmode != 0 && eval(document.getElementById('rotation').value) != 0) {
      deg=eval(document.getElementById('rotation').value);
      //alert("Xwas=" + pxoff + " but now to become " +  eval(pxoff + Math.abs(Math.sin(deg*Math.PI/180)) * nh / 2 + Math.abs(Math.cos(deg*Math.PI/180)) * nw / 2));
      return eval(pxoff + Math.abs(Math.sin(deg*Math.PI/180)) * nh / 2 + Math.abs(Math.cos(deg*Math.PI/180)) * nw / 2);
    }
    return pxoff;
}

function offxmaybe(pyoff, nw, nh) {
    var deg;
    if (imageclickmode != 0 && eval(document.getElementById('rotation').value) != 0) {
      deg=eval(document.getElementById('rotation').value);
      //alert("Ywas=" + pyoff + " but now to become " +  eval(pyoff + Math.abs(Math.cos(deg*Math.PI/180)) * nw / 2 + Math.abs(Math.sin(deg*Math.PI/180)) * nh / 2));
      return eval(pyoff + Math.abs(Math.cos(deg*Math.PI/180)) * nw / 2 + Math.abs(Math.sin(deg*Math.PI/180)) * nh / 2);
    }
    return pyoff;
}

function postscalew(proposedscalew, oh, ow) {
 var deg;
 deg=eval(document.getElementById('rotation').value);
 var yy=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lasty - y) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lastx - x);
 var xx=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lastx - x) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lasty - y);
 if (imageclickmode == 0 || xx == 0.0) return proposedscalew;
 if (imageclickmode == 1) {
   //alert("proposedscalew=" + proposedscalew + " vs returned=" + Math.abs(xx) / Math.abs(ow));
   return Math.abs(xx) / Math.abs(ow);
 }
 if (imageclickmode == 2) return Math.abs(xx) / Math.abs(ow);
   //alert("Math.abs(lasty - y)=" + Math.abs(lasty - y) + " and proposedH=" + Math.abs(oh) + " and Math.abs(lastx - x)=" + Math.abs(lastx - x) + " so newiw becomes=" +  eval( (Math.abs(lasty - y) / Math.abs(oh)) * Math.abs(lastx - x)));
 return eval( (Math.abs(yy) / Math.abs(oh)) * Math.abs(ow))  / Math.abs(oh); //lastx - x));
}

function postscaleh(proposedscaleh, ow, oh) {
 var deg;
 deg=eval(document.getElementById('rotation').value);
 var yy=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lasty - y) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lastx - x);
 var xx=Math.abs(Math.sin(deg*Math.PI/180)) * Math.abs(lastx - x) + Math.abs(Math.cos(deg*Math.PI/180)) * Math.abs(lasty - y);
 if (imageclickmode == 0 || yy == 0.0) return proposedscaleh;
 if (imageclickmode == 1)  {
   //alert("proposedscaleh=" + proposedscaleh + " vs returned=" + Math.abs(yy) / Math.abs(oh));
   return Math.abs(yy) / Math.abs(oh);
 }
 if (imageclickmode == 3) return Math.abs(yy) / Math.abs(oh);
 return eval( (Math.abs(xx) / Math.abs(ow)) * Math.abs(oh))  / Math.abs(ow); //lasty - y));
}

function okpostscalew(proposedscalew, oh, ow) {
 if (imageclickmode == 0 || Math.abs(lastx - x) == 0.0) return proposedscalew;
 if (imageclickmode == 1) {
   //alert("proposediw=" + proposediw + " vs returned=" + Math.abs(lastx - x));
   return Math.abs(lastx - x) / Math.abs(ow);
 }
 if (imageclickmode == 2) return Math.abs(lastx - x) / Math.abs(ow);
   //alert("Math.abs(lasty - y)=" + Math.abs(lasty - y) + " and proposedH=" + Math.abs(oh) + " and Math.abs(lastx - x)=" + Math.abs(lastx - x) + " so newiw becomes=" +  eval( (Math.abs(lasty - y) / Math.abs(oh)) * Math.abs(lastx - x)));
 return eval( (Math.abs(lasty - y) / Math.abs(oh)) * Math.abs(ow))  / Math.abs(oh); //lastx - x));
}

function okpostscaleh(proposedscaleh, ow, oh) {
 if (imageclickmode == 0 || Math.abs(lasty - y) == 0.0) return proposedscaleh;
 if (imageclickmode == 1)  {
   //alert("proposedih=" + proposedih + " vs returned=" + Math.abs(lasty - y));
   return Math.abs(lasty - y) / Math.abs(oh);
 }
 if (imageclickmode == 3) return Math.abs(lasty - y) / Math.abs(oh);
 return eval( (Math.abs(lastx - x) / Math.abs(ow)) * Math.abs(oh))  / Math.abs(ow); //lasty - y));
}

function postnewiw(proposediw, oh, ow, oheight, ycrop) {
 if (imageclickmode == 0 || Math.abs(lastx - x) == 0.0) return proposediw;
 if (imageclickmode == 1) {
   //alert("proposediw=" + proposediw + " vs returned=" + Math.abs(lastx - x));
   return Math.abs(lastx - x);
 }
 if (imageclickmode == 2) return Math.abs(lastx - x);
   //alert("Math.abs(lasty - y)=" + Math.abs(lasty - y) + " and proposedH=" + Math.abs(oh) + " and Math.abs(lastx - x)=" + Math.abs(lastx - x) + " so newiw becomes=" +  eval( (Math.abs(lasty - y) / Math.abs(oh)) * Math.abs(lastx - x)));
 return eval( (Math.abs(lasty - y) / Math.abs(oh)) * Math.abs(ow)); //lastx - x));
}

function postnewih(proposedih, ow, oh, owidth, xcrop) {
 if (imageclickmode == 0 || Math.abs(lasty - y) == 0.0) return proposedih;
 if (imageclickmode == 1)  {
   //alert("proposedih=" + proposedih + " vs returned=" + Math.abs(lasty - y));
   return Math.abs(lasty - y);
 }
 if (imageclickmode == 3) return Math.abs(lasty - y);
 return eval( (Math.abs(lastx - x) / Math.abs(ow)) * Math.abs(oh)); //lasty - y));
}


function capture(toh, tos, toe) {
  if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i) && iscontact == -1) {
    if (document.getElementById('myiemail').value.indexOf('@') == -1) {
      var femail = prompt('Please supply the Email To address', '');
      if (femail == null) femail = '';
      if (femail.indexOf('@') != -1) {
        fixmyemail(femail, 0);
      }
    }
  } else {
  //if (iscontact != -1 && !document.getElementById('myiemail')) alert(7);
      if (document.getElementById('myiemail')) {
   if (document.getElementById('myiemail').value.indexOf('@') != -1) {
 // if (iscontact != -1) alert(70);
    document.getElementById('mode').value = '';
    document.getElementById('ismobile').value = 'y';
    document.getElementById('myisubject').style.display = 'inline';
    document.getElementById('myiemail').style.display = 'inline';
    document.getElementById('myform').action = document.getElementById('myform').action.replace('?mode=1', '');
    document.getElementById('myform').action = document.getElementById('myform').action.replace('mode=1', 'mode=');
    //document.getElementById('myemail').href = '#' + document.getElementById('myemail').href;
 // if (iscontact != -1) alert(700);
   }
   }
  }
 // if (iscontact != -1) alert(7000);
  var pretoh = elem.toDataURL("image/png",0);
  //toh.value = pretoh.substr(22, pretoh.length); 
  var xbits=pretoh.split(',');
  //toh.value = pretoh.substr(eval(pretoh.indexOf(',') + 1), pretoh.length); 
 // if (iscontact != -1) alert(xbits[0]);
  toh.value = pretoh.replace(xbits[0] + ',', '');
 // if (iscontact != -1) alert(70000);
 if (iscontact == -1) {
  if (1 == 1) {
  tos.click();
  } else {
  document.getElementById('myform').submit();
  }
 }
//  if (iscontact != -1) alert(700000);
  var things = document.URL.split("?");
 // if (iscontact != -1) alert("document.getElementById('myfname').value=" + document.getElementById('myfname').value);
  if (iscontact != -1) {
  toe.href = toe.href.split('ody=')[0].replace('fill.in.email@address',document.getElementById('myto').value).replace('tJUNK=', 't=' + encodeURIComponent(document.getElementById('mysubject').value) + '%20to%20').replace('&b','&cc=' + encodeURIComponent(document.getElementById('mycc').value) + '&bcc=' + encodeURIComponent(document.getElementById('mybcc').value) + '&b') + 'ody=' + encodeURIComponent(document.getElementById('myfeedback').value); // + (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);
  } else {
  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);
  }
  //if (iscontact != -1) alert(toe.href);
 if (iscontact != -1) {
  toe.click();
 } else {
  if (document.getElementById('to').value.indexOf('@') != -1 || navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) {
  toe=toe;
  } else {
  toe.click();
  }
}
}

function reworked(inm) {
  var koff=-1;  
  var inmbits=inm.split('/' + '/');
  if (inmbits.length > 1) {
    var ybits=inmbits[0].split('(');
    if (ybits.length > 1 && inmbits[1].substring(0,6) != ' Name:') {
    var zbits=ybits[1].split(',');
    xxtds=document.getElementsByTagName('img');
    xxtds[eval(koff + xxtds.length)].src=inmbits[1].replace(';','').trim();
    eval(zbits[0] + " = xxtds[" + eval(koff + xxtds.length) + "]");
    }
  }
  return inmbits[0].trim();
}

function nameof(what) {
  var nwhat = cookievalue("snapshot" + ("~" + what + "~").replace("~1~","").replace("~","").replace("~",""));
  if (nwhat != "") {
    var namebits=nwhat.split('/' + '/ Name:');
    if (namebits.length > 1) {
      var postnamebits=namebits[1].split("\n");
      return what + ' [' + postnamebits[0].replace(';','').trim() + ']';
    }
  }
  return what;
}

function fullcookieredo() {
  var xssuffix="", isuffix=1, xprefix="", fc="", jsuffix=0;
  if (("" + ssuffix).indexOf("-") != -1) jsuffix=eval(ssuffix);
  while (cookievalue("snapshot" + xssuffix) != "") {
    if (eval(jsuffix + isuffix) != 0) {
    if (eval(naming.length) < isuffix) {
      scol=';';
      naming.push(nameof(isuffix));
    } else {
      scol=';';
      if (naming[isuffix] != '') {
        if (cookievalue("snapshot" + xssuffix).indexOf('Name:' + naming[isuffix] + ';') == -1) {
          if (naming.length > isuffix) scol+=' /' + '/ Name:' + naming[isuffix] + ";\n";
        }
      }
    }
    if (scol != ';') {
    var expiredate = new Date();
    expiredate.setYear(expiredate.getFullYear() + 1);
    document.cookie = "snapshot" + xssuffix + "=" + encodeURIComponent(cookievalue("snapshot" + xssuffix).replace(';',scol)) + "; expires=" + expiredate.toGMTString() + "; path=/";
    }
    fc += xprefix + encodeURIComponent(cookievalue("snapshot" + xssuffix).replace(';',scol));
    if (forlater.indexOf('>Overlay snapshot ' + nameof(isuffix) + '<') == -1) forlater=forlater.replace('</select>','<option value=overlay' + isuffix + '>Overlay snapshot ' + nameof(isuffix) + '</option><option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option><option value=clear' + isuffix + '>Clear snapshot ' + nameof(isuffix) + '</option></select>');
    } else {
    fc += xprefix + "";
    if (forlater.indexOf('>Name snapshot ' + nameof(isuffix) + '<') == -1) forlater=forlater.replace('</select>','<option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option></select>');
    }
    isuffix++;
    xssuffix="" + isuffix;
    xprefix="; snapshot" + isuffix + "=";
  }
  return fc;
}

function cookieredo() {
   var cstr=" ", isuffix=1;
   //alert(canvascommands.length);
   if (ssuffix.trim() == '') {
    for (var iup=0; iup < canvascommands.length; iup++) {
     cstr += canvascommands[iup] + " \n";
    }
   }
   if (ssuffix == ' ') {
     if (naming.length <= 1) naming.push("");
     isuffix=eval(0 + naming.length);
     //alert('isuffix=' + isuffix);
     ssuffix=isuffix;
     document.getElementById('selcookie').innerHTML+='<option value=overlay' + isuffix + '>Overlay snapshot ' + nameof(isuffix) + '</option><option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option><option value=clear' + isuffix + '>Clear snapshot ' + nameof(isuffix) + '</option>';
   } else if (cookievalue("snapshot") != "") {
     if (ssuffix == '' && forlater.indexOf('<option') == -1) forlater+='<select id=selcookie onchange=selcchange(this.value)><option value=>Snapshot menu below ...</option><option value=delete>Delete all snapshots</option><option value=add>Add new snapshot</option></select>';
     var afc=fullcookieredo();
     naming.push("");
     //return afc + "; snapshot" + ssuffix + "=" + encodeURIComponent(cstr);
     return encodeURIComponent(cstr);
   } else if (ssuffix == '') {
     if (forlater.indexOf('>Overlay snapshot ' + nameof(eval(1 + naming.length)) + '<') == -1) {
       naming.push("");
     }
     isuffix=naming.length;
     if (ssuffix == '') {
       if (forlater.indexOf('<option') == -1) { //document.getElementById('dsnapshot').innerHTML.indexOf('<option') == -1) {
       forlater+='<select id=selcookie onchange=selcchange(this.value)><option value=>Snapshot menu below ...</option><option value=delete>Delete all snapshots</option><option value=add>Add new snapshot</option></select>';
       if (forlater.indexOf('>Overlay snapshot ' + nameof(isuffix) + '<') == -1) forlater=forlater.replace('</select>','<option value=overlay' + isuffix + '>Overlay snapshot ' + nameof(isuffix) + '</option><option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option><option value=clear' + isuffix + '>Clear snapshot ' + nameof(isuffix) + '</option></select>');
       setTimeout(xforlater, 1000);
       } else {
       document.getElementById('selcookie').innerHTML+='<option value=overlay' + isuffix + '>Overlay snapshot ' + nameof(isuffix) + '</option><option value=name' + isuffix + '>Name snapshot ' + nameof(isuffix) + '</option><option value=clear' + isuffix + '>Clear snapshot ' + nameof(isuffix) + '</option>';
       }
     }
     //document.getElementById('dsnapshot').innerHTML+='<select id=selcookie onchange=selcchange(this.value)><option value=>Snapshot menu below ...</option></select>';
   }
     //alert("forlater=" + forlater);
   return encodeURIComponent(cstr);
}

function xforlater() {
     //alert(forlater);
     if (cookievalue("snapshot") != "") document.getElementById('dsnapshot').innerHTML+=forlater;
}

function selcchange(selc) {
  //alert(selc);
  var nameit=selc.replace('name','');
  var overlayit=selc.replace('overlay','');
  var clearit=selc.replace('clear','');
  var deleteit=selc.replace('delete','');
  var addit=selc.replace('add','');
  if (nameit != selc) {
    var nm=prompt("Please name snapshot " + nameof(nameit), nameof(nameit).replace(nameit,'').replace(' [','').replace(']',''));
    if (nm != null) {
      if (nm != '' && nm != nameof(nameit).replace(nameit,'').replace(' [','').replace(']','')) {
        ssuffix=eval(nameit);
        var huhn='[' + nameof(nameit).replace(nameit,'').replace(' [','').replace(']','').trim() + ']';
         if (("" + nameit) == "1") {
    var expiredate = new Date();
    expiredate.setYear(expiredate.getFullYear() + 1);
    document.cookie = "snapshot=" + encodeURIComponent(cookievalue("snapshot").replace(';','; /' + '/ Name:' + nm + ';')) + "; expires=" + expiredate.toGMTString() + "; path=/";
    }
       naming[eval('0' + nameit)]=nm;
        //alert(document.getElementById('selcookie').innerHTML + ' ..... huhn=' + huhn);
        if (huhn == '[]') {
          huhn=' snapshot ' + nameit + '<';
          nm=' snapshot ' + nameit + ' [' + nm + ']<';
        } else {
          if (document.getElementById('selcookie').innerHTML.indexOf(huhn) == -1) {
            huhn=' snapshot ' + nameit + '<';
            nm=' snapshot ' + nameit + ' [' + nm + ']<';
          } else {
            nm='[' + nm + ']';
          }
        }
        //alert(document.getElementById('selcookie').innerHTML + ' ... huhn=' + huhn);
        document.getElementById('selcookie').innerHTML=document.getElementById('selcookie').innerHTML.replace(huhn,nm).replace(huhn,nm).replace(huhn,nm);
        getchosensnapshot("2");
        //alert(cookievalue("snapshot"));
        ssuffix='';
      }
    }
  }
  if (overlayit != selc) {
    ssuffix=eval(overlayit);
    //alert('ssuffix=' + eval(overlayit));
    querycurrentsnapshot("setifthere");  
    ssuffix='';
  }
  if (clearit != selc) {
    ssuffix=eval(-clearit);
    getchosensnapshot("2");
    ssuffix='';
  }
  if (deleteit != selc) {
    var expiredate = new Date();
    expiredate.setYear(expiredate.getFullYear() - 1);
    document.cookie = "snapshot=; expires=" + expiredate.toGMTString() + "; path=/";
    var ksuffix=1;
    while (ksuffix < naming.length) {
      ksuffix++;
      document.cookie = "snapshot" + ksuffix + "=; expires=" + expiredate.toGMTString() + "; path=/";
    }
    document.getElementById('selcookie').innerHTML='<option value=>Snapshot menu below ...</option><option value=add>Add new snapshot</option>';
    ssuffix='';
    naming=[];
  }
  if (addit != selc) {
    ssuffix=' ';
    var appbits=cookieredo();
    //alert('was=' + document.cookie);
    //document.cookie = document.cookie.replace("expires=", "snapshot" + ssuffix + "=" + appbits + "; expires=");
    var expiredate = new Date();
    expiredate.setYear(expiredate.getFullYear() + 1);
    var wasi=naming.length;
    if (wasi == 0) naming.push("");
    document.cookie = "snapshot" + ('~' + naming.length + '~').replace('~1~','').replace('~','').replace('~','') + "=" + appbits + "; expires=" + expiredate.toGMTString() + "; path=/";
    //getchosensnapshot("2");
    //alert('is=' + document.cookie);
    ssuffix='';
    if (wasi != 0) naming.push("");
  }
}



function redo() {
 var upto=-1, iup;
 if (eval(laststop) < eval(-1 + majors.length)) {
  laststop++;
  upto = majors[laststop];
 } else if (eval(laststop) == eval(-1 + majors.length)) {
  upto = majors[laststop];
 }
 
 context.clearRect(0, 0, elem.width, elem.height);
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
 newiw=postnewiw(eval(eval(origiw - cropx)  * scalex), eval(origih - cropy), eval(origiw - cropx), origih, cropy);
 newih=postnewih(eval(eval(origih - cropy)  * scaley), eval(origiw - cropx), eval(origih - cropy), origiw, cropx);
 //alert("newiw=" + newiw + " and newih=" + newih);
 if (imageclickmode != 0) {
          context.drawImage(origimg,Math.min(x,lastx),Math.min(y,lasty),newiw,newih);
 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
 context.drawImage(origimg,eval(cropx),eval(cropy),eval(eval(origiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(origih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),0,0,newiw,newih);
 } else {
 context.drawImage(origimg,0,0,newiw,newih);
 }
 } else {
 context.drawImage(origimg,0,0);
 }
 if (eval(upto) >= 0) {
   for (var iup=0; iup <= upto; iup++) {
     eval(reworked(canvascommands[iup]));
   }
 }
}

function undo() {
 var upto=-1, iup;
 if (butnotfirst != 0) {
  if (oimg != null) origimg=oimg;
  upto=eval(-1 + canvascommands.length);
  elem.style.backgroundColor='transparent';
 } else if (eval(laststop) > 0) {
  laststop--;
  upto = majors[laststop];
 } else if (eval(laststop) == 0) {
  laststop = -1;
 }

 
 context.clearRect(0, 0, elem.width, elem.height);
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
 newiw=postnewiw(eval(eval(origiw - cropx)  * scalex), eval(origih - cropy), eval(origiw - cropx), origih, cropy);
 newih=postnewih(eval(eval(origih - cropy)  * scaley), eval(origiw - cropx), eval(origih - cropy), origiw, cropx);
 //alert("neWiw=" + newiw + " and newih=" + newih);
 if (imageclickmode != 0) {
 if (butnotfirst == 0) context.drawImage(origimg,Math.min(x,lastx),Math.min(y,lasty),newiw,newih);
 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
 if (butnotfirst == 0) context.drawImage(origimg,eval(cropx),eval(cropy),eval(eval(origiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(origih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),0,0,newiw,newih);
 } else {
 if (butnotfirst == 0) context.drawImage(origimg,0,0,newiw,newih);
 }
 } else {
 if (butnotfirst == 0) context.drawImage(origimg,0,0);
 }
 if (eval(upto) >= 0) {
   for (var iup=0; iup <= upto; iup++) {
     eval(canvascommands[iup]);
   }
 }
 butnotfirst = 0;
}

function storecanvascommands(thecmd, major) {
 //alert(thecmd + " " + ewtwo + "," + ehtwo);
 if (thecmd.indexOf('.drawImage(') != -1) {
   if (document.getElementById('vsiurl').value.replace('+','') != '') {
     thecmd+=' /' + '/ ' + document.getElementById('vsiurl').value.replace('+','') + ';';
   }
 }
 canvascommands.push(thecmd);
 if (major) {
   laststop = majors.length;
   majors.push(canvascommands.length);
 }
}

function fixmyemail(tval, issubj) {
 // mailto:fill.in.email@address?subject=My%20World%20Map&body=
 if (tval != '') {
  ourbits = document.getElementById('myemail').href.split('?subject=');
  if (issubj == 0) {
   if (ourbits.length > 1) { 
    prebits = ourbits[0].split(':');
    document.getElementById('to').value = tval;
    if (iscontact != -1) {
    document.getElementById('myemail').href = prebits[0] + ':' + encodeURIComponent(tval) + '?subject=' + ourbits[eval(-1 + ourbits.length)] + '&body=' + encodeURIComponent(document.getElementById('myfeedback').value);
    } else {
    document.getElementById('myemail').href = prebits[0] + ':' + encodeURIComponent(tval) + '?subject=' + ourbits[eval(-1 + ourbits.length)];
    }
    if (document.getElementById('myiemail').value.indexOf('@') != -1) {
    document.getElementById('mode').value = '';
    document.getElementById('ismobile').value = 'y';
    document.getElementById('myisubject').style.display = 'inline';
    document.getElementById('myiemail').style.display = 'inline';
    document.getElementById('myform').action = document.getElementById('myform').action.replace('?mode=1', '');
    document.getElementById('myform').action = document.getElementById('myform').action.replace('mode=1', 'mode=');
    //document.getElementById('myemail').href = '#' + document.getElementById('myemail').href;
    }
   }
  } else {
   var pbits = "";
   if (ourbits.length > 1) { 
    pbits = ourbits[1].split('&');
    document.getElementById('mysubject').value = tval;
    if (pbits.length > 1) {
    document.getElementById('myemail').href = ourbits[0] + '?subject=' + encodeURIComponent(tval) + '&' + pbits[1];
    } else {
    document.getElementById('myemail').href = ourbits[0] + '?subject=' + encodeURIComponent(tval);
    }
   }
  }
 }
}

function dorectangle() { // new idea ... March, 2016
    if (eval(document.getElementById('rotation').value) != 0 && rotcmd == "" && 'dorectangle' != 'dorectangle') {
    rotcmd="dorectangle();";
    drawRotated(eval(document.getElementById('rotation').value));
    } else {
    rotcmd="";
    //context.strokeStyle=document.getElementById('mycolour').value;
    context.fillStyle=document.getElementById('mycolour').value;
    storecanvascommands("context.fillStyle='" + document.getElementById('mycolour').value + "';", false);
    context.fillRect(eval(rotoffx + Math.min(x,lastx)), eval(rotoffy + Math.min(y,lasty)), Math.abs(x - lastx), Math.abs(y - lasty));
    storecanvascommands("context.fillRect(" + eval(rotoffx + Math.min(x,lastx)) + "," +eval(rotoffy + Math.min(y,lasty)) + "," + Math.abs(x - lastx) + "," + Math.abs(y - lasty) + ");", true);
  rotoffx=0.0;
  rotoffy=0.0;
    }
}

function dorectangleborder() { // new idea ... March, 2016
    if (eval(document.getElementById('rotation').value) != 0 && rotcmd == "" && 'dorectangle' != 'dorectangle') {
    rotcmd="dorectangleborder();";
    drawRotated(eval(document.getElementById('rotation').value));
    } else {
    rotcmd="";
    context.strokeStyle=document.getElementById('mycolour').value;
    //context.fillStyle=document.getElementById('mycolour').value;
    storecanvascommands("context.strokeStyle='" + document.getElementById('mycolour').value + "';", false);
    context.rect(eval(rotoffx + Math.min(x,lastx)), eval(rotoffy + Math.min(y,lasty)), Math.abs(x - lastx), Math.abs(y - lasty));
    storecanvascommands("context.rect(" + eval(rotoffx + Math.min(x,lastx)) + "," + eval(rotoffy + Math.min(y,lasty)) + "," + Math.abs(x - lastx) + "," + Math.abs(y - lasty) + ");", false);
    context.stroke();
    storecanvascommands("context.stroke();", true);
  rotoffx=0.0;
  rotoffy=0.0;
    }
}

function docircle() { // new idea ... March, 2016
    if (eval(document.getElementById('rotation').value) != 0 && rotcmd == "" && 'docircle' != 'docircle') {
    rotcmd="docircle();";
    drawRotated(eval(document.getElementById('rotation').value));
    } else {
    rotcmd="";
    context.strokeStyle=document.getElementById('mycolour').value;
    storecanvascommands("context.strokeStyle='" + document.getElementById('mycolour').value + "';", false);
    context.beginPath();
    storecanvascommands("context.beginPath();", false);
    context.arc(eval(rotoffx + (x + lastx) / 2.0),eval(rotoffy + (y + lasty) / 2.0),eval(Math.pow(Math.abs(x - lastx) * Math.abs(x - lastx) + Math.abs(y - lasty) * Math.abs(y - lasty),0.5) / 2.0),0,2*Math.PI);
    storecanvascommands("context.arc(" + eval(rotoffx + (x + lastx) / 2.0) + "," + eval(rotoffy + (y + lasty) / 2.0) + "," + eval(Math.pow(Math.abs(x - lastx) * Math.abs(x - lastx) + Math.abs(y - lasty) * Math.abs(y - lasty),0.5) / 2.0) + ",0," + 2*Math.PI + ");", false);
    context.stroke();
    storecanvascommands("context.stroke();", true);
  rotoffx=0.0;
  rotoffy=0.0;
    }
}

function doline() { // new idea ... March, 2016
    if (eval(document.getElementById('rotation').value) != 0 && rotcmd == "" && 'doline' != 'doline') {
    rotcmd="doline();";
    drawRotated(eval(document.getElementById('rotation').value));
    } else {
    rotcmd="";
    context.strokeStyle=document.getElementById('mycolour').value;
    storecanvascommands("context.strokeStyle='" + document.getElementById('mycolour').value + "';", false);
    context.beginPath();
    storecanvascommands("context.beginPath();", false);
    context.moveTo(x,y);
    storecanvascommands("context.moveTo(" + eval(rotoffx + x) + "," + eval(rotoffy + y) + ");", false);
    context.lineTo(lastx,lasty);
    storecanvascommands("context.lineTo(" + eval(rotoffx + lastx) + "," + eval(rotoffy + lasty) + ");", false);
    context.stroke();
    storecanvascommands("context.stroke();", true);
  rotoffx=0.0;
  rotoffy=0.0;
    }
}

function clearall() { // new idea ... March, 2016
    context.clearRect(0, 0, elem.width, elem.height);
    storecanvascommands("context.clearRect(" + 0 + "," + 0 + "," + elem.width + "," + elem.height + ");", false);
    elem.style.borderRight='1px solid black';
    storecanvascommands("elem.style.borderRight='1px solid black';", false);
    elem.style.borderBottom='1px solid black';
    storecanvascommands("elem.style.borderBottom='1px solid black';", true);
  rotoffx=0.0;
  rotoffy=0.0;
}

function placeannotation(anno) { // new idea ... March, 2016
    if (eval(document.getElementById('rotation').value) != 0 && rotcmd == "" && anno.value != '') {
    rotcmd="placeannotation(document.getElementById('" + anno.id + "'));";
     //if (eval(document.getElementById('rotation').value) != 0) alert(rotcmd);
    txtoffx=eval(0 + 2 + Math.min(x,lastx));
    txtoffy=eval((Math.min(y,lasty) + Math.max(y,lasty)) / 2);
    drawRotated(eval(document.getElementById('rotation').value));
    } else {
    rotcmd="";
     //if (eval(document.getElementById('rotation').value) != 0) alert('before:' + anno.value);
 if (anno.value != '') {
     //if (eval(document.getElementById('rotation').value) != 0) alert(anno.value);
  if (anno.id == 'jannotation') {
    context.clearRect(eval(rotoffx + Math.min(x,lastx)), eval(rotoffy + Math.min(y,lasty)), Math.abs(x - lastx), Math.abs(y - lasty));
    storecanvascommands("context.clearRect(" + eval(rotoffx + Math.min(x,lastx)) + "," + eval(rotoffx + Math.min(y,lasty)) + "," + Math.abs(x - lastx) + "," + Math.abs(y - lasty) + ");", false);
    context.strokeStyle = "black";
    storecanvascommands("context.strokeStyle = 'black';", false);
    document.getElementById('iannotation').value='';
    storecanvascommands("document.getElementById('iannotation').value='';", false);
  } else {
    context.strokeStyle = "blue";
    storecanvascommands("context.strokeStyle = 'blue';", false);
    document.getElementById('jannotation').value='';
    storecanvascommands("document.getElementById('jannotation').value='';", false);
  }
  //context.font = cf;
  context.font = document.getElementById('myfont').value;
  storecanvascommands("context.font = '" + document.getElementById('myfont').value + "';", false);
  context.strokeStyle=document.getElementById('mycolour').value;
  storecanvascommands("context.strokeStyle='" + document.getElementById('mycolour').value + "';", false);
  context.strokeText(anno.value,eval(rotoffx + 2 + Math.min(x,lastx)),eval(rotoffy + eval((Math.min(y,lasty) + Math.max(y,lasty)) / 2)));
  storecanvascommands("context.strokeText(" + anno.value + "," + eval(rotoffx + 2 + Math.min(x,lastx)) + "," + eval(rotoffy + eval((Math.min(y,lasty) + Math.max(y,lasty)) / 2)) + ");", false);
  anno.value = '';
  storecanvascommands("document.getElementById('" + anno.id + "').value='';", true);
  rotoffx=0.0;
  rotoffy=0.0;
  txtoffx=0.0;
  txtoffy=0.0;
 }
 }
}

function readUBlob(uval, opt_startByte, opt_stopByte) {
   //var oimg;
   dmyformit(-1);
   ewtwo = eval(zeroone * eval(   Math.min(x,lastx) +   Math.abs(x - lastx) / 2               ));
   ehtwo = eval(zeroone * eval(   Math.min(y,lasty) +   Math.abs(y - lasty) / 2               ));
   if (uval.replace('+','') != '') {
      if (uval.substring(0,1) == '+') {
        document.getElementById('spareimg').src=uval.substring(1);
        lasturl=uval.substring(1);
        oimg=document.getElementById('spareimg');
        curih=oimg.height;
        curiw=oimg.width;
        if (eval(document.getElementById('rotation').value) != 0) {
          drawRotated(eval(document.getElementById('rotation').value));
        } else {
        lasturl=uval;
   ewtwo -= eval(zeroone * oimg.width / 2);
   ehtwo -= eval(zeroone * oimg.height / 2);
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
        curih=oimg.height;
        curiw=oimg.width;
 newiw=postnewiw(eval(eval(curiw - cropx)  * scalex), eval(curih - cropy), eval(curiw - cropx), curih, cropy);
 newih=postnewih(eval(eval(curih - cropy)  * scaley), eval(curiw - cropx), eval(curih - cropy), curiw, cropx);
 //alert("newiw=" + newiw + " and newIh=" + newih);
 if (imageclickmode != 0) {
          context.drawImage(ximg,Math.min(x,lastx),Math.min(y,lasty),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + Math.min(x,lastx) + "," + Math.min(y,lasty) + "," + newiw + "," + newih + ");", true);
 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
          context.drawImage(oimg,eval(cropx),eval(cropy),eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + cropx + "," + cropy + "," + eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 } else {
          context.drawImage(oimg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 }
 } else {
          context.drawImage(oimg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)));
          storecanvascommands("context.drawImage(oimg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + ");", true);
}
        }
      } else {
        context.clearRect(0,0,elem.width,elem.height);
        document.getElementById('spareimg').src=uval;
        oimg=document.getElementById('spareimg');
        curih=oimg.height;
        curiw=oimg.width;
        if (eval(document.getElementById('rotation').value) != 0) {
          drawRotated(eval(document.getElementById('rotation').value));
        } else {
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
 newiw=postnewiw(eval(eval(curiw - cropx)  * scalex), eval(curih - cropy), eval(curiw - cropx), curih, cropy);
 newih=postnewih(eval(eval(curih - cropy)  * scaley), eval(curiw - cropx), eval(curih - cropy), curiw, cropx);
 //alert("newiW=" + newiw + " and newih=" + newih);
 if (imageclickmode != 0) {
          context.drawImage(oimg,Math.min(x,lastx),Math.min(y,lasty),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + Math.min(x,lastx) + "," + Math.min(y,lasty) + "," + newiw + "," + newih + ");", true);
 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
          context.drawImage(oimg,eval(cropx),eval(cropy),eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + cropx + "," + cropy + "," + eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 } else {
          context.drawImage(oimg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 }
 } else {
          context.drawImage(oimg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)));
          storecanvascommands("context.drawImage(oimg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + ");", true);
 }
        }
      }
   }
}

function readOBlob(opt_startByte, opt_stopByte) {
  for (var ii=0; ii<1; ii++) {
   ewtwo = eval(zeroone * eval(   Math.min(x,lastx) +   Math.abs(x - lastx) / 2               ));
   ehtwo = eval(zeroone * eval(   Math.min(y,lasty) +   Math.abs(y - lasty) / 2               ));
    var files = document.getElementById("file").files;
    if (!files.length) {
      var ivo=document.getElementById('vsiurl');
      if (ivo) {
      if (ivo.value.replace('+','') == '') alert("Please select " + bmode + " file!");
      } else {
      alert("Please select " + bmode + " file!");
      }
      return;
    } else {
      var w = files[0].name;
      document.getElementById("fil").value = w;
    }

    var file = files[0];
    
    // Only process image files.
    if (bmode == ' an image ' && !file.type.match('image.*')) {
        continue;
    }
    
    //maptype='img';
    if (bmode != ' an image ' && file.type.match('video.*')) {
           maptype=file.type; //'video';
    mapext='';
    var vexts=file.name.split('.');
    if (vexts.length > 1) {
     mapext='.' + vexts[eval(-1 + vexts.length)];
    } else {
     mapext='.mv4';
    }
    document.getElementById('mapext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('maptype' + eval(-1 + dmfcnt)).value=maptype;
    document.getElementById('mapxext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('mapxtype' + eval(-1 + dmfcnt)).value=maptype;
    } else if (bmode != ' an image ') {
           maptype=file.type; //'audio';
    mapext='';
    var exts=file.name.split('.');
    if (exts.length > 1) {
     mapext='.' + exts[eval(-1 + exts.length)];
    } else {
     mapext='.ma4';
    }
    document.getElementById('mapext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('maptype' + eval(-1 + dmfcnt)).value=maptype;
    document.getElementById('mapxext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('mapxtype' + eval(-1 + dmfcnt)).value=maptype;
    }
    
      
    start = parseInt(opt_startByte) || 0;
    stop = parseInt(opt_stopByte) || file.size - 1;
    
    if (eval(file.size) > 8000000) {
       alert('Sorry ... too big ' + maptype + " (" + file.type + ")");
       continue;
    }

    dmyformit(-1);
    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
        //cis = window.open("", "_blank", "top=20,left=20,width=200,height=200");
        //ww = cis;
        //cis.document.write(evt.target.result);
        //document.getElementById("url").value = evt.target.result;
        //document.getElementById("acont").value = evt.target.result;
        //document.getElementById("submit").click();
        //cis.document.write(evt.target.result.replace(/</g, "&lt;").replace(/>/g, "&gt;"));
        //document.body.innerHTML = document.body.innerHTML + "<div id=be style=display:block;>" + evt.target.result.replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</div>";
        document.getElementById("byte_content").textContent = evt.target.result;
        document.getElementById("byte_range").textContent = 
            ["Read bytes: ", start + 1, " - ", stop + 1,
             " of ", file.size, " byte file"].join("");
        process(evt.target.result);
      }
    };

    var blob = file.slice(start, stop + 1);
    reader.readAsDataURL(blob);   // Thanks to http://stackoverflow.com/questions/22255580/javascript-upload-image-file-and-draw-it-into-a-canvas
    reader.onload = function(e) {
    ximg = new Image();
    ximg.onload = function() {
        if (eval(document.getElementById('rotation').value) != 0) {
          oimg = ximg;
          curih=oimg.height;
          curiw=oimg.width;
          drawRotated(eval(document.getElementById('rotation').value));
        } else {
   ewtwo -= eval(zeroone * ximg.width / 2);
   ehtwo -= eval(zeroone * ximg.height / 2);
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
          curih=ximg.height;
          curiw=ximg.width;
 newiw=postnewiw(eval(eval(curiw - cropx)  * scalex), eval(curih - cropy), eval(curiw - cropx), curih, cropy);
 newih=postnewih(eval(eval(curih - cropy)  * scaley), eval(curiw - cropx), eval(curih - cropy), curiw, cropx);
 //alert("newiw=" + newiw + " and nEwih=" + newih);
 if (imageclickmode != 0) {
 //alert("newiw=" + newiw + " and NEwih=" + newih);
          context.drawImage(ximg,Math.min(x,lastx),Math.min(y,lasty),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + Math.min(x,lastx) + "," + Math.min(y,lasty) + "," + newiw + "," + newih + ");", true);
 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
          context.drawImage(ximg,eval(cropx),eval(cropy),eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + cropx + "," + cropy + "," + eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)) + "," + eval(rwtwo + document.getElementById("xoff").value) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 } else {
          context.drawImage(ximg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 }
 } else {
          context.drawImage(ximg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)));
          storecanvascommands("context.drawImage(oimg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + ");", true);
 }
        }
    }
    ximg.src = e.target.result;
    };
}
}
 
function readBlob(opt_startByte, opt_stopByte) {
  for (var ii=0; ii<1; ii++) {
   ewtwo = eval(zeroone * eval(   Math.min(x,lastx) +   Math.abs(x - lastx) / 2               ));
   ehtwo = eval(zeroone * eval(   Math.min(y,lasty) +   Math.abs(y - lasty) / 2               ));
    var files = document.getElementById("file").files;
    if (!files.length) {
      var ivo=document.getElementById('vsiurl');
      if (ivo) {
      if (ivo.value.replace('+','') == '') alert("Please select " + bmode + " file!");
      } else {
      alert("Please select " + bmode + " file!");
      }
      return;
    } else {
      var w = files[0].name;
      document.getElementById("fil").value = w;
    }

    var file = files[0];
    
    // Only process image files.
    if (bmode == ' an image ' && !file.type.match('image.*')) {
        continue;
    }
    
    //maptype='img';
    if (bmode != ' an image ' && file.type.match('video.*')) {
           maptype=file.type; //'video';
    mapext='';
    var vexts=file.name.split('.');
    if (vexts.length > 1) {
     mapext='.' + vexts[eval(-1 + vexts.length)];
    }
    document.getElementById('mapext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('maptype' + eval(-1 + dmfcnt)).value=maptype;
    document.getElementById('mapxext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('mapxtype' + eval(-1 + dmfcnt)).value=maptype;
    } else if (bmode != ' an image ') {
           maptype=file.type; //'audio';
    mapext='';
    var exts=file.name.split('.');
    if (exts.length > 1) {
     mapext='.' + exts[eval(-1 + exts.length)];
    }
    document.getElementById('mapext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('maptype' + eval(-1 + dmfcnt)).value=maptype;
    document.getElementById('mapxext' + eval(-1 + dmfcnt)).value=mapext;
    document.getElementById('mapxtype' + eval(-1 + dmfcnt)).value=maptype;
    }

    start = parseInt(opt_startByte) || 0;
    stop = parseInt(opt_stopByte) || file.size - 1;
    
    if (eval(file.size) > 8000000) {
       alert('Sorry ... too big ... ' + maptype + " (" + file.type + ")");
       continue;
    }

    dmyformit(-1);
    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
        //cis = window.open("", "_blank", "top=20,left=20,width=200,height=200");
        //ww = cis;
        //cis.document.write(evt.target.result);
        //document.getElementById("url").value = evt.target.result;
        //document.getElementById("acont").value = evt.target.result;
        //document.getElementById("submit").click();
        //cis.document.write(evt.target.result.replace(/</g, "&lt;").replace(/>/g, "&gt;"));
        //document.body.innerHTML = document.body.innerHTML + "<div id=be style=display:block;>" + evt.target.result.replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</div>";
        document.getElementById("byte_content").textContent = evt.target.result;
        document.getElementById("byte_range").textContent = 
            ["Read bytes: ", start + 1, " - ", stop + 1,
             " of ", file.size, " byte file"].join("");
        process(evt.target.result);
      }
    };

    var blob = file.slice(start, stop + 1);
    reader.readAsDataURL(blob);   // Thanks to http://stackoverflow.com/questions/22255580/javascript-upload-image-file-and-draw-it-into-a-canvas
    reader.onload = function(e) {
    ximg = new Image();
    ximg.onload = function() {
      context.clearRect(0,0,elem.width,elem.height);
      storecanvascommands("context.clearRect(" + 0 + "," + 0 + "," + elem.width + "," + elem.height + ");", false);
      if (eval(document.getElementById('rotation').value) != 0) {
          oimg = ximg;
          curih=oimg.height;
          curiw=oimg.width;
          drawRotated(eval(document.getElementById('rotation').value));
      } else {
   ewtwo -= eval(zeroone * ximg.width / 2);
   ehtwo -= eval(zeroone * ximg.height / 2);
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
        curih=ximg.height;
        curiw=ximg.width;
 newiw=postnewiw(eval(eval(curiw - cropx)  * scalex), eval(curih - cropy), eval(curiw - cropx), curih, cropy);
 newih=postnewih(eval(eval(curih - cropy)  * scaley), eval(curiw - cropx), eval(curih - cropy), curiw, cropx);
 //alert("newiw=" + newiw + " and Newih=" + newih);
 if (imageclickmode != 0) {
          context.drawImage(ximg,Math.min(x,lastx),Math.min(y,lasty),newiw,newih);
          storecanvascommands("context.drawImage(ximg," + Math.min(x,lastx) + "," + Math.min(y,lasty) + "," + newiw + "," + newih + ");", true);
 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
          context.drawImage(ximg,eval(cropx),eval(cropy),eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(ximg," + cropx + "," + cropy + "," + eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 } else {
          context.drawImage(ximg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(eval(ehtwo) + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(ximg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 }
 } else {
          context.drawImage(ximg,eval(eval(ewtwo) + eval(document.getElementById("xoff").value)),eval(ehtwo + document.getElementById("yoff").value));
          storecanvascommands("context.drawImage(ximg," + eval(eval(ewtwo) + eval(document.getElementById("xoff").value)) + "," + eval(eval(ehtwo) + eval(document.getElementById("yoff").value)) + ");", true);
 }
      }
    }
    ximg.src = e.target.result;
    };
}
}
  
function process(infilecontents) {
         //if (1 == 7) { alert(infilecontents); }
         //var ourlines = infilecontents.split(String.fromCharCode(10)); 
         //var ourwords = infilecontents.split(String.fromCharCode(32)); 
         //var myfis = "<br><br><p id=myf align=center>Filename is <strong>" + escape(document.getElementById("file").files[0].mozFullPath + document.getElementById("file").value) + "</strong> ... Type is (" + (document.getElementById("file").files[0].type || "n/a") + ") ... Date is " + (document.getElementById("file").files[0].lastModifiedDate ? document.getElementById("file").files[0].lastModifiedDate.toLocaleDateString() : "n/a") + " ... Size is " + infilecontents.length + " bytes ... Line Count is " + ourlines.length + " ... Word Count is " + ourwords.length + "</p>";
         //document.body.innerHTML = document.body.innerHTML + myfis;
         //var huh = document.URL.split("?");
         //if (huh.length > 1) {
         //  location.href = huh[0] + "?myf=" + decodeURIComponent(myfis);
         //} else {
         //  location.href = document.URL + "?myf=" + decodeURIComponent(myfis);
         //}
         //alert(infilecontents);
         fcont = infilecontents;
         //document.getElementById("byte_content").style.display='block';
         document.getElementById("byte_range").style.display='block';
         if (bmode != ' an image ') {
           //alert(bmode);
           var areader = new FileReader();
           areader.onload = function(e) {
              //xaudio = new Audio();
              //alert(e.target.result);
           };
           areader.readAsDataURL(infilecontents);   // Thanks to http://stackoverflow.com/questions/22255580/javascript-upload-image-file-and-draw-it-into-a-canvas
           //alert(infilecontents.substring(0,30));
           //alert("document.getElementById('mapcoords" + eval(-1 + dmfcnt) + "').value='" + document.getElementById('mapcoords' + eval(-1 + dmfcnt)).value + "'");
           //alert("document.getElementById('mapaudio" + eval(-1 + dmfcnt) + "').value='" + infilecontents.substring(0,30) + "'");
           document.getElementById('mapaudio' + eval(-1 + dmfcnt)).value=infilecontents;
           document.getElementById('mapxaudio' + eval(-1 + dmfcnt)).value=infilecontents;
           bmode = ' an image ';
         }
}

function intwo() {
  x=0; 
  y=0;
  lastx=0; 
  lasty=0;  
  isScribble=2;
}

function touchWindowHandler(event) // thanks to http://stackoverflow.com/questions/1517924/javascript-mapping-touch-events-to-mouse-events
{
    var touches = event.changedTouches,
        first = touches[0],
        type = "";
         switch(event.type)
    {
        case "touchstart": type = "onclick"; 
        //alert(88 + moid + event.targetTouches.length); 
        break;
        
        default: return;
    }

             //initMouseEvent(type, canBubble, cancelable, view, clickCount, 
    //           screenX, screenY, clientX, clientY, ctrlKey, 
    //           altKey, shiftKey, metaKey, button, relatedTarget);

    var simulatedEvent = document.createEvent("MouseEvent");
    simulatedEvent.initMouseEvent(type, true, true, window, 1, 
                              first.screenX, first.screenY, 
                              first.clientX, first.clientY, false, 
                              false, false, false, 0/*left*/, null);

    first.target.dispatchEvent(simulatedEvent);
    event.preventDefault();
}


function touchHandler(event) // thanks to http://stackoverflow.com/questions/1517924/javascript-mapping-touch-events-to-mouse-events
{
    var touches = event.changedTouches,
        first = touches[0],
        type = "";
    //if (event.targetTouches.length == 1) {

    switch(event.type)
    {
        //case "touchstart": type="mousedown"; break;
        case "touchmove":  type="mousemove"; break;        
        case "touchend":   type="mouseup"; break;
        default: return;
    }

             //initMouseEvent(type, canBubble, cancelable, view, clickCount, 
    //           screenX, screenY, clientX, clientY, ctrlKey, 
    //           altKey, shiftKey, metaKey, button, relatedTarget);

    var simulatedEvent = document.createEvent("MouseEvent");
    simulatedEvent.initMouseEvent(type, true, true, window, 1, 
                              first.screenX, first.screenY, 
                              first.clientX, first.clientY, false, 
                              false, false, false, 0/*left*/, null);

    first.target.dispatchEvent(simulatedEvent);
    
    event.preventDefault();
    event.stopPropagation();
    
    switch(type)
    {
        //case "mousedown": if (isScribble == 1) { isScribble=2; storecanvascommands("context=context;", false); } break;
        case "mousemove": if (isScribble == 2 || isScribble == 1) {
       if (x == 0 && y == 0 && lastx == 0 && lasty == 0) {
       if (event.pageX || event.pageY) {
       x = event.pageX - elemLeft;
       y = event.pageY - elemTop;
       } else {
       x = event.clientX - elemLeft;
       y = event.clientY - elemTop;
       }
       lastx=x;
       lasty=y;
       } else {
       lastx=x;
       lasty=y;
       if (event.pageX || event.pageY) {
       x = event.pageX - elemLeft;
       y = event.pageY - elemTop;
       } else {
       x = event.clientX - elemLeft;
       y = event.clientY - elemTop;
       }
       }
       
       
       
    if (isScribble == 2) {
    if (x != lastx || y != lasty) {
      document.getElementById('divannotation').style.display='block';
      document.getElementById('myisubject').style.display = 'inline';
      document.getElementById('myiemail').style.display = 'inline';
    context.strokeStyle=document.getElementById('mycolour').value;
    storecanvascommands("context.fillStyle='" + document.getElementById('mycolour').value + "';", false);
    context.beginPath();
    storecanvascommands("context.beginPath();", false);
    context.moveTo(x,y);
    storecanvascommands("context.moveTo(" + x + "," + y + ");", false);
    context.lineTo(lastx,lasty);
    storecanvascommands("context.lineTo(" + lastx + "," + lasty + ");", false);
    context.stroke();
    storecanvascommands("context.stroke();", false);
	}
	}
		isScribble=2;


    }
    break;        
        case "mouseup":  if (isScribble == 2) {  x=0; y=0; lastx=0; lasty=0; isScribble=1; storecanvascommands("context=context;", true); } break;
        default: return;
    }
    
    //}

}

function drawRotated(degrees) {  // thanks to http://stackoverflow.com/questions/17411991/html5-canvas-rotate-image
   var needflip=0;
   var wasf=document.getElementById('rotation').value;
   var spareewtwo = eval(zeroone * eval(   Math.min(x,lastx) +   Math.abs(x - lastx) / 2               ));
   var spareehtwo = eval(zeroone * eval(   Math.min(y,lasty) +   Math.abs(y - lasty) / 2               ));
    ewtwo = eval(elem.width/2);
    ehtwo = eval(elem.height/2);

    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
    if (eval(txtoffx) != 0.0 || eval(txtoffy) != 0.0) {
    //alert("Ewtwo,Ehtwo=" + ewtwo + "," + ehtwo);
    storecanvascommands("context.translate(" + txtoffx + "," + txtoffy + ");", false);
    context.translate(txtoffx,txtoffy);
    if (rotcmd != '') {
    rotoffx=eval(-txtoffx);
    rotoffy=eval(-txtoffy);
    }
    } else if (eval(document.getElementById("xoff").value) != 0 || eval(document.getElementById("yoff").value) != 0) {
    ewtwo = eval(eval(spareeewtwo) * 0 + eval(document.getElementById("xoff").value));
    ehtwo = eval(eval(spareeehtwo) * 0 + eval(document.getElementById("yoff").value));
    //alert("Ewtwo,ehtwo=" + ewtwo + "," + ehtwo);
    storecanvascommands("context.translate(" + ewtwo + "," + ehtwo + ");", false);
    context.translate(ewtwo,ehtwo);
    ewtwo = eval(-ewtwo);
    ehtwo = eval(-ehtwo);
    
    
    } else if (0 == 0) {
      curih=oimg.height;
      curiw=oimg.width;
      
      //if (eval(degrees) >= 180) {
      //  needflip=true;
      //  degrees = eval(360 - wasf);
      //  document.getElementById('rotation').value=degrees;
      //} 
      var dx=0, dy=0;
 newiw=postnewiw(eval(eval(curiw - cropx)  * scalex), eval(curih - cropy), eval(curiw - cropx), curih, cropy);
 newih=postnewih(eval(eval(curih - cropy)  * scaley), eval(curiw - cropx), eval(curih - cropy), curiw, cropx);
    //alert(newiw + ' ' + newih);
    //ewtwo = eval(eval(   Math.min(x,lastx) +   1 * offxmaybe(eval(document.getElementById("xoff").value),newih,newiw) +   Math.abs(x - lastx) / 2  - postscalew(scalex,oimg.height,oimg.width) * oimg.width / 2             ));
    //ehtwo = eval(eval(   Math.min(y,lasty) +   1 * offymaybe(eval(document.getElementById("yoff").value),newiw,newih) +   Math.abs(y - lasty) / 2  - postscaleh(scaley,oimg.width,oimg.height) * oimg.height / 2            ));
    ewtwo = eval(eval(   Math.min(x,lastx) +   1 * offxmaybe(eval(document.getElementById("xoff").value),newih,newiw) +   Math.abs(x - lastx) / 2  - postscalew(scalex,oimg.height,oimg.width) * oimg.width / 2             ));
    ehtwo = eval(eval(   Math.min(y,lasty) +   1 * offymaybe(eval(document.getElementById("yoff").value),newiw,newih) +   Math.abs(y - lasty) / 2  - postscaleh(scaley,oimg.width,oimg.height) * oimg.height / 2            ));
    //alert("ewtwo,ehtwo=" + ewtwo + "," + ehtwo);

    if (eval(degrees) >= 270) {
      needflip=1;
    } else if (eval(degrees) >= 180) {
      needflip=-1;
    }


    storecanvascommands("context.translate(" + ewtwo + "," + ehtwo + ");", false);
    context.translate(ewtwo,ehtwo);
    
    if (needflip != 0) {
      context.scale(needflip, -needflip);
      storecanvascommands("context.scale(" + eval(needflip) + "," + eval(-needflip) + ");", false);
    }
    
    //ewtwo = eval(-ewtwo + Math.min(x,lastx) +   1 * offxmaybe(eval(document.getElementById("xoff").value),newih,newiw) +   Math.abs(x - lastx) / 2  - postscalew(scalex,oimg.height,oimg.width) * oimg.width / 2        );
    //ehtwo = eval(-ehtwo + Math.min(y,lasty) +   1 * offymaybe(eval(document.getElementById("yoff").value),newiw,newih) +   Math.abs(y - lasty) / 2  - postscaleh(scaley,oimg.width,oimg.height) * oimg.height / 2       );
    ewtwo = eval(-ewtwo + Math.min(x,lastx) + dx +   1 * offxmaybe(eval(document.getElementById("xoff").value),newih,newiw) +   Math.abs(x - lastx) / 2  - postscalew(scalex,oimg.height,oimg.width) * oimg.width / 2        );
    ehtwo = eval(-ehtwo + Math.min(y,lasty) + dy +   1 * offymaybe(eval(document.getElementById("yoff").value),newiw,newih) +   Math.abs(y - lasty) / 2  - postscaleh(scaley,oimg.width,oimg.height) * oimg.height / 2       );

    // New idea below
    ewtwo = eval(dx - (offxmaybe(eval(document.getElementById("xoff").value),newih,newiw))); //eval(-ewtwo + Math.min(x,lastx) +   1 * offxmaybe(eval(document.getElementById("xoff").value),newih,newiw) +   Math.abs(x - lastx) / 2  - postscalew(scalex,oimg.height,oimg.width) * oimg.width / 2        );
    ehtwo = eval(dy - (offymaybe(eval(document.getElementById("yoff").value),newiw,newih))); //eval(-ehtwo + Math.min(y,lasty) +   1 * offymaybe(eval(document.getElementById("yoff").value),newiw,newih) +   Math.abs(y - lasty) / 2  - postscaleh(scaley,oimg.width,oimg.height) * oimg.height / 2       );


    //alert("ewTwo,ehTwo=" + ewtwo + "," + ehtwo);
    } else {
    //alert("ewTwo,ehtwo=" + ewtwo + "," + ehtwo);
    storecanvascommands("context.translate(" + ewtwo + "," + ehtwo + ");", false);
    context.translate(ewtwo,ehtwo);
    ewtwo = eval(-ewtwo);
    ehtwo = eval(-ehtwo);
    }

    // rotate the canvas to the specified degrees
    storecanvascommands("context.rotate(" + degrees*Math.PI/180 + ");", false);
    context.rotate(degrees*Math.PI/180);

    if (rotcmd != '') {
    var sparerotcmd=rotcmd;
    //rotcmd='';
    //alert("sparerotcmd=" + sparerotcmd);
    eval(sparerotcmd);
    } else {
  
    if (document.getElementById('rof').value != '') {
      oimg = origimg;
      curih=oimg.height;
      curiw=oimg.width;
    }
    if (document.getElementById('rof').value == '' || oimg != null) {
    // draw the image
    // since the context is rotated, the image will be rotated also
 if (imageclickmode != 0 || eval(scalex) != 1.0 || eval(scaley) != 1.0 || eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
      curih=oimg.height;
      curiw=oimg.width;
 newiw=postpostnewiw(eval(eval(curiw - cropx)  * scalex), eval(curih - cropy), eval(curiw - cropx), curih, cropy);
 newih=postpostnewih(eval(eval(curih - cropy)  * scaley), eval(curiw - cropx), eval(curih - cropy), curiw, cropx);
 if (imageclickmode != 0) {
          context.drawImage(oimg,eval(ewtwo + eval(document.getElementById("xoff").value)),eval(ehtwo + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + eval(ewtwo + eval(document.getElementById("xoff").value)) + "," + eval(ehtwo + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);


 } else if (eval(cropwidth) != 100.00 || eval(cropheight) != 100.000 || eval(cropx) != 0.00 || eval(cropy) != 0.00) {
 //alert("newiw=" + newiw + " and newiH=" + newih);
          context.drawImage(oimg,eval(cropx),eval(cropy),eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)),eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)),eval(ewtwo + eval(document.getElementById("xoff").value)),eval(ehtwo + eval(document.getElementById("yoff").value)),newiw,newih);
          //storecanvascommands("context.drawImage(oimg," + cropx + "," + cropy + "," + eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)) + "," + -oimg.width/2 + eval(document.getElementById("xoff").value) + "," + -oimg.height/2 + eval(document.getElementById("yoff").value) + "," + newiw + "," + newih + ");", true);
          storecanvascommands("context.drawImage(oimg," + cropx + "," + cropy + "," + eval(eval(curiw - cropx)  * cropwidth / ((document.getElementById('cselwidth').value == '%') ? 100.0 : 1.00)) + "," + eval(eval(curih - cropy)  * cropheight / ((document.getElementById('cselheight').value == '%') ? 100.0 : 1.00)) + "," + eval(ewtwo + eval(document.getElementById("xoff").value)) + "," + eval(ehtwo + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 } else {
          context.drawImage(oimg,eval(ewtwo + eval(document.getElementById("xoff").value)),eval(ehtwo + eval(document.getElementById("yoff").value)),newiw,newih);
          storecanvascommands("context.drawImage(oimg," + eval(ewtwo + eval(document.getElementById("xoff").value)) + "," + eval(ehtwo + eval(document.getElementById("yoff").value)) + "," + newiw + "," + newih + ");", true);
 }
 } else {
    storecanvascommands("context.drawImage(oimg," + eval(ewtwo + eval(document.getElementById("xoff").value)) + "," + eval(ehtwo + 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,eval(ewtwo + eval(document.getElementById("xoff").value)),eval(ehtwo + 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();
    document.getElementById('rotation').value=wasf;
}

function maybe(tv) {
  if (tv != "" && eval(document.getElementById("rotation").value) != 0) {
    drawRotated(eval(document.getElementById("rotation").value));
  }
}

function audiomaybe() {
  if (bmode == ' an audio ') {
    document.getElementById('oic').click();
  }
}

function noforeach() {
  if (foreachon) {
       foreachon=false;
       try {
        blobc='transparent';
       } catch(ewq) {
       }
  }
}

function closewinois() {
  if (winois != null) {
    winois.close();
    winois=null;
  }
}

function switchzn() {
    if (longhover.trim() != "") {
      switchit(0, longhover);
    }
}

function switchit(aclick, blurb) {
  if (aclick == 0 && firsthover == 1) {
    if (longhover == "") {
    longhover=blurb;
    setTimeout(switchzn, 2000);
    return;
    } else {
    var bfp=confirm(blurb + ' ... OK proceeds on this basis, else Cancel will only listen for a click/touch of the Copy button here');
    if (bfp == true) {
     firsthover=0;
    } else {
     firsthover=-1;
    }
    }
  }
  if (aclick == 1 || firsthover != -1) {
    var canvuri = elem.toDataURL("image/png",0);
    winois=window.open('','_blank','top=30,left=30,width=1000,height=800');
    winois.document.write('<html><body><img src=' + canvuri + '></img></body></html>');
    setTimeout(closewinois, 5000);
  }
  longhover=" ";
}

function tryit() {
 var tds, hstuff='', koff=-1;
 //alert(9800);
 var imageurl = location.search.split('urlimage=')[1] ? location.search.split('urlimage=')[1].split('&')[0] : '';
 var imageoverlay = location.search.split('overlay=')[1] ? location.search.split('overlay=')[1].split('&')[0] : '';
 if (document.getElementById('myiframe')) {
   document.getElementById('myiframe').width='400px';
 }
 tds=document.getElementsByTagName('img');
 if (document.URL.indexOf('/india.') != -1) koff--;
 if (tds.length > 0) {
 origimg=tds[eval(koff + tds.length)];
 lasturl=tds[eval(koff + tds.length)].src;
 origih=origimg.height;
 origiw=origimg.width;
 if (('~' + decodeURIComponent(imageurl)).toLowerCase().replace('file:','http:').replace('sftp:','http:').replace('ftp:','http:').indexOf('~http') == 0) {
   if (imageoverlay == '') {
     tds[eval(koff + tds.length)].src=decodeURIComponent(imageurl);
     tds=document.getElementsByTagName('img');
     origimg=tds[eval(koff + tds.length)];
     origih=origimg.height;
     origiw=origimg.width;
     context.clearRect(0, 0, elem.width, elem.height);
     elem.width=origiw;
     elem.height=origih;
     document.getElementById('myiframe').style.left=origiw + 'px';
     context.drawImage(tds[eval(koff + tds.length)],0,0);
   } else {
     tds[eval(koff + tds.length)].src=decodeURIComponent(imageurl);
     tds=document.getElementsByTagName('img');
     context.drawImage(tds[eval(koff + tds.length)],0,0);
   }
 }
 }
 tds=document.getElementsByTagName('td');
  //  if (iscontact == -1) alert("tds.length=" + tds.length);
 var scalestuff="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>";
 if (tds.length > 0) {
 //alert(98);
    if (iscontact != -1) {
    hstuff+="<div title='Click me to turn off click/touch blobs' onclick=' noforeach(); ' style='display:none; position: absolute; top:600px; left:860px; display:none; background-color: lightgreen; ' id='divan" + "notation'><h4><select onchange=\" var uub=document.URL.split('?'); location.href=uub[0]; \"><option value=>Your</option><option value=New>New</option></select> Annotations++</h4>";
    } else {
    hstuff+="<div title='Click me to turn off click/touch blobs' onclick=' noforeach(); ' style='position: absolute; top:600px; left:860px; display:none; background-color: lightgreen; ' id='divan" + "notation'><h4><select onchange=\" var uub=document.URL.split('?'); location.href=uub[0]; \"><option value=>Your</option><option value=New>New</option></select> Annotations++</h4>";
    }
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/line.png' onclick=' doline(); ' alt='Line' title='Line'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/rectangle.png' onclick=' dorectangle(); ' alt='Rectangle' title='Rectangle'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/rectangleborder.png' onclick=' dorectangleborder(); ' alt='Rectangle Border' title='Rectangle Border'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/circle.png' onclick=' docircle(); ' alt='Circle' title='Circle'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/clear.png' onclick=' clearall(); ' alt='Clear' title='Clear'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/sline.png' onclick=\" alert('Ready to Scribble in two seconds.  Any key stroke stops scribbling.'); setTimeout(intwo,2000); \" alt='Scribble' title='Scribble'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/zline.png' onclick=\" if (isScribble == 2 || isScribble == 1) { storecanvascommands('context=context;', true); } isScribble=0; \" alt='End of scribble' title='End of scribble'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/minus.png' onclick=\" if (isScribble == 2 || isScribble == 1) { isScribble=0; storecanvascommands('context=context;', true); }  undo(); \" alt='Undo' title='Undo'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/minusminus.png' onclick=\" if (isScribble == 2 || isScribble == 1) { isScribble=0; storecanvascommands('context=context;', true); } butnotfirst=1; undo();  butnotfirst=0; \" alt='Undo original image only and replace by transparent background' title='Undo original image only and replace by transparent background'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/plus.png' onclick=\" if (isScribble == 2 || isScribble == 1) { isScribble=0; storecanvascommands('context=context;', true); }  redo(); \" alt='Redo' title='Redo'></img>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/image.png' onclick=\"   bmode=' an image ';   document.getElementById('file').click();  document.getElementById('file').style.display='block'; document.getElementById('dpf').style.display='block'; \" alt='Image' title='Image'></img><input onchange=' audiomaybe(); ' style='display:none;' id='file' type='file' name='file'><div id=dpf style='display:none;'>&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:10%;' id='xoff' type='number' value='0'></input> Y: <input style='width:10%;' 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>" + scalestuff + "<button onclick='zeroone=0.0; readBlob(0,0);'>Place into Canvas</button><button id=oic onclick='zeroone=0.0; readOBlob(0,0);'>Overlay into Canvas</button><br><select id='imageclickmode' onchange=' 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></select><br><button onclick='zeroone=1.0; readBlob(0,0);'>Place Click</button><button onclick='zeroone=1.0; readOBlob(0,0);'>Overlay Click</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>";
    hstuff+="&nbsp;<img src='http://www.rjmprogramming.com.au/MarkItUp/copy.png' id='mycopy' style='display:inline;' onmouseover=\" switchit(0,this.title); \"  onclick=\" switchit(1,this.title); \" alt='Copy via Click (or Hover) Here, Wait 2 Seconds, Command-A or Ctrl-A (for Select All) and Command-C or Ctrl-C (for Copy) ... new window will close in 5 seconds' title='Copy via Click (or Hover) Here, Wait 2 Seconds, Command-A or Ctrl-A (for Select All) and Command-C or Ctrl-C (for Copy) ... new window will close in 5 seconds'></img>";
    if (cookievalue("snapshot2") != "") {
    //alert(76);
    hstuff+="&nbsp;<br><span id='dsnapshot' style=\"margin: 15 15 15 15; background: url('http://www.rjmprogramming.com.au/MarkItUp/nosnapshot.png') repeat;\">&nbsp;&nbsp;</span>";
    } else if (cookievalue("snapshot") != "") {
    //alert(706);
    hstuff+="&nbsp;<br><span id='dsnapshot' style=\"margin: 15 15 15 15; background: url('http://www.rjmprogramming.com.au/MarkItUp/snapshotplus.png') repeat;\">&nbsp;&nbsp;</span>";
    } else {
    //alert(7006);
    hstuff+="&nbsp;<span id='dsnapshot' onclick=\" if (isSnapshot == 2) { isSnapshot=0; storecanvascommands('context=context;', true); startsnapshot(-1); this.src='http://www.rjmprogramming.com.au/MarkItUp/snapshot.png';  this.title='Snapshot for the next time'; } else if (isSnapshot == 0) {  isSnapshot = 1; ssuffix=''; forlater=''; getchosensnapshot(1);   this.src='http://www.rjmprogramming.com.au/MarkItUp/nosnapshot.png';  this.title='Get rid of snapshot for the next time'; } \"><img id='isnapshot' src='http://www.rjmprogramming.com.au/MarkItUp/snapshot.png' onclick=\" if (isSnapshot == 2 || isSnapshot == 1) { isSnapshot=0; storecanvascommands('context=context;', true); startsnapshot(-1); this.src='http://www.rjmprogramming.com.au/MarkItUp/snapshot.png';  this.title='Snapshot for the next time'; } else {  isSnapshot = 1; ssuffix=''; forlater=''; getchosensnapshot(1);   this.src='http://www.rjmprogramming.com.au/MarkItUp/nosnapshot.png';  this.title='Get rid of snapshot for the next time'; } \" alt='Snapshot' title='Snapshot for the next time'></img></span>";
    }
    hstuff+="<br>Annotation (optional): <input onblur='placeannotation(this);' id='iannotation' type='text' value=''></input><br><span>Anno B&amp;W (optional): <input onblur='placeannotation(this);' id='jannotation' type='text' value=''></input><br>Style: <input type='text' id='myfont' value='18px Verdana'></input>&nbsp;<input type='text' id='mycolour' value='black'></input></span><br>";
    hstuff+="<form style='display:none;' id='myform' method='post' enctype='application/x-www-urlencoded' action='http://www.rjmprogramming.com.au/HTMLCSS/world.php' target='myiframetwo'><div id='dmyxform'></div><input type='hidden' name='mysubject' id='mysubject' value='My " + xxuworld + " Map'></input><input type='hidden' name='myfname' id='myfname' value=''></input><input type='submit' id='bsubmit' value='Submit' style='display:none;'></input><input type='hidden' name='ismobile' id='ismobile' value=''></input><input type='hidden' name='mode' id='mode' value='1'></input><input type='hidden' name='to' id='to' value=''></input><input type='hidden' name='mydurl' id='mydurl' value=''></input></form>";
    hstuff+="<iframe style='display:none;' id='myiframetwo' src='http://www.rjmprogramming.com.au/HTMLCSS/world.php'></iframe>";
    hstuff+="<div id='dmyform'></div><input style='display:none;' onblur='fixmyemail(this.value + String.fromCharCode(32),1);' type='text' id='myisubject' value='My " + xxuworld + " Map '></input>&nbsp;<input style='background-color: yellow;' type='button' value='Email (optional)' onclick=' document.getElementById(" + '"' + "estatus" + '"' + ").innerHTML=" + '"' + "?" + '"' + ";  capture(document.getElementById(" + '"' + "mydurl" + '"' + "),document.getElementById(" + '"' + "bsubmit" + '"' + "),document.getElementById(" + '"' + "myemail" + '"' + "));   '></input><span id=estatus>&nbsp;</span><a style='display:none;' target='_blank' id='myemail' href='mailto:fill.in.email@address?subject=My%20" + xxuworld + "%20Map&body='></a><input style='display:none;' onblur='fixmyemail(this.value,0);' type='text' id='myiemail' value='' title='Fill this in for emailed attachment'></input>";
    hstuff+="</div>";
  //  if (iscontact == -1) alert(hstuff);
    if (tds[eval(-1 + tds.length)].innerHTML.indexOf('diva' + 'nnotation') == -1) {
 //alert(hstuff);
      tds[eval(-1 + tds.length)].innerHTML+=hstuff;
    }
 //alert(980);
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    var yyyy = today.getFullYear();
    var hh = today.getHours();
    var minm = today.getMinutes(); //January is 0!
    var ss = today.getSeconds();
    document.getElementById('myfname').value = xxlworld + "_" + yyyy + "_" + mm + "_" + hh + "_" + minm + "_" + ss + ".png"; 
    document.getElementById('myform').action = document.getElementById('myform').action.replace('?mode=1', '');
    document.getElementById('mode').value = '';
    document.getElementById('ismobile').value = 'y';
    document.getElementById('myisubject').style.display = 'inline';
    document.getElementById('myiemail').style.display = 'inline';
    document.getElementById('myform').action = document.getElementById('myform').action.replace('?mode=1', '');
    document.getElementById('myform').action = document.getElementById('myform').action.replace('mode=1', 'mode=');
    //document.getElementById('myemail').href = '#' + document.getElementById('myemail').href;
 }

    document.body.addEventListener('keyup', function(event) {
       if (isScribble == 2 || isScribble == 1) {
        isScribble=0;
        storecanvascommands("context=context;", true);
       }
    });


    if (isTouch || isiPad) { 
    //elem.addEventListener("touchstart", touchHandler, true);
    elem.addEventListener("touchmove", touchHandler, true);
    elem.addEventListener("touchend", touchHandler, true);
    elem.addEventListener("touchcancel", touchHandler, true);    

    //elem.addEventListener('touchstart', function(event) {
    //   if (isScribble == 1) {
    //    isScribble=2;
    //   }
    //});

	} else {

    elem.addEventListener('mouseup', function(event) {
       if (isScribble == 2) {
        x=0; y=0; lastx=0; lasty=0; 
        isScribble=1;
        storecanvascommands("context=context;", true);
       }
    });
    
    elem.addEventListener('touchend', function(event) {
       if (isScribble == 2) {
        isScribble=1;
        storecanvascommands("context=context;", true);
       }
    });

    elem.addEventListener('touchstart', function(event) {
       if (isScribble == 1) {
        isScribble=2;
        storecanvascommands("context=context;", false);
       }
    });


    elem.addEventListener('mousedown', function(event) {
       elem.title='(' + x + ',' + y + ')';
       if (isScribble == 1) {
        x=0; y=0; lastx=0; lasty=0; 
        isScribble=2;
        storecanvascommands("context=context;", false);
       }
    });
    
    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 + ')';
    });
    
        
    elem.addEventListener('mousemove', function(event) {
       if (isScribble == 2) { // || isScribble == 1) {

       if (x == 0 && y == 0 && lastx == 0 && lasty == 0) {
       if (event.pageX || event.pageY) {
       x = event.pageX - elemLeft;
       y = event.pageY - elemTop;
       } else {
       x = event.clientX - elemLeft;
       y = event.clientY - elemTop;
       }
       lastx=x;
       lasty=y;
       } else {
       lastx=x;
       lasty=y;
       if (event.pageX || event.pageY) {
       x = event.pageX - elemLeft;
       y = event.pageY - elemTop;
       } else {
       x = event.clientX - elemLeft;
       y = event.clientY - elemTop;
       }
       }
       elem.title='(' + x + ',' + y + ')';
       
       
       
    if (isScribble == 2)  {
    if (x != lastx || y != lasty) {
      document.getElementById('divannotation').style.display='block';
      document.getElementById('myisubject').style.display = 'inline';
      document.getElementById('myiemail').style.display = 'inline';
    context.strokeStyle=document.getElementById('mycolour').value;
    storecanvascommands("context.fillStyle='" + document.getElementById('mycolour').value + "';", false);
    context.beginPath();
    storecanvascommands("context.beginPath();", false);
    context.moveTo(x,y);
    storecanvascommands("context.moveTo(" + x + "," + y + ");", false);
    context.lineTo(lastx,lasty);
    storecanvascommands("context.lineTo(" + lastx + "," + lasty + ");", false);
    context.stroke();
    storecanvascommands("context.stroke();", false);
    
    
	}
	}
		isScribble=2;


    }

    });
    
	}
 
 if (document.URL.indexOf('?') == -1) {
   querycurrentsnapshot("setifthere");
   canvascommands = [];
 }
}


setTimeout(tryit, 3000);