JSFiddle - React, Tailwind, and code Playground

by Mert Ener

HTML

<div id="score"></div>
<button type="button" id="fire">Fire!</button>

CSS

#score {
  height: 100px;
  width:200px;
}

JavaScript

function hash(x) {
  return crypto.subtle.digest(
    "SHA-256",
    new TextEncoder().encode(x)
  );
}

let shadowChain = "GENESIS";
let lastEventTime = null;

let counters = {
  small: 0,
  medium: 0,
  large: 0
};

async function GAME_EVENT(type, value) {
  const now = Date.now();

  if (lastEventTime !== null) {
    const delta = now - lastEventTime;

    if (delta <= 0 || delta > 1500) {
      throw "INTEGRITY BROKEN (time)";
    }

    shadowChain = await hash(
      shadowChain +
      type +
      value +
      delta
    );
  }

  lastEventTime = now;

  counters[type] += value;

  const uiScore =
    counters.small  * 10 +
    counters.medium * 25 +
    counters.large  * 60;

  render(uiScore);
}

function fire() {
  const size = Math.floor(Math.random() * 3);
  const type = ["small", "medium", "large"][size];

  GAME_EVENT(type, 1)
    .catch(err => {
      console.error(err);
      alert("Cheat detected");
    });
}

function render(score) {
  document.getElementById("score").innerText = score;
  console.log(score);
}

document.querySelector('#fire').addEventListener('click', fire);

// 👇 başlangıç
render(0);