/*global define */
define(['jquery', 'underscore', 'backbone', 'MetricsChart', 'text!templates/metricModalTemplate.html', 'collections/Citations', 'views/CitationListView'],
    function($, _, Backbone, MetricsChart, MetricModalTemplate, Citations, CitationList) {
    'use strict';

    /**
    * @class MetricModalView
    * @classdesc A Bootstrap Modal that displays a DataONE dataset usage metric,
    * such as downloads, views, or citations.
    * @classcategory Views
    * @extends Backbone.View
    */
    var MetricModalView = Backbone.View.extend(
      /** @lends MetricModalView.prototype */ {

        id: 'metric-modal',
        className: 'modal fade hide',
        template: _.template(MetricModalTemplate),
        metricName: null,
        metricsModel: null,
        metrics: ['Citations', 'Downloads', 'Views'],
        metricIndex: null,
        prevMetricName: null,
        nextMetricName: null,
        subviews: [],

        events: {
          'hidden': 'teardown',
          'click .left-modal-footer'  : 'showPreviousMetricModal',
          'click .right-modal-footer' : 'showNextMetricModal',
          'click .register-citation'  : 'showCitationForm'
        },

        initialize: function(options) {
          _.bindAll(this, 'show', 'teardown', 'render', 'renderView');
          if((typeof options == "undefined")){
              var options = {};
          }

          this.metricName = options.metricName;
          this.metricsModel = options.metricsModel;
          this.pid = options.pid;

        },

        getPreviousMetric : function(currentMetricName) {
            if(currentMetricName != 'undefined') {
                    this.metricIndex = this.metrics.indexOf(currentMetricName);
            }

            // Implementing a circular queue to get the previous metric
            return(this.metrics[((this.metricIndex + this.metrics.length - 1) % this.metrics.length)]);
        },

        getNextMetric : function(currentMetricName) {
            if(currentMetricName != 'undefined') {
                    this.metricIndex = this.metrics.indexOf(currentMetricName);
            }

            // Implementing a circular queue to get the next metric
            return(this.metrics[((this.metricIndex + this.metrics.length + 1) % this.metrics.length)]);
        },

        show: function() {
          this.$el.modal('show');
        },

        teardown: function() {
          this.$el.modal('hide');
          this.$el.data('modal', null);

          _.invoke(this.subviews, "onClose");

          this.remove();


        },

        render: function() {

          var thisView = this;

          this.$el.on('shown', function(){
            thisView.renderView();
            thisView.drawMetricsChart();
          });

          this.$el.modal('show');


          return;
        },

        renderView: function() {
            this.metricNameLemma = this.metricName.toLowerCase().substring(0, this.metricName.length - 1);

            if ( this.metricName === "Citations") {
                var resultDetails = this.metricsModel.get("resultDetails");
                var citationCollection = new Citations(resultDetails["citations"], {parse:true});

                this.citationCollection = citationCollection;


                // Checking if there are any citations available for the List display.
                if(this.metricsModel.get("totalCitations") == 0) {
                    var citationList = new CitationList({citationsForDataCatalogView: true});
                }
                else {
                    var citationList = new CitationList({citations: this.citationCollection, citationsForDataCatalogView: true});
                }

                this.citationList = citationList;

                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalCitations"), metricBody:this.citationList.render().$el.html(), hideReportCitationButton: MetacatUI.appModel.get("hideReportCitationButton")}));
            }
            else {
                if (this.metricName === "Views") {
                    this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalViews"), metricBody:"<div class='metric-chart'></div>"}));
                }
                if (this.metricName === "Downloads") {
                    this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalDownloads"), metricBody:"<div class='metric-chart'></div>"}));
                }

            }

            this.$el.modal({show:false}); // dont show modal on instantiation

        },

        showPreviousMetricModal: function() {

            this.nextMetricName = this.metricName;
            this.metricName = this.getPreviousMetric(this.metricName);
            this.nextMetricName = this.getPreviousMetric(this.metricName);


            this.metricNameLemma = this.metricName.toLowerCase().substring(0, this.metricName.length - 1);
            if ( this.metricName === "Citations") {
                var resultDetails = this.metricsModel.get("resultDetails")
                var citationCollection = new Citations(resultDetails["citations"], {parse:true});

                this.citationCollection = citationCollection;

                // Checking if there are any citations available for the List display.
                if(this.metricsModel.get("totalCitations") == 0) {
                    var citationList = new CitationList({citationsForDataCatalogView: true});
                }
                else {
                    var citationList = new CitationList({citations: this.citationCollection, citationsForDataCatalogView: true});
                }

                this.citationList = citationList;

                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalCitations"), metricBody:this.citationList.render().$el.html()}));
            }
            if (this.metricName === "Views") {
                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalViews"), metricBody:"<div class='metric-chart'></div>"}));
                this.drawMetricsChart();
            }
            if (this.metricName === "Downloads") {
                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalDownloads"), metricBody:"<div class='metric-chart'></div>"}));
                this.drawMetricsChart();
            }
        },

        /**
         * Display the Citation registration form
         */
        showCitationForm: function(){
            // close the current modal
            this.teardown();
            var viewRef = this;
            require(['views/RegisterCitationView'], function(RegisterCitationView){
                // display a register citation modal
                var registerCitationView = new RegisterCitationView({pid: viewRef.pid});
                registerCitationView.render();
                registerCitationView.show();
            });
        },

        showNextMetricModal: function() {
            this.prevMetricName = this.metricName;
            this.metricName = this.getNextMetric(this.metricName);
            this.nextMetricName = this.getNextMetric(this.metricName);


            this.metricNameLemma = this.metricName.toLowerCase().substring(0, this.metricName.length - 1);
            if ( this.metricName === "Citations") {
                var resultDetails = this.metricsModel.get("resultDetails")
                var citationCollection = new Citations(resultDetails["citations"], {parse:true});

                this.citationCollection = citationCollection;

                // Checking if there are any citations available for the List display.
                if(this.metricsModel.get("totalCitations") == 0) {
                    var citationList = new CitationList({citationsForDataCatalogView: true});
                }
                else {
                    var citationList = new CitationList({citations: this.citationCollection, citationsForDataCatalogView: true});
                }

                this.citationList = citationList;

                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalCitations"), metricBody:this.citationList.render().$el.html()}));
            }
            if (this.metricName === "Views") {
                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalViews"), metricBody:"<div class='metric-chart'></div>"}));
                this.drawMetricsChart();
            }
            if (this.metricName === "Downloads") {
                this.$el.html(this.template({metricName:this.metricName, metricNameLemma:this.metricNameLemma, metricValue: this.metricsModel.get("totalDownloads"), metricBody:"<div class='metric-chart'></div>"}));
                this.drawMetricsChart();
            }
        },

        drawMetricsChart: function(){

            var metricCount         = MetacatUI.appView.currentView.metricsModel.get(this.metricName.toLowerCase());
            var metricMonths        = MetacatUI.appView.currentView.metricsModel.get("months");
            var metricName          = this.metricName;

            //Draw a metric chart
            var modalMetricChart = new MetricsChart({
                            id: "metrics-chart",
                            metricCount: metricCount,
                            metricMonths: metricMonths,
                            metricName: metricName,
                            height: 370
                        });

            this.$('.metric-chart').html(modalMetricChart.el);
            modalMetricChart.render();

            this.subviews.push(modalMetricChart);
        },

        /**
        * Cleans up and removes all artifacts created for view
        */
        onClose: function(){
          this.teardown();
        }

    });

     return MetricModalView;
  });