Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
A intermediate step from the daily Dilbert polymer element tutorial
<link rel="import" href="../polymer/polymer.html">
An element for displaying the Deilbert Cartoon of the day.
@group Seed Elements
@element daily-dilbert
@demo demo/index.html
<dom-module id="daily-dilbert">
:host {
display: block;
box-sizing: border-box;
is: 'daily-dilbert',
properties: {
* `fancy` indicates that the element should don a monocle and tophat,
* while checking its pocket watch.
fancy: Boolean,
// Element Lifecycle
ready: function() {
// `ready` is called after all elements have been configured, but
// propagates bottom-up. This element's children are ready, but parents
// are not.
// This is the point where you should make modifications to the DOM (when
// necessary), or kick off any processes the element wants to perform.
attached: function() {
// `attached` fires once the element and its parents have been inserted
// into a document.
// This is a good place to perform any work related to your element's
// visual state or active behavior (measuring sizes, beginning animations,
// loading resources, etc).
detached: function() {
// The analog to `attached`, `detached` fires when the element has been
// removed from a document.
// Use this to clean up anything you did in `attached`.
// Element Behavior
* Sometimes it's just nice to say hi.
* @param {string} greeting A positive greeting.
* @return {string} The full greeting.
sayHello: function(greeting) {
var response = greeting || 'Hello World!';
return 'daily-dilbert says, ' + response;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.