index.html revision f2477e01787aa58f445919b809d89e252beef54f
1<!DOCTYPE html> 2<html> 3 <!-- 4 Copyright (c) 2013 The Chromium Authors. All rights reserved. 5 Use of this source code is governed by a BSD-style license that can be 6 found in the LICENSE file. 7 --> 8 <head> 9 <meta charset="UTF-8"> 10 11 <title>Voronoi</title> 12 13 <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,700"> 14 <link href="/static/styles/style.css" rel="stylesheet"> 15 16 <script type="text/javascript" src="example.js"></script> 17 18 </head> 19 20 <body class="demo"> 21 22 <header> 23 <h1>Voronoi</h1> 24 25 </header> 26 27 <section> 28 <div class="intro"> 29 <p> 30 This demo renders the <a href="http://en.wikipedia.org/wiki/Voronoi" 31 target="_blank">Voronoi diagram</a> for a moving set of points 32 using a brute force technique. 33 </p> 34 <p class="note"> 35 Note: the C++ source code of this demo is available in the Native Client SDK (<tt>examples/demo/voronoi</tt>). 36 </p> 37 <p class="note"> 38 FPS: <span id="fps">0</span> 39 </p> 40 41 <div class="panel panel-info"> 42 43 <h2>Controls</h2> 44 45 <div class="panel-body"> 46 <table id="config" cellspacing="0" cellpadding="0"> 47 <tbody> 48 <tr> 49 <td class="name">Points:</td> 50 <td class="value"> 51 <input type="range" id="pointRange" min="1" max="1024" step="1" value="48"> 52 <label id="pointCount">48 points</label> 53 </td> 54 </tr> 55 <tr> 56 <td class="name">Thread Count:</td> 57 <td class="value"> 58 <select id="threadCount"> 59 <option value="0">Main Thread only</option> 60 <option value="1">1 Thread</option> 61 <option value="2" selected="selected">2 Threads</option> 62 <option value="4">4 Threads</option> 63 <option value="6">6 Threads</option> 64 <option value="8">8 Threads</option> 65 <option value="12">12 Threads</option> 66 <option value="24">24 Threads</option> 67 <option value="32">32 Threads</option> 68 </select> 69 </td> 70 </tr> 71 <tr> 72 <td class="name"><label for="drawPoints">Draw Points:</label></td> 73 <td class="value"> 74 <input type="checkbox" id="drawPoints" checked="checked"> 75 </td> 76 </tr> 77 <tr> 78 <td class="name"> 79 <label for="drawInteriors">Draw Interiors:</label> 80 </td> 81 <td class="value"> 82 <input type="checkbox" id="drawInteriors" checked="checked"> 83 </td> 84 </tr> 85 </tbody> 86 </table> 87 </div> 88 </div> 89 </div> 90 91 <div class="Demo-body"> 92 93 <div id="listener" class="Demo-content"></div> 94 </div> 95 96 <div id="loading-cover"> 97 <div id="message"> 98 <div id="statusField"></div> 99 <div id="progress" class="progress progress-striped active"> 100 <div id="progress-bar" class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%"> 101 </div> 102 </div> 103 </div> 104 </div> 105 </section> 106 107</body> 108</html> 109