diff --git a/.gitignore b/.gitignore index cf1f332..fdd30fc 100644 --- a/.gitignore +++ b/.gitignore @@ -15,3 +15,6 @@ logs/ .vscode/ .idea/ *.iml + +# other files +*.psd diff --git a/src/index.ts b/src/index.ts index 7747c2d..11d7bd6 100644 --- a/src/index.ts +++ b/src/index.ts @@ -7,13 +7,14 @@ import { Vector3, Color3 } from '@babylonjs/core/Maths/math'; import { SkyMaterial } from '@babylonjs/materials/sky'; import { StandardMaterial } from '@babylonjs/core/Materials/standardMaterial'; import { Texture } from '@babylonjs/core/Materials/Textures/texture'; +import { Tools } from '@babylonjs/core/Misc/tools' import img from '../assets/floortiles.png'; import norm from '../assets/floortiles_normal.png'; const canvas = document.createElement('canvas'); -canvas.id = "render-canvas"; +canvas.id = 'render-canvas'; canvas.style.width = '100%'; canvas.style.height = '100%'; document.body.appendChild(canvas); @@ -21,16 +22,30 @@ document.body.appendChild(canvas); const engine = new Engine(canvas, true); const scene = new Scene(engine); -const camera = new ArcRotateCamera('camera1', 0.5, 0.9, 10, Vector3.Zero(), scene); -camera.attachControl(canvas, true); +const setupCamera = () => { + const arcRotCamera = new ArcRotateCamera('camera1arc', + Tools.ToRadians(-90), + Tools.ToRadians(60), + 10, + Vector3.Zero(), + scene); + arcRotCamera.lowerRadiusLimit = 2; + arcRotCamera.upperRadiusLimit = 45; + arcRotCamera.upperBetaLimit = Tools.ToRadians(89.9); // todo: Adjust to mouse wheel ? like in unreal + arcRotCamera.wheelDeltaPercentage = 0.01; + arcRotCamera.speed = 1; + arcRotCamera.attachControl(canvas, true); +} -const sunPosition = new Vector3(0, 100, -100); -const skyMaterial = new SkyMaterial("skyMaterial", scene); +setupCamera(); + +const sunPosition = new Vector3(50, 100, -100); +const skyMaterial = new SkyMaterial('skyMat', scene); skyMaterial.backFaceCulling = false; skyMaterial.useSunPosition = true; skyMaterial.sunPosition = sunPosition; -const skybox = MeshBuilder.CreateBox("skyBox", { size: 1000.0 }, scene); +const skybox = MeshBuilder.CreateBox('skyBox', { size: 1000.0 }, scene); skybox.material = skyMaterial; const light = new HemisphericLight('hemisphereLight', sunPosition, scene); @@ -53,10 +68,10 @@ groundMat.backFaceCulling = false; ground.material = groundMat; engine.runRenderLoop(() => { - scene.render(); - }); - - window.addEventListener('resize', () => { - engine.resize(); - }); + scene.render(); + }); + + window.addEventListener('resize', () => { + engine.resize(); + }); \ No newline at end of file