texture

camera = new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,0.1,10000);
        camera.position.y = 150;
        camera.position.z = 150;


        scene = new THREE.Scene();

        // texture

        let manager = new THREE.LoadingManager();
        manager.onProgress = (item,loaded, data)=>{
            console.log(item,loaded,data);
        };

        let texture = new THREE.Texture();
        let material = new THREE.MeshBasicMaterial({color:0x122319});

        let onProgress = (xhr)=>{
            if (xhr.lengthComputable) {
                let percentComplete = xhr.loaded/xhr.total*100;
                console.log(`${Math.round(percentComplete,2)}% loaded`);
            }
        };

        let onError = (xhr)=>{
            console.log(xhr);
        };

        // model

        let loader = new THREE.BabylonLoader(manager);
        loader.load('./skull.babylon', (babylonScene)=>{
           babylonScene.traverse((obj)=>{
               if (obj instanceof THREE.Mesh) {
                   obj.material = new THREE.MeshPhongMaterial({
                       color: Math.random()*0xffffff
                   });
                   obj.position.x = 10;
                   obj.position.y = 50;
                   obj.position.z = 0;
                   scene.add(obj);
               }

           });
           //scene = babylonScene;
           /*
            setTimeout(()=>{
                console.log(scene);
            },5000);
            */
           animate();
        }, onProgress, onError);


        // grid

        let size = 500, step = 50;

        let lineGeometry = new THREE.Geometry();

        for ( var i = - size; i <= size; i += step ) {

            lineGeometry.vertices.push( new THREE.Vector3( - size, 0, i ) );
            lineGeometry.vertices.push( new THREE.Vector3(   size, 0, i ) );

            lineGeometry.vertices.push( new THREE.Vector3( i, 0, - size ) );
            lineGeometry.vertices.push( new THREE.Vector3( i, 0,   size ) );

        }

        let lineMaterial = new THREE.LineBasicMaterial( {
            color: 0x000000, opacity: 0.2, transparent: true }
            );

        let line = new THREE.LineSegments( lineGeometry, lineMaterial );
        let axisHelper = new THREE.AxisHelper(500);
        scene.add(axisHelper);
        scene.add( line );

        // light

        let light = new THREE.DirectionalLight(0xaabbff,0.8);
        light.position.x = 20;
        light.position.y = 30;
        light.position.z = 300;
        scene.add(light);

        light = new THREE.DirectionalLight(0xaabbff,0.8);
        light.position.x = -320;
        light.position.y = -330;
        light.position.z = 300;
        scene.add(light);



        renderer = new THREE.WebGLRenderer({antialias:true});
        renderer.setSize(window.innerWidth,window.innerHeight);
        renderer.setClearColor( 0xf0f0f0 );
        renderer.setPixelRatio( window.devicePixelRatio );
        document.body.appendChild(renderer.domElement);

        let controls = new THREE.OrbitControls(camera, renderer.domElement);

        stats=new Stats();
        document.body.appendChild(stats.dom);

        window.addEventListener( 'resize', ()=>{

            camera.aspect = window.innerWidth / window.innerHeight;
            camera.updateProjectionMatrix();

            renderer.setSize( window.innerWidth, window.innerHeight );

        }, false );