Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-503.34.1.el9_5.x86_64

PHP Version:

8.2.30

User:

u329947844

Directory:

/home/u329947844/domains/style29.in/public_html/admin

Free Space:

10.3 TB

🔧 Quick Actions

✏️ Editing: car.html

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>NeoRacer — WebGL Car Race</title>
<style>
  :root{
    --bg:#0a0f1a; --fg:#e8f0ff; --accent:#65d1ff; --warn:#ff7a78;
  }
  html,body{margin:0;height:100%;background:radial-gradient(1200px 800px at 50% 0%,#121a2b,var(--bg));color:var(--fg);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;overflow:hidden}
  #hud{position:fixed;inset:0;pointer-events:none}
  #topbar{position:absolute;top:10px;left:50%;transform:translateX(-50%);display:flex;gap:10px;background:rgba(10,14,30,.55);backdrop-filter:blur(6px);padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.08)}
  .pill{padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.06);font-weight:600;letter-spacing:.2px}
  .pill.warn{background:rgba(255,122,120,.12);color:#ffd7d6}
  #center{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);text-align:center;pointer-events:auto}
  #help{opacity:.85;font-size:14px}
  #startCard{position:absolute;inset:0;display:grid;place-items:center}
  .card{background:rgba(10,14,30,.85);backdrop-filter:blur(8px);padding:22px 26px;border-radius:16px;border:1px solid rgba(255,255,255,.08);max-width:92vw;text-align:center}
  .card h1{margin:.2em 0 .1em;font-size:28px}
  .btns{display:flex;gap:10px;justify-content:center;margin-top:12px}
  .btn{pointer-events:auto;padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#141a33;color:var(--fg);cursor:pointer}
  .btn:hover{background:#172148}
  #mobile{position:absolute;inset:0;display:none}
  @media (max-width: 900px){
    #mobile{display:block}
    .pad, .btnM{position:absolute;user-select:none;touch-action:none;pointer-events:auto}
    .pad{left:18px;bottom:18px;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
    .stick{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15)}
    .btnM{right:18px;bottom:18px;width:100px;height:100px;border-radius:50%;background:rgba(101,209,255,.15);border:1px solid rgba(101,209,255,.25);display:grid;place-items:center;font-weight:800;color:#d7f2ff}
    .btnM.brake{right:134px;background:rgba(255,122,120,.16);border-color:rgba(255,122,120,.28);color:#ffd8d7}
  }
</style>
</head>
<body>
<div id="hud">
  <div id="topbar">
    <div class="pill">Speed: <span id="spd">0</span> km/h</div>
    <div class="pill">Lap: <span id="lap">1</span>/3</div>
    <div class="pill">Time: <span id="time">0.00</span>s</div>
    <div class="pill">Pos: <span id="pos">1</span>/4</div>
    <div class="pill warn" id="offroad" style="display:none">Off‑track! Grip ↓</div>
  </div>
  <div id="center">
    <div id="help">WASD / Arrows to drive • Shift = Nitro • R = Reset • P = Pause</div>
  </div>
  <div id="startCard">
    <div class="card">
      <h1>NeoRacer</h1>
      <p>A unique, realistic-feel 3D web racer — no assets, all procedural.</p>
      <p>Lap the neon circuit, drift the S‑curves, beat 3 AI racers.</p>
      <div class="btns">
        <button class="btn" id="startBtn">Start Race</button>
        <button class="btn" id="viewBtn">Free View</button>
      </div>
      <p style="opacity:.8;margin-top:8px">Tip: Hold <b>Shift</b> for Nitro. Mobile controls appear automatically.</p>
    </div>
  </div>
  <div id="mobile">
    <div class="pad" id="pad"><div class="stick" id="stick"></div></div>
    <div class="btnM accel" id="btnAccel">GO</div>
    <div class="btnM brake" id="btnBrake">BRAKE</div>
  </div>
</div>

<script src="https://unpkg.com/three@0.160.0/build/three.min.js"></script>

const scene = new THREE.Scene();
  scene.fog = new THREE.FogExp2(0x0a0f1a, 0.0022);

const camera = new THREE.PerspectiveCamera(60, window.innerWidth/window.innerHeight, 0.1, 2000);
  camera.position.set(0, 6, 14);

window.addEventListener('resize', () => {
    renderer.setSize(window.innerWidth, window.innerHeight);
    camera.aspect = window.innerWidth/window.innerHeight; camera.updateProjectionMatrix();
  });

// ====== Lights / Sky ======
  const hemi = new THREE.HemisphereLight(0x8ad0ff, 0x0a0f1a, 0.55);
  scene.add(hemi);
  const sun = new THREE.DirectionalLight(0xffffff, 1.0);
  sun.position.set(100, 120, 40);
  sun.castShadow = true;
  sun.shadow.mapSize.set(2048, 2048);
  sun.shadow.camera.near = 0.5; sun.shadow.camera.far = 500;
  sun.shadow.camera.left = -120; sun.shadow.camera.right = 120; sun.shadow.camera.top = 120; sun.shadow.camera.bottom = -120;
  scene.add(sun);

// Subtle sky gradient dome
  const skyGeo = new THREE.SphereGeometry(900, 32, 16);
  const skyMat = new THREE.ShaderMaterial({
    side: THREE.BackSide,
    uniforms: {top:{value:new THREE.Color(0x0f1930)}, bottom:{value:new THREE.Color(0x030611)}},
    vertexShader:`varying vec3 vPos; void main(){vPos=position; gl_Position=projectionMatrix*modelViewMatrix*vec4(position,1.0);}`,
    fragmentShader:`varying vec3 vPos; uniform vec3 top; uniform vec3 bottom; void main(){float h=normalize(vPos).y*0.5+0.5; gl_FragColor=vec4(mix(bottom,top,smoothstep(0.0,1.0,h)),1.0);}`
  });
  scene.add(new THREE.Mesh(skyGeo, skyMat));

// ====== Procedural Textures ======
  function makeRoadTexture() {
    const c = document.createElement('canvas'); c.width = 256; c.height = 1024;
    const g = c.getContext('2d');
    // asphalt base
    g.fillStyle = '#2b2f37'; g.fillRect(0,0,c.width,c.height);
    // noise speckles
    for(let i=0;i<1400;i++){ g.fillStyle = `rgba(255,255,255,${Math.random()*0.03})`; g.fillRect(Math.random()*c.width, Math.random()*c.height, 1, 1); }
    // lane edges
    g.fillStyle = '#b8c6d9'; g.fillRect(6,0,3,c.height); g.fillRect(c.width-9,0,3,c.height);
    // center dashed line pattern
    g.strokeStyle = '#e9f2ff'; g.lineWidth = 3; g.setLineDash([24,24]); g.beginPath(); g.moveTo(c.width/2,0); g.lineTo(c.width/2,c.height); g.stroke();
    const tx = new THREE.CanvasTexture(c); tx.wrapS = THREE.RepeatWrapping; tx.wrapT = THREE.RepeatWrapping; tx.repeat.set(1, 60);
    tx.anisotropy = 8; tx.colorSpace = THREE.SRGBColorSpace; return tx;
  }
  function makeGrassTexture() {
    const c = document.createElement('canvas'); c.width = 256; c.height = 256;
    const g = c.getContext('2d');
    g.fillStyle = '#14321a'; g.fillRect(0,0,c.width,c.height);
    for(let i=0;i<4000;i++){
      const x=Math.random()*256,y=Math.random()*256; const s = Math.random()*2; const col = Math.random()<0.5?'#1c5a2a':'#1c4723';
      g.fillStyle = col; g.fillRect(x,y,s,s);
    }
    const tx = new THREE.CanvasTexture(c); tx.wrapS = tx.wrapT = THREE.RepeatWrapping; tx.repeat.set(80,80); tx.anisotropy=8; tx.colorSpace = THREE.SRGBColorSpace; return tx;
  }
  const roadTex = makeRoadTexture();
  const grassTex = makeGrassTexture();

// ====== Track Geometry (Ribbon along closed spline) ======
  const TRACK_WIDTH = 10; // meters
  const HALF_W = TRACK_WIDTH/2;
  // points define a flowing closed S-curve circuit
  const pts = [
    new THREE.Vector3(  0,0, 50), new THREE.Vector3( 60,0, 40), new THREE.Vector3( 90,0,  5),
    new THREE.Vector3( 70,0,-40), new THREE.Vector3( 20,0,-60), new THREE.Vector3(-40,0,-65),
    new THREE.Vector3(-95,0,-40), new THREE.Vector3(-110,0, 10), new THREE.Vector3(-85,0,55),
    new THREE.Vector3(-30,0,80)
  ];
  const curve = new THREE.CatmullRomCurve3(pts, true, 'centripetal');

function buildTrack(curve, width, segments=800){
    const positions = new Float32Array(segments*2*3);
    const uvs = new Float32Array(segments*2*2);
    const indices = new Uint32Array((segments*2-2)*3);

let last = curve.getPoint(0);
    let vAcc = 0; // accumulate along-length for V UVs
    for(let i=0;i<segments;i++){
      const t = i/segments;
      const p = curve.getPoint(t);
      const tan = curve.getTangent(t); tan.y=0; tan.normalize();
      const left = new THREE.Vector3(-tan.z,0,tan.x).normalize();
      vAcc += p.distanceTo(last); last=p;
      const L = p.clone().addScaledVector(left, width/2);
      const R = p.clone().addScaledVector(left, -width/2);
      positions.set([L.x,L.y,L.z], i*6+0);
      positions.set([R.x,R.y,R.z], i*6+3);
      uvs.set([0, vAcc*0.2], i*4+0);
      uvs.set([1, vAcc*0.2], i*4+2);
    }
    let idx=0;
    for(let i=0;i<segments-1;i++){
      const a=i*2, b=i*2+1, c=i*2+2, d=i*2+3;
      indices[idx++]=a; indices[idx++]=b; indices[idx++]=c;
      indices[idx++]=b; indices[idx++]=d; indices[idx++]=c;
    }
    // close the strip
    const a=(segments-1)*2, b=(segments-1)*2+1, c=0, d=1;
    indices[idx++]=a; indices[idx++]=b; indices[idx++]=c;
    indices[idx++]=b; indices[idx++]=d; indices[idx++]=c;

const geo = new THREE.BufferGeometry();
    geo.setAttribute('position', new THREE.BufferAttribute(positions,3));
    geo.setAttribute('uv', new THREE.BufferAttribute(uvs,2));
    geo.setIndex(new THREE.BufferAttribute(indices,1));
    geo.computeVertexNormals();
    return geo;
  }

const trackGeo = buildTrack(curve, TRACK_WIDTH, 1000);
  const trackMat = new THREE.MeshStandardMaterial({map:roadTex, roughness:0.95, metalness:0.0});
  const track = new THREE.Mesh(trackGeo, trackMat);
  track.receiveShadow = true;
  scene.add(track);

// Grass ground
  const ground = new THREE.Mesh(new THREE.CircleGeometry(600, 200), new THREE.MeshStandardMaterial({map:grassTex, roughness:1}));
  ground.rotation.x = -Math.PI/2; ground.receiveShadow = true; scene.add(ground);

// Neon barriers (pillars along edges)
  const pillarGeo = new THREE.CylinderGeometry(0.2,0.2,1.6,8);
  const pillarMat = new THREE.MeshStandardMaterial({color:0x65d1ff, emissive:0x143a4a, emissiveIntensity:0.8, roughness:0.4});
  for(let i=0;i<160;i++){
    const t = i/160; const p = curve.getPoint(t); const tan = curve.getTangent(t); tan.y=0; tan.normalize();
    const left = new THREE.Vector3(-tan.z,0,tan.x).normalize();
    for(const s of [-1,1]){
      const m = new THREE.Mesh(pillarGeo, pillarMat); m.position.copy(p).addScaledVector(left, s*(HALF_W+0.8)); m.position.y = 0.8; m.castShadow = true; scene.add(m);
    }
  }

// ====== Car Factory ======
  function makeCar(color=0x7ab7ff){
    const group = new THREE.Group();
    const body = new THREE.Mesh(new THREE.BoxGeometry(1.9,0.6,3.6), new THREE.MeshStandardMaterial({color, metalness:0.3, roughness:0.4}));
    body.position.y = 0.6/2 + 0.28; body.castShadow = true; body.receiveShadow = true; group.add(body);
    const cabin = new THREE.Mesh(new THREE.BoxGeometry(1.4,0.5,1.4), new THREE.MeshStandardMaterial({color:0xbfd9ff, metalness:0.1, roughness:0.2}));
    cabin.position.set(0, 0.9, -0.3); cabin.castShadow=true; group.add(cabin);
    const wheelGeo = new THREE.CylinderGeometry(0.42,0.42,0.34,18);
    const wheelMat = new THREE.MeshStandardMaterial({color:0x222, roughness:0.8});
    function wheel(x,z){ const w = new THREE.Mesh(wheelGeo, wheelMat); w.rotation.z = Math.PI/2; w.position.set(x,0.42, z); w.castShadow=true; w.receiveShadow=true; group.add(w); return w; }
    const wFL = wheel( 0.82,  1.2), wFR = wheel(-0.82,  1.2), wRL = wheel( 0.82, -1.2), wRR = wheel(-0.82, -1.2);
    return {group, body, wheels:{wFL,wFR,wRL,wRR}};
  }

// Player car
  const playerCar = makeCar(0x7ab7ff);
  scene.add(playerCar.group);

// AI cars
  const aiCars = [0xff7a78,0xffcc66,0x9cff7a].map(c=>{ const car=makeCar(c); scene.add(car.group); return car; });

// ====== Car Physics (simple bicycle model) ======
  const state = {
    t: 0.0, // param on curve [0,1)
    pos: curve.getPoint(0).clone().add(new THREE.Vector3(0,0,0)),
    dir: curve.getTangent(0).setY(0).normalize(),
    up:  new THREE.Vector3(0,1,0),
    vel: new THREE.Vector3(),
    speed: 0,
    heading: 0, // yaw angle (radians), aligned to dir at spawn
    steer: 0,
    lap: 1, maxLap: 3, lapTime: 0, raceStarted:false, finished:false,
    nitro: 1.0 // 0..1
  };
  // align initial heading with tangent
  state.heading = Math.atan2(state.dir.x, state.dir.z);
  playerCar.group.position.copy(state.pos);

// AI states following the same curve with offsets
  const aiStates = aiCars.map((car,i)=>({
    t: (i+1)/4, // spread around track
    offset: (i%2===0?1:-1)* (2 + i*0.2),
    speed: 0,
    heading: Math.atan2(curve.getTangent((i+1)/4).x, curve.getTangent((i+1)/4).z),
  }));

// Input
  const keys = new Set();
  document.addEventListener('keydown', e=>{ if(['ArrowUp','ArrowDown','ArrowLeft','ArrowRight','KeyW','KeyA','KeyS','KeyD','ShiftLeft','KeyR','KeyP'].includes(e.code)) e.preventDefault(); keys.add(e.code);
    if(e.code==='KeyR') resetCar(); if(e.code==='KeyP') pauseToggle(); });
  document.addEventListener('keyup', e=>keys.delete(e.code));

// Mobile input
  const pad = document.getElementById('pad'); const stick = document.getElementById('stick');
  const btnAccel = document.getElementById('btnAccel'); const btnBrake = document.getElementById('btnBrake');
  let mobile = {ax:0, steer:0, accel:false, brake:false, active:false};
  function tp(e,el){const t=e.touches[0]||e.changedTouches[0]; const r=el.getBoundingClientRect(); return {x:t.clientX-r.left,y:t.clientY-r.top};}
  if(pad){
    const R=85, K=40; // area radius and knob radius
    const center=()=>({x:R,y:R});
    function setStick(dx,dy){ const len=Math.hypot(dx,dy); const m=len>R?R/len:1; stick.style.left=(dx*m+R)+'px'; stick.style.top=(dy*m+R)+'px'; }
    const start=e=>{e.preventDefault(); mobile.active=true; const p=tp(e,pad); mobile.mx=p.x; mobile.my=p.y; setStick(0,0)};
    const move=e=>{e.preventDefault(); if(!mobile.active) return; const p=tp(e,pad); const dx=p.x-mobile.mx, dy=p.y-mobile.my; mobile.steer=dx/60; mobile.ax = -dy/60; setStick(dx,dy)};
    const end=e=>{e.preventDefault(); mobile.active=false; mobile.steer=0; mobile.ax=0; setStick(0,0)};
    pad.addEventListener('touchstart',start,{passive:false}); pad.addEventListener('touchmove',move,{passive:false}); pad.addEventListener('touchend',end,{passive:false}); pad.addEventListener('touchcancel',end,{passive:false});
    btnAccel.addEventListener('touchstart',e=>{e.preventDefault(); mobile.accel=true;},{passive:false});
    btnAccel.addEventListener('touchend',e=>{e.preventDefault(); mobile.accel=false;},{passive:false});
    btnBrake.addEventListener('touchstart',e=>{e.preventDefault(); mobile.brake=true;},{passive:false});
    btnBrake.addEventListener('touchend',e=>{e.preventDefault(); mobile.brake=false;},{passive:false});
  }

// HUD elements
  const spdEl = document.getElementById('spd');
  const lapEl = document.getElementById('lap');
  const timeEl = document.getElementById('time');
  const posEl = document.getElementById('pos');
  const offroadEl = document.getElementById('offroad');

// Race control
  const startCard = document.getElementById('startCard');
  document.getElementById('startBtn').onclick = ()=>{ startCard.style.display='none'; state.raceStarted=true; };
  document.getElementById('viewBtn').onclick = ()=>{ startCard.style.display='none'; demoCamera = true; };

let paused = false; function pauseToggle(){ paused=!paused; }

function resetCar(){
    state.t=0; state.pos.copy(curve.getPoint(0)); state.dir.copy(curve.getTangent(0).setY(0).normalize());
    state.heading = Math.atan2(state.dir.x, state.dir.z); state.vel.set(0,0,0); state.speed=0; state.lap=1; state.lapTime=0; state.finished=false; state.nitro=1;
    playerCar.group.position.copy(state.pos); playerCar.group.rotation.y = state.heading;
  }

// Helper: closest centerline data & off-track metric
  function sampleClosestT(pos, guessT, steps=40){
    // search around guessT for better fit
    let bestT=guessT, bestD=Infinity; const N=400;
    for(let i=-steps;i<=steps;i++){
      let t = (guessT + i/N + 1) % 1;
      const p = curve.getPoint(t);
      const d = pos.distanceToSquared(p);
      if(d<bestD){bestD=d; bestT=t;}
    }
    const p = curve.getPoint(bestT);
    const tan = curve.getTangent(bestT); tan.y=0; tan.normalize();
    const left = new THREE.Vector3(-tan.z,0,tan.x).normalize();
    const side = pos.clone().sub(p); const lateral = side.dot(left);
    return {t:bestT, center:p, left, tan, lateral};
  }

// AI logic
  function updateAI(dt){
    aiStates.forEach((ai, idx)=>{
      // target speed varies with small noise and track curvature
      const k = 22 + 6*Math.sin(perfNow*0.2+idx); // base m/s
      ai.speed += (k - ai.speed) * 0.6 * dt; // approach target
      ai.t = (ai.t + (ai.speed * dt) / trackLength) % 1;
      const base = curve.getPoint(ai.t);
      const tan = curve.getTangent(ai.t); tan.y=0; tan.normalize();
      const left = new THREE.Vector3(-tan.z,0,tan.x).normalize();
      const sway = Math.sin(perfNow*0.9 + idx*1.7) * 0.8;
      const pos = base.clone().addScaledVector(left, ai.offset + sway);
      const heading = Math.atan2(tan.x, tan.z);
      ai.heading = heading;
      const car = aiCars[idx];
      car.group.position.copy(pos); car.group.rotation.y = heading;
      // wheel spin visual
      const spin = ai.speed * dt * 2.2;
      car.wheels.wFL.rotation.x -= spin; car.wheels.wFR.rotation.x -= spin; car.wheels.wRL.rotation.x -= spin; car.wheels.wRR.rotation.x -= spin;
    });
  }

// Track length approximation for speed -> t mapping
  let trackLength = 0; { // integrate sample distances
    let prev = curve.getPoint(0);
    for(let i=1;i<=1000;i++){ const t=i/1000; const p=curve.getPoint(t); trackLength += p.distanceTo(prev); prev=p; }
  }

// Camera chase params
  let demoCamera = false;
  const camPivot = new THREE.Vector3();
  const camPos = new THREE.Vector3();

// Main loop
  let prev = performance.now(); let perfNow = prev;
  renderer.setAnimationLoop(() => {
    if(paused){ renderer.render(scene,camera); return; }
    const now = performance.now(); const dt = Math.min(0.033, (now - prev)/1000); prev = now; perfNow = now*0.001;

// ===== Player control =====
    const accel = (keys.has('ArrowUp')||keys.has('KeyW')||mobile.accel||mobile.ax>0.2) ? 1:0;
    const brake = (keys.has('ArrowDown')||keys.has('KeyS')||mobile.brake||mobile.ax<-0.2) ? 1:0;
    const steerInput = (keys.has('ArrowLeft')||keys.has('KeyA') ? -1:0) + (keys.has('ArrowRight')||keys.has('KeyD') ? 1:0) + (mobile.steer||0);

// nitro
    const nitroOn = (keys.has('ShiftLeft') && state.nitro>0);

// basic longitudinal dynamics
    const maxEngine = nitroOn? 22 : 14; // m/s^2 equivalent thrust scale
    const engine = accel * (nitroOn? 12:8);
    const brakeF = brake ? 16 : 0;
    const drag = 0.45 * state.speed*state.speed; // quadratic drag
    const roll = 1.2 * state.speed; // rolling resistance

// get centerline data
    const cl = sampleClosestT(playerCar.group.position, state.t);
    state.t = cl.t; // keep tracking
    const onTrackFactor = 1 - Math.max(0, (Math.abs(cl.lateral)-HALF_W)/4); // <1 when far off
    const grip = THREE.MathUtils.clamp(0.9 * onTrackFactor, 0.25, 0.95);
    offroadEl.style.display = grip<0.8 ? 'inline-flex' : 'none';

// update speed
    let acc = engine - brakeF - drag*0.015 - roll*0.02; // simplified units
    state.speed += acc * dt; state.speed = THREE.MathUtils.clamp(state.speed, 0, 92/3.6); // cap ~92 km/h
    if(!state.raceStarted) state.speed *= 0.98;
    if(nitroOn){ state.nitro = Math.max(0, state.nitro - 0.25*dt); }
    else { state.nitro = Math.min(1, state.nitro + 0.08*dt); }

// steering affects heading more at higher grip and speed
    const steerMax = THREE.MathUtils.degToRad(28);
    const steer = THREE.MathUtils.clamp(steerInput, -1, 1) * steerMax;
    const yawRate = state.speed * Math.tan(steer) * 0.18 * grip; // simplified bicycle model
    state.heading += yawRate * dt;

// update velocity in heading direction, with some lateral slip
    const forward = new THREE.Vector3(Math.sin(state.heading), 0, Math.cos(state.heading));
    state.vel.lerp(forward.multiplyScalar(state.speed), grip);
    playerCar.group.position.addScaledVector(state.vel, dt);

// soft snap toward centerline direction to reduce divergence
    const desiredHeading = Math.atan2(cl.tan.x, cl.tan.z);
    const dAng = THREE.MathUtils.euclideanModulo(desiredHeading - state.heading + Math.PI, Math.PI*2) - Math.PI;
    state.heading += dAng * (0.6*(1-grip)) * dt; // only when off-track/grip low

// wheel visuals
    playerCar.group.rotation.y = state.heading;
    const spin = state.speed * dt * 2.6; // fake rotation
    const w = playerCar.wheels; w.wFL.rotation.x -= spin; w.wFR.rotation.x -= spin; w.wRL.rotation.x -= spin; w.wRR.rotation.x -= spin;

// lap timing
    if(state.raceStarted && !state.finished){ state.lapTime += dt; }
    // detect wrap-around crossing (t decreasing -> new lap), use dt to avoid multiple counts
    if(state.raceStarted && !state.finished){
      const tNew = state.t, tOld = (state.t - (state.speed*dt)/trackLength + 1)%1; // rough back-step
      if(tNew < 0.1 && tOld > 0.9){ // crossed start line
        if(state.lap < state.maxLap) { state.lap++; } else { state.finished = true; state.raceStarted=false; }
      }
    }

// AI update
    updateAI(dt);

// camera
    if(demoCamera){
      const tt = (perfNow*0.03)%1; const p = curve.getPoint(tt); const tan = curve.getTangent(tt); const left = new THREE.Vector3(-tan.z,0,tan.x).normalize();
      camera.position.copy(p).addScaledVector(left, 18).add(new THREE.Vector3(0,12,0));
      camera.lookAt(p);
    } else {
      const camBack = 7 + THREE.MathUtils.smoothstep(state.speed, 0, 25)*2;
      const camUp = 3.2 + THREE.MathUtils.smoothstep(state.speed, 0, 25)*0.8;
      const target = playerCar.group.position.clone();
      const behind = new THREE.Vector3(Math.sin(state.heading),0,Math.cos(state.heading)).multiplyScalar(-camBack);
      camPivot.lerp(target, 0.15);
      camPos.lerp(target.clone().add(behind).add(new THREE.Vector3(0,camUp,0)), 0.08);
      camera.position.copy(camPos);
      camera.lookAt(camPivot);
    }

// sun follows a bit for nice specular
    sun.position.x = Math.cos(perfNow*0.1)*140; sun.position.z = Math.sin(perfNow*0.1)*80;

// HUD
    spdEl.textContent = Math.round(state.speed*3.6);
    lapEl.textContent = state.lap;
    timeEl.textContent = state.lapTime.toFixed(2);
    // position estimate: compare t ahead along track (higher t means ahead)
    const order = [state.t, ...aiStates.map(a=>a.t)].sort((a,b)=> b-a);
    const pos = order.indexOf(state.t)+1; posEl.textContent = pos;

renderer.render(scene, camera);
  });
})();
</script>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: car.html

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation