function initScene() {
scene = new THREE.Scene();
scene.sortObjects = false;
camera = new THREE.PerspectiveCamera(75, container.clientWidth / container.clientHeight, 0.1, 20000);
camera.position.x = 0;
camera.position.y = 0;
camera.position.z = 200;
scene.add(camera);
nodeView = createNodeView(scene);
edgeView = createEdgeView(scene);
if (options.autoFit) autoFitController = createAutoFit(nodeView, camera);
renderer = new THREE.WebGLRenderer({
antialias: false
});
renderer.setClearColor(options.clearColor, 1);
renderer.setSize(container.clientWidth, container.clientHeight);
container.appendChild(renderer.domElement);
input = createInput(camera, graph, renderer.domElement);
input.on('move', stopAutoFit);
input.onKey(options.layoutToggleKey, toggleLayout);
input.on('nodeover', setTooltip);
input.on('nodeclick', passthrough('nodeclick'));
input.on('nodedblclick', passthrough('nodedblclick'));
window.addEventListener('resize', onWindowResize, false);
}
prepare(width, height, texture, shader) {
/* shader material */
let material =
new Three.ShaderMaterial({
uniforms: {
u_sourceData: {
type: "t",
value: texture
}
},
vertexShader: require("raw!vertex.glsl"),
fragmentShader: shader
});
/* cube and mesh */
const geom = new Three.BoxBufferGeometry(width, height, 0);
const mesh = new Three.Mesh(geom, material);
/* scene and camera */
this.scene = new Three.Scene();
this.scene.add(mesh);
this.camera = new Three.OrthographicCamera(width / -2, width / 2, height / -2, height / 2, 0, 0.1);
this.scene.add(this.camera);
/* render */
this.renderer = new Three.WebGLRenderer();
this.renderer.setSize(width, height);
this.bufferTexture = new Three.WebGLRenderTarget(width, height, {
type: Three.FloatType
});
}
constructor() {
const scene = this.scene = new THREE.Scene();
const camera = this.camera = new THREE.PerspectiveCamera(
75,
window.innerWidth / window.innerHeight,
1,
10000
);
camera.position.z = 1000;
var light = new THREE.AmbientLight( 0x404040 ); // soft white light
scene.add(light);
const directionalLight = new THREE.DirectionalLight(0xffffff, 0.8);
directionalLight.position.set(0, 1, 1);
scene.add(directionalLight);
//const material = new THREE.MeshBasicMaterial({color: 0xff0000, wireframe: true});
const material = new THREE.MeshLambertMaterial({color: 0x2194ce});
const facesList = [4, 6, 8, 10, 20];
const meshes = this.meshes = facesList.map((faces, i) => {
const geometry = new Dice[`Dice${faces}`](300);
const mesh = new THREE.Mesh(geometry, material);
mesh.position.x = (i - facesList.length / 2) * 400;
return mesh;
});
meshes.forEach((mesh) => scene.add(mesh));
const renderer = this.renderer = new THREE.WebGLRenderer({alpha: true});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
}
_initCanvas: function(renderElement, width, height) {
var self = this;
// create renderer
var renderer = new THREE.WebGLRenderer({
canvas: renderElement,
antialias: true
});
renderer.setSize(width, height);
renderer.setClearColor( 0xffffff, 1);
// create a scene
var scene = new THREE.Scene();
// set a camera
var camera = new THREE.PerspectiveCamera(40, width / height, 1, 10000);
camera.position.set(500, 800, 1300);
camera.lookAt( new THREE.Vector3() );
scene.add(camera);
// mouse controller
var controls = new OrbitControls(camera, renderElement);
this.set('renderer', renderer);
this.set('scene', scene);
this.set('camera', camera);
self._initLights();
self._initGrids();
self._initRayAndMouse();
// self.renderCanvas();
},
init() {
// Add our rendering to the DOM.
document.body.appendChild(this.renderer.domElement);
// Resize event so that our scene responds to window size change.
window.addEventListener('resize', this.onWindowResize.bind(this), false);
// Set colour of background.
this.renderer.setClearColor(0x09c9f2);
// Create a terrain.
this.createTerrain();
var light = new THREE.HemisphereLight(0xffffbb, 0x080820, 2);
this.scene.add(light);
var ambientLight = new THREE.AmbientLight(0x4c4c4c);
this.scene.add(ambientLight);
var spotLight = new THREE.SpotLight(0xffffff);
spotLight.position.set(0, -500, this.terrain.height);
spotLight.castShadow = true;
spotLight.angle = 5.05;
spotLight.intensity = 0.5;
spotLight.penumbra = 1;
this.scene.add(spotLight);
this.camera.position.set(10, 8810, 4780);
this.controls.target.set(0, 0, 0);
this.controls.update();
// Begin rendering!
this.render();
}
var renderCollectorLines = function(r, c, target, clear) {
var scene = new THREE.Scene();
var points = getPointCollector().points;
for (var i = 0 ; i < points.length - 1 ; i ++) {
var p = points[i],
n = points[i+1];
if (p.id !== n.id)
continue; // don't connect if they belong to different segments
var g = new THREE.Geometry();
g.vertices.push(p);
g.vertices.push(n);
var m = new THREE.LineBasicMaterial({
color: p.color.getHex(),
linewidth: 5,
blending: THREE.NoBlending,
depthTest: false,
depthWrite: false
});
var l = new THREE.Line(g, m);
scene.add(l);
}
r.render(scene, c, target, clear);
};
export default function() {
const clock = new THREE.Clock();
const scene = new THREE.Scene();
scene.fog = THREE.FogExp2(0xD6F1FF, 0.0005);
const ASPECT = WIDTH / HEIGHT;
const objects = {};
const camera = new THREE.PerspectiveCamera(75, ASPECT, 1, 10000);
camera.position.x = -350;
camera.position.y = 350;
scene.add(camera);
const MOVEMENTSPEED = 100;
const LOOKSPEED = 0.075;
const controls = new FirstPersonControls(camera);
controls.movementSpeed = MOVEMENTSPEED;
controls.lookSpeed = LOOKSPEED;
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(WIDTH, HEIGHT);
renderer.domElement.style.backgroundColor = 'rgb(0, 0, 150)';
document.body.appendChild(renderer.domElement);
return { scene, objects, camera, renderer, controls, clock };
}
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(100, WIDTH / HEIGHT, 0.1, 1000);
camera.position.set(200, -200, 950);
scene.add(camera);
camera.lookAt(new THREE.Vector3(0, 0, 0));
camera.rotation.z += 0.1;
light = new THREE.DirectionalLight(0xffffff);
light.position.set(-200, 100, 1000);
camera.add(light);
scene.fog = new THREE.FogExp2(0x000000, 0.0025);
renderer = new THREE.WebGLRenderer({ antialias: true, alpha: false });
renderer.setSize(WIDTH, HEIGHT);
document.body.appendChild(renderer.domElement);
for(let i = 0; i < HEX_COUNT; i++){
let posX = randomize(-1000, 1000);
let posY = randomize(-1000, 1000);
let depth = 1000 / HEX_COUNT;
let mesh = hex(posX, posY, randomize(0, 200), randomize(0, 15));
mesh.position.z = depth * i;
scene.add(mesh);
hexes.push(mesh);
}
}
function init() {
container = document.getElementById( 'background' );
camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 18000 );
camera.position.z = 100;
camera.position.y = 0;
camera.lookAt({
x : 0,
y : 0,
z : 0
});
scene = new THREE.Scene();
scene.fog = new THREE.FogExp2( 0xaaccff, 0.0007 );
geometry = new THREE.PlaneGeometry( 20000, 20000, worldWidth - 1, worldDepth - 1 );
geometry.rotateX( - Math.PI / 2 );
for ( var i = 0, l = geometry.vertices.length; i < l; i ++ ) {
geometry.vertices[ i ].y = 35 * Math.sin( i / 2 );
}
var texture = new THREE.TextureLoader().load( `./images/water.jpg` );
texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set( 5, 5 );
material = new THREE.MeshBasicMaterial( { color: 0x0044ff, map: texture } );
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
renderer = new THREE.WebGLRenderer();
renderer.setClearColor( 0xaaccff );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
//
window.addEventListener( 'resize', onWindowResize, false );
}
function init() {
scene = new THREE.Scene();
var SCREEN_WIDTH = window.innerWidth, SCREEN_HEIGHT = window.innerHeight;
var VIEW_ANGLE = 75,
ASPECT = SCREEN_WIDTH / SCREEN_HEIGHT,
NEAR = 1,
FAR = 1000;
camera = new THREE.PerspectiveCamera(VIEW_ANGLE, ASPECT, NEAR, FAR);
camera.position.set(0,0,180);
camera.lookAt(scene.position);
scene.add(camera);
//RENDERER
renderer = new THREE.WebGLRenderer({antialias:true});
renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
container = document.getElementById('game-of-life');
document.body.style.margin = '0';
document.body.style.overflow = 'hidden';
container.appendChild(renderer.domElement);
renderer.setClearColor(params.colors.background);
// CONTROLS
controls = new OrbitControls(camera, renderer.domElement);
controls.minDistance = 110;
controls.maxDistance = 500;
controls.noKeys = true;
controls.noPan = true;
// LIGHT
var light = new THREE.PointLight(0xffffff);
light.position.set(10,50,100);
scene.add(light);
}
level.prepare(function(err) {
if(err) {
return console.error(err);
}
var definition = {
ObjectID: 0,
Rotation: 0,
x: 0,
y: 0,
z: 0,
};
scene.remove(model);
moveable = new Moveable(level, definition);
model = moveable.getModel();
model.scale.x = 0.1;
model.scale.y = -0.1;
model.scale.z = -0.1;
model.position.set(0, 0, 0);
scene.add(model);
global.moveable = moveable;
global.model = model;
});
let main = () => {
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(
75, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.z = 1000;
const geometry = new THREE.BoxGeometry(100, 100, 100);
const material = new THREE.MeshBasicMaterial(
{color: 0xff0000, wireframe: true, wireframeLinewidth: 3});
const x = -window.innerWidth / 2 + 300;
const y = window.innerHeight / 2 - 300;
const boxes = [];
for (let r = 0; r < 10; r++) {
let ry = y - r * 100;
for (let c = 0; c < 10; c++) {
let cx = x + c * 100;
const box = new THREE.Mesh(geometry, material);
box.position.set(cx, ry, 0);
boxes.push(box);
scene.add(box);
}
}
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
window.document.body.appendChild(renderer.domElement);
animate(boxes, renderer, scene, camera);
};
function createScene() {
var scene = new THREE.Scene();
var path = "img/cube/SwedishRoyalCastle/";
var format = '.jpg';
var urls = [
path + 'px' + format, path + 'nx' + format,
path + 'py' + format, path + 'ny' + format,
path + 'pz' + format, path + 'nz' + format
];
var reflectionCube = THREE.ImageUtils.loadTextureCube( urls );
reflectionCube.format = THREE.RGBFormat;
var refractionCube = new THREE.Texture( reflectionCube.image, new THREE.CubeRefractionMapping() );
refractionCube.format = THREE.RGBFormat;
var r = 10;
var sphereGeo = new THREE.SphereGeometry(r, 50, 50);
var colors = [
0x9e735f,
0xFFFFFF,
0x5babc2
];
var count = 5;
for (var i=0; i<count; i++) {
var c = colors[i%colors.length];
var sphere = new THREE.Mesh(
sphereGeo,
new THREE.MeshLambertMaterial({
color: c, envMap: reflectionCube,
combine: THREE.MixOperation, reflectivity: Math.random()*0.5,
shading:THREE.SmoothShading})
);
sphere.position.x = (i/count*2-1) * 55;
// sphere.position.z = (Math.random()*2-1)*100;
sphere.castShadow = true;
scene.add(sphere);
}
var ground = THREE.ImageUtils.loadTexture("img/ground.jpg");
ground.wrapS = THREE.RepeatWrapping;
ground.wrapT = THREE.RepeatWrapping;
ground.repeat.x = 15;
ground.repeat.y = 15;
var planeGeo = new THREE.PlaneGeometry(1000, 1000, 10, 10);
planeGeo.applyMatrix(new THREE.Matrix4().makeRotationX(-Math.PI/2));
var floor = new THREE.Mesh(
planeGeo, new THREE.MeshLambertMaterial({map:ground})
);
floor.position.y = -r;
floor.receiveShadow = true;
scene.add(floor);
addLights(scene);
return scene;
}
function init (width, height) {
const viewAngle = 45;
const aspect = width / height;
const near = 0.1;
const far = 10000;
const container = document.getElementById('app-container');
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(viewAngle, aspect, near, far);
renderer = new THREE.WebGLRenderer();
scene.add(camera);
camera.position.z = 300;
renderer.setSize(width, height);
container.appendChild(renderer.domElement);
scene.add(sphere);
const pointLight = new THREE.PointLight(0xFFFFFF);
pointLight.position.x = 10;
pointLight.position.y = 50;
pointLight.position.z = 130;
scene.add(pointLight);
render();
}
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.z = 1000;
geometry = new THREE.BoxGeometry( 200, 200, 200 );
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
canvas.getContext = function(canvas,options){
//webgl_null functions
return new webgl_null();
}
//renderer = new THREE.WebGLRenderer();
renderer = new THREE.WebGLRenderer({ canvas: canvas });
//renderer = new THREE.CanvasRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
//document.body.appendChild( renderer.domElement );
}
constructor(props) {
super(props);
this.rotation = 0;
const { width, height } = props.dimensions;
this.scene = new THREE.Scene();
this.camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 1000);
this.renderer = new THREE.WebGLRenderer({ alpha: true });
this.renderer.setSize(width, height);
const hemiLight = new THREE.HemisphereLight(0xffffff, 0xffffff, 0.6);
hemiLight.position.set(0, 500, 0);
this.scene.add(hemiLight);
const dirLight = new THREE.DirectionalLight(0xffffff, 1);
dirLight.position.set(-1, 0.75, 1);
dirLight.position.multiplyScalar(50);
dirLight.name = "dirlight";
this.scene.add(dirLight);
this.camera.position.y = 1;
this.camera.position.z = 3;
this.camera.lookAt(new THREE.Vector3(0, 0, 0));
this.objectGroup = new THREE.Group();
this.scene.add(this.objectGroup);
this.objLoader = new window.THREE.OBJLoader();
}
function init() {
camera = new THREE.PerspectiveCamera(55, window.innerWidth / window.innerHeight, 20, 3000);
camera.position.z = 1000;
scene = new THREE.Scene();
//init object to hold cubes and rotate
cubeHolder = new THREE.Object3D();
scene.add(cubeHolder);
//add light
var light = new THREE.PointLight(0xFFFFFF, 1);
light.position.set(1000, 1000, 1000);
scene.add(light);
//use lambert material to get greyscale shadows
var material = new THREE.MeshLambertMaterial();
//create cubes
var geometry = new THREE.BoxGeometry(100, 100, 100);
var spread = 2000;
for(var j = 0; j < 100; j++) {
var cube = new THREE.Mesh(geometry, material);
//randomize size, posn + rotation
cube.scale.x = cube.scale.y = cube.scale.z = Math.random() * 3 + .05;
cubeHolder.add(cube);
cube.position.x = Math.random() * spread - spread / 2;
cube.position.y = Math.random() * spread - spread / 2;
cube.position.z = Math.random() * spread - spread / 2;
cube.rotation.x = Math.random() * 2 * Math.PI - Math.PI;
cube.rotation.y = Math.random() * 2 * Math.PI - Math.PI;
cube.rotation.z = Math.random() * 2 * Math.PI - Math.PI;
}
//init renderer
renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
//POST PROCESSING
//Create Shader Passes
//render pass renders scene into effects composer
var renderPass = new THREE.RenderPass( scene, camera );
kaleidoPass = new THREE.ShaderPass( THREE.KaleidoShader );
//Add Shader Passes to Composer
//order is important
composer = new THREE.EffectComposer( renderer );
composer.addPass( renderPass );
composer.addPass( kaleidoPass );
//set last pass in composer chain to renderToScreen
kaleidoParams = {
sides: 12,
angle: 0.0
};
}
initializeLights() {
const directionalLight = new THREE.DirectionalLight( 0xffffff, 0.7 );
directionalLight.position.set(60, 60, 60);
this.scene.add(directionalLight);
const ambientLight = new THREE.AmbientLight(0x4B4B4B);
this.scene.add(ambientLight);
}
_initScene () {
this.scene = new THREE.Scene()
this.sceneOverlay = new THREE.Scene()
this.scene.add(this.earthquakes.root)
this.scene.add(this.volcanoes.root)
this.scene.add(this.crossSectionBox.root)
this.sceneOverlay.add(this.crossSectionBox.overlay)
}
// Needed for all graphs
selectGraph (graph) {
if (this.currentGraph !== undefined) {
this.scene.remove(this.currentGraph.view.container);
this.currentGraph.setCurrent(false);
}
this.scene.add(graph.view.container);
this.setCurrentGraph(graph);
}
function init(renderer, camera, scene) {
_quadCamera = new THREE.Camera();
_quadCamera.position.z = 1;
_particlesScene = new THREE.Scene();
_quadScene = new THREE.Scene();
_camera = camera;
_scene = scene;
_renderer = renderer;
_resolution = new THREE.Vector2();
_initGeometry();
_initDepthRenderTarget();
_initAdditiveRenderTarget();
_initBlurRenderTarget();
_particles = new THREE.Points(_particleGeometry, _additiveRenderTarget.material);
_particles.frustumCulled = false;
var geomtry = new THREE.PlaneBufferGeometry( 2, 2 );
var uniforms = THREE.UniformsUtils.merge([THREE.UniformsLib.ambient, THREE.UniformsLib.lights]);
uniforms.uDepth = {type: 't', value: _depthRenderTarget};
uniforms.uAdditive = {type: 't', value: _additiveRenderTarget};
uniforms.uResolution = {type: 'v2', value: _resolution};
uniforms.uCameraInverse = {type: 'm4', value: _camera.matrixWorld};
uniforms.uCameraRotationInverse = {type: 'm4', value: new THREE.Matrix4()};
uniforms.uProjectMatrix = {type: 'm4', value: _camera.projectionMatrix};
uniforms.uProjectMatrixInverse = {type: 'm4', value: new THREE.Matrix4()};
uniforms.uFogColor = {type: 'c', value: new THREE.Color()};
uniforms.uColor1 = {type: 'c', value: new THREE.Color()};
uniforms.uColor2 = {type: 'c', value: new THREE.Color()};
uniforms.uLightPosition = {type: 'v3', value: lights.mesh.position};
_particlesMaterial = new THREE.ShaderMaterial({
uniforms: uniforms,
transparent: true,
depthWrite: false,
vertexShader: shaderParse(glslify('../glsl/particles.vert')),
fragmentShader: shaderParse(glslify('../glsl/particles.frag'))
});
mesh = exports.mesh = new THREE.Mesh(geomtry, _particlesMaterial);
_quadScene.add(mesh);
_shadowMatrial = new THREE.ShaderMaterial( {
uniforms: {
uTexturePosition: {type: 't', value: null},
uParticleSize: { type: 'f', value: 1 }
},
vertexShader: shaderParse(glslify('../glsl/shadow.vert')),
fragmentShader: shaderParse(glslify('../glsl/shadow.frag')),
blending: THREE.NoBlending,
depthTest: true,
depthWrite: true
});
_particles.castShadow = true;
_particles.customDepthMaterial = _shadowMatrial;
}
componentDidMount() {
const width = this.mount.clientWidth
const height = this.mount.clientHeight
div.x = width
div.y = height
window.addEventListener("resize", this._updateDimensions);
const scene = new THREE.Scene()
const camera = new THREE.PerspectiveCamera(
60,
width / height,
0.1,
1000
)
const clock = new THREE.Clock();
camera.position.z = 8
const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true })
renderer.setClearColor(0xff00ff, 0)
renderer.setSize(width, height)
rend = renderer
let loader = new THREE.JSONLoader();
const material = new THREE.MeshBasicMaterial({ color: 0x4444ff })
const mat_air = new THREE.MeshStandardMaterial(
{ color: 0xffffff, roughness: 0.5, metalness: 0.8 })
const loading = loader.parse(model)
const loading2 = loader.parse(airplane)
let logo = new THREE.Mesh(loading.geometry, material);
let flight = new THREE.Mesh(loading2.geometry, mat_air);
let ambientLight = new THREE.AmbientLight(0xcccccc);
let pointBlue = new THREE.PointLight(0x003399, 5, 10);
pointBlue.position.set(0, 5, 0);
scene.add(logo)
scene.add(flight)
scene.add(ambientLight);
scene.add(pointBlue);
this.scene = scene
this.camera = camera
this.renderer = renderer
this.material = material
this.logo = logo
this.flight = flight
this.clock = clock
this.screen_x = 0
this.screen_y = 0
this.mount.appendChild(this.renderer.domElement)
this.start()
}
update(requiredWidth) {
const height = 1;
if (this.width < requiredWidth) {
let newWidth = requiredWidth;
L.info("required ", requiredWidth, ": changing", this.width, " -> ", newWidth);
this.width = newWidth;
/* cube and mesh */
if (exists(this.mesh)) {
this.scene.remove(this.mesh);
}
const vertices = new Float32Array(this.width * 3);
for (let i = 0; i < this.width; i++) {
vertices[i * 3] = -1 + (2 * i / this.width);
vertices[i * 3 + 1] = -0.5
vertices[i * 3 + 2] = -1;
}
const geom = new Three.BufferGeometry();
this.geom = geom;
geom.addAttribute('position', new Three.BufferAttribute(vertices, 3));
const indices = new Float32Array(this.width);
for (let i = 0; i < this.width; i++) {
indices[i] = i;
}
geom.addAttribute('idxP', new Three.BufferAttribute(indices, 1));
/* points */
this.pointData = new Float32Array(this.width * 3);
geom.addAttribute('point', new Three.BufferAttribute(this.pointData, 3));
/* p1 */
this.p1Data = new Float32Array(this.width * 3);
geom.addAttribute('p1', new Three.BufferAttribute(this.p1Data, 3));
/* p2 */
this.p2Data = new Float32Array(this.width * 3);
geom.addAttribute('p2', new Three.BufferAttribute(this.p2Data, 3));
/* scene */
this.scene.add(new Three.Points(geom, this.material));
/* render into texture */
if (exists(this.bufferTexture)) {
this.bufferTexture.dispose();
}
this.bufferTexture = new Three.WebGLRenderTarget(this.width, height, {
type: Three.FloatType
});
/* read back pixels */
this.outDistances = new Float32Array(4 * this.width);
}
}
exports.build = function(humanNotation, rotation) {
rotation = typeof rotation !== 'undefined' ? rotation : "[0,0,0]";
var rotationArray = JSON.parse(rotation);
scene = new THREE.Scene();
figure = new THREE.Object3D();
figure.useQuaternion = true;
figure.quaternion = new THREE.Quaternion();
figure.quaternion.setFromEuler(new THREE.Vector3(rotationArray[0] * Math.PI / 180, rotationArray[1] * Math.PI / 180, rotationArray[2] * Math.PI / 180));
scene.add(figure);
prisms = [];
var computerNotation = parseNotation(humanNotation);
// after adding a new prism its exit direction
// is cumulated in this quaternion to be used to
// orient the next prism
var Q = new THREE.Quaternion();
var previous = null;
for (var i = 0; i < computerNotation.length; i++) {
var mesh;
if (i % 2) {
mesh = THREE.SceneUtils.createMultiMaterialObject(geometryOdd, materialOdd);
} else {
if (useFirstColor === true && i === 0) {
mesh = THREE.SceneUtils.createMultiMaterialObject(geometryEven, materialFirst);
} else {
mesh = THREE.SceneUtils.createMultiMaterialObject(geometryEven, materialEven);
}
}
mesh.useQuaternion = true;
figure.add(mesh);
prisms.push(mesh);
mesh.quaternion.copy(Q);
mesh.updateMatrix();
Q.multiplyQuaternions(advanceQuaternion(mesh, computerNotation[i]), Q);
if (previous !== null) {
connectPrisms(previous, mesh);
}
previous = mesh;
}
// center each figure around 0,0,0
var positions = prisms.map(function(prism) {
return prism.position;
});
var center = computeCenter(positions);
prisms.forEach(function(prism) {
prism.position.sub(center);
});
setupCamera();
};
addModel(model) {
if (this.model !== null) {
this.scene.remove(this.model);
}
this.model = model;
this.scene.add(this.model);
}
module.exports = function (domContainer) {
"use strict";
var distance = 1000,
w = global.innerWidth,
h = global.innerHeight,
camera,
scene,
renderer;
camera = new THREE.PerspectiveCamera(30, w / h, 0.1, 100000000);
camera.up = new THREE.Vector3(0, 0, 1);
camera.useQuaternion = true;
camera.position.z = distance * 6;
scene = new THREE.Scene();
renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(w, h);
config.maxAnisotropy = renderer.getMaxAnisotropy();
registerHandlers(window);
domContainer.appendChild(renderer.domElement);
skyBox(scene, config.sky_box);
scene.add(new THREE.AmbientLight(0xCCCCCC));
// Populate the universe
universe(scene, camera);
animate();
function resizeHandler() {
w = window.innerWidth;
h = window.innerHeight;
camera.aspect = w / h;
camera.updateProjectionMatrix();
renderer.setSize(w, h);
}
function render() {
renderer.render(scene, camera);
}
function registerHandlers(window) {
window.addEventListener('resize', resizeHandler);
}
function animate() {
raf(animate);
TWEEN.update();
NEW_TWEEN.update();
render();
}
};
.factory('scene', () => {
var scene = new THREE.Scene();
var light1 = new THREE.DirectionalLight(new THREE.Color('white'));
light1.position.set(0, 0, 1);
scene.add(light1);
var light2 = new THREE.DirectionalLight(new THREE.Color('white'));
light2.position.set(0, 0, -1);
scene.add(light2);
return scene;
});
setSingleplayer() {
// prepare singleplayer mode
this.config.mode = MODE.SINGLEPLAYER;
this.scene.remove(this.table);
this.table = Table(this.scene, this.config);
this.resetTimeoutDuration = 1500;
this.hud.scoreDisplay.opponentScore.visible = false;
this.hud.scoreDisplay.lifeGroup.visible = true;
this.scene.getObjectByName('net-collider').visible = false;
}
createLight () {
const lightOne = new THREE.DirectionalLight(0xFFFFFF, 1)
const lightTwo = new THREE.DirectionalLight(0xFFFFFF, 1)
lightOne.position.set(1, 1, 1)
lightTwo.position.set(-1, -1, 1)
this.scene.add(lightOne)
this.scene.add(lightTwo)
}
this.addToOrthoScene = function(object) {
if (sceneOrtho == undefined)
sceneOrtho = new THREE.Scene();
if (cameraOrtho == undefined) {
cameraOrtho = new THREE.OrthographicCamera( - container.clientWidth / 2,
container.clientWidth / 2, container.clientHeight / 2, - container.clientHeight / 2, 1, 10 );
cameraOrtho.position.z = 10;
}
sceneOrtho.add(object)
}