'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _index = require('../index.js');

var _index2 = _interopRequireDefault(_index);

var _events = require('../events.js');

var _events2 = _interopRequireDefault(_events);

var _eventtype = require('../events/eventtype.js');

var _eventtype2 = _interopRequireDefault(_eventtype);

var _object = require('../object.js');

var _object2 = _interopRequireDefault(_object);

var _control = require('../control/control.js');

var _control2 = _interopRequireDefault(_control);

var _proj = require('../proj.js');

var _proj2 = _interopRequireDefault(_proj);

function _interopRequireDefault(obj) {
  return obj && obj.__esModule ? obj : { default: obj };
}

/**
 * @classdesc
 * A control to show the 2D coordinates of the mouse cursor. By default, these
 * are in the view projection, but can be in any supported projection.
 * By default the control is shown in the top right corner of the map, but this
 * can be changed by using the css selector `.ol-mouse-position`.
 *
 * @constructor
 * @extends {ol.control.Control}
 * @param {olx.control.MousePositionOptions=} opt_options Mouse position
 *     options.
 * @api
 */
// FIXME should listen on appropriate pane, once it is defined

var _ol_control_MousePosition_ = function (opt_options) {

  var options = opt_options ? opt_options : {};

  var element = document.createElement('DIV');
  element.className = options.className !== undefined ? options.className : 'ol-mouse-position';

  var render = options.render ? options.render : _ol_control_MousePosition_.render;

  _control2.default.call(this, {
    element: element,
    render: render,
    target: options.target
  });

  _events2.default.listen(this, _object2.default.getChangeEventType(_ol_control_MousePosition_.Property_.PROJECTION), this.handleProjectionChanged_, this);

  if (options.coordinateFormat) {
    this.setCoordinateFormat(options.coordinateFormat);
  }
  if (options.projection) {
    this.setProjection(options.projection);
  }

  /**
   * @private
   * @type {string}
   */
  this.undefinedHTML_ = options.undefinedHTML !== undefined ? options.undefinedHTML : '';

  /**
   * @private
   * @type {string}
   */
  this.renderedHTML_ = element.innerHTML;

  /**
   * @private
   * @type {ol.proj.Projection}
   */
  this.mapProjection_ = null;

  /**
   * @private
   * @type {?ol.TransformFunction}
   */
  this.transform_ = null;

  /**
   * @private
   * @type {ol.Pixel}
   */
  this.lastMouseMovePixel_ = null;
};

_index2.default.inherits(_ol_control_MousePosition_, _control2.default);

/**
 * Update the mouseposition element.
 * @param {ol.MapEvent} mapEvent Map event.
 * @this {ol.control.MousePosition}
 * @api
 */
_ol_control_MousePosition_.render = function (mapEvent) {
  var frameState = mapEvent.frameState;
  if (!frameState) {
    this.mapProjection_ = null;
  } else {
    if (this.mapProjection_ != frameState.viewState.projection) {
      this.mapProjection_ = frameState.viewState.projection;
      this.transform_ = null;
    }
  }
  this.updateHTML_(this.lastMouseMovePixel_);
};

/**
 * @private
 */
_ol_control_MousePosition_.prototype.handleProjectionChanged_ = function () {
  this.transform_ = null;
};

/**
 * Return the coordinate format type used to render the current position or
 * undefined.
 * @return {ol.CoordinateFormatType|undefined} The format to render the current
 *     position in.
 * @observable
 * @api
 */
_ol_control_MousePosition_.prototype.getCoordinateFormat = function () {
  return (
    /** @type {ol.CoordinateFormatType|undefined} */this.get(_ol_control_MousePosition_.Property_.COORDINATE_FORMAT)
  );
};

/**
 * Return the projection that is used to report the mouse position.
 * @return {ol.proj.Projection|undefined} The projection to report mouse
 *     position in.
 * @observable
 * @api
 */
_ol_control_MousePosition_.prototype.getProjection = function () {
  return (
    /** @type {ol.proj.Projection|undefined} */this.get(_ol_control_MousePosition_.Property_.PROJECTION)
  );
};

/**
 * @param {Event} event Browser event.
 * @protected
 */
_ol_control_MousePosition_.prototype.handleMouseMove = function (event) {
  var map = this.getMap();
  this.lastMouseMovePixel_ = map.getEventPixel(event);
  this.updateHTML_(this.lastMouseMovePixel_);
};

/**
 * @param {Event} event Browser event.
 * @protected
 */
_ol_control_MousePosition_.prototype.handleMouseOut = function (event) {
  this.updateHTML_(null);
  this.lastMouseMovePixel_ = null;
};

/**
 * @inheritDoc
 * @api
 */
_ol_control_MousePosition_.prototype.setMap = function (map) {
  _control2.default.prototype.setMap.call(this, map);
  if (map) {
    var viewport = map.getViewport();
    this.listenerKeys.push(_events2.default.listen(viewport, _eventtype2.default.MOUSEMOVE, this.handleMouseMove, this), _events2.default.listen(viewport, _eventtype2.default.MOUSEOUT, this.handleMouseOut, this));
  }
};

/**
 * Set the coordinate format type used to render the current position.
 * @param {ol.CoordinateFormatType} format The format to render the current
 *     position in.
 * @observable
 * @api
 */
_ol_control_MousePosition_.prototype.setCoordinateFormat = function (format) {
  this.set(_ol_control_MousePosition_.Property_.COORDINATE_FORMAT, format);
};

/**
 * Set the projection that is used to report the mouse position.
 * @param {ol.ProjectionLike} projection The projection to report mouse
 *     position in.
 * @observable
 * @api
 */
_ol_control_MousePosition_.prototype.setProjection = function (projection) {
  this.set(_ol_control_MousePosition_.Property_.PROJECTION, _proj2.default.get(projection));
};

/**
 * @param {?ol.Pixel} pixel Pixel.
 * @private
 */
_ol_control_MousePosition_.prototype.updateHTML_ = function (pixel) {
  var html = this.undefinedHTML_;
  if (pixel && this.mapProjection_) {
    if (!this.transform_) {
      var projection = this.getProjection();
      if (projection) {
        this.transform_ = _proj2.default.getTransformFromProjections(this.mapProjection_, projection);
      } else {
        this.transform_ = _proj2.default.identityTransform;
      }
    }
    var map = this.getMap();
    var coordinate = map.getCoordinateFromPixel(pixel);
    if (coordinate) {
      this.transform_(coordinate, coordinate);
      var coordinateFormat = this.getCoordinateFormat();
      if (coordinateFormat) {
        html = coordinateFormat(coordinate);
      } else {
        html = coordinate.toString();
      }
    }
  }
  if (!this.renderedHTML_ || html != this.renderedHTML_) {
    this.element.innerHTML = html;
    this.renderedHTML_ = html;
  }
};

/**
 * @enum {string}
 * @private
 */
_ol_control_MousePosition_.Property_ = {
  PROJECTION: 'projection',
  COORDINATE_FORMAT: 'coordinateFormat'
};
exports.default = _ol_control_MousePosition_;
module.exports = exports['default'];