Untitled

<?php


$css = "none";
$x = "";
$coin="";
$coins = array("Coin 1", "Coin 2", "Coin 3", "Coin 4");


if (isset($_POST['start'])) {
    unset($_POST['stop']);
    $css ="";
}
if (isset($_POST['stop'])) {
    $x = "x";
    $css = "";
    unset($_POST['stop']);
    $coin = $coins[array_rand($coins)];

}


?>

<html>
<head>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/wheel.css">
<script>
var r = 50;

var x = setInterval(function() {
    var item = ['Coin 1', 'Coin 2', 'Coin 3', 'Coin 4'].find((_, i, ar) => Math.random() < 1 / (ar.length - i));
    document.getElementById("counter").innerHTML = item;
}, r);
clearInterval(<?php echo $x ?>)

</script>

</head>

<body>

<div >
    <form method="post">
    <input type="submit" name="start" value="start">
    <input type="submit"  name="stop" value="stop">
    <input type="submit" name="reset" value="reset">
    </form>
</div>
<div class="spacer"></div>
<div style="display:<?php echo $css ?>;" id="counter"><?php echo $coin ?></div>
</body>
</html>