JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
<html><head><meta charset="CP1251">
<script>
var	k = 5.66, step = 0.001, xU, yU, xL, yL, Angle, History = [], hh, prec=7, dd=Math.pow(10,-prec);
function DispCoord() {
	xU = eval(xU.toFixed(prec)); yU = eval(yU.toFixed(prec)); xL = eval(xL.toFixed(prec)); yL = eval(yL.toFixed(prec));
	var sL = 1 + xU, sR = 1 - xU, sU = 1 - yU, sB = 1 + yU, s = "", t;
	Angle = solveAngle(xU, yU, xL, yL);
	document.getElementById("stK").value = "k = " + k;
	document.getElementById("stStep").innerHTML = "шаг Лисы " + step;
	document.getElementById("stCoord").innerHTML = "Координаты Утки: " + xU.toFixed(prec) + ";" + yU.toFixed(prec) +"<br>Координаты Лисы: " + xL.toFixed(prec) + ";" + yL.toFixed(prec);
	document.getElementById("stAngle").innerHTML = "Угол между Уткой и Лисой: " + Angle.toFixed(3) + "°";
	document.getElementById("stSize").innerHTML = "Расстояния от Утки до берега:<br>Влево: " + sL.toFixed(prec) + "; Вправо: " + sR.toFixed(prec) + "<br>Вверх: " + sU.toFixed(prec) + "; Вниз: " + sB.toFixed(prec);
	if (Math.abs(xU) >= 1 || Math.abs(yU) >= 1) {
		document.getElementById("stWin").innerHTML = "<big><b>Утка выиграла!</b></big>";
		ButtonsOn(false);
	} else {
		document.getElementById("stWin").innerHTML = "<big><b>-</b></big>";
		ButtonsOn(true);
	}
	if (History.length > 0) {
		History.forEach(function(item, index, array) {
			t = item.split(";");
			s = s + "<tr align=center><td>" + t[0] +";" + t[1] + "</td><td>" + t[2] + ";" + t[3] + "</td><td>" + t[4] +"</td></tr>\n";
		});
	}
	document.getElementById("stHistory").innerHTML = "<table border=1 cellspacing=0><caption>История перемещений Утки и Лисы:</caption><tr align=center><td>Утка</td><td>Лиса</td><td>Утка шагнёт:</td></tr>\n" + s + "</table>";
	document.getElementById("btUndo").disabled = History.length < 1;
}
function SaveForHistory() {
	hh = xU.toFixed(prec) + ";" + yU.toFixed(prec) + ";" + xL.toFixed(prec) + ";" + yL.toFixed(prec);
}
function AddHistory(t) {
	if (History.length >= 100)...