createGlRenderer

index83
let camera, glScene, glRenderer, composer

let angle = 0,
    speed = 0.03,
    radius = 1,
    numLights = 10,
    slice = Math.PI * 2 / numLights,
    lights = [];

let coreData = {
    radius: 0.8,
    detail: 1
};

let lightData = {
    radius: 0.05,
    intensity: 1
}

let isMouseMoving = false

function createGlRenderer() {
    let glRenderer = new THREE.WebGLRenderer({antialias: true})

    glRenderer.setSize(window.innerWidth, window.innerHeight)
    glRenderer.setPixelRatio(window.devicePixelRatio)
    glRenderer.setClearColor('#222222')

    return glRenderer
}

function initialize() {
    camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000)
    camera.position.z = 3;

    glRenderer = createGlRenderer()
    document.body.appendChild(glRenderer.domElement)

    glScene = new THREE.Scene()

    var coreGeom = new THREE.IcosahedronGeometry(coreData.radius, coreData.detail);
    var coreMat = new THREE.MeshPhongMaterial({
        flatShading: true
    });
    var core = new THREE.Mesh(coreGeom, coreMat);
    core.name = 'core';
    glScene.add(core);

    var lightsRing = new THREE.Object3D();
    lightsRing.name = 'lightsRing';
    glScene.add(lightsRing);

    for (let i = 0; i < numLights; i++) {
        let color = new THREE.Color(Math.random(), Math.random(), Math.random());
        let posx = Math.cos(slice * i) * radius;
        let posy = Math.sin(slice * i) * radius;

        let light = getPointLightObject(posx, posy, 0, lightData.radius, color);
        lights.push(light);
        lightsRing.add(light);
    }

    var directional = [];
    directional[0] = new THREE.DirectionalLight(0xffffff, 0.1);
    directional[0].position.set(1, 0, 0);
    directional[1] = new THREE.DirectionalLight(0xffffff, 0.1);
    directional[1].position.set(0.75, 1, 0.5);
    directional[2] = new THREE.DirectionalLight(0xffffff, 0.1);
    directional[2].position.set(-0.75, -1, 0.5);

    glScene.add(directional[0]);
    glScene.add(directional[1]);
    glScene.add(directional[2]);

    update()
}

function update() {
    glRenderer.render(glScene, camera);

    var lightsRing = glScene.getObjectByName('lightsRing');
    lightsRing.rotation.x += speed;
    lightsRing.rotation.y += speed;
    lightsRing.rotation.z += speed;

    var core = glScene.getObjectByName('core');
    core.rotation.x += .0002;
    core.rotation.y += .0001;
    core.rotation.z += .0001;

    window.requestAnimationFrame(update)
}

window.addEventListener('resize', () => {
    let width = window.innerWidth
    let height = window.innerHeight
    glRenderer.setSize(width, height)
    camera.aspect = width / height
    camera.updateProjectionMatrix()
})

window.addEventListener('mousemove', () => {
    isMouseMoving = true
});

window.addEventListener('DOMContentLoaded', initialize, false)

function getLightObject(x, y, z, color) {
    var light = new THREE.PointLight(
        color,
        lightData.intensity
    );
    light.position.x = x;
    light.position.y = y;
    return light;
}

function getSphereObject(radius, color) {
    var geom = new THREE.SphereGeometry(radius, 30, 30);
    var mat = new THREE.MeshBasicMaterial({
        color: color
    });
    var sphere = new THREE.Mesh(geom, mat);
    return sphere;
}

function getPointLightObject(x, y, z, radius, color) {
    var light = getLightObject(x, y, z, color);
    var point = getSphereObject(radius, color);

    light.add(point);
    return light;
}

function updateGroupGeometry(mesh, geometry) {
    mesh.geometry.dispose();
    mesh.geometry = geometry;
}