sunstar

use

import {
    Scene,
    Camera,
    Renderer,
    Animation,
    Controls
} from "sunstar";

import {meshList} from './meshes'
import config from "./config";

Scene.binding(meshList)
Renderer.render(Scene, Camera)

document.body.appendChild( Renderer.domElement );

Animation()

config.controls && Controls();

// meshes.js
import { box, boxAnimation} from "../model/Box";

export const meshList = [
    [box, boxAnimation]
]

// box.js
import * as THREE from 'three';

const initBoxs = () => {
    const group = new THREE.Group()
    for (let i = 0; i < 10; i++) {
        for (let j = 0; j < 6; j++) {
            const geometry = new THREE.BoxGeometry( 6, 10, 10 );
            const material = new THREE.MeshBasicMaterial( {color: Math.random()*0xff0000} );
            const mesh = new THREE.Mesh( geometry, material );
            mesh.position.x = i*10
            mesh.position.y = j*20
            group.add(mesh)
        }
    }
    return group;
}

export const box = async () => {
    const group = new THREE.Group()
    const boxs = initBoxs()
    group.add(boxs)
    return group;
}
export const boxAnimation = function (){
    this.mesh.children.map((item)=>{
        item.children.map((iter,index)=>{
            iter.rotation.x += Math.random() / 10
            iter.rotation.y += Math.random() / 10
        })
    })
}