define(['jquery', 'underscore', 'backbone', 'text!modules/index/indexViewTemplate.html', 'text!modules/index/indexItemViewTemplate.html', 'modules/base/baseView'],
        function ($, _, Backbone, indexViewTemplate, indexItemViewTemplate, BaseView) {

            var IndexView = BaseView.extend({
                collection: null,
                //initialize template
                template: _.template(indexViewTemplate),
                //templateItem:_.template(indexItemViewTemplate, {variable: 'item'}),

                initialize: function (options) {
                    this.id = "IndexView";
                    var self = this;
                    IndexView.__super__.initialize.call(this);
                    /*this.collection = options.collection;
                     this.collection.fetch({ 
                     success: function(){
                     var $ul = $('#categoryList');
                     var html = "";
                     _.each(self.collection.toJSON(), function(d) {
                     html += self.templateItem(d);
                     });
                     $ul.html(html);
                     $ul.listview("refresh");
                     $ul.trigger("updatelayout");
                     self.trigger("renderCompleted:Categories",self);
                     }
                     });*/
                },
                onShowed: function(){
                    $('body').scrollTop(0);
                },
                //render the content into div of view
                render: function () {
                    if (this.created === true)
                    {
                        //this.header.title = "pippo";
                        IndexView.__super__.render.call(this);
                        //this.el is the root element of Backbone.View. By default, it is a div.
                        //$el is cached jQuery object for the view's element.
                        //append the compiled template into view div container
                        this.$el.append(this.header.$el);
                        this.$el.append(this.template());
                        this.$el.append(this.footer.$el);

                        //return to enable chained calls                        
                    }
                    this.$el.find("#indexBtn").addClass("ui-btn-active");
                    return this;
                }
            });
            return IndexView;
        });