ppapi/examples/enumerate_devices/enumerate_devices.html

   1 <!DOCTYPE html>
   2 <html>
   3   <!--
   4   Copyright (c) 2012 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   <title>Enumerate Devices Example</title>
  10   <script type="text/javascript">
  11     var device_array = [];
  12     var enumerating = false;
  13
  14     function HandleMessage(message_event) {
  15       if (message_event.data) {
  16         var status = document.getElementById('status');
  17         if (message_event.data == 'EnumerationFailed') {
  18           status.innerText = 'Device enumeration failed!';
  19         } else {
  20           devices_data =
  21               message_event.data.substring('EnumerationSuccess'.length);
  22           if (devices_data.length > 0)
  23             device_array = devices_data.split('#__#');
  24           else
  25             device_array = [];
  26
  27           var list = document.getElementById('device_list');
  28           if (device_array.length == 0)
  29             list.innerHTML = 'No devices.';
  30           for (var i = 0; i < device_array.length; ++i) {
  31             var list_item = document.createElement('li');
  32             var span = document.createElement('span');
  33             span.innerText = device_array[i];
  34             list_item.appendChild(span);
  35             list.appendChild(list_item);
  36           }
  37           status.innerText = 'Device enumeration success!';
  38         }
  39         enumerating = false;
  40       }
  41     }
  42
  43     function EnumerateDevices(sync) {
  44       if (enumerating)
  45         return;
  46       enumerating = true;
  47       var status = document.getElementById('status');
  48       var plugin = document.getElementById('plugin');
  49       if (sync) {
  50         status.innerText = 'Enumerating devices sync...'
  51         plugin.postMessage('EnumerateDevicesSync');
  52       } else {
  53         status.innerText = 'Enumerating devices async...'
  54         plugin.postMessage('EnumerateDevicesAsync');
  55       }
  56     }
  57
  58     function Initialize() {
  59       var plugin = document.getElementById('plugin');
  60       plugin.addEventListener('message', HandleMessage, false);
  61       EnumerateDevices(true);
  62     }
  63
  64     document.addEventListener('DOMContentLoaded', Initialize, false);
  65   </script>
  66 </head>
  67
  68 <body>
  69   <embed id="plugin" type="application/x-ppapi-example-enumerate-devices"
  70       width=0 height=0 />
  71   <div>
  72     Press a link to enumerate video devices:
  73     <ul>
  74       <li><a href="javascript:EnumerateDevices(true)">Enumerate devices sync</a>
  75           (only implemented for out-of-process)</li>
  76       <li><a href="javascript:EnumerateDevices(false)">Enumerate devices async</a></li>
  77     </ul>
  78   </div>
  79   <div id="available_devices">
  80     Available device(s):
  81     <ul id="device_list">No devices.</ul>
  82   </div>
  83   <div>
  84     Status: <span id="status"></span>
  85   </div>
  86 </body>
  87 </html>