<link rel="import" href="../catalog-data/catalog-data.html">

<dom-module id="catalog-guide">
  <template>
    <catalog-data guide-map="{{_guides}}"></catalog-data>
    <iron-ajax id="req" auto url="[[src]]" method="get" handle-as="text" last-response="{{content}}" on-error="_didReceiveError"></iron-ajax>
  </template>
</dom-module>
<script>
  Polymer({
    is: 'catalog-guide',
    properties: {
      name: {type: String, notify: true},
      _guides: {type: Object, notify: true},

      data: {type: Object, notify: true, computed: 'getData(_guides,name)'},
      src: {type: String, notify: true, computed: 'getSrc(name)'},
      content: {type: String, notify: true}
    },
    getData: function(_guides,name) {
      if (!_guides) return;
      return _guides[name];
    },
    getSrc: function(name) {
      return "/data/guides/" + name + ".html";
    },
    _didReceiveError: function(e) {
      this.fire('catalog-guide-error', e.detail);
    }
  });
</script>