https://flipacoin.org.uk/js/custom-coin.js

1/**
2 * FlipACoin.org.uk - Custom Coin JS (only-heads, only-tails)
3 * Reads values from two inputs; click coin to flip
4 */
5
6'use strict';
7
8let turnCount  = 0;
9let isRotating = false;
10
11document.addEventListener('DOMContentLoaded', () => {
12  const headsInput  = document.getElementById('heads');
13  const tailsInput  = document.getElementById('tails');
14  const textDisplay = document.getElementById('text');
15  const coinEl      = document.getElementById('coin');
16
17  function flipResult() {
18    textDisplay.textContent = Math.random() < 0.5 ? headsInput.value : tailsInput.value;
19  }
20
21  function handleClick() {
22    if (isRotating) return;
23    isRotating = true;
24    turnCount++;
25    coinEl.style.transform = `rotateX(${turnCount}turn)`;
26    setTimeout(() => {
27      flipResult();
28      isRotating = false;
29    }, 1500);
30  }
31
32  textDisplay.addEventListener('click', handleClick);
33  coinEl.addEventListener('click', handleClick);
34
35  // Show initial value
36  textDisplay.textContent = headsInput.value;
37});