JSFiddle - React, Tailwind, and code Playground

by triangle_shifter

HTML

<script src="https://rawgit.com/mrdoob/three.js/dev/build/three.min.js"></script>
<script src="https://rawgit.com/cozmo/jsQR/master/dist/jsQR.js"></script>
<html lang="en">

  <head>
    <meta charset="UTF-8" />
    <title>Three.js example</title>
    <style>
      body {
        margin: 0;
      }

      canvas {
        width: 100%;
        height: 100%
      }

    </style>
    <!--  Three.js CDN  -->
  </head>

  <body>
    <!--  Our code  -->
    <script>
      var scene, camera, renderer;
      var cube;
      var sprite, texture;
      var cameraOrtho, sceneOrtho;
      var dpr = window.devicePixelRatio;
      var textureSize;
      var vector = new THREE.Vector2();
      var width, height;
      var bufferTexture, bufferScene;
      var pixelBuffer;
      init()


      function init() {
        width = window.innerWidth;
        height = window.innerHeight;
        textureSize = 256;
        // Create an empty scene
        scene = new THREE.Scene();

        // Create a basic perspective camera
        camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        camera.position.z = 4;

        // Create a renderer with Antialiasing
        renderer = new THREE.WebGLRenderer({
          antialias: true,
          alpha: true
        });

        // Configure renderer clear color
        renderer.setClearColor("#000000");
        renderer.autoClear = false;

        // Configure renderer size
        renderer.setSize(window.innerWidth, window.innerHeight);

        // Append Renderer to DOM
        document.body.appendChild(renderer.domElement);

        // Create a Cube Mesh with basic material
        var geometry = new THREE.BoxGeometry(1, 1, 1);
        var material = new THREE.MeshLambertMaterial({
          color: "#433F81"
        });
        cube = new THREE.Mesh(geometry, material);

        // Add cube to Scene
        scene.add(cube);
        var ambientLight = new THREE.AmbientLight(0xcccccc, 1);
       ...