'use strict';

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

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _class, _temp2;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactBootstrap = require('react-bootstrap');

var _reactRedux = require('react-redux');

var _lodash = require('lodash');

var _pathExtra = require('path-extra');

var _reselect = require('reselect');

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _reactFontawesome = require('react-fontawesome');

var _reactFontawesome2 = _interopRequireDefault(_reactFontawesome);

var _avatar = require('views/components/etc/avatar');

var _countdownTimer = require('./countdown-timer');

var _selectors = require('views/utils/selectors');

var _tools = require('views/utils/tools');

require('../assets/repair-panel.css');

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

const { ROOT } = window;


const { i18n } = window;

const __ = i18n.main.__.bind(i18n.main);

const inRepairShipsDataSelector = (0, _reselect.createSelector)([_selectors.inRepairShipsIdSelector, _selectors.shipsSelector], (inRepairShipsId, ships) => inRepairShipsId.map(shipId => ships[shipId]));

const EmptyDock = ({ state }) => _react2.default.createElement(
  'div',
  { className: 'empty-dock' },
  _react2.default.createElement(_reactFontawesome2.default, { name: state === 0 ? 'bath' : 'lock' })
);

function _ref(props, timeRemaining) {
  return timeRemaining > 600 ? 'primary' : timeRemaining > 60 ? 'warning' : timeRemaining >= 0 ? 'success' : 'default';
}

exports.default = (0, _reactRedux.connect)((0, _selectors.createDeepCompareArraySelector)([_selectors.repairsSelector, _selectors.constSelector, inRepairShipsDataSelector, _selectors.miscSelector, state => (0, _lodash.get)(state, 'config.poi.enableAvatar', true)], (repairs, { $ships }, inRepairShips, { canNotify }, enableAvatar) => ({
  repairs,
  $ships,
  inRepairShips,
  canNotify,
  enableAvatar
})))((_temp2 = _class = class RepairPanel extends _react.Component {
  constructor(...args) {
    var _temp;

    return _temp = super(...args), this.getLabelStyle = _ref, _temp;
  }

  render() {
    const { canNotify, repairs, $ships, inRepairShips, enableAvatar } = this.props;
    // The reason why we use an array to pass in inRepairShips and indexify it
    // into ships, is because by passing an array we can make use of
    // createDeepCompareArraySelector which only deep compares arrays, and
    // by indexifying it into an object, it becomes easier to use.
    const ships = (0, _tools.indexify)(inRepairShips);
    return _react2.default.createElement(
      _react.Fragment,
      null,
      (0, _lodash.range)(0, 4).map(i => {
        const emptyRepair = {
          api_complete_time: 0,
          api_complete_time_str: '0',
          api_item1: 0,
          api_item2: 0,
          api_item3: 0,
          api_item4: 0,
          api_ship_id: 0,
          api_state: 0
        };
        const dock = repairs[i] || emptyRepair;
        const dockName = dock.api_state == -1 ? __('Locked') : dock.api_state == 0 ? __('Empty') : i18n.resources.__($ships[ships[dock.api_ship_id].api_ship_id].api_name);
        const completeTime = dock.api_complete_time || -1;
        let hpPercentage;
        if (dock.api_state > 0) {
          hpPercentage = 100 * (0, _lodash.get)(ships, [dock.api_ship_id, 'api_nowhp']) / (0, _lodash.get)(ships, [dock.api_ship_id, 'api_maxhp']);
        }
        return _react2.default.createElement(
          'div',
          { key: i, className: (0, _classnames2.default)('panel-item', 'ndock-item', { avatar: enableAvatar }) },
          enableAvatar && _react2.default.createElement(
            _react.Fragment,
            null,
            dock.api_state > 0 ? _react2.default.createElement(_avatar.Avatar, {
              height: 20,
              mstId: (0, _lodash.get)(ships, [dock.api_ship_id, 'api_ship_id']),
              isDamaged: hpPercentage <= 50
            }) : _react2.default.createElement(EmptyDock, { state: dock.api_state })
          ),
          _react2.default.createElement(
            'span',
            { className: 'ndock-name' },
            dockName
          ),
          _react2.default.createElement(
            _reactBootstrap.OverlayTrigger,
            { placement: 'left', overlay: _react2.default.createElement(
                _reactBootstrap.Tooltip,
                { id: `ndock-finish-by-${i}`, style: dock.api_state < 0 && { display: 'none' } },
                _react2.default.createElement(
                  'strong',
                  null,
                  __("Finish by : ")
                ),
                (0, _tools.timeToString)(completeTime)
              ) },
            _react2.default.createElement(
              'div',
              null,
              _react2.default.createElement(_countdownTimer.CountdownNotifierLabel, {
                timerKey: `ndock-${i + 1}`,
                completeTime: completeTime,
                getLabelStyle: this.getLabelStyle,
                getNotifyOptions: () => canNotify && completeTime >= 0 && _extends({}, this.constructor.basicNotifyConfig, {
                  args: dockName,
                  completeTime: completeTime
                })
              })
            )
          )
        );
      })
    );
  }
}, _class.basicNotifyConfig = {
  type: 'repair',
  title: __('Docking'),
  message: names => `${(0, _lodash.join)(names, ', ')} ${__('repair completed')}`,
  icon: (0, _pathExtra.join)(ROOT, 'assets', 'img', 'operation', 'repair.png'),
  preemptTime: 60
}, _temp2));
module.exports = exports['default'];