react-lacona/lib/options.js

React Component to provide a friendly interface for lacona

'use strict';

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

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _lodash = require('lodash');

var _lodash2 = _interopRequireDefault(_lodash);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactDom = require('react-dom');

var _option = require('./option');

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

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var Options = exports.Options = function (_React$Component) {
  _inherits(Options, _React$Component);

  function Options() {
    _classCallCheck(this, Options);

    var _this = _possibleConstructorReturn(this, (Options.__proto__ || Object.getPrototypeOf(Options)).call(this));

    _this.options = [];
    _this.coords = [0, 0];
    return _this;
  }

  _createClass(Options, [{
    key: 'getOption',
    value: function getOption(index) {
      return this.options[index];
    }

    // mouseMoved (coords) {
    //   return coords[0] !== this.coords[0] || coords[1] !== this.coords[1]
    // }

    // handleMouseMove (e) {
    //   this.coords = [e.pageX, e.pageY]
    // }

  }, {
    key: 'render',
    value: function render() {
      var _this2 = this;

      var divs = this.props.outputs.map(function (option, index) {
        var select = function select() {
          return _this2.props.select(index);
        };
        var execute = function execute() {
          return _this2.props.execute(index);
        };

        var selectKeyGlyph = '';
        switch (_this2.props.selectKey) {
          case 'ctrl':
            selectKeyGlyph = '⌃';break;
          case 'alt':
            selectKeyGlyph = '⌥';break;
          case 'cmd':
            selectKeyGlyph = '⌘';break;
        }

        var hint = _this2.props.showHints ? index === _this2.props.selection ? '↩' : index < 9 ? '' + selectKeyGlyph + (index + 1) : '' : '';

        return _react2.default.createElement(_option.Option, {
          ref: function ref(c) {
            return _this2.options[index] = c;
          },
          key: index,
          selected: index === _this2.props.selection
          // mouseMoved={this.mouseMoved.bind(this)}
          , option: option,
          select: select,
          execute: execute,
          onMouseDown: _this2.props.onMouseDown,
          onMouseUp: _this2.props.onMouseUp,
          hint: hint });
      });

      var notEmpty = !!this.props.outputs.length;

      return divs.length ? _react2.default.createElement(
        'div',
        {
          className: 'options ' + (notEmpty ? 'not-empty' : '')
          // onMouseMove={this.handleMouseMove.bind(this)}
          , onContextMenu: function onContextMenu(e) {
            return e.preventDefault();
          } },
        divs
      ) : _react2.default.createElement('div', { className: 'options' });
    }
  }]);

  return Options;
}(_react2.default.Component);