<?php
header("Content-Type: application/javascript");
?>

(function(){

/* -----------------------------------------
   WAIT FOR GAME TO EXIST
----------------------------------------- */
function waitForGame() {
  if (typeof player === "undefined" || typeof map === "undefined") {
    requestAnimationFrame(waitForGame);
    return;
  }
  initDLC();
}

waitForGame();

/* -----------------------------------------
   DLC INIT
----------------------------------------- */
function initDLC() {

  console.log("🚗 gnelsona DLC loaded");

  /* -----------------------------
     DEFAULTS
  ----------------------------- */
  const defaults = {
    accel: player.accel,
    brake: player.brake,
    maxSpeed: player.maxSpeed,
    friction: player.friction,
    turnRate: player.turnRate,
    zoom: map.getZoom(),
    pitch: cameraPitch,
    spawnLng: player.lng,
    spawnLat: player.lat
  };

  /* -----------------------------
     CREATE UI
  ----------------------------- */
  const menu = document.createElement("div");
  menu.id = "gnelsonaMenu";
  menu.innerHTML = `
    <h3>⚙️ Tuning</h3>

    ${slider("accel", 1, 50)}
    ${slider("brake", 1, 60)}
    ${slider("maxSpeed", 5, 100)}
    ${slider("friction", 0, 20, 0.5)}
    ${slider("turnRate", 30, 300, 5)}

    <hr>

    ${slider("zoom", 15, 20, 0.1)}
    ${slider("pitch", 0, 80)}

    <hr>

    <label>Spawn Lng <input id="spawnLng" type="number" step="0.0001"></label>
    <label>Spawn Lat <input id="spawnLat" type="number" step="0.0001"></label>

    <button id="respawnBtn">Respawn</button>
    <button id="resetBtn">Reset</button>
  `;
  document.body.appendChild(menu);

  /* -----------------------------
     STYLE
  ----------------------------- */
  const style = document.createElement("style");
  style.innerHTML = `
    #gnelsonaMenu {
      position: absolute;
      top: 10px;
      left: 10px;
      width: 220px;
      background: rgba(0,0,0,0.7);
      color: #00eaff;
      font-family: system-ui;
      padding: 12px;
      border-radius: 10px;
      z-index: 9999;
    }
    #gnelsonaMenu label {
      display:block;
      font-size:12px;
      margin-bottom:6px;
    }
    #gnelsonaMenu input {
      width:100%;
    }
    #gnelsonaMenu button {
      width:100%;
      margin-top:6px;
      padding:6px;
      background:#111;
      border:1px solid #00eaff;
      color:#00eaff;
      border-radius:6px;
      cursor:pointer;
    }
  `;
  document.head.appendChild(style);

  /* -----------------------------
     BIND VALUES
  ----------------------------- */
  function bind(id) {
    const el = document.getElementById(id);
    el.value = defaults[id];

    el.addEventListener("input", () => {
      const val = parseFloat(el.value);

      if (id in player) player[id] = val;
      if (id === "zoom") map.setZoom(val);
      if (id === "pitch") cameraPitch = val;
    });
  }

  ["accel","brake","maxSpeed","friction","turnRate","zoom","pitch"].forEach(bind);

  document.getElementById("spawnLng").value = defaults.spawnLng;
  document.getElementById("spawnLat").value = defaults.spawnLat;

  document.getElementById("respawnBtn").onclick = () => {
    const lng = parseFloat(document.getElementById("spawnLng").value);
    const lat = parseFloat(document.getElementById("spawnLat").value);

    player.lng = lng;
    player.lat = lat;
    map.setCenter([lng, lat]);
  };

  document.getElementById("resetBtn").onclick = () => {
    Object.keys(defaults).forEach(k => {
      if (k in player) player[k] = defaults[k];
    });
    map.setZoom(defaults.zoom);
    cameraPitch = defaults.pitch;
  };

  /* -----------------------------------------
     🔥 OPTIONAL UPGRADE (SMART STEERING)
  ----------------------------------------- */

  const originalUpdate = player.update.bind(player);

  player.update = function(dt) {

    // --- SMART TURNING ---
    const speedFactor = Math.min(Math.abs(this.speed) / this.maxSpeed, 1);
    const effectiveTurn = this.turnRate * (0.3 + speedFactor);

    if (keys.a) this.heading -= effectiveTurn * dt;
    if (keys.d) this.heading += effectiveTurn * dt;

    // temporarily disable default turning
    const oldTurn = this.turnRate;
    this.turnRate = 0;

    originalUpdate(dt);

    this.turnRate = oldTurn;
  };
}

/* -----------------------------------------
   UI HELPER
----------------------------------------- */
function slider(id, min, max, step=1) {
  return `<label>${id}
    <input id="${id}" type="range" min="${min}" max="${max}" step="${step}">
  </label>`;
}

})();