53,70d52
< .circle {
<   -webkit-box-sizing: content-box;
<   -moz-box-sizing: content-box;
<   box-sizing: content-box;
<   text-align: center;
<   width: 200px;
<   height: 200px;
<   border: none;
<   -webkit-border-radius: 50%;
<   border-radius: 50%;
<   font: normal 100%/normal Arial, Helvetica, sans-serif;
<   color: rgba(0,0,0,1);
<   -o-text-overflow: clip;
<   text-overflow: clip;
<   background: pink; //#1abc9c;
<   opacity:0.5;
< }
< 
114d95
< var bris='<br>';
117,264d97
< var vscnt=0;
< var cat='?';
< var noeolp='Now other end of line please.&nbsp;&nbsp;';
< var wdef='';
< var bcols=['red','yellow','green','blue','cyan','magenta','pink','lightblue','lightgreen','pink','#ffc0cb','lightpink','#ffb6c1'
< ,'hotpink','#ff69b4'
< ,'deeppink','#ff1493'
< ,'palevioletred','#db7093'
< ,'mediumvioletred','#c71585'
< ,'lightsalmon','#ffa07a'
< ,'salmon','#fa8072'
< ,'darksalmon','#e9967a'
< ,'lightcoral','#f08080'
< ,'indianred','#cd5c5c'
< ,'crimson','#dc143c'
< ,'firebrick','#b22222'
< ,'darkred','#8b0000'
< ,'red','#ff0000'
< ,'orangered','#ff4500'
< ,'tomato','#ff6347'
< ,'coral','#ff7f50'
< ,'darkorange','#ff8c00'
< ,'orange','#ffa500'
< ,'yellow','#ffff00'
< ,'lightyellow','#ffffe0'
< ,'lemonchiffon','#fffacd'
< ,'lightgoldenrodyellow','#fafad2'
< ,'papayawhip','#ffefd5'
< ,'moccasin','#ffe4b5'
< ,'peachpuff','#ffdab9'
< ,'palegoldenrod','#eee8aa'
< ,'khaki','#f0e68c'
< ,'darkkhaki','#bdb76b'
< ,'gold','#ffd700'
< ,'cornsilk','#fff8dc'
< ,'blanchedalmond','#ffebcd'
< ,'bisque','#ffe4c4'
< ,'navajowhite','#ffdead'
< ,'wheat','#f5deb3'
< ,'burlywood','#deb887'
< ,'tan','#d2b48c'
< ,'rosybrown','#bc8f8f'
< ,'sandybrown','#f4a460'
< ,'goldenrod','#daa520'
< ,'darkgoldenrod','#b8860b'
< ,'peru','#cd853f'
< ,'chocolate','#d2691e'
< ,'saddlebrown','#8b4513'
< ,'sienna','#a0522d'
< ,'brown','#a52a2a'
< ,'maroon','#800000'
< ,'olive','#808000'
< ,'olivedrab','#6b8e23'
< ,'yellowgreen','#9acd32'
< ,'limegreen','#32cd32'
< ,'lime','#00ff00'
< ,'lawngreen','#7cfc00'
< ,'chartreuse','#7fff00'
< ,'greenyellow','#adff2f'
< ,'springgreen','#00ff7f'
< ,'mediumspringgreen','#00fa9a'
< ,'lightgreen','#90ee90'
< ,'palegreen','#98fb98'
< ,'darkseagreen','#8fbc8f'
< ,'mediumseagreen','#3cb371'
< ,'seagreen','#2e8b57'
< ,'forestgreen','#228b22'
< ,'green','#008000'
< ,'darkgreen','#006400'
< ,'mediumaquamarine','#66cdaa'
< ,'aqua','#00ffff'
< ,'cyan','#00ffff'
< ,'lightcyan','#e0ffff'
< ,'paleturquoise','#afeeee'
< ,'aquamarine','#7fffd4'
< ,'turquoise','#40e0d0'
< ,'mediumturquoise','#48d1cc'
< ,'darkturquoise','#00ced1'
< ,'lightseagreen','#20b2aa'
< ,'cadetblue','#5f9ea0'
< ,'darkcyan','#008b8b'
< ,'teal','#008080'
< ,'lightsteelblue','#b0c4de'
< ,'powderblue','#b0e0e6'
< ,'lightblue','#add8e6'
< ,'skyblue','#87ceeb'
< ,'lightskyblue','#87cefa'
< ,'deepskyblue','#00bfff'
< ,'dodgerblue','#1e90ff'
< ,'cornflowerblue','#6495ed'
< ,'steelblue','#4682b4'
< ,'royalblue','#4169e1'
< ,'blue','#0000ff'
< ,'mediumblue','#0000cd'
< ,'darkblue','#00008b'
< ,'navy','#000080'
< ,'midnightblue','#191970'
< ,'thistle','#d8bfd8'
< ,'plum','#dda0dd'
< ,'violet','#ee82ee'
< ,'orchid','#da70d6'
< ,'fuchsia','#ff00ff'
< ,'magenta','#ff00ff'
< ,'mediumorchid','#ba55d3'
< ,'mediumpurple','#9370db'
< ,'blueviolet','#8a2be2'
< ,'darkviolet','#9400d3'
< ,'darkorchid','#9932cc'
< ,'darkmagenta','#8b008b'
< ,'purple','#800080'
< ,'indigo','#4b0082'
< ,'darkslateblue','#483d8b'
< ,'rebeccapurple','#663399'
< ,'slateblue','#6a5acd'
< ,'mediumslateblue','#7b68ee'
< ,'snow','#fffafa'
< ,'honeydew','#f0fff0'
< ,'mintcream','#f5fffa'
< ,'azure','#f0ffff'
< ,'aliceblue','#f0f8ff'
< ,'ghostwhite','#f8f8ff'
< ,'whitesmoke','#f5f5f5'
< ,'seashell','#fff5ee'
< ,'beige','#f5f5dc'
< ,'oldlace','#fdf5e6'
< ,'floralwhite','#fffaf0'
< ,'ivory','#fffff0'
< ,'antiquewhite','#faebd7'
< ,'linen','#faf0e6'
< ,'lavenderblush','#fff0f5'
< ,'mistyrose','#ffe4e1'
< ,'gainsboro','#dcdcdc'
< ,'lightgrey','#d3d3d3'
< ,'silver','#c0c0c0'
< ,'darkgray','#a9a9a9'
< ,'gray','#808080'
< ,'dimgray','#696969'
< ,'lightslategray','#778899'
< ,'slategray','#708090'
< ,'darkslategray','#2f4f4f'];
< 
< var inp="Flowchart";
< var withvenn="?venn=y", withoutvenn="";
< var venn="Venn Diagram", novenn="Flowchart";
< var dfrom='.php', dto='.html';
< var h1is='<h1 style=display:inline-block; id="myemail"></h1>&nbsp;<h1 style=display:inline-block; id="myh1">Flowchart</h1>&nbsp;or&nbsp;<input style=display:inline-block; id=itbut type=button onclick=location.href=document.URL.split(String.fromCharCode(35))[0].split(String.fromCharCode(63))[0].replace(dfrom,dto)+withvenn; value="Venn Diagram"></input>';
< h1is=location.search.split('venn=')[1] ? '<h1 style=display:inline-block; id="myemail"></h1>&nbsp;<h1 style=display:inline-block; id="myh1">' + venn + '</h1>&nbsp;or&nbsp;<input id=itbut style=display:inline-block; type=button onclick=location.href=document.URL.split(String.fromCharCode(35))[0].split(String.fromCharCode(63))[0].replace(dfrom,dto)+withoutvenn; value="' + novenn + '"></input>' : h1is;
< if (h1is.indexOf('"myh1">Venn') != -1) { inp="Venn Diagram"; cat="circle"; wording=cat; noeolp='Is this a new circle pointing or you want to place value?&nbsp;&nbsp;'; }
279,281c112
<        if (h1is.indexOf('"myh1">Venn') != -1) { 
<        outst+='<div id=dcolour style=display:inline-block;><input onclick=notc(); id=icolour type="color" onchange="overdiv(div1,this.value);" value="#90ee90"></input></div>&nbsp;&nbsp;<div id=dpf style=display:NONE;><input onclick="wnotc(); setTimeout(preprocess,12000);" style=display:inline-block; id=file type=file name=file></input><span class=readBytesButtons><button style=display:none; data-endbyte=4 data-startbyte=0>1-5</button><button style=display:none; data-endbyte=14 data-startbyte=5>6-15</button><button style=display:none; data-endbyte=7 data-startbyte=6>7-8</button><button name=button id=button value=Process data-endbyte=0 data-startbyte=0>Process</button></span></div>';
<        } else if (idarr.length == 0 && inst == '') {
---
>        if (idarr.length == 0 && inst == '') {
291,292d121
<        } else if (div1.outerHTML.indexOf(' class="circle"') != -1) {
<          mycol='#ffc0cb';
328,329c157,158
<                  document.getElementById('dstart').innerHTML=cat;
<                  return cat;
---
>                  document.getElementById('dstart').innerHTML='?';
>                  return '?';
381c210
<     wording=cat;
---
>     wording='?';
383c212
<     document.getElementById('dsave').innerHTML=document.getElementById('dsave').innerHTML.replace(somuchmore(noeolp), '');
---
>     document.getElementById('dsave').innerHTML=document.getElementById('dsave').innerHTML.replace(somuchmore('Now other end of line please.&nbsp;&nbsp;'), '');
528,531d356
<  function butlater() {
<        bodyclick=true;
<  }
<  
547,574d371
<      if (h1is.indexOf('"myh1">Venn') != -1) { 
<          bodyclick=false;
<          nonbodyclick--;
<          wdef='';
<          var vdtitle='', vspare;
<          if (dois.innerHTML == '') {
<           wdef=prompt('Enter Venn Diagram circle title (and can separate its integer value by ~ or use it for line feeds), else will plot a new circle', '');
<           if (wdef == null) { wdef=''; }
<           if (wdef.indexOf('~') != -1) { vspare=wdef.split('~')[eval(-1 + wdef.split('~').length)];  vdtitle=wdef.substring(0, eval(-1 + eval('' + wdef.length) - eval('' + vspare.length))).replace(/\~/g,'<br>') + '<br>';  wdef=vspare;  }
<          } 
<          if (wdef == '') { wdef=prompt('If you enter an integer, will show this, else will plot a new circle', ''); }
<          if (wdef == null) { wdef=''; }
<          if ((wdef + ' ').substring(0,1) >= '0' && (wdef + ' ').substring(0,1) <= '9') {
<            //alert(div1.outerHTML + ' ' + '<span style="position:absolute;top:' + y + 'px;left:' + x + 'px;">' + wdef + '</span>');
<            if (vdtitle != '') { dois.innerHTML='&nbsp;'; }
<            idarr.push("sp" + vscnt);
<            document.getElementById('dcontent').innerHTML+='<span id=sp' + vscnt + ' style="z-index:56;position:absolute;top:' + y + 'px;left:' + x + 'px;">' + vdtitle + wdef + '</span>';
<            vscnt++;
<            wdef='';
<            nonbodyclick=-1;
<            setTimeout(butlater, 1500);
<          } else {
<            bodyclick=true;
<            nonbodyclick=-1;
<            wdef="";
<            andthen();
<          }
<      }
593c390
<     wording=cat;
---
>     wording='?';
667,668c464,465
<    if (bodyclick && document.getElementById('secpoint').innerHTML.indexOf(noeolp.split('&')[0]) == -1) {
<        if (wording.replace('circle','').replace('?','') == '' && nonbodyclick >= 0) {
---
>    if (bodyclick && document.getElementById('secpoint').innerHTML.indexOf('Now other end of line please.') == -1) {
>        if (wording.replace('?','') == '' && nonbodyclick >= 0) {
671,674c468,469
<           if (h1is.indexOf('"myh1">Venn') != -1) { cat="circle"; wording=cat; } else {
<           wording=prompt("What wording do you want? (~ is carriage return) ... optional (space to) URL will be a background image (append ' /browse' to browse for background image) ... later an #ffffff type of colour can change a background colour (should the colour picker not work)", wdef);
<           }
<           if (wording == null) { wording=cat; } else { wording=tfc(wording); }
---
>           wording=prompt("What wording do you want? (~ is carriage return) ... optional (space to) URL will be a background image (append ' /browse' to browse for background image) ... later an #ffffff type of colour can change a background colour (should the colour picker not work)", "");
>           if (wording == null) { wording='?'; } else { wording=tfc(wording); }
769,773d563
<          if (h1is.indexOf('"myh1">Venn') != -1) { 
<          shape="circle"; 
<          var bch=Math.floor(Math.random() * bcols.length);
<          document.getElementById('dcontent').innerHTML+="<div id=d" + icnt + " onclick='recxy(event); clickme(this);' class='" + shape + "' style='" + biis + "line-height:20px;background-color:" + bcols[bch] + ";opacity:0.5;position:absolute;left:" + x + "px;top:" + y + "px;width:" + document.getElementById('idiam').style.width.replace('px','') + "px;height:" + document.getElementById('idiam').style.width.replace('px','') + "px;'></div>";
<          } else {
775d564
<          }
777c566
<          wording=cat;
---
>          wording='?';
794c583
<        wording=cat;
---
>        wording='?';
796c585
<        document.getElementById('secpoint').innerHTML=somuchmore(noeolp);
---
>        document.getElementById('secpoint').innerHTML=somuchmore('Now other end of line please.&nbsp;&nbsp;');
801,802c590,591
<        document.getElementById('secpoint').innerHTML=document.getElementById('secpoint').innerHTML.replace(somuchmore(noeolp), '');
<        document.getElementById('dsave').innerHTML=document.getElementById('dsave').innerHTML.replace(somuchmore(noeolp), '');
---
>        document.getElementById('secpoint').innerHTML=document.getElementById('secpoint').innerHTML.replace(somuchmore('Now other end of line please.&nbsp;&nbsp;'), '');
>        document.getElementById('dsave').innerHTML=document.getElementById('dsave').innerHTML.replace(somuchmore('Now other end of line please.&nbsp;&nbsp;'), '');
818c607
<       wording=cat;
---
>       wording='?';
835c624
<     var nameis=prompt('Please enter ' + inp + ' name to Save to (and be able to recall later).', '');
---
>     var nameis=prompt('Please enter Flowchart name to Save to (and be able to recall later).', '');
873,886d661
<  function minus(hm) {
<     notc();
<     var ij=eval('' + document.getElementById('idiam').style.width.replace('px',''));
<     ij-=hm;
<     document.getElementById('idiam').style.width='' + ij + 'px';
<  }
<  
<  function plus(hm) {
<     notc();
<     var ij=eval('' + document.getElementById('idiam').style.width.replace('px',''));
<     ij+=hm;
<     document.getElementById('idiam').style.width='' + ij + 'px';
<  }
<  
888,898d662
<     if (h1is.indexOf('"myh1">Venn') != -1 || (h1is.indexOf('"myh1">Venn') == -1 && document.getElementById('dcontent').innerHTML.replace(/\"/g,'').indexOf('class=circle') != -1)) {
<        document.getElementById('myh1').innerHTML=document.getElementById('myh1').innerHTML.replace('Flowchart', venn);
<        document.getElementById('itbut').value=novenn;
<        h1is='<h1 style=display:inline-block; id="myemail"></h1>&nbsp;<h1 style=display:inline-block; id="myh1">' + venn + '</h1>&nbsp;or&nbsp;<input id=itbut style=display:inline-block; type=button onclick=location.href=document.URL.split(String.fromCharCode(35))[0].split(String.fromCharCode(63))[0].replace(dfrom,dto)+withoutvenn; value="' + novenn + '"></input>';
<        withvenn='';
<        inp="Venn Diagram";
<        cat="circle"; 
<        wording=cat; 
<        noeolp='Is this a new circle pointing or you want to place value?&nbsp;&nbsp;'; 
<     }
<     if (h1is.indexOf('"myh1">Venn') != -1) { document.getElementById('dstart').innerHTML="circle";  document.getElementById('instruction').innerHTML+='&nbsp;&nbsp;Venn Diagram Title:&nbsp;<input title="You can add line feeds via ~ character" id=idiam placeholder="Diameter of Venn Diagram circle" onclick=notc(); style=display:inline-block;width:200px; type=text onblur="document.getElementById(' + "'" + 'dheader' + "'" + ').innerHTML=' + "'" + '<h1>' + "'" + ' + this.value.replace(/~/g,bris) + ' + "'" + '</h1>' + "'" + ';"></input>&nbsp;<a onclick=minus(10); style=cursor:pointer;>--</a>&nbsp;<a onclick=minus(1); style=cursor:pointer;>-</a>&nbsp;&nbsp;<a onclick=plus(1); style=cursor:pointer;>+</a>&nbsp;<a onclick=plus(10); style=cursor:pointer;>++</a>'; }
914c678
<   wording=cat;
---
>   wording='?';
930c694
< <h1 style=display:inline-block; id="myemail"></h1>&nbsp;<h1 style=display:inline-block; id="myh1">Flowchart</h1>&nbsp;or&nbsp;<input style=display:inline-block; id=itbut type=button onclick=location.href=document.URL.split(String.fromCharCode(35))[0].split(String.fromCharCode(63))[0].replace(dfrom,dto)+withvenn; value="Venn Diagram"></input>
---
> <h1 style=display:inline-block; id="myemail"></h1>&nbsp;<h1 style=display:inline-block; id="myh1">Flowchart</h1>
932c696
< <h4 id='instruction' onclick='notc();'><div onclick='notc();' style='display:inline-block;' id=secpoint></div>Click where you want "<div onclick=" if (this.innerHTML.length == 0) { wording=cat; } bodyclick=false; nonbodyclick=-2; setTimeout(resetit,1000); " style='display:inline-block;background-color:pink;' id=dstart contenteditable=true onblur="wording=tfc(this.innerHTML); " title="What wording do you want? (~ is carriage return) ... optional (space to) URL will be a background image (append ' /browse' to browse for background image) ... later an #ffffff type of colour can change a background colour (should the colour picker not work)">Start</div>" to be placed</h4>
---
> <h4 id='instruction' onclick='notc();'><div onclick='notc();' style='display:inline-block;' id=secpoint></div>Click where you want "<div onclick=" if (this.innerHTML.length == 0) { wording='?'; } bodyclick=false; nonbodyclick=-2; setTimeout(resetit,1000); " style='display:inline-block;background-color:pink;' id=dstart contenteditable=true onblur="wording=tfc(this.innerHTML); " title="What wording do you want? (~ is carriage return) ... optional (space to) URL will be a background image (append ' /browse' to browse for background image) ... later an #ffffff type of colour can change a background colour (should the colour picker not work)">Start</div>" to be placed</h4>
934,935c698,699
< <div id="diamond" class="diamond" style='display:none;'></div><div id="oval" class="oval" style='display:none;'></div><div id="rectangle" class="rectangle" style='display:none;'></div><div id="circle" class="circle" style='display:none;'></div>
< <div id="dcontent"><div id="dheader"></div></div>
---
> <div id="diamond" class="diamond" style='display:none;'></div><div id="oval" class="oval" style='display:none;'></div><div id="rectangle" class="rectangle" style='display:none;'></div>
> <div id="dcontent"></div>