chao
/
mini_cocopi


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
							<!DOCTYPE html>
<html>
<!--
Copyright 2010 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.ui.CharPicker</title>
  <meta charset=utf-8>
  <!-- common css used by all closure demos; not required for char picker -->
  <link rel="stylesheet" href="css/demo.css">

  <!-- used only for button in this page; not required for char picker-->
  <link rel="stylesheet" href="../css/menubutton.css">

  <!-- only required css for char picker -->
  <link rel="stylesheet" href="../css/charpicker.css">

  <script src="../base.js"></script>
  <script>
    goog.require('goog.i18n.CharPickerData');
    goog.require('goog.i18n.uChar.LocalNameFetcher');
    goog.require('goog.ui.CharPicker');
  </script>

  <style>
    #p1_value {
      color: red;
      font-weight: bold;
      font-size: large;
    }

    p {
      height: 2em;
    }
  </style>
</head>

<body>
  <h1>goog.ui.CharPicker</h1>
  <p>You have selected: <span id="p1_value">none</span>
  <div id="char-picker"></div>

  <script>
    var picker = new goog.ui.CharPicker(new goog.i18n.CharPickerData(),
        new goog.i18n.uChar.LocalNameFetcher(),
        ["\uD869\uDED6", "a", "b", "c"], 10, 1);
    var el = goog.dom.getElement('char-picker');
    picker.decorate(el);

    // Action on selection
    var selectionAction = function() {
      goog.dom.setTextContent(goog.dom.getElement('p1_value'),
          picker.getSelectedChar());
    };

    // Get selected locale from the char picker.
    goog.events.listen(picker, 'action', function(e) { selectionAction(); });
  </script>
  <p>
    <input type="button" value="Dispose" onclick="picker.dispose()">
  </p>
</body>
</html>