Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(302)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: native_client_sdk/src/gonacl_appengine/static/pnacl-demo/index.html

Issue 22503002: [NaCl SDK] Earth demo modifications for gonacl PNaCl. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: merge master Created 7 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « native_client_sdk/src/gonacl_appengine/static/pnacl-demo/example.js ('k') | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: native_client_sdk/src/gonacl_appengine/static/pnacl-demo/index.html
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo/index.html b/native_client_sdk/src/gonacl_appengine/static/pnacl-demo/index.html
index 2e7632c2bf2de6f4fbdd318ae275b240e787a884..18a230ad94cbb9c24821efa98a2b661315eecce5 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/pnacl-demo/index.html
@@ -9,68 +9,142 @@ found in the LICENSE file.
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">
<meta charset="UTF-8">
- <title>Multi-Threaded Earth Demo</title>
+ <title>Multi-Threaded Raycasted Earth</title>
<script type="text/javascript" src="example.js"></script>
+ <style>
+ body {
+ font-family: "Helvetica Neue", Arial, sans-serif;
+ }
+ .absolute-fill-parent {
+ position: relative;
+ }
+ .absolute-fill {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ }
+ .flex-container {
+ display: flex;
+ }
+ .main {
+ background-color: #000;
+ flex: 1;
+ position: relative;
+ }
+ .flex-column {
+ flex-direction: column;
+ justify-content: center;
+ }
+ #message {
+ text-align: center;
+ width: 100%;
+ }
+ #statusField {
+ display: none;
+ color: #fff;
+ font-size: 34px;
+ text-align: center;
+ width: 100%;
+ }
+ #progress {
+ display: none;
eliben 2013/08/07 19:46:47 With this display: none, the progress bar is not w
binji 2013/08/07 21:23:40 Strange, I just tried it and I saw the progress ba
+ margin: auto;
+ width: 300px;
+ }
+ #nacl_module {
+ height: 100%;
+ width: 100%;
+ }
+ .sidebar {
+ padding: 0 8px;
+ overflow-y: auto;
+ width: 350px;
+ }
+ #config {
+ width: 100%;
+ }
+ #config .name {
+ font-weight: bold;
+ padding-right: 8px;
+ text-align: right;
+ white-space: nowrap;
+ width: 1px;
+ }
+ #threadCount, #lightRange, #zoomRange {
+ width: 100%;
+ }
+ .small {
+ font-size: 12px;
+ }
+ </style>
</head>
<body data-name="earth" data-width="480" data-height="480">
- <h1>Multi-Threaded Earth Demo</h1>
- <div id="progress_div">
- Load progress: <progress id="progress"></progress>
- </div>
- <div id="statusField"></div>
- <br/>
- <div id="config-demo">
- <br/>
- Zoom:
- <input type="range" id="zoomRange"
- min="1.0" max="50.0" step="0.5" value="14.0" />
- Light:
- <input type="range" id="lightRange"
- min="0.2" max="2.0" step=".01" value="1.0" />
- <br/>
- Number of worker threads (0 means rendering is done in the main thread):
- <br/>
- <input type="radio" name="threadCount" id="radio0" value="0"
- checked="checked">
- <label for="radio0">0</label>
- <input type="radio" name="threadCount" id="radio1" value="1">
- <label for="radio1">1</label>
- <input type="radio" name="threadCount" id="radio2" value="2">
- <label for="radio2">2</label>
- <input type="radio" name="threadCount" id="radio3" value="4">
- <label for="radio3">4</label>
- <input type="radio" name="threadCount" id="radio4" value="6">
- <label for="radio4">6</label>
- <input type="radio" name="threadCount" id="radio5" value="8">
- <label for="radio5">8</label>
- <input type="radio" name="threadCount" id="radio6" value="12">
- <label for="radio6">12</label>
- <input type="radio" name="threadCount" id="radio7" value="16">
- <label for="radio7">16</label>
- <input type="radio" name="threadCount" id="radio8" value="24">
- <label for="radio8">24</label>
- <input type="radio" name="threadCount" id="radio9" value="32">
- <label for="radio9">32</label>
- <br/><br/>
- <label id="result" name="result"> </label>
- </div>
- <div id="listener"></div>
- <br/>
- <div id="auxnotes">
- Note: the C++ source code of this demo is available in the Native
- Client SDK (<tt>examples/demo/earth</tt>).
- <br/><br/>
- Image Credit:
- <br/>
- NASA Goddard Space Flight Center Image by Reto Stöckli (land surface,
- shallow water, clouds). Enhancements by Robert Simmon (ocean color,
- compositing, 3D globes, animation).
- <br/>
- Data and technical support: MODIS Land Group; MODIS Science Data,
- Support Team; MODIS Atmosphere Group; MODIS Ocean Group Additional data:
- USGS EROS Data Center (topography); USGS Terrestrial Remote Sensing
- Flagstaff Field Center (Antarctica); Defense Meteorological
- Satellite Program (city lights).
+ <div class="absolute-fill flex-container">
+ <div class="main absolute-fill-parent">
+ <div class="absolute-fill flex-container flex-column">
+ <div id="message">
+ <div id="statusField"></div>
+ <progress id="progress"></progress>
+ </div>
+ </div>
+ <div id="listener" class="absolute-fill"></div>
+ </div>
+ <div class="sidebar">
+ <h1>Multi-Threaded Raycasted Earth</h1>
+ <table id="config">
+ <tbody>
+ <tr>
+ <td class="name">Thread Count:</td>
+ <td class="value">
+ <select id="threadCount">
+ <option value="0">Main Thread only</option>
+ <option value="1">1 Thread</option>
+ <option value="2">2 Threads</option>
eliben 2013/08/07 19:46:47 Please set selected="selected" here, on 2 threads
binji 2013/08/07 21:23:40 OK, though I'm not certain this will work without
+ <option value="4">4 Threads</option>
+ <option value="6">6 Threads</option>
+ <option value="8">8 Threads</option>
+ <option value="12">12 Threads</option>
+ <option value="24">24 Threads</option>
+ <option value="32">32 Threads</option>
+ </select>
+ </td>
+ </tr>
+ <tr>
+ <td class="name">Zoom:</td>
+ <td class="value">
+ <input type="range" id="zoomRange"
+ min="1.0" max="50.0" step="0.5" value="14.0">
+ </td>
+ </tr>
+ <tr>
+ <td class="name">Light:</td>
+ <td class="value">
+ <input type="range" id="lightRange"
+ min="0.2" max="2.0" step=".01" value="1.0">
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ <p class="small">
+ Note: the C++ source code of this demo is available in the Native
+ Client SDK (<tt>examples/demo/earth</tt>).
+ </p>
+ <p class="small">
+ Image Credit:
+ <br/>
+ NASA Goddard Space Flight Center Image by Reto Stöckli (land
+ surface, shallow water, clouds). Enhancements by Robert Simmon
+ (ocean color, compositing, 3D globes, animation).
+ <br/>
+ Data and technical support: MODIS Land Group; MODIS Science Data,
+ Support Team; MODIS Atmosphere Group; MODIS Ocean Group Additional
+ data: USGS EROS Data Center (topography); USGS Terrestrial Remote
+ Sensing Flagstaff Field Center (Antarctica); Defense Meteorological
+ Satellite Program (city lights).
+ </p>
+ </div>
</div>
</body>
</html>
« no previous file with comments | « native_client_sdk/src/gonacl_appengine/static/pnacl-demo/example.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698