document.writeln('<div style="border:1px solid #ccc; border-radius:.5rem; padding:1rem;">');
document.writeln('<div style="font-size:1.15rem; font-weight:bold; text-align:center; margin-bottom:.6rem;">');
document.writeln('Generate Alien Words or Names');
document.writeln('</div>');
document.writeln('<div style="margin-bottom:.5rem;">');
document.writeln('Fo'+'rmat Info & Custom Fo'+'rmats<span id="AWN_WB-fo'+'rmats-open-me" style="display:inline;"><a href="javascript:AWN_WBfo'+'rmatsexplanation(\'open\')" style="text-decoration:none;"><span style="color:#977a35;">&#9660;&nbsp;(tap&nbsp;to&nbsp;open)</span></a></span><span id="AWN_WB-fo'+'rmats-close-me" style="display:none;"><a href="javascript:AWN_WBfo'+'rmatsexplanation(\'close\')" style="text-decoration:none;"><span style="color:#977a35;">&#9650; (close)</span></a></span>');
document.writeln('</div>');
document.writeln('');
document.writeln('<div id="AWN_WB-fo'+'rmats-explanation" style="margin-left:.5em; margin-bottom:1rem; padding-left:.5em; display:none; border-left:3px solid #ccc; border-bottom-left-radius:1em;">');
document.writeln('');
document.writeln('<div><span style="display:inline-block; width:1.35em;">"C"</span> = consonant capitalized</div>');
document.writeln('<div><span style="display:inline-block; width:1.35em;">"c"</span> = consonant lower-cased</div>');
document.writeln('<div><span style="display:inline-block; width:1.35em;">"V"</span> = vowel capitalized</div>');
document.writeln('<div><span style="display:inline-block; width:1.35em;">"v"</span> = vowel lower-cased</div>');
document.writeln('<div>All other characters and spaces are verbatim.</div>');
document.writeln('');
document.writeln('<div style="margin-top:1em; margin-bottom:.25em;">');
document.writeln('To add more fo'+'rmats, type them here, one fo'+'rmat per line. All fo'+'rmats must have at least one of "C", "c", "V", or&nbsp;"v". When done, then <div style="display:inline-block; border:1px solid #977a35; border-radius:.5em; white-space:nowrap; padding:0 .5em 0 .5em; vertical-align:-.2px; cursor:pointer; background-color:#efefef; color:#977a35;" onclick="AWN_WB_AddFo'+'rmats()">tap this button</div>');
document.writeln('</div>');
document.writeln('');
document.writeln('<div id="AWN_WB-more-fo'+'rmats" contenteditable="true" spellcheck="false" style="min-height:3em; font-size:100%; border:1px solid #f7e2a4; padding:.25em .5em .25em .5em; border-radius:.5em;"></div>');
document.writeln('');
document.writeln('</div>');
document.writeln('');
document.writeln('<div style="margin-bottom:.5em;">');
document.writeln('Tap on a fo'+'rmat button below to generate a list of alien words or names using that fo'+'rmat. Tap the "Random" button to generate a list with randomly se'+'lected fo'+'rmats.');
document.writeln('</div>');
document.writeln('<div id="AWN_WB-word-tap-setup"></div>');
document.writeln('');
document.writeln('<div id="AWN_WB-generated-name" contenteditable="true" spellcheck="false" style="font-size:100%; border:1px solid #f7e2a4; padding:.25em .5em .25em .5em; border-radius:.5em; margin-top:.75rem;"><span style="color:#999">Copy results from here</span></div>');
document.writeln('</div>');
var AWN_WB_url = "https://willbontrager.com/service/AlienWordsNames.php?";
function AWN_WB_AddFormats()
{
	var http = new XMLHttpRequest();
	if(! http) { return; }
	var params = new Array();
	params.push( "newtemplates=" + encodeURIComponent(document.getElementById("AWN_WB-more-formats").innerHTML) );
	var d;
	var list = "";
	if( (d=document.getElementById("AWN_WB-formats-for-alien-words-names")) ) { list=d.innerHTML; }
	params.push( "oldtemplates=" + encodeURIComponent(list) );
	AWN_WBformatsexplanation('close');
	http.onreadystatechange = function()
	{ 
		if(http.readyState == 4)
		{
			if(http.status == 200)
			{
//alert('response:'+http.responseText);
			    if( http.responseText.substr('Error: ')===0 )
			    {
			        alert(http.responseText);
			        return;
			    }
			    document.getElementById("AWN_WB-word-tap-setup").innerHTML = http.responseText;
			}
			else { alert("Content request error, status code "+http.status+" "+http.statusText); }
		}
	}
	http.open("POST",AWN_WB_url,true);
	http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	http.send(params.join("&"));
}
function AWN_WBformatsexplanation(which)
{
    if( which=='open' )
    {
        document.getElementById("AWN_WB-formats-open-me").style.display="none";
        document.getElementById("AWN_WB-formats-close-me").style.display="inline";
        document.getElementById("AWN_WB-formats-explanation").style.display="block";
    }
    else
    {
        document.getElementById("AWN_WB-formats-open-me").style.display="inline";
        document.getElementById("AWN_WB-formats-close-me").style.display="none";
        document.getElementById("AWN_WB-formats-explanation").style.display="none";
    }
}
function AWN_WB_Generate(num,wrd,id)
{
	var http = new XMLHttpRequest();
	if(! http) { return; }
	var params = new Array();
	if( num == 1 ) { params.push( "tmplt=" + encodeURIComponent(wrd.innerHTML) ); }
	else { params.push( "frmts=" + encodeURIComponent( document.getElementById("AWN_WB-formats-for-alien-words-names").innerHTML ) ); }
	http.onreadystatechange = function()
	{ 
		if(http.readyState == 4)
		{
			if(http.status == 200) { document.getElementById(id).innerHTML = http.responseText; }
			else { alert("Content request error, status code "+http.status+" "+http.statusText); }
		}
	}
	http.open("POST",AWN_WB_url,true);
	http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	http.send(params.join("&"));
}
AWN_WB_AddFormats();document.writeln('');