JSFiddle - React, Tailwind, and code Playground

by intrinsica

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>
<script src="https://cdn.jsdelivr.net/gh/freshfork/[email protected]/p5.easycam.min.js"></script>
<script src="https://unpkg.com/[email protected]"></script>

<div id="app">
  <p>{{ message }}</p>
</div>

JavaScript

const s = ( p ) => {

  p.setup =_=> {
    p.createCanvas(400, 400, p.WEBGL);
    p.createEasyCam({distance : 400});

    // prevent context menus
    document.oncontextmenu = function() { return false; };

    // set up Vue
    new Vue({
      el: '#app',
      data: {
        message: 'Hello Vue.js!'
      }
    })

    // demonstrates global namespace 'Dw' is accessible
    console.log(Dw.EasyCam.INFO);
  }
  p.draw =_=> {
    p.background(0);
    p.lights();
    p.box(100);
  }

};

let myp5 = new p5(s);