---

const canvas = document.getElementById("renderCanvas");
const engine = new BABYLON.Engine(canvas, true);
let scene, camera, player, coinA, coinB, score = 0, keys = {};

function make() {
  scene = new BABYLON.Scene(engine);
  camera = new BABYLON.ArcRotateCamera("camera", 0, 1.2, 18, BABYLON.Vector3.Zero(), scene);
  camera.attachControl(canvas, true);
  new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0, 1, 0), scene);
  BABYLON.MeshBuilder.CreateGround("ground", { width: 20, height: 20 }, scene);

  player = BABYLON.MeshBuilder.CreateBox("player", { size: 1.5 }, scene);
  player.position.y = 0.75;

  coinA = BABYLON.MeshBuilder.CreateSphere("coinA", { diameter: 1 }, scene);
  coinA.position.set(4, 0.5, 4);

  coinB = BABYLON.MeshBuilder.CreateSphere("coinB", { diameter: 1 }, scene);
  coinB.position.set(-4, 0.5, -4);

  window.addEventListener("keydown", e => keys[e.key] = true);
  window.addEventListener("keyup", e => keys[e.key] = false);

  scene.onBeforeRenderObservable.add(() => {

    if (keys["w"]) player.position.z += 0.1;
    if (keys["s"]) player.position.z -= 0.1;
    if (keys["a"]) player.position.x -= 0.1;
    if (keys["d"]) player.position.x += 0.1;

    if (player.position.x > 7) player.position.x = 7;
    if (player.position.x < -7) player.position.x = -7;
    if (player.position.z > 7) player.position.z = 7;
    if (player.position.z < -7) player.position.z = -7;

    coinA.rotation.y += 0.03;
    coinB.rotation.y += 0.03;

    if (player.intersectsMesh(coinA, false)) { coinA.position.x = Math.random() * 10 - 5; coinA.position.z = Math.random() * 10 - 5; score += 10; document.title = "Score: " + score; }
    if (player.intersectsMesh(coinB, false)) { coinB.position.x = Math.random() * 10 - 5; coinB.position.z = Math.random() * 10 - 5; score += 10; document.title = "Score: " + score; }
  });

  return scene;
}

make();
engine.runRenderLoop(() => scene.render());
window.addEventListener("resize", () => engine.resize());