native_client_sdk/src/examples/api/messaging/index.html

   1 <!DOCTYPE html>
   2 <html>
   3   <!--
   4   Copyright 2014 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 http-equiv="Pragma" content="no-cache">
  10   <meta http-equiv="Expires" content="-1">
  11   <title>{{title}}</title>
  12   <script type="text/javascript" src="common.js"></script>
  13   <script type ="text/javascript" src="example.js"></script>
  14 </head>
  15 <body {{attrs}}>
  16   <h1>{{title}}</h1>
  17   <h2>Status: <code id="statusField">NO-STATUS</code></h2>
  18   <p>This example demonstrates sending messages from JavaScript to the Native
  19      Client module, and from the Native Client module to JavaScript.</p>
  20   <p>There are two ways to do this: asynchronously and sychronously.</p>
  21   <p><code>postMessage()</code> sends a message from JavaScript to the module
  22      asynchronously. This means that the response must be handled in a callback.
  23   </p>
  24   <p><code>postMessageAndAwaitResponse()</code> sends a message synchronously.
  25      JavaScript execution is blocked while the module generates and sends back
  26      a response. The response from the module is returned from the call to
  27      <code>postMessageAndAwaitResponse()</code>, so no callback is necessary.
  28   </p>
  29   <p>Take a look at <code>example.js</code> to see the difference between these
  30   two methods.</p>
  31   <div>
  32     <div>
  33       <label for="addend1">1st Number:</label>
  34       <input type="number" id="addend1" value="123">
  35     </div>
  36     <div>
  37       <label for="addend2">2nd Number:</label>
  38       <input type="number" id="addend2" value="234">
  39     </div>
  40     <div>
  41       <label for="result">Sum:</label>
  42       <span id="result"></span>
  43     </div>
  44     <input type="button" id="addAsync" value="Add Asynchronously">
  45     <input type="button" id="addSync" value="Add Synchronously">
  46   </div>
  47   <div id="listener"></div>
  48 </body>
  49 </html>