public/index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Experiment</title>
  <meta name="author" content="Jochem Janssens">
  <meta name="description" content=" web-experiment met WebGL (Three.js) en javascript-socketing (socket.io)">
  <meta name="keywords" content="Jochem Janssens, Jochem, Janssens, Devine, WebGL, socket">
  <link rel="shortcut icon" type="image/png" href="assets/img/favicon.png"/>
  <meta name="theme-color" content="#F6BE57">
  <link rel="stylesheet" href="css/reset.css">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>
  <article class="explainer">
    <h1 class="explainer-title">experiment</h1>
    <p class="explainer-text">
      Welkom op dit web-experiment met WebGL (Three.js) en javascript-socketing (socket.io).
      Scan de QR code, leg hierna je GSM plat voor je, en probeer dan deze rond zijn assen te roteren en bekijk welk effect dit heeft op de vorm.
    </p>
    <div class="qrcode"></div>
    <p class="qr-text">
      scan de code om verder te gaan
    </p>
    <ul class="links">
      <li><a href="https://www.janssensjochem.be">janssensjochem.be</a></li>
      <li><a href="https://github.com/jochemjanssens/webgl-experiments">Github</a></li>
    </ul>
  </article>
  <div id="world"></div>

  <script type="text/javascript" src="js/three.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>
  <script type="text/javascript" src="js/qrcode.js"></script>
  <script src="https://js.leapmotion.com/leap-0.6.4.min.js"></script>
  <script type="text/javascript" src="js/script.js"></script>
  <script>
    WebFontConfig = {
      custom: {
        families: ['Branding'],
        urls: ['assets/fonts/branding.css']
      }
    };

    (function(d) {
      var wf = d.createElement('script'), s = d.scripts[0];
      wf.async = true;
      wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.16/webfont.js';
      s.parentNode.insertBefore(wf, s);
    })(document);
  </script>
</body>