define([

'jquery',
'./base',
'../utils',
'../keys'

], function ($, BaseSelection, Utils, KEYS) {

function SingleSelection () {
  SingleSelection.__super__.constructor.apply(this, arguments);
}

Utils.Extend(SingleSelection, BaseSelection);

SingleSelection.prototype.render = function () {
  var $selection = SingleSelection.__super__.render.call(this);

  $selection.addClass('select2-selection--single');

  $selection.html(
    '<span class="select2-selection__rendered"></span>' +
    '<span class="select2-selection__arrow" role="presentation">' +
      '<b role="presentation"></b>' +
    '</span>'
  );

  return $selection;
};

SingleSelection.prototype.bind = function (container, $container) {
  var self = this;

  SingleSelection.__super__.bind.apply(this, arguments);

  var id = container.id + '-container';

  this.$selection.find('.select2-selection__rendered').attr('id', id);
  this.$selection.attr('aria-labelledby', id);

  this.$selection.on('mousedown', function (evt) {
    // Only respond to left clicks
    if (evt.which !== 1) {
      return;
    }

    self.trigger('toggle', {
      originalEvent: evt
    });
  });

  this.$selection.on('focus', function (evt) {
    // User focuses on the container
  });

  this.$selection.on('blur', function (evt) {
    // User exits the container
  });

  container.on('focus', function (evt) {
    if (!container.isOpen()) {
      self.$selection.focus();
    }
  });

  container.on('selection:update', function (params) {
    self.update(params.data);
  });
};

SingleSelection.prototype.clear = function () {
  this.$selection.find('.select2-selection__rendered').empty();
};

SingleSelection.prototype.display = function (data, container) {
  var template = this.options.get('templateSelection');
  var escapeMarkup = this.options.get('escapeMarkup');

  return escapeMarkup(template(data, container));
};

SingleSelection.prototype.selectionContainer = function () {
  return $('<span></span>');
};

SingleSelection.prototype.update = function (data) {
  if (data.length === 0) {
    this.clear();
    return;
  }

  var selection = data[0];

  var $rendered = this.$selection.find('.select2-selection__rendered');
  var formatted = this.display(selection, $rendered);

  $rendered.empty().append(formatted);
  $rendered.prop('title', selection.title || selection.text);
};

return SingleSelection;

});