hax-stax.html

<link rel="import" href="../polymer/polymer.html">

<!--
 `hax-stax`
Register a stax with HAX store.

@demo demo/index.html

@microcopy - the mental model for this element
 - stax - a stack of haxElement definitions that are named. Similar to a template in WYSIWYGs.
 - data - this is the stax data model which expresses itself to hax

@example data call
```
[{
  "details": {
    "title": "Example text and meme",
    "image": "example-meme.jpg",
    "author": "ELMS:LN",
    "description": "A well organized example list of objectives.",
    "status": "available",
    "rating": "0",
    "tags": ["instructional design", "list"]
  },
  "stax": [
    {
      "tag": "p",
      "properties": {},
      "content": "It is an ethical imperative that we seek the fundamental transformation of higher education to maximize quality and access to knowledge. This transformation will empower the globe to increase empathy, maximize personal freedom and personal growth through increased educational equality."
    },
    {
      "tag": "meme-maker",
      "properties": {
        "image-url": "https://media1.giphy.com/media/3o7TKMOy5zz1nuD71u/giphy.gif",
        "alt": "sun moon GIF by Amy Ciavolino",
        "top-text": "Sup, suuuuuun?",
        "bottom-text": "Hax, Moon. Hax."
      },
      "content": ""
    }
  ]
}]

```

-->


<dom-module id="hax-stax">
  <style>
    :host {
      display:none;
    }
  </style>
  <template>
  </template>

  <script>
    Polymer({

      is: 'hax-stax',
      properties: {
        /**
         * The data model.
         */
        data: {
          type: Object,
        },
      },
      /**
       * ON attached life-cycle, meaning it's in the body most likely, then fire registration.
       */
      attached: function() {
        if (typeof this.data !== typeof undefined) {
          this.fire('hax-register-stax', this.data);
        }
      },
    });
  </script>
</dom-module>