Tool Request: call_I54XLz0BnVaIU1BQGS2ai10K - create_file
{"file_name":"index.html","content":"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Go-Kart Racing Game</title>\n <style>\n body { margin: 0; overflow: hidden; }\n #info { position: absolute; top: 10px; left: 10px; color: white; font-family: sans-serif; }\n </style>\n <script src=\"https://cdn.jsdelivr.net/npm/three@0.150.1/build/three.min.js\"></script>\n</head>\n<body>\n <div id=\"info\">Use Arrow Keys to Drive the Go-Kart</div>\n <script>\n let scene, camera, renderer;\n let kart, speed = 0;\n const maxSpeed = 0.3;\n const acceleration = 0.002;\n const friction = 0.96;\n\n const controls = { forward: false, backward: false, left: false, right: false };\n\n init();\n animate();\n\n function init() {\n // Scene & Camera\n scene = new THREE.Scene();\n camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);\n\n // Renderer\n renderer = new THREE.WebGLRenderer({ antialias: true });\n renderer.setSize(window.innerWidth, window.innerHeight);\n document.body.appendChild(renderer.domElement);\n\n // Lights\n const ambient = new THREE.AmbientLight(0xcccccc, 0.4);\n scene.add(ambient);\n const dirLight = new THREE.DirectionalLight(0xffffff, 0.8);\n dirLight.position.set(5, 10, 7.5);\n scene.add(dirLight);\n\n // Ground (Track)\n const trackGeo = new THREE.PlaneGeometry(200, 200);\n const trackMat = new THREE.MeshStandardMaterial({ color: 0x228B22 });\n const track = new THREE.Mesh(trackGeo, trackMat);\n track.rotation.x = -Math.PI / 2;\n scene.add(track);\n\n // Simple track boundaries (boxes)\n const boundaryMat = new THREE.MeshStandardMaterial({ color: 0x8B4513 });\n const createBoundary = (x, z, w, h) => {\n const geo = new THREE.BoxGeometry(w, 1, h);\n const m = new THREE.Mesh(geo, boundaryMat);\n m.position.set(x, 0.5, z);\n scene.add(m);\n };\n const B = 100;\n createBoundary(0, -B, 200, 2);\n createBoundary(0, B, 200, 2);\n createBoundary(-B, 0, 2, 200);\n createBoundary(B, 0, 2, 200);\n\n // Go-Kart Model (simple)\n kart = new THREE.Group();\n // Chassis\n const chassisMat = new THREE.MeshStandardMaterial({ color: 0xff0000 });\n const chassis = new THREE.Mesh(new THREE.BoxGeometry(1, 0.3, 2), chassisMat);\n chassis.position.y = 0.25;\n kart.add(chassis);\n\n // Wheels\n const wheelGeo = new THREE.CylinderGeometry(0.2, 0.2, 0.4, 16);\n const wheelMat = new THREE.MeshStandardMaterial({ color: 0x000000 });\n const wheelPositions = [\n [ 0.6, 0.1, 0.8], // front-right\n [ -0.6, 0.1, 0.8], // front-left\n [ 0.6, 0.1, -0.8], // rear-right\n [ -0.6, 0.1, -0.8] // rear-left\n ];\n wheelPositions.forEach(pos => {\n const wheel = new THREE.Mesh(wheelGeo, wheelMat);\n wheel.rotation.z = Math.PI / 2;\n wheel.position.set(pos[0], pos[1], pos[2]);\n kart.add(wheel);\n });\n\n scene.add(kart);\n kart.position.set(0, 0, 0);\n\n // Camera initial position\n camera.position.set(0, 5, 10);\n camera.lookAt(kart.position);\n\n // Event Listeners\n window.addEventListener('resize', onWindowResize, false);\n document.addEventListener('keydown', onKeyDown, false);\n document.addEventListener('keyup', onKeyUp, false);\n }\n\n function onKeyDown(event) {\n switch (event.code) {\n case 'ArrowUp': controls.forward = true; break;\n case 'ArrowDown': controls.backward = true; break;\n case 'ArrowLeft': controls.left = true; break;\n case 'ArrowRight': controls.right = true; break;\n }\n }\n\n function onKeyUp(event) {\n switch (event.code) {\n case 'ArrowUp': controls.forward = false; break;\n case 'ArrowDown': controls.backward = false; break;\n case 'ArrowLeft': controls.left = false; break;\n case 'ArrowRight': controls.right = false; break;\n }\n }\n\n function animate() {\n requestAnimationFrame(animate);\n\n // Acceleration & braking\n if (controls.forward) speed += acceleration;\n if (controls.backward) speed -= acceleration;\n // Clamp speed\n speed = Math.max(-maxSpeed, Math.min(maxSpeed, speed));\n // Friction\n if (!controls.forward && !controls.backward) speed *= friction;\n\n // Steering\n let steerAngle = 0;\n if (controls.left) steerAngle = 0.03;\n if (controls.right) steerAngle = -0.03;\n // Reduce steering at low speeds\n const steer = steerAngle * (speed / maxSpeed);\n kart.rotation.y += steer;\n\n // Move Kart\n const forward = new THREE.Vector3(\n Math.sin(kart.rotation.y),\n 0,\n Math.cos(kart.rotation.y)\n );\n kart.position.add(forward.multiplyScalar(speed));\n\n // Update camera to follow\n const camOffset = new THREE.Vector3(0, 5, 10)\n .applyAxisAngle(new THREE.Vector3(0, 1, 0), kart.rotation.y);\n camera.position.copy(kart.position).add(camOffset);\n camera.lookAt(kart.position);\n\n renderer.render(scene, camera);\n }\n\n function onWindowResize() {\n camera.aspect = window.innerWidth / window.innerHeight;\n camera.updateProjectionMatrix();\n renderer.setSize(window.innerWidth, window.innerHeight);\n }\n </script>\n</body>\n</html>\n"}