margin-left: 0.5em;
margin-right: 0.5em;
}
+#lowdepthcontainer {
+ font-size: x-small;
+ margin-top: 0;
+}
#pvcontainer {
clear: left;
margin-top: 1em;
border-right: none;
}
-.pv, #pv, #history { /* Mute move colors a bit. */
+.pv, #pv, #history, #lowdepth .depth { /* Mute move colors a bit. */
color: #555;
}
<span id="scorespark"></span>
</div>
</div>
+ <div id="lowdepthcontainer">
+ <span id="lowdepth"></span>
+ </div>
<p id="pvcontainer"><strong id="pvtitle">PV:</strong> <span id="pv"></span></p>
<p id="searchstats"></p>
<h3>History and potential moves (multi-PV)</h3>
$("#score").text(format_long_score(data['score']));
}
+ // Low depth.
+ var lowdepth = '';
+ if (data['lowdepth']) {
+ lowdepth = 'Quick look: ';
+ var lds = [];
+ Object.keys(data['lowdepth']).forEach(function(depth) {
+ lds.push([parseInt(depth), format_short_score(data['lowdepth'][depth])]);
+ });
+ lds.sort(function(a, b) { return a[0] - b[0]; });
+ for (var i = 0; i < lds.length; ++i) {
+ lowdepth += '<span class="depth">d' + lds[i][0] + ':</span> ' + lds[i][1];
+ if (i != lds.length - 1) {
+ lowdepth += ', ';
+ }
+ }
+ }
+ $("#lowdepth").html(lowdepth);
+
// The search stats.
if (data['searchstats']) {
$("#searchstats").html(data['searchstats']);