1<!DOCTYPE html> 2<html> 3<!-- 4Copyright (c) 2013 The Chromium Authors. All rights reserved. 5Use of this source code is governed by a BSD-style license that can be 6found in the LICENSE file. 7--> 8<head> 9 <meta charset="UTF-8"> 10 <title>Rotating Cube</title> 11 <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,700"> 12 <link href="/static/styles/style.css" rel="stylesheet"> 13 <script type="text/javascript" src="example.js"></script> 14</head> 15<body class="demo"> 16 17 <header> 18 <h1>Rotating Cube</h1> 19 </header> 20 21 <section> 22 <div class="intro"> 23 <p> 24 An example showing rendering via OpenGLES2 in a Native Client module. 25 </p> 26 <p class="note"> 27 Note: the C++ source code of this demo is available in the Native Client SDK (<tt>examples/api/graphics_3d</tt>). 28 </p> 29 <p class="note"> 30 FPS: <span id="fps">0</span> 31 </p> 32 33 <div class="panel panel-info"> 34 <h2>Controls</h2> 35 <div class="panel-body"> 36 <table id="config" cellspacing="0" cellpadding="0"> 37 <tbody> 38 <tr> 39 <td class="name">X Angle:</td> 40 <td class="value"> 41 <input type="range" id="xAngle" min="0" max="360" step="1" 42 value="0"> 43 </td> 44 </tr> 45 <tr> 46 <td class="name">Y Angle:</td> 47 <td class="value"> 48 <input type="range" id="yAngle" min="0" max="360" step="1" 49 value="0"> 50 </td> 51 </tr> 52 <tr> 53 <td class="name">Animating:</td> 54 <td class="value"> 55 <label> 56 off 57 <input type="radio" id="animateOff" value="false"> 58 </label> 59 <label> 60 on 61 <input type="radio" id="animateOn" value="true" 62 checked="true"> 63 </label> 64 </td> 65 </tr> 66 </tbody> 67 </table> 68 </div> 69 </div> 70 </div> 71 72 <div class="Demo-body"> 73 <div id="listener" class="Demo-content"></div> 74 </div> 75 76 <div id="loading-cover"> 77 <div id="message"> 78 <div id="statusField"></div> 79 <div id="progress" class="progress progress-striped active"> 80 <div id="progress-bar" class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%"> 81 </div> 82 </div> 83 </div> 84 </div> 85 </div> 86 87 </section> 88 </div> 89</body> 90</html> 91