LiteChat Race Result
[TOOL_CALLS][runjs]
```runjs
litechat.target.replaceChildren();
// Function to create and append a new element
const createElement = (tag, props = {}, styles = {}, parent = litechat.target) => {
const el = document.createElement(tag);
Object.assign(el, props);
Object.assign(el.style, styles);
parent.appendChild(el);
return el;
};
// Create game container
const gameContainer = createElement('div', { className: 'game-container' }, {
width: '100%',
height: '100%',
position: 'relative',
overflow: 'hidden',
background: 'linear-gradient(to bottom, #00f, #0ff)',
});
// Create game canvas
const canvas = createElement('canvas', {}, {
width: '100%',
height: '100%',
position: 'absolute',
top: 0,
left: 0,
});
// Load Three.js and OrbitControls
(async () => {
try {
// Load Three.js and OrbitControls
const [THREE, OrbitControls] = await Promise.all([
import('https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js'),
import('https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/controls/OrbitControls.js')
]);
// Create Three.js scene
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer({ canvas, antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
// Create player
const playerGeometry = new THREE.BoxGeometry(1, 1, 1);
const playerMaterial = new THREE.MeshBasicMaterial({ color: 0xff00ff });
const player = new THREE.Mesh(playerGeometry, playerMaterial);
player.position.set(0, 0, -5);
scene.add(player);
// Create enemy
const enemyGeometry = new THREE.BoxGeometry(1, 1, 1);
const enemyMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 });
const enemy = new THREE.Mesh(enemyGeometry, enemyMaterial);
enemy.position.set(0, 2, -10);
scene.add(enemy);
// Add ambient light
const light = new THREE.AmbientLight(0x404040); // Soft white light
scene.add(light);
// Add point light
const pointLight = new THREE.PointLight(0xffffff, 1, 100);
pointLight.position.set(5, 5, 5);
scene.add(pointLight);
// Animate scene
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}
animate();
// Handle window resize
window.addEventListener('resize', () => {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
});
// Add OrbitControls
const controls = new OrbitControls(camera, renderer.domElement);
controls.enableDamping = true;
controls.dampingFactor = 0.25;
controls.enableZoom = true;
} catch (error) {
console.error('Error initializing Three.js:', error);
}
})();
```