import * as THREE from 'three';
|
import rotatingAperture from '@/assets/map/texture/rotatingAperture.png';
|
import rotatingPoint from '@/assets/map/texture/rotating-point2.png';
|
import circlePoint from '@/assets/map/texture/circle-point.png';
|
import sceneBg from '@/assets/map/texture/scene-bg2.png';
|
export default class Enviroment {
|
constructor(experience) {
|
this.experience = experience;
|
this.scene = this.experience.scene;
|
// this.setSunLight();
|
this.setBackground();
|
}
|
setSunLight() {
|
this.sunLight = new THREE.DirectionalLight('#ffffff', 4);
|
this.sunLight.castShadow = true;
|
this.sunLight.shadow.camera.far = 15;
|
this.sunLight.shadow.mapSize.set(2048, 2048);
|
this.sunLight.shadow.normalBias = 0.05;
|
this.sunLight.position.set(-1.3, 7, 10);
|
this.scene.add(this.sunLight);
|
}
|
|
setBackground() {
|
const texture = new THREE.TextureLoader();
|
const rotatingApertureTexture = texture.load(rotatingAperture);
|
const rotatingPointTexture = texture.load(rotatingPoint);
|
const circlePointTexture = texture.load(circlePoint);
|
const sceneBgTexture = texture.load(sceneBg);
|
let meshConfig1 = {
|
width: 100,
|
height: 100,
|
texture: rotatingApertureTexture,
|
positionList: [0, 0.13, 0.3],
|
scaleList: [0.048, 0.048, 0.048],
|
rotateList: [-Math.PI / 2, 0, 0]
|
};
|
let meshConfig2 = {
|
width: 100,
|
height: 100,
|
texture: rotatingPointTexture,
|
positionList: [0, 0.1, 0.3],
|
scaleList: [0.04, 0.04, 0.04],
|
rotateList: [-Math.PI / 2, 0, 0]
|
};
|
this.hola1 = this.createMesh(meshConfig1);
|
this.hola2 = this.createMesh(meshConfig2);
|
|
this.scene.add(this.hola1);
|
this.scene.add(this.hola2);
|
}
|
|
createMesh(config) {
|
let { width, height, texture, positionList, rotateList, scaleList } = config;
|
let plane = new THREE.PlaneGeometry(width, height);
|
let material = new THREE.MeshBasicMaterial({
|
map: texture,
|
transparent: true,
|
opacity: 1,
|
depthTest: true,
|
});
|
let mesh = new THREE.Mesh(plane, material);
|
mesh.position.set(...positionList);
|
mesh.scale.set(...scaleList);
|
mesh.rotation.set(...rotateList);
|
return mesh;
|
}
|
|
update() {
|
if (this.hola1) {
|
this.hola1.rotation.z += 0.001;
|
}
|
if (this.hola2) {
|
this.hola2.rotation.z -= 0.001;
|
}
|
}
|
}
|
