1 | /** |
---|
2 | * @file Main Module |
---|
3 | * @author Patryk Gliszczynski |
---|
4 | * @version 1.0 |
---|
5 | */ |
---|
6 | |
---|
7 | class App { |
---|
8 | /** |
---|
9 | * Main module responsible for the maintanance of the core animation components. |
---|
10 | */ |
---|
11 | |
---|
12 | constructor() { |
---|
13 | this.scene = this.Scene(); |
---|
14 | this.camera = this.Camera(); |
---|
15 | this.controls = this.Controls(); |
---|
16 | this.webGLRenderer = this.WebGLRenderer(); |
---|
17 | this.css3DRenderer = this.CSS3DRenderer(); |
---|
18 | |
---|
19 | this.simulation = new Simulation(new World(this.camera, this.scene)); |
---|
20 | |
---|
21 | document.body.appendChild(this.webGLRenderer.domElement); |
---|
22 | document.body.appendChild(this.css3DRenderer.domElement); |
---|
23 | window.addEventListener("resize", this.onWindowResize.bind(this), false); |
---|
24 | return this; |
---|
25 | } |
---|
26 | |
---|
27 | Scene() { |
---|
28 | /** |
---|
29 | * Creates a new Scene object. |
---|
30 | */ |
---|
31 | let scene = new THREE.Scene(); |
---|
32 | scene.fog = new THREE.Fog(Config.Fog.BACKGROUND, Config.Fog.NEAR, Config.Fog.FAR); |
---|
33 | return scene; |
---|
34 | } |
---|
35 | |
---|
36 | Camera() { |
---|
37 | /** |
---|
38 | * Creates a new Camera object. |
---|
39 | */ |
---|
40 | let camera = new THREE.PerspectiveCamera(Config.Camera.FOV, Config.Camera.ASPECT, Config.Camera.NEAR, Config.Camera.FAR); |
---|
41 | camera.position.set(Config.Camera.X_POS, Config.Camera.Y_POS, Config.Camera.Z_POS); |
---|
42 | camera.updateProjectionMatrix(); |
---|
43 | return camera; |
---|
44 | } |
---|
45 | |
---|
46 | Controls() { |
---|
47 | /** |
---|
48 | * Creates a new Control object alowing to steer the camera. |
---|
49 | */ |
---|
50 | let controls = new THREE.OrbitControls(this.camera); |
---|
51 | controls.autoRotate = Config.Controls.AUTO_ROTATE; |
---|
52 | controls.autoRotateSpeed = Config.Controls.AUTO_ROTATE_SPEED; |
---|
53 | controls.minDistance = Config.Controls.MIN_DISTANCE; |
---|
54 | controls.maxDistance = Config.Controls.MAX_DISTANCE; |
---|
55 | controls.maxPolarAngle = Config.Controls.MAX_POLAR_ANGLE; |
---|
56 | controls.update(); |
---|
57 | return controls |
---|
58 | } |
---|
59 | |
---|
60 | WebGLRenderer() { |
---|
61 | /** |
---|
62 | * Creates a WebGL Renderer object used to visualize 3D components. |
---|
63 | */ |
---|
64 | let renderer = new THREE.WebGLRenderer({antialias: Config.WebGLRenderer.ANTIALIAS}); |
---|
65 | renderer.setSize(Config.WebGLRenderer.WIDTH, Config.WebGLRenderer.HEIGHT); |
---|
66 | renderer.setPixelRatio(Config.WebGLRenderer.PIXEL_RATIO); |
---|
67 | renderer.shadowMap.enabled = Config.WebGLRenderer.ShadowMap.ENABLED; |
---|
68 | renderer.shadowMap.type = THREE.PCFSoftShadowMap; |
---|
69 | renderer.shadowMap.renderSingleSided = Config.WebGLRenderer.ShadowMap.SINGLE_SIDED; |
---|
70 | renderer.gammaInput = Config.WebGLRenderer.GAMMA_INPUT; |
---|
71 | renderer.gammaOutput = Config.WebGLRenderer.GAMMA_OUTPUT; |
---|
72 | return renderer; |
---|
73 | } |
---|
74 | |
---|
75 | CSS3DRenderer() { |
---|
76 | /** |
---|
77 | * Creates a CSS3D Renderer object used to visualize HTML+CSS components in 3D scene. |
---|
78 | */ |
---|
79 | let renderer = new THREE.CSS3DRenderer(); |
---|
80 | renderer.setSize(Config.CSS3DRenderer.WIDTH, Config.CSS3DRenderer.HEIGHT); |
---|
81 | renderer.domElement.style.position = Config.CSS3DRenderer.POSITION; |
---|
82 | renderer.domElement.style.top = Config.CSS3DRenderer.TOP; |
---|
83 | return renderer |
---|
84 | } |
---|
85 | |
---|
86 | run() { |
---|
87 | /** |
---|
88 | * Starts the simulation and rendering process. |
---|
89 | */ |
---|
90 | this.render(); |
---|
91 | this.simulation.run(); |
---|
92 | } |
---|
93 | |
---|
94 | render() { |
---|
95 | /** |
---|
96 | * Main renderer loop, called on each frame. |
---|
97 | */ |
---|
98 | requestAnimationFrame(this.render.bind(this)); |
---|
99 | TWEEN.update(); |
---|
100 | this.controls.update(); |
---|
101 | this.webGLRenderer.render(this.scene, this.camera); |
---|
102 | this.css3DRenderer.render(this.scene, this.camera); |
---|
103 | } |
---|
104 | |
---|
105 | onWindowResize() { |
---|
106 | /** |
---|
107 | * Updates the dimmensions of renderers after window size changes. |
---|
108 | */ |
---|
109 | this.camera.aspect = window.innerWidth / window.innerHeight; |
---|
110 | this.camera.updateProjectionMatrix(); |
---|
111 | this.webGLRenderer.setSize(window.innerWidth, window.innerHeight); |
---|
112 | this.css3DRenderer.setSize(window.innerWidth, window.innerHeight); |
---|
113 | } |
---|
114 | } |
---|
115 | |
---|
116 | new App().run(); |
---|