| <!DOCTYPE html> |
| <html> |
| <!-- |
| Copyright (c) 2013 The Chromium Authors. All rights reserved. |
| Use of this source code is governed by a BSD-style license that can be |
| found in the LICENSE file. |
| --> |
| <head> |
| <meta charset="UTF-8"> |
| |
| <title>Bullet Physics</title> |
| |
| <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,700"> |
| <link href="/static/css/out/site.css" rel="stylesheet"> |
| |
| |
| <script type="text/javascript" src="NaClAM.js"></script> |
| <script type="text/javascript" src="NaClAMBullet.js"></script> |
| <script type="text/javascript" src="//storage.googleapis.com/gonacl/pnacl-demo-bullet/three.min.js"></script> |
| <script type="text/javascript" src="scene.js"></script> |
| <script type="text/javascript" src="world.js"></script> |
| <script type="text/javascript" src="scenes.js"></script> |
| |
| </head> |
| |
| <body class="demo"> |
| |
| <header> |
| <h1>Bullet Physics</h1> |
| |
| </header> |
| |
| <section> |
| <div class="intro"> |
| <p> |
| An example of the <a href="http://bulletphysics.org/" |
| target="_blank">Bullet Physics SDK</a> ported to Native Client, |
| using WebGL for rendering. |
| </p> |
| <p class="note"> |
| Example courtesy <a href="http://www.johnmccutchan.com" |
| target="_blank">John McCutchan</a>. Read his <a |
| href="http://www.johnmccutchan.com/2012/10/bullet-native-client-acceleration-module.html" |
| target="_blank">description</a> of the demo or browse the <a |
| href="https://github.com/johnmccutchan/NaClAMBase" |
| target="_blank">source</a>. |
| <br> |
| </p> |
| <p class="note"> |
| Simulation Time: <span id="simulationTime">0</span>μs |
| <br> |
| FPS: <span id="fps">0</span> |
| </p> |
| |
| <div class="panel panel-info"> |
| |
| <h2>Controls</h2> |
| |
| <div class="panel-body"> |
| <ul> |
| <li><b>Click and drag</b> an object to move it</li> |
| <li><b>Click and drag</b> elsewhere to rotate the camera</li> |
| <li>Use the <b>mousewheel</b> to zoom in/out</li> |
| </ul> |
| </div> |
| |
| <h2>Add Objects</h2> |
| |
| <div class="panel-body"> |
| <button type="button" id="jenga10">Block Tower (10 blocks)</button> |
| <button type="button" id="jenga20">Block Tower (20 blocks)</button> |
| <button type="button" id="randomCube250">Random Cubes (250)</button> |
| <button type="button" id="randomCube1000">Random Cubes (1000)</button> |
| <button type="button" id="randomCube2000">Random Cubes (2000)</button> |
| <button type="button" id="randomCylinder500">Random Cylinders (500)</button> |
| <button type="button" id="randomShapes">Random Shapes</button> |
| <button type="button" id="reload">Reload Scene</button> |
| </div> |
| </div> |
| </div> |
| |
| <div class="Demo-body"> |
| |
| <div id="listener" class="Demo-content"> |
| <div id="rendererContainer"></div> |
| </div> |
| </div> |
| |
| <div id="loading-cover"> |
| <div id="message"> |
| <div id="statusField"></div> |
| <div id="progress" class="progress progress-striped active"> |
| <div id="progress-bar" class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%"> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
| |
| <script type="text/javascript" src="main.js"></script> |
| </body> |
| </html> |
