Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
constructor() {
// Define Geometry
const geometry = new THREE.PlaneBufferGeometry(1, 1, 64, 64);
// Define Material
const material = new THREE.RawShaderMaterial({
uniforms: {
time: {
type: 'f',
value: 0
},
easeTransition: {
type: 'f',
value: 0
},
noiseTex: {
type: 't',
value: null
},
constructor() {
// Define Geometry
const geometry = new THREE.PlaneBufferGeometry(30, 30, 128, 128);
// Define Material
const material = new THREE.RawShaderMaterial({
uniforms: {
...THREE.UniformsLib['lights'],
time: {
type: 'f',
value: 0
},
},
vertexShader: vs,
fragmentShader: fs,
flatShading: true,
});
// Create Object3D
scene = new THREE.Scene();
const ambient = new THREE.AmbientLight(0xffffff);
scene.add(ambient);
light = new THREE.SpotLight(0xffffff);
light.position.set(10, 30, 20);
light.target.position.set(0, 5, 0);
scene.add(light);
/*----- CREATE CLOCK FOR FIRE ANIMATION -----*/
clock = new THREE.Clock()
controls = new PointerLockControls(camera, sphereBody);
scene.add(controls.getObject());
/*----- FLOOR -----*/
geometry = new THREE.PlaneBufferGeometry(125, 125, 50, 50);
geometry.applyMatrix(new THREE.Matrix4().makeRotationX(-Math.PI / 2));
const texture = new THREE.TextureLoader().load('images/grass.png');
material = new THREE.MeshLambertMaterial({ map: texture });
/*----- REPEAT TEXTURE TILING FOR FLOOR -----*/
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.x = 20;
texture.repeat.y = 20;
mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
/*----- SKYBOX -----*/
const skyGeo = new THREE.SphereGeometry(1000, 32, 32);
const skyMaterial = new THREE.MeshBasicMaterial({ color: '#00bfff' });
const sky = new THREE.Mesh(skyGeo, skyMaterial);
constructor() {
super(
new PlaneBufferGeometry( 100000, 100000, 2, 2 ),
new MeshBasicMaterial( { visible: false, wireframe: true, side: DoubleSide, transparent: true, opacity: 0.1 } )
);
this.type = 'TransformControlsPlane';
this.unitX = new Vector3(1, 0, 0);
this.unitY = new Vector3(0, 1, 0);
this.unitZ = new Vector3(0, 0, 1);
this.tempVector = new Vector3();
this.dirVector = new Vector3();
this.alignVector = new Vector3();
this.tempMatrix = new Matrix4();
this.identityQuaternion = new Quaternion();
this.isTransformControlsPlane = true;
*/
this.camera = new OrthographicCamera(-1, 1, 1, -1, 0, 1);
/**
* scene, for composite draw
* @member {Scene}
*/
this.scene = new Scene();
const readBuffer = this.afterEffects.readBuffer;
/**
* quad, for composite draw
* @member {Mesh}
*/
this.quad = new Mesh(
new PlaneBufferGeometry(2, 2),
new MeshBasicMaterial({
transparent: true,
map: readBuffer.texture,
depthTest: false,
depthWrite: false,
}));
this.scene.add(this.quad);
}
import { Object3DFacade } from 'troika-3d'
import { Color, Mesh, MeshBasicMaterial, PlaneBufferGeometry, Vector4 } from 'three'
import { createUIBlockLayerDerivedMaterial } from './UIBlockLayerDerivedMaterial.js'
const geometry = new PlaneBufferGeometry(1, 1).translate(0.5, -0.5, 0)
const defaultBgMaterial = new MeshBasicMaterial({color: 0})
const noclip = Object.freeze(new Vector4())
/**
* A single layer in a UI Block's rendering, e.g. background or border. All layers honor
* border radius, which is calculated shader-side for perfectly smooth curves at any scale,
* with antialiasing.
*
* You shouldn't have to use this directly; UIBlock3DFacade will create these as needed
* based on background/border styles.
*/
class UIBlockLayer3DFacade extends Object3DFacade {
constructor(parent) {
const mesh = new Mesh(geometry, defaultBgMaterial)
mesh.frustumCulled = false //TODO moot if we make this an Instanceable, otherwise need to fix culling by transformed size
});
geometry.computeBoundingSphere();
geometry.computeBoundingBox();
object = new THREE.Mesh(geometry, material);
object.applyMatrix(modelMatrix);
object.updateMatrixWorld();
/*
Light Map support
*/
if (config.shadow !== 'off') {
sceneRTT = new THREE.Scene();
quadRTT = new THREE.Mesh(
new THREE.PlaneBufferGeometry(lightMapRenderTargetSize, lightMapRenderTargetSize),
new THREE.ShaderMaterial({
uniforms: _.merge(
uniforms,
THREE.UniformsLib.lights,
{
lightDirection: {type: 'v3', value: new THREE.Vector3()}
}
),
defines: {
USE_MAP: 1
},
vertexShader: require('./shaders/Volume.lightmap.vertex.glsl'),
fragmentShader: require('./shaders/Volume.lightmap.fragment.glsl'),
clipping: true,
depthWrite: false,
depthTest: false
_generateGeometry() {
const geometry = new PlaneBufferGeometry(this._dimWidth, this._dimHeight);
this._setGeometry(geometry);
}
new THREE.PlaneBufferGeometry(
window.innerWidth - 1,
window.innerHeight - 1,
window.innerWidth / 16,
window.innerHeight / 16
)
),
new THREE.LineBasicMaterial({
color: 0x999999,
depthWrite: false,
depthTest: false
})
),
new THREE.LineSegments(
new THREE.WireframeGeometry(
new THREE.PlaneBufferGeometry(
window.innerWidth - 1,
window.innerHeight - 1,
2,
2
)
),
new THREE.LineBasicMaterial({
color: 0xff0000,
depthWrite: false,
depthTest: false
})
)
);
penObject = new THREE.Mesh(
new THREE.SphereBufferGeometry(4, 4, 4),