JSFiddle - React, Tailwind, and code Playground

by Paul West

HTML

<script src="https://threejs.org/build/three.min.js"></script>

CSS

body {
  overflow: hidden;
  margin: 0;
}

JavaScript

var textureLoader = new THREE.TextureLoader();

        var texture = textureLoader.load('https://farm5.static.flickr.com/4071/4518701887_96b504cff8_b.jpg'); //, function(texture){}
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 10000);

        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(window.innerWidth, window.innerHeight);
        renderer.setClearColor(0x909090);
        document.body.appendChild(renderer.domElement);
        camera.position.z = 200;

        var mesh = new THREE.Mesh(new THREE.SphereBufferGeometry(300, 120, 80), new THREE.MeshBasicMaterial({
          map: texture
        }));
        mesh.scale.x = -1;
        scene.add(mesh);

        obb = new obj("cube", "sphere");
        obb.position.x = 0;
        obb.position.y = 0;
        scene.add(obb);


        var animate = function() {
          requestAnimationFrame(animate);

          obb.rotation.x += 0.01;
          obb.rotation.y += 0.01;

          renderer.render(scene, camera);
        };

        animate();



        function obj(to, ti, mo, mi, s, gap, rx, ry, rz) {
          var loader = new THREE.TextureLoader();
          var geosheld, geocore;
          if (to != undefined) this.to = to;
          else {
            this.to = "sphere";
          }
          if (ti != undefined) this.ti = ti;
          else {
            this.ti = "cube";
          }
          if (mo != undefined) this.mo = mo;
          else {
            this.mo = new THREE.MeshBasicMaterial({
              side: THREE.DoubleSide,
              transparent: true,
              opacity: 1,
              map: loader.load('https://lh3.googleusercontent.com/Mbtkbx4bMlKA_ztjEk6tbum9lwg6eH7mQgJDFO_8Wp2DCrhR9Cnf3b7p6DJy3kn4PA=w300')
            });
          }

          if (mi != undefined) this.mi = mi;
          else {
            this.mi = new THREE.MeshBasicMaterial({

              /*
    If I...