third_party/polymer/components-chromium/core-signals/demo.html

   1 <!--
   2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
   3 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
   4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
   5 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
   6 Code distributed by Google as part of the polymer project is also
   7 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
   8 -->
   9 <!doctype html>
  10 <html>
  11 <head>
  12
  13 <title></title>
  14
  15 <script src="../webcomponentsjs/webcomponents.js"></script>
  16
  17 <link rel="import" href="core-signals.html">
  18
  19 </head>
  20 <body>
  21
  22 <my-element></my-element>
  23 <my-app></my-app>
  24
  25 <polymer-element name="my-element">
  26 <template>
  27   Hello
  28 </template>
  29 <script>
  30   Polymer('my-element', {
  31     ready: function() {
  32       this.asyncFire('core-signal', {name: "foo", data: "Foo!"});
  33     }
  34   });
  35 </script>
  36 </polymer-element>
  37
  38 <polymer-element name="my-app">
  39 <template>
  40   <core-signals on-core-signal-foo="{{fooSignal}}"></core-signals>
  41   <content></content>
  42 </template>
  43 <script>
  44   Polymer('my-app', {
  45     fooSignal: function(e, detail, sender) {
  46       this.innerHTML += '<br>[my-app] got a [' + detail + '] signal<br>';
  47     }
  48   });
  49 </script>
  50 </polymer-element>
  51
  52 </body>
  53 </html>