statistics dice roll test

by Laurens Maneschijn

HTML

<form onsubmit="run();return false;">
<button type="submit" onclick=run()>run</button>
<button type="reset">reset</button>
<br>
dice A:<input type="text" id="diceA" pattern="\s*([0-9]+(\.[0-9]+)?)([,\s]\s*[0-9]+(\.[0-9]+)?)*\s*" value="3,3,3,3,3,6"><br>
dice B:<input type="text" id="diceB" pattern="\s*([0-9]+(\.[0-9]+)?)([,\s]\s*[0-9]+(\.[0-9]+)?)*\s*" value="2,2,2,5,5,5"><br>
turns: <input id="turns" type="number" min="1" max="10000000" value="1000000"><input id="turns_range" type="range" min="0" max="10000000" value="1000000" step="10000"><br>
</form>
<br>
<textarea id="result" spellcheck="false"></textarea>

CSS

* {
	box-sizing: border-box;
}
textarea#result {
	width: 100%;
	height: 200px;
	tab-size: 2;
}
input {
	vertical-align: middle;
}

JavaScript

run();

function logclear() {
	console.clear();
	document.querySelector('textarea#result').value = '';
}
function log(...args) {
//	var args = [].slice.call(arguments);
	console.log.apply(console, args);

	var result = document.querySelector('textarea#result');
	if (args.length === 1 && typeof args[0] === 'object') {
		result.value += JSON.stringify(args[0], null, '\t') + '\n';
	} else {
		result.value += args.join('\t') + '\n';
	}
}
function roll(options) {
	// roll a dice with given side values.
	options = options || [1,2,3,4,5,6];
	return options[Math.floor(Math.random() * options.length)];
}
function getDiceFromString(s) {
	s = (''+s).trim();
	s = s.replace(/[^0-9\.]/g, ' ').replace(/\s+/g, ' ').trim();
	a = s.split(' ');
	return a.map((v) => {return parseFloat(v)});
}

function getDiceA() {
	return getDiceFromString(document.querySelector('#diceA').value);
}
function getDiceB() {
	return getDiceFromString(document.querySelector('#diceB').value);
}
function getTurns() {
	return parseInt(document.querySelector('#turns').value, 10);
}
function update_turns_to_range() {
	document.querySelector('#turns_range').value = document.querySelector('#turns').value;
}
function update_turns_from_range() {
	document.querySelector('#turns').value = document.querySelector('#turns_range').value;
}
document.querySelector('#turns').addEventListener('change', update_turns_to_range);
document.querySelector('#turns').addEventListener('keydown', update_turns_to_range);
document.querySelector('#turns').addEventListener('keyup', update_turns_to_range);
document.querySelector('#turns').addEventListener('mousedown', update_turns_to_range);
document.querySelector('#turns').addEventListener('mouseup', update_turns_to_range);
document.querySelector('#turns_range').addEventListener('change', update_turns_from_range);
document.querySelector('#turns_range').addEventListener('keydown', update_turns_from_range);
document.querySelector('#turns_range').addEventListener('keyup',...