useragent.html | Explore in Territory

<!DOCTYPE html>
<html>
<!--
Copyright The Closure Library Authors. All Rights Reserved.

Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
  <title>goog.userAgent</title>
  <link rel="stylesheet" href="css/demo.css">
  <style>
    th {
      text-align: left;
      font-weight: normal;
    }

    thead th {
      text-align: left;
      font-size: 2em;
    }

    tbody td {
      text-align: center;
    }

    .container {
      margin: 1em 3em 1em 0;
      vertical-align: top;
    }

    .section {
      font-weight: bold;
      font-size: 1.2em;
      border-bottom: 1px solid #ccc;
      padding-top: 0.5em;
    }

    .no {
      background: #efefef;
    }

    .yes {
      background: #ddf8cc;
    }
  </style>

  <script src="../base.js"></script>
  <script>
    goog.require('goog.array');
    goog.require('goog.dom');
    goog.require('goog.dom.classlist');
    goog.require('goog.userAgent');
    goog.require('goog.userAgent.adobeReader');
    goog.require('goog.userAgent.iphoto');
    goog.require('goog.userAgent.jscript');
    goog.require('goog.userAgent.product');
    goog.require('goog.userAgent.product.isVersion');
    goog.require('goog.dom.TagName');
  </script>

</head>
<body>
  <h1>goog.userAgent</h1>

  <div class="goog-inline-block container">
    <table>
      <tbody id="browserFields">
      </tbody>
    </table>
  </div>

  <div class="goog-inline-block container">
    <table style="display:inline-table">
      <tbody id="featureFields">
      </tbody>
    </table>
  </div>


  <script>

  var platformFields = [
    'LINUX',
    'MAC',
    'WINDOWS',
    'X11',
    'PLATFORM'
  ];

  var rendererFields = [
    'GECKO',
    'IE',
    'OPERA',
    'WEBKIT',
    'VERSION'
  ];

  var productFields = [
    'ANDROID',
    'CHROME',
    'FIREFOX',
    'IE',
    'IPAD',
    'IPHONE',
    'OPERA',
    'SAFARI',
    'VERSION'
  ];

  // Public members in goog.userAgent.iphoto
  var iphotoFields = [
    'HAS_IPHOTO',
    'VERSION'
  ];

  // Public members in goog.userAgent.jscript
  var jscriptFields = [
    'HAS_JSCRIPT',
    'VERSION'
  ];

  // Public members in goog.userAgent.adobeReader
  var adobeReaderFields = [
    'HAS_READER',
    'SILENT_PRINT',
    'VERSION'
  ];

  /**
   * Adds a list of user-agent properties and their values to the output table.
   * @param {Element} parent The table body to append new rows to
   * @param {string} title The header for this table section
   * @param {Object} ns The Closure namespace to read properties from
   * @param {Array.<string>} A list of properties to read from that namespace
   */
  function addSection(parent, title, ns, properties) {
    goog.dom.appendChild(
        parent,
        goog.dom.createDom(goog.dom.TagName.TR,
                           null,
                           goog.dom.createDom(goog.dom.TagName.TH,
                                              {'colspan': 2, 'class': 'section'},
                                              title)));

    goog.array.forEach(
        properties,
        function(p) {
          addValue(parent, p.toLowerCase(), ns[p]);
        })
  }


  /**
   * Adds a name/value row to the table.
   * @param {Element} parent The table body to append the row to
   * @param {string} name The name of the property
   * @param {string|boolean} value The value to display
   */
  function addValue(parent, name, value) {
    var row = goog.dom.createElement('tr');
    goog.dom.appendChild(parent, row);

    var nameCell = goog.dom.createDom(goog.dom.TagName.TH, null, name);
    goog.dom.appendChild(row, nameCell);

    var valueCell = goog.dom.createElement('td');
    goog.dom.appendChild(row, valueCell);

    if (typeof value === 'boolean') {
      value = value ? 'yes' : 'no';
      goog.dom.setTextContent(valueCell, value);
      goog.dom.classlist.set(valueCell, value);
    } else {
      goog.dom.setTextContent(valueCell, value);
      if (!value) {
        goog.dom.classlist.set(valueCell, 'no');
      }
    }
  }


  var browser = goog.dom.getElement('browserFields');
  addSection(browser, 'Hardware Platform', goog.userAgent, platformFields);
  addSection(browser, 'Renderer', goog.userAgent, rendererFields);
  addSection(browser, 'Product', goog.userAgent.product, productFields);

  var features = goog.dom.getElement('featureFields');
  addSection(features, 'Adobe Reader Detection', goog.userAgent.adobeReader,
      adobeReaderFields);
  addSection(features, 'iPhoto Detection', goog.userAgent.iphoto, iphotoFields);
  addSection(features, 'Microsoft JScript', goog.userAgent.jscript,
      jscriptFields);

  </script>

</body>
</html>
chromium/third_party/google-closure-library/closure/goog/demos/useragent.html
