<!doctype html>
<html>
<head>
<title>Circular Text or Emoji - RJM Programming - December, 2018 ... Thanks to https://appendto.com/2016/09/how-to-make-circularcurved-text-with-javascript/</title>
<meta charset="utf-8">
<style>
 .roulettered { color:white; background:linear-gradient(to top,orange 92%,red 8%);    }
 .rouletteblack { color:white; background:linear-gradient(to top,orange 92%,black 8%);    }
 .roulettegreen { color:white; background:linear-gradient(to top,orange 92%,green 8%);    }
</style>
<script type='text/javascript'>
var mediaid='', vrect=null;
var dvisibility='hidden';
var covcon=location.search.split('bsize=')[1] ? decodeURIComponent(location.search.split('bsize=')[1]).split('&')[0].replace(/\+/g,' ') : 'cover';
var egtextis=location.search.split('text=')[1] ? (location.search.split('text=')[1].split('&')[0]).replace(/\+/g, ' ') : '';
var atendih=location.search.split('ih=')[1] ? decodeURIComponent(location.search.split('ih=')[1]).split('&')[0].replace(/\+/g,' ').replace('svg xml','svg+xml') : '';
var atendim=location.search.split('im=')[1] ? decodeURIComponent(location.search.split('im=')[1]).split('&')[0] : '';
var atendiu=location.search.split('iu=')[1] ? decodeURIComponent(location.search.split('iu=')[1]).split('&')[0] : '';
var sizeword=location.search.split('sizeword=')[1] ? decodeURIComponent(location.search.split('sizeword=')[1]).split('&')[0] : covcon;
var pwidth=location.search.split('width=')[1] ? decodeURIComponent(location.search.split('width=')[1]).split('&')[0] : '';
var pheight=location.search.split('height=')[1] ? decodeURIComponent(location.search.split('height=')[1]).split('&')[0] : '';
var qans=location.search.split('answer=')[1] ? decodeURIComponent(location.search.split('answer=')[1]).split('&')[0].replace(/\+/g,' ') : '';
var altqans=location.search.split('answeralt=')[1] ? decodeURIComponent(location.search.split('answeralt=')[1]).split('&')[0].replace(/\+/g,' ') : '';
var parid=location.search.split('id=')[1] ? decodeURIComponent(location.search.split('id=')[1]).split('&')[0].replace(/\+/g,' ') : '';
var myrepeat=location.search.split('repeat=')[1] ? decodeURIComponent(location.search.split('repeat=')[1]).split('&')[0].replace(/\+/g,' ') : 'no-repeat';
if (atendim == 'data:' && parid.trim() != '') {
   atendim='data:' + parent.document.getElementById(parid).innerHTML.split('data:')[1].split("'")[0].split('"')[0].split('>')[0];
}
var twenty=20, twentyfive=25;
var pts=['H:Hydrogen','He:Helium','Li:Lithium','Be:Beryllium','B:Boron','C:Carbon','N:Nitrogen','O:Oxygen','F:Fluorine','Ne:Neon','Na:Sodium','Mg:Magnesium','Al:Aluminium','Si:Silicon','P:Phosphorus','S:Sulphur','Cl:Chlorine','Ar:Argon','K:Potassium','Ca:Calcium','Sc:Scandium','Ti:Titanium','V:Vanadium','Cr:Chromium','Mn:Manganese','Fe:Iron','Co:Cobalt','Ni:Nickel','Cu:Copper','Zn:Zinc','Ga:Gallium','Ge:Germanium','As:Arsenic','Se:Selenium','Br:Bromine','Kr:Krypton'];
var pnum=0;
var ieach=0, jeach=0;
var lasta=null, lasto=null;
var rad='100';
var radbit='';
var deg=360;
var it=[];
var lastois=null;
var itc=[];
var citc=[];
var fs="14";
var score=location.search.split('score=')[1] ? decodeURIComponent(location.search.split('score=')[1]).split('&')[0] : 0;
var goes=location.search.split('goes=')[1] ? decodeURIComponent(location.search.split('goes=')[1]).split('&')[0] : 0;
var nthg='';
var preitc="";
var cycles=Math.floor(Math.random() * 4567873);
var stopplace=Math.floor(Math.random() * 150) + 300;
var koffset=0;
var moff=0;
var userpicked='';
var txt=[], etxt=[];
var isRoulette=false, isThirtySeven=false;
var xalert='';
//var oncr=' id="p___" onclick="if (userpicked.length == 0) { userpicked=this.innerText; document.getElementById(' + "'" + 'mynum' + "'" + ').innerHTML=userpicked; huhd(userpicked); }" ';
var oncr=' id="p___" onclick=" lastois=this; if (userpicked.length == 0) { userpicked=this.textContent; document.getElementById(' + "'" + 'mynum' + "'" + ').innerHTML=userpicked; huhd(userpicked); }" ';
var rw=decodeURIComponent("3%3Cspan%3E2%3C%2Fspan%3E1%3Cspan%3E5%3C%2Fspan%3E1%3Cspan%3E9%3C%2Fspan%3E42%3Cspan%3E1%3C%2Fspan%3E22%3Cspan%3E5%3C%2Fspan%3E1%3Cspan%3E7%3C%2Fspan%3E3%3Cspan%3E4%3C%2Fspan%3E62%3Cspan%3E7%3C%2Fspan%3E1%3Cspan%3E3%3C%2Fspan%3E3%3Cspan%3E6%3C%2Fspan%3E1%3Cspan%3E1%3C%2Fspan%3E3%3Cspan%3E0%3C%2Fspan%3E82%3Cspan%3E3%3C%2Fspan%3E1%3Cspan%3E0%3C%2Fspan%3E52%3Cspan%3E4%3C%2Fspan%3E1%3Cspan%3E6%3C%2Fspan%3E3%3Cspan%3E3%3C%2Fspan%3E12%3Cspan%3E0%3C%2Fspan%3E1%3Cspan%3E4%3C%2Fspan%3E3%3Cspan%3E1%3C%2Fspan%3E92%3Cspan%3E2%3C%2Fspan%3E1%3Cspan%3E8%3C%2Fspan%3E2%3Cspan%3E9%3C%2Fspan%3E72%3Cspan%3E8%3C%2Fspan%3E1%3Cspan%3E2%3C%2Fspan%3E3%3Cspan%3E5%3C%2Fspan%3E32%3Cspan%3E6%3C%2Fspan%3E0");
var xintxt='', xradius='', xarcd='';
if (!String.fromCodePoint) {   // thanks to http://xahlee.info/js/js_unicode_code_point.html
// ES6 Unicode Shims 0.1 , © 2012 Steven Levithan , MIT License
    String.fromCodePoint = function fromCodePoint () {
        var chars = [], point, offset, units, i;
        for (i = 0; i < arguments.length; ++i) {
            point = arguments[i];
            offset = point - 0x10000;
            units = point > 0xFFFF ? [0xD800 + (offset >> 10), 0xDC00 + (offset & 0x3FF)] : [point];
            chars.push(String.fromCharCode.apply(null, units));
        }
        return chars.join("");
    }
}
// parseInt("hex",16);
function qask() {
  var qqans='';
  if (qans != '') {
    qqans=prompt('What is your answer?  Cannot stand it anymore, and need you to tell me the answer, you should enter a question mark.', '');
    if (qqans != null) { 
      if (qqans == '?') {
        alert(qans.substring(0,1).toUpperCase() + qans.substring(1).toLowerCase());
        qqans=null;
      }
    }
    if (qqans == null) { 
      qqans=''; 
    } else if (qqans.toLowerCase() == qans.toLowerCase() || qqans.toLowerCase() == altqans.toLowerCase()) {
      if (parid != '') {
        if (parent.document.getElementById(parid)) {
          parent.document.getElementById(parid).src=parent.document.getElementById(parid).src.replace(egtextis, encodeURIComponent(qqans.substring(0,1).toUpperCase() + qqans.substring(1).toLowerCase())).replace(/\%22red\%22/g, '%22green%22').replace(/\%22blue\%22/g, '%22purple%22');
          if (parent.document.getElementById('score') && parent.document.getElementById('goes')) {
            parent.document.getElementById('score').innerHTML='' + eval(1 + eval('' + parent.document.getElementById('score').innerHTML));
            parent.document.getElementById('goes').innerHTML='' + eval(1 + eval('' + parent.document.getElementById('goes').innerHTML));
          } else {
            alert('Well done!');
          }
        } else {
          alert('Well done!');
        }
      } else {
        alert('Well done!');
      }
    } else {
      if (parid != '') {
        if (parent.document.getElementById(parid)) {
          if (parent.document.getElementById('goes')) {
            parent.document.getElementById('goes').innerHTML='' + eval(1 + eval('' + parent.document.getElementById('goes').innerHTML));
          } else {
            alert('Bad luck.');
          }
        } else {
          alert('Bad luck.');
        }
      } else {
        alert('Bad luck.');
      }
    }
  }
}
// https://appendto.com/2016/09/how-to-make-circularcurved-text-with-javascript/
function circularText(intxt, radius, arcd) {
  var one=1, isemoji=false, kk=0, kkk=0, zero=0, ishex=false, dtxt=[], dectxt='', lu='', tprefix='';
  xintxt=intxt;
  intxt=intxt.split(' (Optional')[0];
  xradius=radius;
  xarcd=arcd;
  //alert(intxt);
  if (intxt.replace(/\&\;/g,'&').indexOf('') != -1 && intxt.indexOf(';') != -1) {
    etxt=justinnertextish(intxt,true).replace(/\&\;/g,'&').replace(/\;\&\#/g,',').split('');
    for (var k=0; k<etxt.length; k+=one) {
      if (!isemoji) {
        if (etxt[k].substring(zero).length > 1 && etxt[k].substring(zero).substring(0,1).charCodeAt(0) > 255) {
         while (zero < etxt[k].length && etxt[k].substring(zero).length > 1 && etxt[k].substring(zero).substring(0,1).charCodeAt(0) > 255) {
  //alert(etxt[k].substring(zero).substring(0,1).charCodeAt(0)) + ' ' + eval('' + etxt[k].substring(zero).substring(1).charCodeAt(0));
          txt.push(String.fromCodePoint(eval('' + etxt[k].substring(zero).substring(0,1).charCodeAt(0)),eval('' + etxt[k].substring(zero).substring(1).charCodeAt(0))   ));
          itc[eval(-1 + txt.length)]="cursor:pointer\" onclick=\"window.open('" + "//www.google.com/search?client=firefox-b-ab&q=%26%23" + etxt[k].substring(zero).substring(0,1).charCodeAt(0) + "%3B%20%26%23" + etxt[k].substring(zero).substring(1).charCodeAt(0) + "%3B&ie=UTF-8&oe=UTF-8" + "','_blank');";
          zero+=2;
         }
        }
        //if (zero != 0) { alert('' + zero + ' ' + etxt[k].substring(zero) + '! k=' + k + ' and etxt.length=' + etxt.length + ' ... ' + intxt.replace(/\;\&\#/g,',')); }
        one=1;
        for (kk=zero; kk<etxt[k].length; kk+=one) {
         if (etxt[k].substring(kk, eval(1 + kk)).charCodeAt(0) > 255) {
          txt.push(String.fromCodePoint(eval('' + etxt[k].substring(kk).charCodeAt(0)),eval('' + etxt[k].substring(kk).substring(1).charCodeAt(0))   ));
          itc[eval(-1 + txt.length)]="cursor:pointer\" onclick=\"window.open('" + "//www.google.com/search?q=%26%23" + etxt[k].substring(kk).charCodeAt(0) + "%3B%20%26%23" + etxt[k].substring(kk).substring(1).charCodeAt(0) + "%3B&ie=UTF-8&oe=UTF-8" + "','_blank');";
          one=2;
         } else {
          txt.push(tprefix + etxt[k].substring(kk, eval(1 + kk)));
          one=1;
          tprefix='';
         }
        }
        one=1;
        zero=0;
        isemoji=true;
      } else {
        
        if (ishex || etxt[k].split(';')[0].toLowerCase().replace('x','a').replace('b','a').replace('c','a').replace('d','a').replace('e','a').replace('f','a').indexOf('a') != -1) {
        ishex=true;
        dtxt=etxt[k].split(';')[0].split(',');
        dectxt='' + parseInt(dtxt[0].replace('x','').replace('X',''),16);
        lu=dtxt[0];
        for (kkk=1; kkk<dtxt.length; kkk++) {
         dectxt+=',' + parseInt(dtxt[kkk].replace('x','').replace('X',''),16);
         lu=dtxt[kkk];
        }
        eval("txt.push(String.fromCodePoint(" + dectxt + "))");
        itc[eval(-1 + txt.length)]="cursor:pointer\" onclick=\"window.open('" + "//www.google.com/search?q=%26%23" + dectxt.replace(',','%3B%20%26%23') + "%3B&ie=UTF-8&oe=UTF-8" + "','_blank');";
        } else {
        eval("txt.push(String.fromCodePoint(" + etxt[k].split(';')[0].replace(/x/g,'').replace(/X/g,'') + "))");
        itc[eval(-1 + txt.length)]="cursor:pointer\" onclick=\"window.open('" + "//www.google.com/search?q=%26%23" + etxt[k].split(';')[0].replace(/x/g,'').replace(/X/g,'').replace(',','%3B%20%26%23') + "%3B&ie=UTF-8&oe=UTF-8" + "','_blank');";
        }
        zero=eval(1 + eval('' + etxt[k].split(';')[0].length));
        //if (zero != 0) { alert('' + zero + ' ' + etxt[k].substring(zero) + '! k=' + k + ' and etxt.length=' + etxt.length + ' ... ' + intxt.replace(/\;\&\#/g,',')); }
        if ((etxt[k] + '&').substring(kk, eval(1 + kk)) != '&'.substring(0,1)) {
        if (intxt.split(lu + ';')[1].length > 1 && intxt.split(lu + ';')[1].substring(0,1).charCodeAt(0) > 255) {
          //alert('' + String.fromCodePoint(eval('' + intxt.split(lu + ';')[1].substring(0,1).charCodeAt(0))) + ' ' + intxt.split(lu + ';')[1].substring(0,1).charCodeAt(0) + ' ' + intxt.split(lu + ';')[1].substring(1).charCodeAt(0) + ' ' + etxt[k].substring(kk));
          //txt.push(etxt[k].substring(kk));
          txt.push(String.fromCodePoint(eval('' + intxt.split(lu + ';')[1].substring(0,1).charCodeAt(0)),eval('' + intxt.split(lu + ';')[1].substring(1).charCodeAt(0))   ));
        } else {
        //alert(intxt.split(lu + ';')[1] + ' ' + intxt.split(lu + ';')[1].length + ' ' + intxt.split(lu + ';')[1].substring(0,1).charCodeAt(0));
        one=1;
        for (kk=zero; kk<etxt[k].length; kk+=one) {
         if (etxt[k].substring(kk, eval(1 + kk)).charCodeAt(0) > 255) {
          txt.push(String.fromCodePoint(eval('' + etxt[k].substring(kk).charCodeAt(0)),eval('' + etxt[k].substring(kk).substring(1).charCodeAt(0))   ));
          itc[eval(-1 + txt.length)]="cursor:pointer\" onclick=\"window.open('" + "//www.google.com/search?q=%26%23" + etxt[k].substring(kk).charCodeAt(0) + "%3B%20%26%23" + etxt[k].substring(kk).substring(1).charCodeAt(0) + "%3B&ie=UTF-8&oe=UTF-8" + "','_blank');";
          one=2;
         } else {
          txt.push(tprefix + etxt[k].substring(kk, eval(1 + kk)));
          one=1;
          tprefix='';
         }
        }
        }
        one=1;
        zero=0;
        } else {
        isemoji=false;
        }
      }
    }
  } else {
  
  
  
    if (isThirtySeven) {   
    //alert(intxt);  
    txt = justinnertextish(reworked(intxt),false).split("");
    //alert(txt[0]);
    } else {
    txt = justinnertextish(intxt,false).split("");
    }
    //if (isThirtySeven) {   alert(txt);  }
  }
  //alert(txt.length);
  var deg = arcd / txt.length, origin = 0, j = 0;
  while (eval('' + origin) < arcd) {
    if (txt.length > j) {
     //if (it[j] != '') { alert(it[j]); }
     //alert('' + radius + ' ... ' + fs + ' ... ' + eval(fs - 14 + radius));
     if (preitc != '') {
       itc[j]='cursor:pointer;z-index:56;padding:7px;' + itc[j];
     }
     if (preitc != '') {
       if ((txt[j] + it[j]).indexOf('<span') == -1) {  it[j]+=' ';   }
       if (eval(eval('' + origin) + eval('' + deg)) >= arcd) {
         preitc=oncr + " class=\"roulettegreen\""; 
       }
     }
     document.getElementById('test').innerHTML+=("<p style=\"height:" + eval(eval('' + fs) - 14 + eval('' + radius)) + "px;font-size:" + fs + "px;position:absolute;transform:rotate(" + origin + "deg);transform-origin:0 100%;" + itc[j] + "\"" + preitc + ">" + txt[j] + it[j] + "</p>").replace("___","" + j);
     citc.push(preitc);
     if (preitc != '') {
       if (preitc == (oncr + " class=\"roulettered\"")) {
         preitc=oncr + " class=\"rouletteblack\""; 
       } else {
         preitc=oncr + " class=\"roulettered\""; 
       }
     }
    }
    origin += deg;
    j++;
  }
  //alert(it[11]);
  if (preitc != '' && isRoulette) {
    cycles+=txt.length;
    koffset=-1;
    setTimeout(another,4100);
  }
}
 function reworked(intis) {  // RE: pts array Period Table symbol/name quiz
   // 3<span>2</span>1<span>5</span>1<span>9</span>42<span>1</span>22<span>5</span>1<span>7</span>3<span>4</span>62<span>7</span>1<span>3</span>3<span>6</span>1<span>1</span>3<span>0</span>82<span>3</span>1<span>0</span>52<span>4</span>1<span>6</span>3<span>3</span>12<span>0</span>1<span>4</span>3<span>1</span>92<span>2</span>1<span>8</span>2<span>9</span>72<span>8</span>1<span>2</span>3<span>5</span>32<span>6</span>0
   var okayis=false, outtis=intis + '<span>/0</span>', sofar=',', iso=-1;
   var outtisa='3<span>2</span>;1<span>5</span>;1<span>9</span>;4;2<span>1</span>;2;2<span>5</span>;1<span>7</span>;3<span>4</span>;6;2<span>7</span>;1<span>3</span>;3<span>6</span>;1<span>1</span>;3<span>0</span>;8;2<span>3</span>;1<span>0</span>;5;2<span>4</span>;1<span>6</span>;3<span>3</span>;1;2<span>0</span>;1<span>4</span>;3<span>1</span>;9;2<span>2</span>;1<span>8</span>;2<span>9</span>;7;2<span>8</span>;1<span>2</span>;3<span>5</span>;3;2<span>6</span>'.split(';');       //;0<span>/0</span>';
   for (var i=0; i<pts.length; i++) {
     okayis=false;
     while (!okayis) {
      iso=Math.floor(Math.random() * pts.length);
      if (sofar.indexOf(',' + iso + ',') == -1) { okayis=true; sofar+='' + iso + ','; }
     }
     if (pts[iso].split(':')[0].length == 1) {
     outtis=outtis.replace(outtisa[i], pts[iso].split(':')[0]);
     } else {
     outtis=outtis.replace(outtisa[i], pts[iso].split(':')[0].substring(0,1) + '<span>' + pts[iso].split(':')[0].substring(1) + '</span>');
     }
   }
   return outtis;
 } 
function preanother() {
  var brb="";
  for (var ij=jeach; ij>2; ij--) {
     brb+="<br>";
  }
  if (brb != "") {
     document.getElementById('p' + pnum).innerHTML=document.getElementById('p' + pnum).innerHTML + brb + '⚽';
     jeach--;
     setTimeout(preanother,ieach);
  }
}
function another() {
  var pzc='';
  var deg = xarcd / txt.length, origin = 0, j = 0;
  document.getElementById('test').innerHTML='';
  preitc=citc[eval(eval(koffset + txt.length + j) % eval(txt.length))];
  while (eval('' + origin) < xarcd) {
    if (txt.length > j) {
     preitc=citc[eval(eval(koffset + txt.length + j) % eval(txt.length))];
     document.getElementById('test').innerHTML+=("<p style=\"height:" + eval(eval('' + fs) - 14 + eval('' + xradius)) + "px;font-size:" + fs + "px;position:absolute;transform:rotate(" + origin + "deg);transform-origin:0 100%;" + itc[eval(eval(koffset + txt.length + j) % eval(txt.length))] + "\"" + preitc + ">" + txt[eval(eval(koffset + txt.length + j) % eval(txt.length))] + it[eval(eval(koffset + txt.length + j) % eval(txt.length))] + "</p>").replace("___","" + j);
    }
    origin += deg;
    j++;
  }
  if (moff < cycles) {
    moff++;
    koffset--;
    if (koffset == eval(0 - txt.length)) { koffset=0; }
    //document.title='' + eval(moff + 100) + ' ' + userpicked;
    if (stopplace == eval(moff + 99)) {
     pnum=Math.floor(Math.random() * 36);
     jeach=12;
     ieach=Math.floor(eval(eval(moff + 100) / 10));
     document.getElementById('myballdivtwo').style.display='none';
     lasto.style.display='none'; 
     setTimeout(preanother,ieach);
    } else if (stopplace == eval(moff + 100)) {
     document.getElementById('myballdivtwo').style.display='none';
     pzc=document.getElementById('p' + pnum).textContent; //innerText;
     document.getElementById('p' + pnum).innerHTML=document.getElementById('p' + pnum).innerHTML + '<br><br>⚽';
     if (document.getElementById('mynum').textContent == 'red') { //.innerText == 'red') {
       if (('' + document.getElementById('p' + pnum).className).indexOf('red') != -1) {
       score+=eval('' + 2);
       goes++;
       xalert=('You win!  Congratulations on scoring 2.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
       } else {
       goes++;
       xalert=('Spun onto ' + pzc + ' which is not red.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
       }
     } else if (document.getElementById('mynum').textContent == 'black') { //.innerText == 'black') {
       if (('' + document.getElementById('p' + pnum).className).indexOf('black') != -1) {
       score+=eval('' + 2);
       goes++;
       xalert=('You win!  Congratulations on scoring 2.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
       } else {
       goes++;
       xalert=('Spun onto ' + pzc + ' which is not black.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
       }
     } else if (document.getElementById('mynum').textContent == 'green') { //..innerText == 'green') {
       if (('' + document.getElementById('p' + pnum).className).indexOf('green') != -1) {
       score+=eval('' + 37);
       goes++;
       xalert=('You win!  Congratulations on scoring 37.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
       } else {
       goes++;
       xalert=('Spun onto ' + pzc + ' which is not green.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
       }
     } else if (pzc == document.getElementById('mynum').textContent) { //.innerText) {
       score+=eval('' + 36);
       goes++;
       xalert=('You win!  Congratulations on scoring 36.');
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
     } else {
       goes++;
       xalert=('Spun onto ' + pzc + ' not ' + document.getElementById('mynum').textContent); //.innerText);
       if (1 == 1) { setTimeout(xalertst,2000); } else { location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes; }
     }
    } else {
     setTimeout(another,eval(moff + 100));
    }
  }
}
function xalertst() {
  alert(xalert);
  location.href=document.URL.split('&score=')[0] + '&score=' + score + '&goes=' + goes;
}
function justinnertextish(intx, within) {
  var sone=1, tagis='', iit=0, less=false, ioffset=0;
  outx=intx;
  it=[];
  itc=[];
  if (intx.indexOf('</') != -1) {
    outx="";
    for (iit=0; iit<intx.length; iit+=sone) {
      if (intx.substring(iit, eval(1 + iit)) == '<') {
        tagis=intx.substring(iit).substring(1).split('>')[0];
        less=false;
        if (tagis.indexOf(' ') != -1) { // || within) {
        less=true;
        //document.getElementById('atend').style.display='block';
        //document.getElementById('atend').style.backgroundColor='#c0d0f0'; //'transparent';
        document.getElementById('atend').innerHTML='<' + tagis + '>' + intx.substring(eval(iit + 2 + tagis.length)).split('>')[0] + '>';
        //alert('' + eval(iit + 2 + tagis.length) + ' ... ' + tagis + ' --- ' + intx.substring(eval(iit + 2 + tagis.length)));
        //alert('<' + tagis + '>' + intx.substring(eval(iit + 2 + tagis.length)).split('>')[0] + '>');
        it[Math.max(0,eval(-1 + it.length))]+='<' + tagis + '>' + intx.substring(eval(iit + 2 + tagis.length)).split('>')[0] + '>';
        if (it[Math.max(0,eval(-1 + it.length))] != ('<' + tagis + '>' + intx.substring(eval(iit + 2 + tagis.length)).split('>')[0] + '>')) {
          ioffset=eval(it[Math.max(0,eval(-1 + it.length))].length - ('<' + tagis + '>' + intx.substring(eval(iit + 2 + tagis.length)).split('>')[0] + '>').length);
          less=false;
        }
        } else if (tagis.toLowerCase().replace('br','b').replace('i','b') == 'b') {
        less=false;
        it[Math.max(0,eval(-1 + it.length))]='<' + tagis + '>';
        itc[Math.max(0,eval(-1 + itc.length))]='';
        } else {
        less=false;
        it[Math.max(0,eval(-1 + it.length))]='<' + tagis + '>' + intx.substring(eval(iit + 2 + tagis.length)).split('>')[0] + '>';
        itc[Math.max(0,eval(-1 + itc.length))]='';
        }
        sone=eval(ioffset + it[Math.max(0,eval(-1 + it.length))].length);
        if (ioffset != 0) {
          it[Math.max(0,eval(-1 + it.length))]=it[Math.max(0,eval(-1 + it.length))].substring(0,Math.abs(ioffset));
        }
        ioffset=0;
        //if (sone != 1) { alert('' + Math.max(0,eval(-1 + it.length)) + ' ' + it[Math.max(0,eval(-1 + it.length))] + ' ... ' + less); }
        if (less) { it[Math.max(0,eval(-1 + it.length))]=""; itc[Math.max(0,eval(-1 + itc.length))]=""; }
        //alert(sone);
      } else {
        it.push("");
        itc.push("");
        outx+=intx.substring(iit, eval(1 + iit));
        sone=1;
      }
    }
  } else {
    it=intx.split("");
    for (iit=0; iit<it.length; iit++) {
      it[iit]="";
      itc[iit]="";
    }
  }
  return outx;
}
//circularText("this text is in a circle ", 100, 0);
function detvis() {
   var rectb, huhcs=dvisibility.split(',');
   if (document.getElementById('mydetails').open) {
     if (dvisibility.toLowerCase() == dvisibility) {
     //alert(167);
      rectb=document.getElementById('mydetails').getBoundingClientRect();
      dvisibility=dvisibility.toUpperCase();
      if (huhcs.length == 2) { dvisibility+=',' + eval(-18 + rectb.height) + 'PX'; } 
      document.getElementById('atend').style.marginTop='' + eval(-18 + rectb.height) + 'px';
     } else {
     //alert(267);
      document.getElementById('atend').style.marginTop='' + dvisibility.split(',')[2].toLowerCase();
     }
     setTimeout(detvis, 5000);
   } else if (dvisibility.toUpperCase() == dvisibility) {
     //alert(dvisibility);
     document.getElementById('atend').style.marginTop=('' + dvisibility.split(',')[1]).toLowerCase();
     setTimeout(detvis, 5000);
   } else if (dvisibility.split(',')[0].toLowerCase() == 'hidden') {
     //alert('4:' + dvisibility);
     dvisibility=dvisibility.replace('hidden', 'visible');
     if (dvisibility.indexOf(',') == -1) {
      if (('' + document.getElementById('atend').style.marginTop).replace(/^null/g,'').replace(/^undefined/g,'') != '') {
       dvisibility+=',' + ('' + document.getElementById('atend').style.marginTop);
      } else {
       dvisibility+=',0px';
      }
     }
     //alert('0:' + dvisibility);
     document.getElementById('mydetails').style.visibility='hidden';
     setTimeout(detvis, 5000);
   } else {
     //alert(567);
     //alert('5:' + dvisibility);
     dvisibility=dvisibility.replace('visible', 'hidden');
     //alert('1:' + dvisibility);
     document.getElementById('mydetails').style.visibility='visible';
     setTimeout(detvis, 5000);
   }
}
function covercontain() {
  if (covcon == 'cover') {
    covcon='contain';
    document.getElementById('atend').style.backgroundSize=covcon;
  } else {
    covcon='cover';
    document.getElementById('atend').style.backgroundSize=covcon;
  }
  setTimeout(covercontain, 10000);
}
function onl() {
  var factor=1.0;
  var stt=0, stl=0;
  var crad=location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1].split('&')[0]) : '' + rad;
  if (atendih != '' || atendim != '' || atendiu != '') {
     //document.title='' + eval(eval(-0.5 * screen.width) + eval(crad / 2.0) - 30) + 'px';
     //document.getElementById('mycontainer').style.marginLeft='' + eval(eval(-0.5 * screen.width) + eval(crad / 2.0) - 30) + 'px';
     //document.title='' + eval(eval(-0.5 * window.innerWidth) + eval(crad / 2.0) - 30) + 'px';
     var recta=document.getElementById('mycontainer').getBoundingClientRect();
     if (1 == 1) {
     //alert('' + recta.left);
     document.getElementById('mycontainer').style.marginLeft='' + eval(eval(-0.5 * recta.width) + eval(crad * 1.0) - 30) + 'px';
     } else {
     document.getElementById('mycontainer').style.marginLeft='' + eval(eval(-0.5 * window.innerWidth) + eval(crad / 2.0) - 220) + 'px';
     }
     document.getElementById('mycontainer').style.marginTop='-40px';
     // Thanks to https://stackoverflow.com/questions/14031740/how-to-center-in-div-without-text-align
     //if (atendih != '') { document.getElementById('atend').innerHTML='<br><p style=text-align:center;vertical-align:middle;>' + atendih + '</p>'; }
     if (atendih != '') { document.getElementById('atend').innerHTML='<p style=text-align:center;vertical-align:middle;>' + atendih + '</p>'; }
     if (atendim.indexOf('data:video/') != -1) {
       document.getElementById('atend').style.verticalAlign='top';
       document.getElementById('atend').innerHTML='<video data-onclick="document.getElementById(' + "'myplay'" + ').click();" id=myvidis style="object-fit:cover;vertical-align:top;float:top;border-radius:' + (location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500').split('.')[0] + 'px;" controls><source src="' + atendim + '" type="video/' + atendim.split('data:video/')[1].split(';')[0].split(',')[0].replace(/^mov$/g,'mp4').replace(/^m4v$/g,'mp4') + '"></source></video>';
       document.getElementById('atend').style.borderRadius='' + (location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500').split('.')[0] + 'px';
       atendim='DATA:';
       mediaid='myvidis';
     } else if (atendim.indexOf('data:audio/') != -1) {
       document.getElementById('atend').innerHTML='<audio id=myaidis style="opacity:0.6;margin-top:-' + ('' + eval((location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500') / 2.2)).split('.')[0] + 'px;" controls><source src="' + atendim + '" type="audio/' + atendim.split('data:audio/')[1].split(';')[0].split(',')[0].replace(/^aiff$/g,'x-aiff').replace(/^m4a$/g,'x-m4a').replace(/^wav$/g,'x-wav') + '"></source></audio>';
       //document.getElementById('atend').style.borderRadius='' + (location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500').split('.')[0] + 'px';
       document.getElementById('atend').style.verticalAlign='middle';
       document.getElementById('atend').style.borderRadius='' + (location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500').split('.')[0] + 'px';
       atendim='DATA:';
       mediaid='myaidis';
     } else if (atendim.indexOf('data:image/') != -1 && document.URL.replace('ihfill=','idget=').indexOf('idget=') != -1) {
       document.getElementById('atend').style.background='URL("' + atendim + '")';
       //alert((location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500').split('.')[0]);
       
       document.getElementById('atend').style.borderRadius='' + (location.search.split('radius=')[1] ? decodeURIComponent(location.search.split('radius=')[1]).split('&')[0].replace(/\+/g,' ') : '500').split('.')[0] + 'px';
       document.getElementById('atend').style.backgroundRepeat=myrepeat; //'no-repeat';
       document.getElementById('atend').style.backgroundSize=covcon; // 'cover';  
       setTimeout(covercontain, 10000);
       atendim='DATA:';
     }
     if (atendim != '') { 
       //alert(atendim);
       if (atendih.trim() != '') {
       if (atendim != 'DATA:') {
       document.getElementById('atend').style.background="linear-gradient(rgba(255,255,255,0.5),rgba(255,255,255,0.5)),URL('" + atendim + "')";
       }
       } else {
       if (atendim.indexOf('data:') == 0) {
          //alert(atendim);
          if (atendim.indexOf(';utf8,') != -1) {
             if (atendih == '' && qans == 'secant') {
             if (atendim.indexOf(' width="') != -1) { atendim=atendim.replace(' width="' + atendim.split(' width="')[1].split('"')[0], ' x="0" y="0" preserveAspectRatio="none" width="100%'); }
             if (atendim.indexOf(' height="') != -1) { atendim=atendim.replace(' height="' + atendim.split(' height="')[1].split('"')[0], ' height="110%'); document.getElementById('atend').style.backgroundColor='yellow'; }
             //alert(atendim);
             document.getElementById('atend').innerHTML=atendim.split(';utf8,')[1].replace('<svg ', '<svg id=mysvg ');
     if (atendiu != '') {
        if (atendiu.substring(0,2) == '//') { 
          atendiu=document.URL.split('//')[0] + atendiu;  
        } else if (atendiu.substring(0,1) == '/') {
          atendiu=document.URL.split('//')[0] + '//' + document.URL.split('//')[1].split('/')[0] + atendiu;  
        } else if (atendiu.substring(0,4) == 'www.') {
          atendiu=document.URL.split('//')[0] + '//' + atendiu;  
        }
        document.getElementById('mysvg').setAttribute('data-url', atendiu);
     }
             } else if (atendim != 'DATA:') {
             if (atendim.indexOf(' width="') != -1) { atendim=atendim.replace(' width="' + atendim.split(' width="')[1].split('"')[0], ' x="0" y="0" preserveAspectRatio="none" width="100%'); }
             if (atendim.indexOf(' height="') != -1) { atendim=atendim.replace(' height="' + atendim.split(' height="')[1].split('"')[0], ' height="100%'); }
             atendim=atendim.split(';utf8,')[0] + ';base64,' + window.btoa(atendim.split(';utf8,')[1]);
             //alert('2:' + atendim);
             document.getElementById('atend').style.background="URL(" + atendim + ")";
             if (atendih == '' && qans.replace('radius','diameter').replace('chord','diameter').replace('tanJUNKgent','diameter') == 'diameter') {  document.getElementById('atend').style.backgroundColor='yellow'; }
             if (qans == 'tangent') { document.getElementById('atend').style.borderTopLeftRadius=null; document.getElementById('atend').style.borderLeft='1px solid blue'; }
             }
          } else if (atendim != 'DATA:') {
             atendim=atendim.replace(/\'/g, '"');
             document.getElementById('atend').style.background="URL('" + atendim + "')";
          }
       } else if (atendim != 'DATA:') {
          document.getElementById('atend').style.background="URL('" + atendim + "')";
       }
       }
       if (atendim != 'DATA:') {
       document.getElementById('atend').style.backgroundRepeat=myrepeat; //"no-repeat"; 
       document.getElementById('atend').style.backgroundSize=sizeword; 
       }
       
       if (mediaid == 'myvidis') {
         //alert(99);
         setTimeout(bitlat, 2000);
       }
     }
     if (atendiu != '') {
        if (atendiu.substring(0,2) == '//') { 
          atendiu=document.URL.split('//')[0] + atendiu;  
        } else if (atendiu.substring(0,1) == '/') {
          atendiu=document.URL.split('//')[0] + '//' + document.URL.split('//')[1].split('/')[0] + atendiu;  
        } else if (atendiu.substring(0,4) == 'www.') {
          atendiu=document.URL.split('//')[0] + '//' + atendiu;  
        }
        document.getElementById('atend').style.cursor='pointer';
        document.getElementById('atend').setAttribute('data-url', atendiu);
        var valid = /^(ftp|http|https):\/\/[^ "]+$/.test(atendiu);  // thanks to https://stackoverflow.com/questions/1410311/regular-expression-for-url-validation-in-javascript
        if (valid) {
        document.getElementById('atend').title = 'Click for ' + atendiu;
        document.getElementById('atend').addEventListener('click', function(evt) {  if (('' + evt.target.getAttribute('data-url')).replace(/^null/g,'').replace(/^undefined/g,'').trim() != '') { window.open(evt.target.getAttribute('data-url'), '_blank', 'top=50,left=50,width=600,height=600'); }  });
        } else {
        document.getElementById('atend').addEventListener('click', function(event) {   eval(event.target.getAttribute('data-url').replace(/\\\"/g, '"'));  });
        }
     }
     setTimeout(detvis, 500);
  } else {
     dvisibility=dvisibility.toUpperCase() + (',,' + ('' + document.getElementById('atend').style.marginTop).toUpperCase()).replace(/^\,\,$/g, ',,0PX');
     document.getElementById('mydetails').open=true;
     var rectis=document.getElementById('mydetails').getBoundingClientRect();
     dvisibility=dvisibility.toUpperCase().replace(',,',(',' + ('' + document.getElementById('atend').style.marginTop).toUpperCase()).replace(/^\,$/g, ',' + eval(eval(-1 * rectis.bottom) + twentyfive) + 'PX') + ',');
     setTimeout(detvis, 5000);
  }
  var notr=location.search.split('notr=')[1] ? (' ' + decodeURIComponent(location.search.split('notr=')[1].split('&')[0])) : '';
  var textis=location.search.split('text=')[1] ? decodeURIComponent(location.search.split('text=')[1].split('&')[0]).replace(/\+/g, ' ') : '';
  if (textis == rw) { if (notr == '') { isRoulette=true; } else { isThirtySeven=true; } preitc=oncr + " class=\"roulettered\""; }
  deg=location.search.split('degrees=')[1] ? eval(decodeURIComponent(location.search.split('degrees=')[1].split('&')[0])) : deg;
  fs=location.search.split('fontsize=')[1] ? decodeURIComponent(location.search.split('fontsize=')[1].split('&')[0]) : fs;
  if (crad != ('' + rad)) {
    if (crad.indexOf('.') != -1) {
      deg=eval(crad.split('.')[1]);
      rad=eval(crad.split('.')[0]);
    } else if (rad.indexOf('.') != -1) {
      deg=eval(rad.split('.')[1]);
      rad=eval(rad.split('.')[0]);
    } else {
      rad=eval(crad);
    }
  }
  document.getElementById('iself').value='' + fs;
//alert(1);
  if (('' + rad) != '100' || ('' + deg) != '360') { radbit='radius=' + encodeURIComponent('' + rad + '.' + deg) + '&'; document.getElementById('irad').value=('' + rad).split('.')[0]; document.getElementById('ideg').value='' + deg; }
  if (textis == '') {
//alert(11);
    circularText("this text is in a circle 🍍 🍌 (Optionally | separate words (++ is line feed) & image URL & onclick URL or Javascript)", rad, deg);
  } else {
    //document.getElementById('inp').value=textis; //.replace(/\&\#/g,'&#');
    //alert(textis);
//alert(textis);
    circularText(textis, rad, deg);
    document.getElementById('inp').value=textis.replace(/\&\#/g,'&#');
  }
  var rect=document.getElementById('test').getBoundingClientRect();
  var thirtyeight=38, thirtyeight=38, twentyeight=28, four=4;
//alert(1111);
  if (isRoulette || isThirtySeven) {
    //alert('here');
    twenty=-15;
    thirtyeight=-30;
    twentyeight=0;
    four=-14;
  } else if (window.self !== window.top && (atendih != '' || atendim != '' || atendiu != '')) {
//alert(11111);
    twenty=25;  // maybe 20
  } //else {
    //alert(98);
  //}
  //alert('' + rect.left + ',' + rect.top + ' ... ' + rect.width + ',' + rect.height);
  document.getElementById('atend').style.position='absolute';
  if (pheight != '') {
  document.getElementById('atend').style.left='0px';
  document.getElementById('atend').style.top='0px';
  } else {
  document.getElementById('atend').style.left=eval(factor * eval(-rad + (eval('' + twenty)) + rect.left)) + 'px';
  stl=eval(factor * eval(-rad + (eval('' + twenty)) + rect.left));
  //document.getElementById('atend').style.top=eval(38 + rect.top) + 'px';
  //document.getElementById('atend').style.top=eval(98 + rect.top) + 'px';  // 14.34 32.?  54.98
  document.getElementById('atend').style.top=eval(factor * eval(eval('' + fs) * 2 + (eval('' + four)) + eval('' + rect.top))) + 'px';
  }
  stt=eval(factor * eval(eval('' + fs) * 2 + (eval('' + four)) + eval('' + rect.top)));
  
  if (pwidth != '') {
  document.getElementById('atend').style.width='' + pwidth + 'px';
  } else {
  document.getElementById('atend').style.width=eval(2 * rad - (eval('' + thirtyeight))) + 'px';
  if (mediaid != '') { document.getElementById(mediaid).style.width=eval(2 * rad - (eval('' + thirtyeight))) + 'px';  }
  }
  if (pheight != '') {
  document.getElementById('atend').style.height='' + pheight + 'px';
  if (document.getElementById('atend').outerHTML.indexOf('.gif') == -1) {
  if (qans == 'tangent') { 
  document.getElementById('atend').style.borderTopRightRadius='' + pheight + 'px';
  document.getElementById('atend').style.borderBottomRightRadius='' + pheight + 'px';
  } else if (atendim != 'DATA:') {
  document.getElementById('atend').style.borderRadius='' + pheight + 'px';
  }
  }
  document.getElementById('atend').style.borderColor='transparent';
  } else {
  document.getElementById('atend').style.height=eval(2 * rad - (eval('' + thirtyeight))) + 'px';
  if (mediaid != '') { document.getElementById(mediaid).style.height=eval(2 * rad - (eval('' + thirtyeight))) + 'px';  }
  //if (qans == 'secant') {
  //document.getElementById('atend').style.borderRadius=eval(3 * rad - twentyeight) + 'px';
  //} else {
  if (qans == 'tangent') { 
  document.getElementById('atend').style.borderTopRightRadius=eval(2 * rad - twentyeight) + 'px';
  document.getElementById('atend').style.borderBottomRightRadius=eval(2 * rad - twentyeight) + 'px';
  } else if (atendim != 'DATA:') {
  document.getElementById('atend').style.borderRadius=eval(2 * rad - twentyeight) + 'px';
  }
  //}
  }
  
  
  //document.getElementById('atend').innerHTML='X';
  //if (document.getElementById('atend').innerHTML != '') { document.getElementById('atend').style.backgroundColor='#c0d0f0'; } //'transparent';
  if (document.getElementById('atend').innerHTML != '' && atendim == '') { 
    document.getElementById('atend').style.background='radial-gradient(circle,#c0d0f0,#c3d3f3)'; 
  } else if (isThirtySeven) {
    document.getElementById('atend').style.backgroundColor='rgba(165,265,0,0.3)'; 
    document.getElementById('atend').innerHTML='<p id=pscore>Score: ' + score + '/' + goes + '</p>Pick Your <br>Periodic Table <br>Symbol<br><i><b><div contenteditable=true onblur=huhd(this.innerHTML); onchange=huhd(this.innerHTML); id=mynum>?</div></b></i>';
    //alert(76);
  } else if (isRoulette) {
    document.getElementById('atend').style.backgroundColor='rgba(265,165,0,0.3)'; 
    document.getElementById('atend').innerHTML='Score: ' + score + '/' + goes + '<br>Pick Your Number<br><i><b><div contenteditable=true onblur=huhd(this.innerHTML); onchange=huhd(this.innerHTML); id=mynum>?</div></b></i>';
    var ccl=Math.floor(eval(eval(-rad + (eval('' + twenty)) + rect.left) + eval(eval(2 * rad - (eval('' + thirtyeight))) / 2)));
    var cct=Math.floor(eval(eval(eval('' + fs) * 2 + (eval('' + four)) + eval('' + rect.top)) + eval(eval(2 * rad - (eval('' + thirtyeight))) / 2)));
    lasta=document.getElementById('myballdivtwo');
    animateonorbit('myballdivtwo', ccl, cct, 150, 6);
    var toccl=eval(180 + ccl);
    var tocct=eval(180 + cct);
    lasta=document.getElementById('myballdiv');
    //animateonline('myballdiv', ccl, cct, toccl, tocct, 6);
  } //#c0d0f0'; } //'transparent';
  //document.getElementById('atend').style.display='none';
  atendih='';
  atendiu='';
  atendim='';
}
function bitlat() {
         vrect=document.getElementById('atend').getBoundingClientRect();
         //alert('' + vrect.bottom);
         
         document.getElementById('myplay').style.position='absolute';
         //alert('2:' + vrect.bottom);
         document.getElementById('myplay').style.top='' + eval(15 + eval('' + vrect.top)) + 'px'; 
         //alert('3:' + vrect.bottom);
         document.getElementById('myplay').style.left='2px'; 
         //alert('4:' + vrect.bottom);
         document.getElementById('myplay').style.zIndex='99';
         //alert('5:' + vrect.bottom);
         document.getElementById('myplay').style.opacity='1.0'; 
         //alert('6:' + vrect.bottom);
         document.getElementById('myplay').style.display='inline-block'; 
         //alert('7:' + document.getElementById('myplay').outerHTML);
         //document.getElementById('myvvidis').scrollIntoView();
         setTimeout(bitlatr, 2000);
}
function bitlatr() {
         //var arectis=document.body.getBoundingClientRect();
         //console.log('parent.document.body.scrollTop()=' + window.parent.scrollY);
         //document.getElementById('myplay').style.top='' + eval(eval(15 + eval('' + vrect.top)) + eval('' + parent.document.documentElement.scrollTop | parent.document.body.scrollTop)) + 'px';
         document.getElementById('myplay').style.top='' + eval(eval(15 + eval('' + vrect.top)) + eval('' + window.parent.scrollY)) + 'px';
         setTimeout(bitlatr, 5000);
}
function animateonorbit(bid, ccl, cct, anrad, fhl) { // thanks to https://www.useragentman.com/blog/2013/03/03/animating-circular-paths-using-css3-transitions/
    var dba='<style> #' + bid + ' { display:block;  top:' + cct + 'px; ';
    dba+=' left:' + ccl + 'px; position:absolute; -moz-border-radius: 12px; border-radius: 12px;  ';
    dba+=' filter: alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; transform: rotate(45deg) translateX(' + anrad + 'px) rotate(-45deg); ';
    dba+=' animation:animateonorbit  ' + fhl + 's linear infinite; -webkit-animation:animateonorbit ' + fhl + 's linear infinite; z-index:79; } ';
    dba+=' @keyframes animateonorbit {  from   { 	transform: rotate(0deg) translateX(' + anrad + 'px) rotate(0deg);    } ';
    dba+='  to     { transform: rotate(360deg) translateX(' + anrad + 'px) rotate(-360deg);    } ';
    dba+=' @-webkit-keyframes animateonorbit {  from   { 	-webkit-transform: rotate(0deg) translateX(' + anrad + 'px) rotate(0deg);    } ';
    dba+='  to     { -webkit-transform: rotate(360deg) translateX(' + anrad + 'px) rotate(-360deg);    } </style> ';
    document.body.innerHTML+=dba;
    lasto=document.getElementById(bid);
    document.getElementById(bid).style.display='block';
    //setTimeout(endanimateonline, eval(eval('' + fhl) * 1000));
}
function animateonline(bid, ccl, cct, toccl, tocct, fhl) {
    var dba='<style> #' + bid + ' { display:block;  top:' + cct + 'px; ';
    dba+=' left:' + ccl + 'px; position:absolute; -moz-border-radius: 12px; border-radius: 12px;  ';
    dba+=' filter: alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; ';
    dba+=' animation:animateonline  ' + fhl + 's; -webkit-animation:animateonline ' + fhl + 's; z-index:79; } ';
    dba+=' @keyframes animateonline {  from   { top:' + cct + 'px;  left:' + ccl + 'px;   opacity:1.00; background:orange;   } ';
    dba+='  to     {top:' + tocct + 'px;  left:' + toccl + 'px;   opacity:0.80; background:orange;   } ';
    dba+=' @-webkit-keyframes animateonline {  from   { top:' + cct + 'px;  left:' + ccl + 'px;   opacity:1.00; background:orange;   } ';
    dba+='  to     { top:' + tocct + 'px;  left:' + toccl + 'px;   opacity:0.80; background:orange;   } </style> ';
    document.body.innerHTML+=dba;
    lasta=document.getElementById(bid);
    document.getElementById(bid).style.display='block';
    setTimeout(endanimateonline, eval(eval('' + fhl) * 1000));
    //alert(dba);
}
function endanimateonline() {
    lasta.style.display='none'; //lasta.style.zIndex='0';
    var rectx=lasta.getBoundingClientRect();
    //alert('end ' + rectx.left + ',' + rectx.top + ' ... ' + rectx.width + ',' + rectx.height);
}
function huhd(dv) {
  var formula='', nonformula='', wds=[], prevanswer='';
  var answer='',ans='',wasih='';
  if (isThirtySeven) { 
  if (dv.trim().length <= 2 && dv.indexOf('/') == -1) {
  answer=prompt('What is the name of the element in the Period Table with the symbol ' + dv.trim() + '?  To just find out, but not score, enter a question mark.  Append on numbers and symbology to name a compound we can look up for you as you please.', ''); 
  if (answer == null) {  answer=''  }
  goes++;
  wds=answer.split(' ');
  prevanswer=answer;
  answer=answer.replace(wds[eval(-1 + wds.length)], dv.trim() + wds[eval(-1 + wds.length)]).replace(/NaCl$/g, 'NaCl()').replace(/KBr$/g, 'KBr()').replace(/CsF$/g, 'CsF()').replace(/CdS$/g, 'CdS()').replace(/Nacl$/g, 'Nacl()').replace(/Kbr$/g, 'Kbr()').replace(/Csf$/g, 'Csf()').replace(/Cds$/g, 'Cds()').replace(/NaCL$/g, 'NaCL()').replace(/KBR$/g, 'KBR()').replace(dv.trim() + wds[eval(-1 + wds.length)], wds[eval(-1 + wds.length)]);
  //alert(answer);
  if (answer.replace('?','').trim() != '' && answer.replace('(','').replace(')','').replace('0','').replace('1','').replace('2','').replace('3','').replace('4','').replace('5','').replace('6','').replace('7','').replace('8','').replace('9','') != answer) {
    nonformula=answer.split('0')[0].split('1')[0].split('2')[0].split('3')[0].split('4')[0].split('5')[0].split('6')[0].split('7')[0].split('8')[0].split('9')[0].split('()')[0];
  //alert('nonformula=' + nonformula + ' dv=' + dv.trim());
    if (prevanswer != answer || 8 == 8) {
    formula=dv.trim() + answer.split(' ')[eval(-1 + answer.split(' ').length)]; //.split('()')[0];
    answer=answer.replace(answer.split(' ')[eval(-1 + answer.split(' ').length)], '');
    formula=formula.split('()')[0];
    } else {
    formula=dv.trim() + answer.substring(nonformula.length).split('()')[0];
    answer=nonformula.trim();
    }
  //alert('formula=' + formula + ' dv=' + dv.trim());
    window.open('//www.google.com/search?q=' + encodeURIComponent(formula), '_blank', 'top=50,left=50,width=600,height=600');
  }  
  if (answer.trim() == '?') {
   goes--;
   answer='';
   ans=document.head.innerHTML.replace(/\"/g,"'").split("'" + dv.trim() + ":")[1].split("'")[0];
  } 
  if (document.head.innerHTML.toLowerCase().replace(/\"/g,"'").indexOf("'" + dv.trim().toLowerCase() + ":" + (answer + ans).toLowerCase() + "'") != -1) {
   if (answer.trim() != '') { score++; }
   wasih=lastois.innerHTML;
   lastois.innerHTML='<font size=1><a title="Click here for Google search" target=_blank style="color:white;text-decoration:none;cursor:pointer;" href="https://www.google.com/search?q=' + encodeURIComponent(answer + ans) + '">' + answer + ans + '</a></font><br>' + wasih;
  }
  document.getElementById('pscore').innerHTML='Score: ' + score + '/' + goes;
  document.getElementById('p36').innerHTML='' + score + '/' + goes;
  }
  userpicked='';
   } else { 
  if (dv.trim() == '') {
    if (userpicked != '') {
     document.getElementById('mynum').innerHTML=userpicked;
    } else {
     document.getElementById('mynum').innerHTML='?';
    }
  } else if (dv.toLowerCase() == 'red' || dv.toLowerCase() == 'green' || dv.toLowerCase() == 'black') {
    userpicked=dv.toLowerCase();
  } else if (dv.substring(0,1) >= '0' && dv.substring(0,1) <= '9') {
    var huhi=eval('' + dv);
    if (huhi >= 0 && huhi <= 36) {
    userpicked=dv;
    document.getElementById('mynum').innerHTML=userpicked;
    } else {
    if (userpicked != '') {
     document.getElementById('mynum').innerHTML=userpicked;
    } else {
     document.getElementById('mynum').innerHTML='?';
    }
    }
  } else {
    if (userpicked != '') {
     document.getElementById('mynum').innerHTML=userpicked;
    } else {
     document.getElementById('mynum').innerHTML='?';
    }
  }
  }
}
function placethis(oi) {
  var dm='';
  if (oi.value == '') {
    oi.value=oi.placeholder.split(' (Optional')[0];
  } else {
    if (oi.value.indexOf('|') != -1) {
     if (oi.value.indexOf('++') != -1) {
      oi.value=oi.value.replace(/\+\+/g, '<br>');
     }
    }
    var pcols=oi.value.split('|');
    if (pcols.length > 1) {
      if (pcols[1].trim() != '') {
        document.getElementById('dmore').innerHTML='<input name=ih id=ih value="' + pcols[1] + '"></input>';
        dm='&ih=' + encodeURIComponent(pcols[1]);
      }
      if (pcols.length > 2) {
        if (pcols[2].trim() != '') {
          document.getElementById('dmore').innerHTML+='<input name=im id=im value="' + pcols[2] + '"></input>';
          dm+='&im=' + encodeURIComponent(pcols[2]);
        }
      }
      if (pcols.length > 3) {
        if (pcols[3].trim() != '') {
          if (pcols[3].indexOf('"') != -1) {
          if (pcols[3].indexOf('\"') != -1) {
          dm+='&iu=' + encodeURIComponent(pcols[3]);
          document.getElementById('dmore').innerHTML+='<input name=iu id=iu value="' + pcols[3] + '"></input>';
          } else {
          dm+='&iu=' + encodeURIComponent(pcols[3].replace(/\"/g, '\"'));
          document.getElementById('dmore').innerHTML+='<input name=iu id=iu value="' + pcols[3].replace(/\"/g, '\"') + '"></input>';
          }
          } else {
          dm+='&iu=' + encodeURIComponent(pcols[3]);
          document.getElementById('dmore').innerHTML+='<input name=iu id=iu value="' + pcols[3] + '"></input>';
          }
        }
      }
      oi.value='' + pcols[0];
    }
    var purl=document.URL.split('#')[0].split('?')[0] + '?' + radbit + 'text=' + encodeURIComponent(oi.value.replace(/\&\#/g,'&#')) + '&fontsize=' + fs;
    if (purl.length > 900) {
    document.getElementById('iradius').value=(('' + rad).split('.')[0] + '.' + ('' + deg).split('.')[0]);
    document.getElementById('itext').value=(oi.value.replace(/\&\#/g,'&#'));
    document.getElementById('ifontsize').value=fs;
    document.getElementById('isubmit').click();
    } else {
    location.href=document.URL.split('#')[0].split('?')[0] + '?' + radbit + 'text=' + encodeURIComponent(oi.value.replace(/\&\#/g,'&#')) + '&fontsize=' + fs + dm;
    }
  }
}
</script>
</head>
<body onload='onl();'>
<details id=mydetails><summary></summary><h1 id=myh1>Circular Text or Emoji or <a target=_blank title='Analogue Clock' href='./circular_text.html?radius=320.360&text=1%3Cspan%3E2%3C%2Fspan%3E1234567891%3Cspan%3E0%3C%2Fspan%3E1%3Cspan%3E1%3C%2Fspan%3E%3Ciframe%20scrolling%3Dno%20frameborder%3D0%20style%3D%27z-index%3A23%3Bmargin-left%3A127px%3Bmargin-top%3A130px%3Bheight%3A400px%3B%27%20src%3Danalogue_clock.htm%3Fx%3Dx%23xbody%3E%3C%2Fiframe%3E'>Analogue Clock</a> or <a target=_blank title='Roulette Wheel' href='./circular_text.html?radius=300.360&text=3%3Cspan%3E2%3C%2Fspan%3E1%3Cspan%3E5%3C%2Fspan%3E1%3Cspan%3E9%3C%2Fspan%3E42%3Cspan%3E1%3C%2Fspan%3E22%3Cspan%3E5%3C%2Fspan%3E1%3Cspan%3E7%3C%2Fspan%3E3%3Cspan%3E4%3C%2Fspan%3E62%3Cspan%3E7%3C%2Fspan%3E1%3Cspan%3E3%3C%2Fspan%3E3%3Cspan%3E6%3C%2Fspan%3E1%3Cspan%3E1%3C%2Fspan%3E3%3Cspan%3E0%3C%2Fspan%3E82%3Cspan%3E3%3C%2Fspan%3E1%3Cspan%3E0%3C%2Fspan%3E52%3Cspan%3E4%3C%2Fspan%3E1%3Cspan%3E6%3C%2Fspan%3E3%3Cspan%3E3%3C%2Fspan%3E12%3Cspan%3E0%3C%2Fspan%3E1%3Cspan%3E4%3C%2Fspan%3E3%3Cspan%3E1%3C%2Fspan%3E92%3Cspan%3E2%3C%2Fspan%3E1%3Cspan%3E8%3C%2Fspan%3E2%3Cspan%3E9%3C%2Fspan%3E72%3Cspan%3E8%3C%2Fspan%3E1%3Cspan%3E2%3C%2Fspan%3E3%3Cspan%3E5%3C%2Fspan%3E32%3Cspan%3E6%3C%2Fspan%3E0&fontsize=14'>Roulette Wheel</a> or <a target=_blank title='Roulette Wheel' href='./circular_text.html?radius=300.360&text=3%3Cspan%3E2%3C%2Fspan%3E1%3Cspan%3E5%3C%2Fspan%3E1%3Cspan%3E9%3C%2Fspan%3E42%3Cspan%3E1%3C%2Fspan%3E22%3Cspan%3E5%3C%2Fspan%3E1%3Cspan%3E7%3C%2Fspan%3E3%3Cspan%3E4%3C%2Fspan%3E62%3Cspan%3E7%3C%2Fspan%3E1%3Cspan%3E3%3C%2Fspan%3E3%3Cspan%3E6%3C%2Fspan%3E1%3Cspan%3E1%3C%2Fspan%3E3%3Cspan%3E0%3C%2Fspan%3E82%3Cspan%3E3%3C%2Fspan%3E1%3Cspan%3E0%3C%2Fspan%3E52%3Cspan%3E4%3C%2Fspan%3E1%3Cspan%3E6%3C%2Fspan%3E3%3Cspan%3E3%3C%2Fspan%3E12%3Cspan%3E0%3C%2Fspan%3E1%3Cspan%3E4%3C%2Fspan%3E3%3Cspan%3E1%3C%2Fspan%3E92%3Cspan%3E2%3C%2Fspan%3E1%3Cspan%3E8%3C%2Fspan%3E2%3Cspan%3E9%3C%2Fspan%3E72%3Cspan%3E8%3C%2Fspan%3E1%3Cspan%3E2%3C%2Fspan%3E3%3Cspan%3E5%3C%2Fspan%3E32%3Cspan%3E6%3C%2Fspan%3E0¬r=y&fontsize=14'>Periodic Table Quiz</a></h1>
<h3>RJM Programming <a title="Circular Text" style="text-decoration:underline;cursor:pointer;" onclick="location.href=document.URL.split('?')[0].split('#')[0];">-</a> December, 2018 ... Thanks to <a target=_blank title='Useful link, thanks' href='https://appendto.com/2016/09/how-to-make-circularcurved-text-with-javascript/'>https://appendto.com/2016/09/how-to-make-circularcurved-text-with-javascript/</a></h3>
Your <select id=iself onchange="fs='' + this.value;"><option value=14>text (14px)</option><option value=6>text (6px)</option><option value=8>text (8px)</option><option value=10>text (10px)</option><option value=12>text (12px)</option><option value=20>text (20px)</option><option value=24>text (24px)</option><option value=32>text (32px)</option><option value=40>text (40px)</option><option value=48>text (48px)</option><option value=64>text (64px)</option></select> (on circle radius <input style='width:5%;' id=irad title=pixels type=number onchange="rad=eval(this.value); radbit='radius=' + encodeURIComponent(('' + rad).split('.')[0] + '.' + ('' + deg).split('.')[0]) + '&'; " value=100 min=1 max=2000></input><input style='width:5%;' title=degrees id=ideg type=number onchange="deg=eval(this.value); radbit='radius=' + encodeURIComponent('' + rad + '.' + deg) + '&'; " value=360 min=1 max=360></input> arc): <input id=inp onblur=placethis(this); type=text style='width:60%;' placeholder="this text is in a circle 🍍 🍌 (Optionally | separate words (++ is line feed) & image URL & onclick URL or Javascript)" title="Optionally | append to the circular text entered any inner words (++ is line feed) & image URL & onclick URL or Javascript"></input>
</details>
<div id=mycontainer class="container" style="text-align: center;">
  <!--the holders for the text, reuse as desired-->
  <div class="circTxt" id="test" style="display: inline-block; margin-bottom: 128px;  "></div>
</div>
<input type=text style="position:absolute;top:-200px;left:-200px;" value=""></input>
<div id=atend></div>
<form style=display:none; method=POST action=./circular_text.php>
<input type=text id=itext name=text value=''></input>
<input type=text id=iradius name=radius value=''></input>
<input type=text id=ifontsize name=fontsize value=''></input>
<div id=dmore style=display:none;></div>
<input id=isubmit type=submit value=Submit></input>
</form>
<input style='position:absolute;top:-200px;left:-200px;' type='text' value=''></input>
<div id=myballdiv style='display:none;'>⚽</div>
<div id=myballdivtwo style='display:none;'>⚽</div>
<div id=myballdivthree style='display:none;'>⚽</div>
<div id=myplay title='Click to play video' style='display:none;font-color:red;font-size:24px;' data-status='stop' onclick="if (this.getAttribute('data-status') == 'stop') { this.title='Click to pause video'; this.setAttribute('data-status', 'start'); document.getElementById('myvidis').play(); this.innerHTML='⏸'; } else { this.title='Click to play video'; this.setAttribute('data-status', 'stop'); document.getElementById('myvidis').pause(); this.innerHTML='▶'; } ">▶</div>
</body>
</html>