107 lines
4.2 KiB
HTML
107 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<style type="text/css">
|
|
body {
|
|
font-family: sans-serif;
|
|
}
|
|
.corner {
|
|
display: inline-block;
|
|
width:48px;
|
|
height:48px;
|
|
background: url('data:image/jpeg;base64,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');
|
|
}
|
|
table {
|
|
border-collapse: collapse;
|
|
}
|
|
thead td {
|
|
text-align: center;
|
|
}
|
|
td:first-child {
|
|
text-align: center;
|
|
}
|
|
td {
|
|
padding: 3px 6px;
|
|
text-align: right;
|
|
}
|
|
.chance-bad {
|
|
color:red;
|
|
}
|
|
.chance-good {
|
|
color: orange;
|
|
}
|
|
.chance-high {
|
|
color: green;
|
|
}
|
|
.chance-perfect {
|
|
color: black;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<h2>Oracle of Delphi<h2>
|
|
<h3>Chance of defeating a monster</h3>
|
|
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<td>
|
|
<div class="corner"></div>
|
|
</td>
|
|
<td>0</td>
|
|
<td>1</td>
|
|
<td>2</td>
|
|
<td>3</td>
|
|
<td>4</td>
|
|
<td>5</td>
|
|
<td>6</td>
|
|
<td>7</td>
|
|
<td>8</td>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="tbody"></tbody>
|
|
</table>
|
|
|
|
<script type="text/javascript">
|
|
|
|
var chance = function(current_shield) {
|
|
var monster_strength = (9 - current_shield);
|
|
return 1 - (monster_strength / 10);
|
|
};
|
|
|
|
var chance_with_favor = function(effective_shields, remaining_turns) {
|
|
var base = chance(effective_shields);
|
|
if (remaining_turns == 0) {
|
|
return base;
|
|
}
|
|
|
|
var extra = (1 - base) * chance_with_favor(effective_shields + 1, remaining_turns - 1);
|
|
return base + extra;
|
|
};
|
|
|
|
var round = function(v) {
|
|
return Math.round(v * 100) / 100;
|
|
}
|
|
|
|
var tbody_content = []
|
|
for (var s = 0; s < 6; ++s) {
|
|
var tr = "<tr><td>" + s + "</td>";
|
|
|
|
for (var t = 0; t < 9; ++t) {
|
|
var c = chance_with_favor(s, t);
|
|
var className = ( c == 1 ? 'chance-perfect' : (c > 0.75 ? 'chance-high' : (c > 0.5 ? 'chance-good' : 'chance-bad')));
|
|
|
|
tr += "<td class=\"" + className + "\">" + round(c * 100) + "%</td>"
|
|
}
|
|
|
|
tbody_content.push(tr);
|
|
}
|
|
document.getElementById("tbody").innerHTML = tbody_content.join("");
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|