define(['jquery', 'underscore', 'backbone', 'text!modules/home/homeViewTemplate.html',
    'modules/base/baseView', 'modules/ricette/ricette', 'modules/editricetta/editricetta', 'modules/photos/photos', 'modules/statistics/statistics',
    'modules/editricetta/editricetta', 'text!modules/home/inputWindow.html',
    'jqx'],
        function($, _, Backbone, homeViewTemplate, BaseView, RicetteView, EditRicettaView, PhotosView, StatisticsView, EditRicetta, inputWindowTemplate) {

            var HomeView = BaseView.extend({
                ricetteView: null,
                statiView: null,
                editorRicetta: null,
                //initialize template
                template: _.template(homeViewTemplate),
                templateInputWindow: _.template(inputWindowTemplate),
                initialize: function() {
                    HomeView.__super__.initialize.call(this);
                    //this.header.title = "pippo";
                },
                addRicetta: function() {
                    //e.preventDefault();
                    var editRicetteView = new EditRicettaView();
                    editRicetteView.render();
                    $('body').append(editRicetteView.$el);
                    editRicetteView.openRicetta();
                },
                modifyRicetta: function() {
                    //e.preventDefault();
                    if(this.ricetteView == null)
                    {
                        this.ricetteView = new RicetteView();
                        this.ricetteView.render();
                        $('body').append(this.ricetteView.$el);
                    }
                    else
                        this.ricetteView.render();
                },
                modifyByIDRicetta: function() {
                    var self = this;
                    //e.preventDefault();
                    if(this.editorRicetta == null)
                    {
                        this.editorRicetta = new EditRicetta();
                        this.editorRicetta.render();
                        $('body').append(this.editorRicetta.$el);
                    }
                    $('#openBtn').off('click');
                    $('#openBtn').on('click', function () { 
                        $('#inputWindow').jqxWindow('close');
                        self.editorRicetta.openRicetta($('#ricettaId').val());
                    });
                    $('#cancelButton').off('click');
                    $('#cancelButton').on('click', function () {
                        $('#inputWindow').jqxWindow('close');
                    });
                    $('#ricettaId').val("");
                    $('#inputWindow').jqxWindow('open');
                    $('#ricettaId').focus();

                },
                photosView: function(){
                    var photosView = new PhotosView();
                    photosView.render();
                    $('body').append(photosView.$el);
                },
                statisticsView: function(){
                    if(this.statiView == null)
                    {
                        this.statiView = new StatisticsView();
                        this.statiView.render();
                        $('body').append(this.statiView.$el);
                    }
                    else
                        this.statiView.render();
                },
                clickMenu: function(event) {
                    var item = $(event.target);
                    //var clickedItem = event.args;
                    if(item[0].id === "addRicetta" ||
                       item[0].lastChild.id === "addRicetta")
                    {
                        event.data.scope.addRicetta();
                    }
                    else if(item[0].id === "modifyRicetta" ||
                            item[0].lastChild.id === "modifyRicetta")
                    {
                        event.data.scope.modifyRicetta();
                    }
                    else if(item[0].id === "modifyByIDRicetta" ||
                            item[0].lastChild.id === "modifyByIDRicetta")
                    {
                        event.data.scope.modifyByIDRicetta();
                    }
                    else if(item[0].id === "viewPhotos" ||
                            item[0].lastChild.id === "viewPhotos")
                    {
                        event.data.scope.photosView();
                    }
                    else if(item[0].id === "viewStatistics" ||
                            item[0].lastChild.id === "viewStatistics")
                    {
                        event.data.scope.statisticsView();
                    }
                },
                //render the content into div of view
                render: function() {
                    //this.header.title = "pippo";
                    HomeView.__super__.render.call(this);
                    var self = this;
                    if ($('#jqxMenu').length === 0)
                    {
                        this.$el.append(this.template());
                        this.$el.append(this.templateInputWindow());

                        this.$el.find("#jqxMenu").jqxMenu({
                            width: '60%',
                            height: '30px'
                        });

                        this.$el.find('#jqxMenu').on('itemclick', { scope: this }, this.clickMenu);

                        var offset = this.$el.offset();
                        this.$el.find('#inputWindow').jqxWindow({  width: 400,
                            height: 110, resizable: false,
                            cancelButton: $('#cancelButton'),
                            okButton: $('#openBtn'),
                            autoOpen: false,
                            position: { x: offset.left + 50, y: offset.top + 50},
                            initContent: function () {
                                $('#openBtn').jqxButton({ width: '80px' });
                                $('#cancelButton').jqxButton({ width: '80px' });
                            }
                        });

                        $('#inputWindow').keypress(function(e){
                            if ( e.which == 13 ) {
                                 e.preventDefault();
                                 $('#openBtn').trigger('click');
                            }
                        });
                    }

                    //$("#homeBtn").addClass("ui-btn-active");
                    //return to enable chained calls
                    return this;
                }
            });
            return HomeView;
        });