livingsocial/rearview-engine

define([
    'view/base'
], function(
    BaseView
){  
    var DashboardTileView = BaseView.extend({

        events : {
            'click .save.btn'     : 'save',
            'click .settings.btn' : 'settings',
            'click figure.front'  : 'loadDashboard',
            'click .cancel.btn'   : 'settings',
            'click .add.btn'      : 'addCategory'
        },

        initialize : function(options) {
            _.bindAll(this);

            this.templar        = options.templar;
            this.intervalLength = ( options.intervalLength ) ? options.intervalLength : 60; // seconds
            this.render();
        },

        render : function() {
            this.templar.render({
                path   : 'dashboardtile',
                el     : this.$el,
                append : true,
                data   : {
                    'dashboard' : this.model.toJSON()
                }
            });

            this.$dashboardTile = this.$el.find('.dashboard' + this.model.get('id'));
            this.setElement(this.$dashboardTile);
            
            this.startStatusCheck();
        },

        loadDashboard : function(e) {
            location.href = '#dash/' + this.model.get('id');
        },

        addCategory : function(e) {
            Backbone.Mediator.pub('view:dashboard:add', {
                dashboard : {
                    id       : this.model.get('id'),
                    name     : this.model.get('name'),
                    children : this.model.get('children')
                }
            });
        },

        startStatusCheck : function() {
            this.updateTile();

            this.interval = setInterval(function() {
                this.updateTile();
            }.bind(this), this.intervalLength * 1000);

            clearInterval(this.interval);
        },

        updateTile : function() {
            $.ajax({
                url      : '/dashboards/' + this.model.get('id') + '/jobs.json',
                success  : function(response) {
                    _.map(response, function(job) {
                        job.createdAt = ( job.createdAt ) 
                                      ? this.formatServerDateTime(job.createdAt, true) 
                                      : job.createdAt;
                            
                        job.modifiedAt = ( job.modifiedAt )
                                       ? this.formatServerDateTime(job.modifiedAt, true)
                                       : job.modifiedAt;
                    }, this);

                    this.checkErrorState(response);
                }.bind(this)
            });
        },

        checkErrorState : function(response) {
            var dashboardErrorState = false; 

            for (var i = response.length - 1; i >= 0; i--) {
                if ( response[i].status != 'success' && typeof response[i].status != 'undefined' && response[i].active ) {
                    dashboardErrorState = true;
                    break;
                }
            };

            if ( dashboardErrorState ) {
                this.$el.find('.dashboard' + this.model.get('id')).addClass('red');
            } else {
                this.$el.find('.dashboard' + this.model.get('id')).removeClass('red');
            }
        },

        settings : function(e) {
            e.stopPropagation();
            this.$dashboardTile.toggleClass('flipped');
            setTimeout(function() {
                this.$dashboardTile.find('.front .btn').toggle();
            }.bind(this), 600);
        },

        save : function(e) {
            e.stopPropagation();

            this.model.save({
                'name' : this.$dashboardTile.find('.dashboard-name').val()
            },{
                success : function(response) {
                    Backbone.Mediator.pub('view:dashboard:save', {
                        'model'     : this.model,
                        'message'   : "Your changes to '" + this.model.get('name') + "' dashboard were saved.",
                        'attention' : 'Dashboard Saved!'
                    });
                }.bind(this),
                error : function(model, xhr, options) {
                    Backbone.Mediator.pub('view:dashboard:save', {
                        'model'     : this.model,
                        'message'   : "The dashboard '" + model.get('name') + "' produced an error during the process of saving.",
                        'attention' : 'Dashboard Save Error!',
                        'status'    : 'error'
                    });
                }.bind(this)
            });
        },

        destructor : function() {
            // go ahead and clear out the graph updating interval
            clearInterval(this.interval);

            this.remove();
            this.$el.remove();
            this.off();

            // remove model bound events
            this.model.off();
        }
    });

    return DashboardTileView;
});