var React = require('react');
var ItemList = require('./itemList');
var ItemStore = require('../../stores/itemStore.js');
var ItemActions = require('../../actions/itemActions.js');
var ItemCollection = require('../../models/itemCollection');

var RandomItems = React.createClass({

  render: function() {  
      return (
        <ItemList items={this.state.items} />
        );
  },

    // Add change listeners to stores
    componentDidMount: function() {
      ItemActions.loadFrontPageItems();
      ItemStore.addChangeListener(this._onChange);
    },

    componentWillUnmount: function () {
      ItemStore.removeChangeListener(this._onChange);
    },

    getInitialState: function() {
      return {
          items: this.getRandomItems()
        }
    },

    getRandomItems: function() {
      var NUMBER_OF_SUGGESTED_ITEMS = 8;
      var allItems =  ItemStore.getItems();
      allItems.reset(allItems.shuffle(), {silent:true});
      allItems.reset(allItems.first(NUMBER_OF_SUGGESTED_ITEMS), {silent:true});
      return allItems;
    },

    _onChange: function () {
     
      this.setState({
          items: this.getRandomItems()
        });
    },
});

module.exports = RandomItems;