react-planner-viewer/lib/components/viewer2d/area.js

react-planner-viewer is a React Component for view plans builded with react-planner in 2D mode

'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; };

exports.default = Area;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _polylabel = require('polylabel');

var _polylabel2 = _interopRequireDefault(_polylabel);

var _areaPolygon = require('area-polygon');

var _areaPolygon2 = _interopRequireDefault(_areaPolygon);

var _lodash = require('lodash');

var _lodash2 = _interopRequireDefault(_lodash);

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

var STYLE_TEXT = {
  textAnchor: 'middle',
  fontSize: '12px',
  fontFamily: '"Courier New", Courier, monospace',
  pointerEvents: 'none',
  fontWeight: 'bold',
  zIndex: 100,

  //http://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting-using-css
  WebkitTouchCallout: 'none', /* iOS Safari */
  WebkitUserSelect: 'none', /* Chrome/Safari/Opera */
  MozUserSelect: 'none', /* Firefox */
  MsUserSelect: 'none', /* Internet Explorer/Edge */
  userSelect: 'none'
};

function Area(_ref) {
  var layer = _ref.layer,
      area = _ref.area,
      catalog = _ref.catalog,
      fontSize = _ref.fontSize;


  var rendered = catalog.getElement(area.type).render2D(area, layer);
  var center = void 0;

  var polygon = area.vertices.toArray().map(function (vertexID) {
    var _layer$vertices$get = layer.vertices.get(vertexID),
        x = _layer$vertices$get.x,
        y = _layer$vertices$get.y;

    return [x, y];
  });

  var polygonWithHoles = polygon;

  area.holes.forEach(function (holeID) {

    var polygonHole = layer.areas.get(holeID).vertices.toArray().map(function (vertexID) {
      var _layer$vertices$get2 = layer.vertices.get(vertexID),
          x = _layer$vertices$get2.x,
          y = _layer$vertices$get2.y;

      return [x, y];
    });

    polygonWithHoles = polygonWithHoles.concat(polygonHole.reverse());
  });

  center = (0, _polylabel2.default)([polygonWithHoles], 1.0);
  var renderAreaName = _react2.default.createElement(
    'text',
    { x: '0', y: '0', transform: 'translate(' + center[0] + ' ' + center[1] + ') scale(1, -1)', style: _extends({}, STYLE_TEXT, { fontSize: fontSize + 'px' }) },
    area.getIn(['properties', 'name'])
  );

  return _react2.default.createElement(
    'g',
    {
      'data-element-root': true,
      'data-prototype': area.prototype,
      'data-id': area.id,
      'data-selected': area.selected,
      'data-layer': layer.id,
      'data-name': area.properties.get('name')
    },
    rendered,
    renderAreaName,
    ');'
  );
}

Area.propTypes = {
  area: _propTypes2.default.object.isRequired,
  layer: _propTypes2.default.object.isRequired,
  catalog: _propTypes2.default.object.isRequired
};
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3ZpZXdlcjJkL2FyZWEuanN4Il0sIm5hbWVzIjpbIkFyZWEiLCJTVFlMRV9URVhUIiwidGV4dEFuY2hvciIsImZvbnRTaXplIiwiZm9udEZhbWlseSIsInBvaW50ZXJFdmVudHMiLCJmb250V2VpZ2h0IiwiekluZGV4IiwiV2Via2l0VG91Y2hDYWxsb3V0IiwiV2Via2l0VXNlclNlbGVjdCIsIk1velVzZXJTZWxlY3QiLCJNc1VzZXJTZWxlY3QiLCJ1c2VyU2VsZWN0IiwibGF5ZXIiLCJhcmVhIiwiY2F0YWxvZyIsInJlbmRlcmVkIiwiZ2V0RWxlbWVudCIsInR5cGUiLCJyZW5kZXIyRCIsImNlbnRlciIsInBvbHlnb24iLCJ2ZXJ0aWNlcyIsInRvQXJyYXkiLCJtYXAiLCJnZXQiLCJ2ZXJ0ZXhJRCIsIngiLCJ5IiwicG9seWdvbldpdGhIb2xlcyIsImhvbGVzIiwiZm9yRWFjaCIsInBvbHlnb25Ib2xlIiwiYXJlYXMiLCJob2xlSUQiLCJjb25jYXQiLCJyZXZlcnNlIiwicmVuZGVyQXJlYU5hbWUiLCJnZXRJbiIsInByb3RvdHlwZSIsImlkIiwic2VsZWN0ZWQiLCJwcm9wZXJ0aWVzIiwicHJvcFR5cGVzIiwib2JqZWN0IiwiaXNSZXF1aXJlZCJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7a0JBdUJ3QkEsSTs7QUF2QnhCOzs7O0FBQ0E7Ozs7QUFDQTs7OztBQUNBOzs7O0FBQ0E7Ozs7OztBQUVBLElBQU1DLGFBQWE7QUFDakJDLGNBQVksUUFESztBQUVqQkMsWUFBVSxNQUZPO0FBR2pCQyxjQUFZLG1DQUhLO0FBSWpCQyxpQkFBZSxNQUpFO0FBS2pCQyxjQUFZLE1BTEs7QUFNakJDLFVBQVEsR0FOUzs7QUFRakI7QUFDQUMsc0JBQW9CLE1BVEgsRUFTVztBQUM1QkMsb0JBQWtCLE1BVkQsRUFVUztBQUMxQkMsaUJBQWUsTUFYRSxFQVdNO0FBQ3ZCQyxnQkFBYyxNQVpHLEVBWUs7QUFDdEJDLGNBQVk7QUFiSyxDQUFuQjs7QUFpQmUsU0FBU1osSUFBVCxPQUFrRDtBQUFBLE1BQWxDYSxLQUFrQyxRQUFsQ0EsS0FBa0M7QUFBQSxNQUEzQkMsSUFBMkIsUUFBM0JBLElBQTJCO0FBQUEsTUFBckJDLE9BQXFCLFFBQXJCQSxPQUFxQjtBQUFBLE1BQVpaLFFBQVksUUFBWkEsUUFBWTs7O0FBRS9ELE1BQUlhLFdBQVdELFFBQVFFLFVBQVIsQ0FBbUJILEtBQUtJLElBQXhCLEVBQThCQyxRQUE5QixDQUF1Q0wsSUFBdkMsRUFBNkNELEtBQTdDLENBQWY7QUFDQSxNQUFJTyxlQUFKOztBQUdBLE1BQUlDLFVBQVVQLEtBQUtRLFFBQUwsQ0FBY0MsT0FBZCxHQUF3QkMsR0FBeEIsQ0FBNEIsb0JBQVk7QUFBQSw4QkFDckNYLE1BQU1TLFFBQU4sQ0FBZUcsR0FBZixDQUFtQkMsUUFBbkIsQ0FEcUM7QUFBQSxRQUM5Q0MsQ0FEOEMsdUJBQzlDQSxDQUQ4QztBQUFBLFFBQzNDQyxDQUQyQyx1QkFDM0NBLENBRDJDOztBQUVwRCxXQUFPLENBQUNELENBQUQsRUFBSUMsQ0FBSixDQUFQO0FBQ0QsR0FIYSxDQUFkOztBQUtBLE1BQUlDLG1CQUFtQlIsT0FBdkI7O0FBRUFQLE9BQUtnQixLQUFMLENBQVdDLE9BQVgsQ0FBbUIsa0JBQVU7O0FBRTNCLFFBQUlDLGNBQWNuQixNQUFNb0IsS0FBTixDQUFZUixHQUFaLENBQWdCUyxNQUFoQixFQUF3QlosUUFBeEIsQ0FBaUNDLE9BQWpDLEdBQTJDQyxHQUEzQyxDQUErQyxvQkFBWTtBQUFBLGlDQUM1RFgsTUFBTVMsUUFBTixDQUFlRyxHQUFmLENBQW1CQyxRQUFuQixDQUQ0RDtBQUFBLFVBQ3JFQyxDQURxRSx3QkFDckVBLENBRHFFO0FBQUEsVUFDbEVDLENBRGtFLHdCQUNsRUEsQ0FEa0U7O0FBRTNFLGFBQU8sQ0FBQ0QsQ0FBRCxFQUFJQyxDQUFKLENBQVA7QUFDRCxLQUhpQixDQUFsQjs7QUFLQUMsdUJBQW1CQSxpQkFBaUJNLE1BQWpCLENBQXdCSCxZQUFZSSxPQUFaLEVBQXhCLENBQW5CO0FBQ0QsR0FSRDs7QUFVQWhCLFdBQVMseUJBQVUsQ0FBQ1MsZ0JBQUQsQ0FBVixFQUE4QixHQUE5QixDQUFUO0FBQ0EsTUFBTVEsaUJBQ0o7QUFBQTtBQUFBLE1BQU0sR0FBRSxHQUFSLEVBQVksR0FBRSxHQUFkLEVBQWtCLDBCQUF3QmpCLE9BQU8sQ0FBUCxDQUF4QixTQUFxQ0EsT0FBTyxDQUFQLENBQXJDLG1CQUFsQixFQUFrRixvQkFBWW5CLFVBQVosSUFBd0JFLFVBQVVBLFdBQVcsSUFBN0MsR0FBbEY7QUFDR1csU0FBS3dCLEtBQUwsQ0FBVyxDQUFDLFlBQUQsRUFBZSxNQUFmLENBQVg7QUFESCxHQURGOztBQU1BLFNBRUU7QUFBQTtBQUFBO0FBQ0UsK0JBREY7QUFFRSx3QkFBZ0J4QixLQUFLeUIsU0FGdkI7QUFHRSxpQkFBU3pCLEtBQUswQixFQUhoQjtBQUlFLHVCQUFlMUIsS0FBSzJCLFFBSnRCO0FBS0Usb0JBQVk1QixNQUFNMkIsRUFMcEI7QUFNRSxtQkFBVzFCLEtBQUs0QixVQUFMLENBQWdCakIsR0FBaEIsQ0FBb0IsTUFBcEI7QUFOYjtBQVFHVCxZQVJIO0FBU0dxQixrQkFUSDtBQUFBO0FBQUEsR0FGRjtBQWlCRDs7QUFFRHJDLEtBQUsyQyxTQUFMLEdBQWlCO0FBQ2Y3QixRQUFNLG9CQUFVOEIsTUFBVixDQUFpQkMsVUFEUjtBQUVmaEMsU0FBTyxvQkFBVStCLE1BQVYsQ0FBaUJDLFVBRlQ7QUFHZjlCLFdBQVMsb0JBQVU2QixNQUFWLENBQWlCQztBQUhYLENBQWpCIiwiZmlsZSI6ImFyZWEuanMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCBwb2x5bGFiZWwgZnJvbSAncG9seWxhYmVsJztcbmltcG9ydCBhcmVhcG9seWdvbiBmcm9tICdhcmVhLXBvbHlnb24nO1xuaW1wb3J0IF8gZnJvbSAnbG9kYXNoJztcblxuY29uc3QgU1RZTEVfVEVYVCA9IHtcbiAgdGV4dEFuY2hvcjogJ21pZGRsZScsXG4gIGZvbnRTaXplOiAnMTJweCcsXG4gIGZvbnRGYW1pbHk6ICdcIkNvdXJpZXIgTmV3XCIsIENvdXJpZXIsIG1vbm9zcGFjZScsXG4gIHBvaW50ZXJFdmVudHM6ICdub25lJyxcbiAgZm9udFdlaWdodDogJ2JvbGQnLFxuICB6SW5kZXg6IDEwMCxcblxuICAvL2h0dHA6Ly9zdGFja292ZXJmbG93LmNvbS9xdWVzdGlvbnMvODI2NzgyL2hvdy10by1kaXNhYmxlLXRleHQtc2VsZWN0aW9uLWhpZ2hsaWdodGluZy11c2luZy1jc3NcbiAgV2Via2l0VG91Y2hDYWxsb3V0OiAnbm9uZScsIC8qIGlPUyBTYWZhcmkgKi9cbiAgV2Via2l0VXNlclNlbGVjdDogJ25vbmUnLCAvKiBDaHJvbWUvU2FmYXJpL09wZXJhICovXG4gIE1velVzZXJTZWxlY3Q6ICdub25lJywgLyogRmlyZWZveCAqL1xuICBNc1VzZXJTZWxlY3Q6ICdub25lJywgLyogSW50ZXJuZXQgRXhwbG9yZXIvRWRnZSAqL1xuICB1c2VyU2VsZWN0OiAnbm9uZSdcbn07XG5cblxuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gQXJlYSh7IGxheWVyLCBhcmVhLCBjYXRhbG9nLCBmb250U2l6ZSB9KSB7XG5cbiAgbGV0IHJlbmRlcmVkID0gY2F0YWxvZy5nZXRFbGVtZW50KGFyZWEudHlwZSkucmVuZGVyMkQoYXJlYSwgbGF5ZXIpO1xuICBsZXQgY2VudGVyO1xuXG5cbiAgbGV0IHBvbHlnb24gPSBhcmVhLnZlcnRpY2VzLnRvQXJyYXkoKS5tYXAodmVydGV4SUQgPT4ge1xuICAgIGxldCB7IHgsIHkgfSA9IGxheWVyLnZlcnRpY2VzLmdldCh2ZXJ0ZXhJRCk7XG4gICAgcmV0dXJuIFt4LCB5XTtcbiAgfSk7XG5cbiAgbGV0IHBvbHlnb25XaXRoSG9sZXMgPSBwb2x5Z29uO1xuXG4gIGFyZWEuaG9sZXMuZm9yRWFjaChob2xlSUQgPT4ge1xuXG4gICAgbGV0IHBvbHlnb25Ib2xlID0gbGF5ZXIuYXJlYXMuZ2V0KGhvbGVJRCkudmVydGljZXMudG9BcnJheSgpLm1hcCh2ZXJ0ZXhJRCA9PiB7XG4gICAgICBsZXQgeyB4LCB5IH0gPSBsYXllci52ZXJ0aWNlcy5nZXQodmVydGV4SUQpO1xuICAgICAgcmV0dXJuIFt4LCB5XTtcbiAgICB9KTtcblxuICAgIHBvbHlnb25XaXRoSG9sZXMgPSBwb2x5Z29uV2l0aEhvbGVzLmNvbmNhdChwb2x5Z29uSG9sZS5yZXZlcnNlKCkpO1xuICB9KTtcblxuICBjZW50ZXIgPSBwb2x5bGFiZWwoW3BvbHlnb25XaXRoSG9sZXNdLCAxLjApO1xuICBjb25zdCByZW5kZXJBcmVhTmFtZSA9IChcbiAgICA8dGV4dCB4PVwiMFwiIHk9XCIwXCIgdHJhbnNmb3JtPXtgdHJhbnNsYXRlKCR7Y2VudGVyWzBdfSAke2NlbnRlclsxXX0pIHNjYWxlKDEsIC0xKWB9IHN0eWxlPXt7IC4uLlNUWUxFX1RFWFQsIGZvbnRTaXplOiBmb250U2l6ZSArICdweCcgfX0+XG4gICAgICB7YXJlYS5nZXRJbihbJ3Byb3BlcnRpZXMnLCAnbmFtZSddKX1cbiAgICA8L3RleHQ+XG4gICk7XG5cbiAgcmV0dXJuIChcblxuICAgIDxnXG4gICAgICBkYXRhLWVsZW1lbnQtcm9vdFxuICAgICAgZGF0YS1wcm90b3R5cGU9e2FyZWEucHJvdG90eXBlfVxuICAgICAgZGF0YS1pZD17YXJlYS5pZH1cbiAgICAgIGRhdGEtc2VsZWN0ZWQ9e2FyZWEuc2VsZWN0ZWR9XG4gICAgICBkYXRhLWxheWVyPXtsYXllci5pZH1cbiAgICAgIGRhdGEtbmFtZT17YXJlYS5wcm9wZXJ0aWVzLmdldCgnbmFtZScpfVxuICAgID5cbiAgICAgIHtyZW5kZXJlZH1cbiAgICAgIHtyZW5kZXJBcmVhTmFtZX1cblxuICAgICAgKTtcbiAgICA8L2c+XG4gIClcblxufVxuXG5BcmVhLnByb3BUeXBlcyA9IHtcbiAgYXJlYTogUHJvcFR5cGVzLm9iamVjdC5pc1JlcXVpcmVkLFxuICBsYXllcjogUHJvcFR5cGVzLm9iamVjdC5pc1JlcXVpcmVkLFxuICBjYXRhbG9nOiBQcm9wVHlwZXMub2JqZWN0LmlzUmVxdWlyZWQsXG59O1xuXG5cbiJdfQ==