<!doctype html>
<html>
<head>
<title>Knockout Dice Game - RJM Programming - March, 2018</title>
<script type='text/javascript'>
// https://www.w3schools.com/charsets/ref_utf_punctuation.asp

// ․ 8228 2024 ONE DOT LEADER
// ⁖ 8278 2056 THREE DOT PUNCTUATION
// ⁘ 8280 2058 FOUR DOT PUNCTUATION
// ⁙ 8281 2059 FIVE DOT PUNCTUATION
// ⁚ 8282 205A TWO DOT PUNCTUATION
// ⁛ 8283 205B FOUR DOT MARK
// …8230 2026 … HORIZONTAL ELLIPSIS

// Thanks to http://www.math.hawaii.edu/~ramsey/Probability/TwoDice.html
var probabilities=[0,0,1,2,3,4,5,6,5,4,3,2,1]; // score will be 7-guessValue
var score=[0,0], goes=[0,0], names=['Player1','Player2'], sels=['',''], stillin=[true,true];
var cactiontd='';
var numplayers=2;
var theader='', tgame='';
var hris='';
var d1=7, d2=7, ccomma='', lastwinners='';
var rollno=1;

function andthen() {
document.getElementById('actiontd').innerHTML=cactiontd;
document.getElementById('tdr').innerHTML='Two Dice Roll';
for (var hem=1; hem<=numplayers; hem++) {
document.getElementById('gplayer' + hem).innerHTML=sels[eval(-1 + hem)];
document.getElementById('gplayer' + hem).value='06';
stillin[eval(-1 + hem)]=true;
lastwinners='';
}
}

function roll() {
d1=7;
d2=7;
ccomma='';
rollno=1;
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0];
fixinstone(numplayers);
if (cactiontd == '') {
cactiontd=document.getElementById('actiontd').innerHTML;
}
document.getElementById('actiontd').innerHTML='';
postroll();
}

function postroll() {
var sofarx='';
if (1 != 7) {
if (document.getElementById('tdr').innerHTML == 'Two Dice Roll') document.getElementById('tdr').innerHTML='Two Dice Rolls are ';
d1=7;
while (d1 == 7) {
d1=eval(Math.floor(Math.random() * 6) + 1);
}
if (1 == 1) {
sofarx=document.getElementById('actiontd').innerHTML;
if (eval(eval('' + sofarx.split('</div').length) % 2) == 1) { hris='<hr>Roll ' + rollno + '<hr>'; rollno++; } else { hris=''; }
document.getElementById('actiontd').innerHTML='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d1).outerHTML.replace(' id="h' + d1 + '"','') + '</div>' + hris + sofarx;
} else {
document.getElementById('actiontd').innerHTML+='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d1).outerHTML.replace(' id="h' + d1 + '"','') + '</div>';
}
d2=7;
while (d2 == 7) {
d2=eval(Math.floor(Math.random() * 6) + 1);
}
if (1 == 1) {
sofarx=document.getElementById('actiontd').innerHTML;
if (eval(eval('' + sofarx.split('</div').length) % 2) == 1) { hris='<hr>Roll ' + rollno + '<hr>'; rollno++; } else { hris=''; }
document.getElementById('actiontd').innerHTML='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d2).outerHTML.replace(' id="h' + d2 + '"','') + '</div>' + hris + sofarx;
} else {
document.getElementById('actiontd').innerHTML+='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d2).outerHTML.replace(' id="h' + d2 + '"','') + '</div>';
}
d1+=d2;
document.getElementById('tdr').innerHTML+=ccomma + d1;
ccomma=', ';
} else {
document.getElementById('tdr').innerHTML='Two Dice Rolls are ';
}
for (var hem=0; hem<numplayers; hem++) {
if (1 == 7) {
d1=7;
while (d1 == 7) {
d1=eval(Math.floor(Math.random() * 6) + 1);
}
if (1 == 1) {
sofarx=document.getElementById('actiontd').innerHTML;
if (eval(eval('' + sofarx.split('</div').length) % 2) == 1) { hris='<hr>Roll ' + rollno + '<hr>'; rollno++; } else { hris=''; }
document.getElementById('actiontd').innerHTML='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d1).outerHTML.replace(' id="h' + d1 + '"','') + '</div>' + hris + sofarx;
} else {
document.getElementById('actiontd').innerHTML+='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d1).outerHTML.replace(' id="h' + d1 + '"','') + '</div>';
}
d2=7;
while (d2 == 7) {
d2=eval(Math.floor(Math.random() * 6) + 1);
}
if (1 == 1) {
sofarx=document.getElementById('actiontd').innerHTML;
if (eval(eval('' + sofarx.split('</div').length) % 2) == 1) { hris='<hr>Roll ' + rollno + '<hr>'; rollno++; } else { hris=''; }
document.getElementById('actiontd').innerHTML='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d2).outerHTML.replace(' id="h' + d2 + '"','') + '</div>' + hris + sofarx;
} else {
document.getElementById('actiontd').innerHTML+='<div style="margin-left:10%;z-index:89;">' + document.getElementById('h' + d2).outerHTML.replace(' id="h' + d2 + '"','') + '</div>';
}
d1+=d2;
document.getElementById('tdr').innerHTML+=ccomma + d1;
ccomma=', ';
}
if (('' + document.getElementById('gplayer' + eval(1 + hem)).value) != '0') {
if (('' + document.getElementById('gplayer' + eval(1 + hem)).value).replace('0','') == ('' + d1)) {
goes[hem]++;
stillin[hem]=false;
document.getElementById('gplayer' + eval(1 + hem)).innerHTML="<option value='0' style='border:2px solid red;'>Sorry, " + names[hem] + ", you are out</option>";
}
//document.getElementById('score' + eval(1 + hem)).innerHTML='Score: ' + score[hem] + '/' + goes[hem];
}
}
if (csi() == "") {
for (var jhem=0; jhem<numplayers; jhem++) {
document.getElementById('score' + eval(1 + jhem)).innerHTML='Score: ' + score[jhem] + '/' + goes[jhem];
}
setTimeout(andthen, 5000);
} else {
setTimeout(postroll, 2000);
}
if (hris == '') { hris='<hr>'; } else { hris=''; }
}

function csi() {
var winners='', wsuffix='', numleft=0;
var sinc=1;
if (document.getElementById('gwta').checked) { sinc=rollno; }
for (var jhem=0; jhem<numplayers; jhem++) {
if (stillin[jhem]) {
winners+=wsuffix + jhem;
wsuffix=',';
numleft++;
}
}
if (winners == '' && numleft == 0 && document.getElementById('mytable').innerHTML.indexOf('Sorry') == -1) {
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0] + ' ... ' + "No winners";
return '';
} else if (numleft == 1) {
goes[eval(winners)]++;
score[eval(winners)]+=sinc;
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0] + ' ... ' + "Well done, " + names[eval(winners)] + ", you win alone";
document.getElementById('gplayer' + eval(1 + eval(winners))).innerHTML="<option value='0' style='border:2px solid darkgreen;'>Well done, " + names[eval(winners)] + ", you win alone</option>";
//alert('one winner is ' + winners);
return '';
} else if (numleft == 0) {
var izero=1;
if (eval('' + lastwinners.replace(/\,$/g, '').split(',').length) >= eval('' + lastwinners.split(',').length) && document.getElementById('mytable').innerHTML.indexOf('Sorry') == -1) {
izero=0;
}
if (document.getElementById('mytable').innerHTML.indexOf('Sorry') == -1) {
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0] + ' ... ' + "No winners";
return '';
} else {
var ws=lastwinners.split(',');
for (var khem=0; khem<ws.length; khem++) {
//goes[eval('' + ws[khem])]++;
if (document.getElementById('gplayer' + eval(1 + eval(ws[khem])))) {
if (eval('' + lastwinners.replace(/\,$/g, '').split(',').length) >= eval('' + ws.length) && document.getElementById('mytable').innerHTML.indexOf('Sorry') == -1) {
document.getElementById('gplayer' + eval(1 + eval(ws[khem]))).innerHTML="<option value='0' style='border:2px solid lightgreen;'>Even Stevens, " + names[eval(ws[khem])] + ", you lose but not alone</option>";
} else {
document.getElementById('gplayer' + eval(1 + eval(ws[khem]))).innerHTML="<option value='0' style='border:2px solid lightgreen;'>Well done, " + names[eval(ws[khem])] + ", you win but not alone</option>";
}
score[eval('' + ws[khem])]+=izero;
}
}
if (eval('' + lastwinners.replace(/\,$/g, '').split(',').length) >= eval('' + ws.length)) {
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0] + ' ... ' + "No winners";
} else {
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0] + ' ... ' + "Well done, " + manynames(lastwinners) + ", you win but not alone";
}
//alert('several winners are ' + lastwinners);
}
return '';
} else {
lastwinners=winners;
//document.title=lastwinners;
document.getElementById('actiontd').innerHTML+='<hr>';
document.getElementById('myh3').innerHTML=document.getElementById('myh3').innerHTML.split(' ... ')[0];
return lastwinners;
}
}

function manynames(lw) {
var iissa=lw.replace(/\,$/g, '').split(',');
var outx='';
for (var ij=0; ij<iissa.length; ij++) {
if (outx == '') {
outx='' + names[iissa[ij]];
} else {
outx+=',' + names[iissa[ij]];
}
}
return outx;
}

function checkt() {
if (sels[0] == '') {
sels[0]=document.getElementById('gplayer1').innerHTML;
}
if (sels[1] == '') {
sels[1]=document.getElementById('gplayer2').innerHTML;
}
if (theader == '') {
theader=document.getElementById('header').innerHTML;
}
if (tgame == '') {
tgame=document.getElementById('game').innerHTML;
}
}

function namechange(tid,tval) {
names[eval(tid.replace('dname','') - 1)]=tval;
}

function fixinstone(ihow) {
document.getElementById('dnum').innerHTML='' + ihow;
if (numplayers < eval(ihow)) {
numplayers=eval(ihow);
var th='', tg='';
for (var jhow=3; jhow<=numplayers; jhow++) {
score.push(0);
goes.push(0);
stillin.push(true);
sels.push(sels[0]);
names.push('Player' + jhow);
th+="<th>Knockout Choice</th><th><div onchange='namechange(this.id,this.innerHTML);' id='dname" + jhow + "' contenteditable=true>Player " + jhow + "</div><br>Score</th>";
tg+="<td><select style=width:100%;background-color:cyan; id='gplayer" + jhow + "'><option value='06'>[6] Knockout value ...</option><option value='6'>6</option><option value='7'>7</option><option value='8'>8</option><option value='9'>9</option></select></td><td><div id='score" + jhow + "'>Score: 0/0</div></td>";
}
document.getElementById('header').innerHTML=theader + th;
document.getElementById('game').innerHTML=tgame + tg;
}
}
</script>
<style>
td { text-align: center; vertical-align: top; }
h4 { background-color: lightblue; font-size: 26px; text-align: center; width: 50px; height: 50px; padding: 10px 10px 10px 10px; border: 5px solid black; }
.six { padding-top: 2px; padding-bottom: 18px; }
</style>
</head>
<body onload="checkt();">
<h1><div id=divword style=display:inline-block;>Knockout</div> Dice Game for <div id='dnum' style='display:inline-block;'><select style='display:inline-block;' onchange='fixinstone(this.value);' id='snum'><option value=2>2</option><option value=3>3</option><option value=4>4</option><option value=5>5</option><option value=6>6</option><option value=7>7</option><option value=8>8</option><option value=9>9</option></select></div> <input onchange="this.style.opacity='' + eval(1.5 - eval('' + this.style.opacity));" style=display:inline-block;opacity=1.0; type=checkbox id=gwta checked>Winner Take All</input> Players</h1>
<h3 id=myh3>RJM Programming <a target=_self href='/HTMLCSS/knockout_dice_game.html' title=Reload>-</a> March, 2018</h3>
<div style='display:none;'>
<h4 id="h1" class="one">․</h4>
<h4 id="h2" class="two">⁚</h4>
<h4 id="h3" class="three">…</h4>
<h4 id="h4" class="four">⁘</h4>
<h4 id="h5" class="five">⁙</h4>
<h4 id="h6" class="six">…<br>…</h4>
</div>

<table id=mytable style='width:100%;' border=20 cellpadding=5>
<tr id='header'><th><div id='dname1' contenteditable=true>Player 1</div><br>Score</th><th>Knockout Choice</th><th id='tdr'>Two Dice Roll</th><th>Knockout Choice</th><th><div id='dname2' contenteditable=true>Player 2</div><br>Score</th></tr>
<tr id='game'><td><div id='score1'>Score: 0/0</div></td><td><select style=width:100%;background-color:cyan; id='gplayer1'><option value='06'>[6] Knockout value ...</option><option value='6'>6</option><option value='7'>7</option><option value='8'>8</option><option value='9'>9</option></select></td><td id='actiontd'><button style='width:100%;background-color:yellow;height:150px;border:7px solid red;' type='button' onclick='roll();' data-value='Roll the Dice for Each Player'>Roll the <br>Dice for <br>Each Player</button></td><td><select style=width:100%;background-color:cyan; id='gplayer2'><option value='06'>[6] Knockout value ...</option><option value='6'>6</option><option value='7'>7</option><option value='8'>8</option><option value='9'>9</option></select></td><td><div id='score2'>Score: 0/0</div></td></tr>
</table>

</body>
</html>