OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" |
| 2 "http://www.w3.org/TR/html4/strict.dtd"> |
| 3 <html> |
| 4 <!-- |
| 5 Copyright (c) 2010 The Native Client Authors. All rights reserved. |
| 6 Use of this source code is governed by a BSD-style license that can be |
| 7 found in the LICENSE file. |
| 8 --> |
| 9 <head> |
| 10 <title>Hello, World!</title> |
| 11 |
| 12 <script type="text/javascript"> |
| 13 time = new Date().getTime() |
| 14 hello_world = null; // Global application object. |
| 15 status_text = 'NO-STATUS'; |
| 16 |
| 17 function moduleDidLoad() { |
| 18 time = new Date().getTime() - time |
| 19 hello_world = document.getElementById('hello_world'); |
| 20 updateStatus('SUCCESS' + ' ' + time + 'ms'); |
| 21 } |
| 22 |
| 23 // If the page loads before the Native Client module loads, then set the |
| 24 // status message indicating that the module is still loading. Otherwise, |
| 25 // do not change the status message. |
| 26 function pageDidLoad() { |
| 27 if (hello_world == null) { |
| 28 updateStatus('LOADING...'); |
| 29 } else { |
| 30 // It's possible that the Native Client module onload event fired |
| 31 // before the page's onload event. In this case, the status message |
| 32 // will reflect 'SUCCESS', but won't be displayed. This call will |
| 33 // display the current message. |
| 34 updateStatus(); |
| 35 } |
| 36 } |
| 37 |
| 38 function fortytwo() { |
| 39 try { |
| 40 alert(hello_world.fortytwo()); |
| 41 } catch(e) { |
| 42 alert(e.message); |
| 43 } |
| 44 } |
| 45 |
| 46 function helloworld() { |
| 47 try { |
| 48 alert(hello_world.helloworld()); |
| 49 } catch(e) { |
| 50 alert(e.message); |
| 51 } |
| 52 } |
| 53 |
| 54 // Set the global status message. If the element with id 'status_field' |
| 55 // exists, then set its HTML to the status message as well. |
| 56 // opt_message The message test. If this is null or undefined, then |
| 57 // attempt to set the element with id 'status_field' to the value of |
| 58 // |status_text|. |
| 59 function updateStatus(opt_message) { |
| 60 if (opt_message) |
| 61 status_text = opt_message; |
| 62 var status_field = document.getElementById('status_field'); |
| 63 if (status_field) { |
| 64 status_field.innerHTML = status_text; |
| 65 } |
| 66 } |
| 67 </script> |
| 68 </head> |
| 69 <body onload="pageDidLoad()"> |
| 70 |
| 71 <h1>Native Client Simple Module</h1> |
| 72 <p> |
| 73 <button onclick="fortytwo()">Call fortytwo()</button> |
| 74 <button onclick="helloworld()">Call helloworld()</button> |
| 75 |
| 76 <!-- For development, use a #develop location, which loads the develop |
| 77 version of the module. |
| 78 --> |
| 79 </p> |
| 80 <div id="nacl_helloworld_content"></div> |
| 81 |
| 82 <script type="text/javascript"> |
| 83 contentDiv = document.getElementById('nacl_helloworld_content'); |
| 84 if (window.location.hash == '#develop') { |
| 85 // Load the develop version of the module. |
| 86 contentDiv.innerHTML = '<embed name="nacl_module" ' |
| 87 + 'id="hello_world" ' |
| 88 + 'width=0 height=0 ' |
| 89 + 'type="pepper-application/hello_world" />'; |
| 90 moduleDidLoad(); |
| 91 } else { |
| 92 // Load the published .nexe. This includes the 'nexes' attribute which |
| 93 // shows how to load multi-architecture modules. Each entry in the |
| 94 // table is a key-value pair: the key is the runtime ('x86-32', |
| 95 // 'x86-64', etc.); the value is a URL for the desired NaCl module. |
| 96 var nexes = 'x86-32: hello_world_x86_32.nexe\n' |
| 97 + 'x86-64: http://localhost:4444/service?arch=x86-64&url=' |
| 98 + 'localhost%3A4445/hello_world.nexe.bc\n' |
| 99 + 'ARM: hello_world_arm.nexe '; |
| 100 contentDiv.innerHTML = '<embed name="nacl_module" ' |
| 101 + 'id="hello_world" ' |
| 102 + 'width=0 height=0 ' |
| 103 // + 'nexes="' + nexes + '" ' |
| 104 + 'type="application/x-nacl-srpc" ' |
| 105 + 'onload=moduleDidLoad() />'; |
| 106 // Note: this code is here to work around a bug in Chromium build |
| 107 // #47357. See also |
| 108 // http://code.google.com/p/nativeclient/issues/detail?id=500 |
| 109 document.getElementById('hello_world').nexes = nexes; |
| 110 } |
| 111 </script> |
| 112 |
| 113 |
| 114 <p>If the module is working correctly, a click on the "Call fortytwo" button |
| 115 should open a popup dialog containing <b>42</b> as value.</p> |
| 116 |
| 117 <p> Clicking on the "Call helloworld" button |
| 118 should open a popup dialog containing <b>hello, world</b> as value.</p> |
| 119 |
| 120 <h2>Status</h2> |
| 121 <div id="status_field">NO-STATUS</div> |
| 122 </body> |
| 123 </html> |
OLD | NEW |