| <!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> |