var Backbone = require('backbone'),
    React = require('react'),
    ItemWithDetails = require('../models/itemWithDetails'),
    ItemWithDetailsPage = require('../components/itemWithDetailsPage');

var ItemDetailsView = Backbone.View.extend({
    el: '#content',
    template: '<div class="item-details-container"></div>',
    initialize: function(id) {
        this.itemId = id;
    },

    render: function() {
        var self = this;
        this.$el.html(this.template);
        var item = new ItemWithDetails({id: this.itemId });
        console.log(item);

        item.fetch({success: function() {            
            React.render(new ItemWithDetailsPage({            
                item: item
            }), 
            self.$('.item-details-container').get(0));            
         }
        });
        return this;
    }
});

module.exports = ItemDetailsView;