var CoreView = require('backbone/core-view');
var $ = require('jquery');
var _ = require('underscore');
var renderLoading = require('../../../../components/loading/render-loading.js');
var templateExportMapConfirmation = require('../../../components/modals/export-map/export-map-confirmation.tpl');
var templateExportMapDownload = require('../../../components/modals/export-map/export-map-download.tpl');
var REQUIRED_OPTS = [
  'modalModel',
  'renderOpts',
  'exportMapModel'
];

module.exports = CoreView.extend({
  className: 'Dialog-content',

  events: {
    'click .js-confirm': '_onConfirm',
    'click .js-cancel': '_onCancel',
    'click .js-download': '_download'
  },

  initialize: function (opts) {
    _.each(REQUIRED_OPTS, function (item) {
      if (!opts[item]) throw new Error(item + ' is required');
      this['_' + item] = opts[item];
    }, this);

    this._onKeyDown = this._onKeyDown.bind(this);
    this._initBinds();
  },

  render: function () {
    this.clearSubViews();

    var state = this._exportMapModel.get('state');

    if (state === 'complete') {
      this._renderCompleteView();
    } else if (state === 'pending' || state === 'exporting' || state === 'uploading') {
      this._renderLoadingView(state)
    } else if (state === 'failure') {
      this._renderFailureView();
    } else {
      this._renderConfirmationView();
    }
  },

  _renderCompleteView: function () {
    var w = window.open(this._exportMapModel.get('url'));

    // If w is undefined, popup was blocked: we show a "click to download" modal. Else, download has started.
    if (w === undefined) {
      this.$el.html(
        templateExportMapDownload({
          downloadURL: this._exportMapModel.get('url')
        })
      );
    } else {
      w.focus();
      this._modalModel.destroy();
    }
  },

  _renderLoadingView: function (state) {
    var loadingTitle = state.charAt(0).toUpperCase() + state.slice(1) + ' ...';

    this.$el.html(
      renderLoading({
        title: loadingTitle
      })
    );
  },

  _renderFailureView: function () {
    return cdb.templates.getTemplate('common/templates/fail')({
      msg: 'Export has failed'
    });
  },

  _renderConfirmationView: function () {
    this.$el.html(
      templateExportMapConfirmation({
        name: this._renderOpts.mapName
      })
    );
  },

  _initBinds: function () {
    $(document).bind('keydown', this._onKeyDown);

    this._exportMapModel.bind('change:state', function () {
      this.render();
    }, this);
  },

  _disableBinds: function () {
    $(document).unbind('keydown', this._onKeyDown);
  },

  _onKeyDown: function (ev) {
    var keyCode = ev.which;
    if (keyCode === $.ui.keyCode.ENTER) {
      this._onConfirm();
    }
  },

  _$content: function () {
    return this.$('.js-content');
  },

  _onConfirm: function () {
    this._exportMapModel.requestExport();
  },

  _onCancel: function () {
    this._exportMapModel.cancelExport();

    this._modalModel.destroy();
  },

  _download: function () {
    window.open(this._exportMapModel.get('url'));
    window.focus();

    this._modalModel.destroy();
  },

  clean: function () {
    this._disableBinds();
    CoreView.prototype.clean.apply(this);
  }
});

@@ -2740,75 +2740,8 @@
 %7D,%0A%0A
-  _$content: function () %7B%0A    return this.$('.js-content');%0A  %7D,%0A%0A
   _o

clean unsued method