/** @jsx React.DOM */

var UnreadCount = React.createClass({
  getInitialState: function() {
    return {
      unreadCount: {}
    };
  },

  componentDidMount: function() {
    $.get(this.props.source, function(result) {
        console.log('$.get', result);
      this.setState({unreadCount: result});
    }.bind(this));
  },

  render: function() {
    var keys = Object.keys(this.state.unreadCount).sort();
    console.log('unread keys', keys);
    var lis = [];
    for (var i in keys) {
        var key = keys[i];
        var value = this.state.unreadCount[key];
        var dom = React.DOM.li({key: key}, React.DOM.a({href: '#'},
                    React.DOM.span({className: 'email-count'}, '(', value, ')'),
                    ' ', key
                    ));
        lis.push(dom);
    }
    console.log('Found', lis);
    return React.DOM.ul({}, lis);
  }
});

React.renderComponent(
  <UnreadCount source="//mail.z.xinu.tv/unread" />,
  $('#unread-list').get(0)
);