54 lines
1.3 KiB
TypeScript
54 lines
1.3 KiB
TypeScript
import SocketIO, { Socket } from 'socket.io-client';
|
|
import * as THREE from 'three';
|
|
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
|
|
import { Game } from './game';
|
|
import { ThirdPersonCamera } from './object/camera';
|
|
|
|
const socket = SocketIO({ autoConnect: false });
|
|
|
|
const scene = new THREE.Scene();
|
|
const camera = new THREE.PerspectiveCamera(
|
|
75,
|
|
window.innerWidth / window.innerHeight,
|
|
0.1,
|
|
1000,
|
|
);
|
|
|
|
const renderer = new THREE.WebGLRenderer();
|
|
renderer.setSize(window.innerWidth, window.innerHeight);
|
|
document.body.appendChild(renderer.domElement);
|
|
|
|
renderer.setClearColor(0x00ddff);
|
|
|
|
const sun = new THREE.DirectionalLight(0xffffff);
|
|
sun.position.set(10, 10, 0);
|
|
scene.add(sun);
|
|
|
|
const ambient = new THREE.AmbientLight(0xe8e8e8, 0.2);
|
|
scene.add(ambient);
|
|
|
|
const cube = new THREE.Mesh(
|
|
new THREE.BoxGeometry(100, 1, 100, 10, 1, 10),
|
|
new THREE.MeshToonMaterial({ color: 0x32a852 }),
|
|
);
|
|
cube.position.set(0, -0.5, 0);
|
|
scene.add(cube);
|
|
|
|
camera.position.set(0, 4, 4);
|
|
|
|
const game = new Game(socket, camera, scene, renderer.domElement);
|
|
|
|
const clock = new THREE.Clock();
|
|
let delta: number;
|
|
function animate() {
|
|
requestAnimationFrame(animate);
|
|
|
|
delta = clock.getDelta();
|
|
game.update(delta);
|
|
|
|
renderer.render(scene, camera);
|
|
}
|
|
animate();
|
|
|
|
game.initialize().catch((e) => console.error(e));
|