import * as T from 'three'; import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'; export function Scene(inSettings) { const renderer = new T.WebGLRenderer({canvas:document.querySelector(inSettings.DOM)}); const scene = new T.Scene(); const camera = new T.PerspectiveCamera(80, 2, 0.1, 100); const light = new T.DirectionalLight(0xFFFFFF, 1); const controls = new OrbitControls(camera, renderer.domElement); let dirty = false; const Screen = { Dirty:false, Drag:0, Down:false, Ray:new T.Raycaster(), Mouse:new T.Vector2(), Camera:camera, Event:null, Update:e=> { Screen.Event = e; Screen.Dirty = true; Screen.Mouse.x = ( e.clientX / renderer.domElement.clientWidth ) * 2 - 1; Screen.Mouse.y = - ( e.clientY / renderer.domElement.clientHeight ) * 2 + 1; Screen.Ray.setFromCamera( Screen.Mouse, Screen.Camera ); }, HandleMove:e=> { Screen.Drag = Screen.Down ? 2 : 0; Screen.Update(e); }, HandlePress:e=> { Screen.Down = true; Screen.Drag = 1; Screen.Update(e); }, HandleRelease:e=> { Screen.Down = false; Screen.Drag = 0; Screen.Update(e); } }; renderer.domElement.addEventListener("pointermove", Screen.HandleMove); renderer.domElement.addEventListener("pointerdown", Screen.HandlePress); renderer.domElement.addEventListener("pointerup", Screen.HandleRelease); const update = inTime => { let timeNew = new Date(); let timeDelta = timeNew - inTime; let delta = timeDelta * 0.001; inSettings.Update(scene, Screen, delta); Screen.Dirty = false; controls.update(); dirty = true; setTimeout(()=>update(timeNew), 50); } const render = inTime => { if(dirty) { renderer.render(scene, camera); dirty = false; } requestAnimationFrame(render); } const resize = () => { let canvas = renderer.domElement; camera.aspect = canvas.clientWidth / canvas.clientHeight; camera.updateProjectionMatrix(); renderer.setSize(canvas.clientWidth, canvas.clientHeight, false); }; scene.add(light); light.position.set(-1, 2, 4); camera.position.set(-1, 2, -1); camera.lookAt(new T.Vector3(0,0,0)); controls.update(); inSettings.Init(scene); window.addEventListener("resize", resize); resize(); render(0); update(new Date()); };