inner.html 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <!DOCTYPE html>
  2. <html>
  3. <!--
  4. Copyright 2010 The Closure Library Authors. All Rights Reserved.
  5. Use of this source code is governed by the Apache License, Version 2.0.
  6. See the COPYING file for details.
  7. -->
  8. <head>
  9. <script type="text/javascript" src="../../../base.js"></script>
  10. <script type="text/javascript">
  11. goog.require('goog.dom');
  12. goog.require('goog.dom.TagName');
  13. goog.require('goog.events');
  14. goog.require('goog.net.xpc.CrossPageChannel');
  15. </script>
  16. <script type="text/javascript">
  17. var channel;
  18. var logEl;
  19. /**
  20. * Writes a message to the log.
  21. * @param {string} msg The message text.
  22. */
  23. function log(msg) {
  24. logEl || (logEl = goog.dom.getElement('log'));
  25. var msgEl = goog.dom.createDom(goog.dom.TagName.DIV);
  26. msgEl.innerHTML = msg;
  27. logEl.insertBefore(msgEl, logEl.firstChild);
  28. }
  29. goog.events.listen(window, 'load', function() {
  30. // Get the channel configuration from the URI parameter.
  31. var cfg = goog.json.parse(
  32. (new goog.Uri(window.location.href)).getParameterValue('xpc'));
  33. // Create the channel.
  34. channel = new goog.net.xpc.CrossPageChannel(cfg);
  35. channel.registerService('log', log);
  36. channel.connect(function() {
  37. log('Channel connected.');
  38. });
  39. });
  40. </script>
  41. <style type="text/css">
  42. body {
  43. background-color: #ddffff;
  44. font-family: arial,verdana;
  45. font-size: 12px;
  46. }
  47. </style>
  48. </head>
  49. <body>
  50. <h3><script type="text/javascript">document.write(location.href.replace(/\?.*/,'?...'))</script></h3>
  51. <p>
  52. <input type="text" id="msgInput" value="Hello from the iframe."
  53. style="width:250px">
  54. <input type="button" value="Send" onclick="
  55. channel.send('log', goog.dom.getElement('msgInput').value)">
  56. </p>
  57. <div id="log" style="border: 1px #000 solid"></div>
  58. </body>
  59. </html>