| | |
| | | import TWEEN from '@tweenjs/tween.js'; |
| | | |
| | | const help = false; |
| | | const debugCamera = { |
| | | x: 200, |
| | | y: 200, |
| | | z: 200 |
| | | } |
| | | |
| | | export default class ShelfThree { |
| | | |
| | |
| | | } |
| | | |
| | | animate = () => { |
| | | requestAnimationFrame(this.animate); |
| | | this.animationFrame = requestAnimationFrame(this.animate); |
| | | this.render(); |
| | | TWEEN.update(); |
| | | } |
| | | |
| | | render = () => { |
| | | console.log(1); |
| | | this.renderer.shadowMap.enabled = true; |
| | | this.renderer.render(this.scene, this.camera); |
| | | this.stats.update(); |
| | |
| | | |
| | | initCamera = () => { |
| | | const camera = new THREE.PerspectiveCamera(70, this.fullWidth / this.fullHeight, 1, 60000); |
| | | camera.position.set(debugCamera.x, debugCamera.y, debugCamera.z); |
| | | camera.position.set(200, 200, 200); |
| | | this.scene.add(camera); |
| | | return camera; |
| | | } |
| | |
| | | } |
| | | |
| | | windowResize = () => { |
| | | let that = this; |
| | | window.addEventListener('resize', function () { |
| | | that.camera.aspect = this.fullWidth / this.fullHeight; |
| | | that.camera.updateProjectionMatrix(); |
| | | that.renderer.setSize(that.fullWidth, that.fullHeight); |
| | | }, false); |
| | | this.resizeHandler = () => { |
| | | this.camera.aspect = this.fullWidth / this.fullHeight; |
| | | this.camera.updateProjectionMatrix(); |
| | | this.renderer.setSize(this.fullWidth, this.fullHeight); |
| | | }; |
| | | window.addEventListener('resize', this.resizeHandler, false); |
| | | } |
| | | |
| | | initRaycaster = (container) => { |
| | |
| | | handleClick = () => { |
| | | |
| | | } |
| | | |
| | | destroy = () => { |
| | | cancelAnimationFrame(this.animationFrame); |
| | | window.removeEventListener('resize', this.resizeHandler); |
| | | this.renderer.dispose(); |
| | | this.controls.dispose(); |
| | | } |
| | | }; |
| | | |
| | | const initLight = (scene) => { |