react-planner-viewer/lib/components/viewer2d/ruler.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
});
exports.default = Ruler;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

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

var _propTypes2 = _interopRequireDefault(_propTypes);

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

var STYLE = {
  stroke: "#0096fd",
  strokeWidth: "1px"
};

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

  //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 Ruler(_ref) {
  var length = _ref.length,
      unit = _ref.unit,
      transform = _ref.transform;


  var distanceText = length.toFixed(2) + ' ' + unit;

  return _react2.default.createElement(
    'g',
    { transform: transform },
    _react2.default.createElement(
      'text',
      { x: length / 2, y: '-3', transform: 'scale(1, -1)', style: STYLE_TEXT },
      distanceText
    ),
    _react2.default.createElement('line', { x1: '0', y1: '-5', x2: '0', y2: '5', style: STYLE }),
    _react2.default.createElement('line', { x1: length, y1: '-5', x2: length, y2: '5', style: STYLE }),
    _react2.default.createElement('line', { x1: '0', y1: '0', x2: length, y2: '0', style: STYLE })
  );
}

Ruler.propTypes = {
  length: _propTypes2.default.number.isRequired,
  unit: _propTypes2.default.string.isRequired,
  transform: _propTypes2.default.string.isRequired
};
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3ZpZXdlcjJkL3J1bGVyLmpzeCJdLCJuYW1lcyI6WyJSdWxlciIsIlNUWUxFIiwic3Ryb2tlIiwic3Ryb2tlV2lkdGgiLCJTVFlMRV9URVhUIiwidGV4dEFuY2hvciIsImZvbnRTaXplIiwiZm9udEZhbWlseSIsInBvaW50ZXJFdmVudHMiLCJmb250V2VpZ2h0IiwiV2Via2l0VG91Y2hDYWxsb3V0IiwiV2Via2l0VXNlclNlbGVjdCIsIk1velVzZXJTZWxlY3QiLCJNc1VzZXJTZWxlY3QiLCJ1c2VyU2VsZWN0IiwibGVuZ3RoIiwidW5pdCIsInRyYW5zZm9ybSIsImRpc3RhbmNlVGV4dCIsInRvRml4ZWQiLCJwcm9wVHlwZXMiLCJudW1iZXIiLCJpc1JlcXVpcmVkIiwic3RyaW5nIl0sIm1hcHBpbmdzIjoiOzs7OztrQkF3QndCQSxLOztBQXhCeEI7Ozs7QUFDQTs7Ozs7O0FBRUEsSUFBTUMsUUFBUTtBQUNaQyxVQUFRLFNBREk7QUFFWkMsZUFBYTtBQUZELENBQWQ7O0FBS0EsSUFBTUMsYUFBYTtBQUNqQkMsY0FBWSxRQURLO0FBRWpCQyxZQUFVLE1BRk87QUFHakJDLGNBQVksbUNBSEs7QUFJakJDLGlCQUFlLE1BSkU7QUFLakJDLGNBQVksTUFMSzs7QUFPakI7QUFDQUMsc0JBQW9CLE1BUkgsRUFRVztBQUM1QkMsb0JBQWtCLE1BVEQsRUFTVztBQUM1QkMsaUJBQWUsTUFWRSxFQVVXO0FBQzVCQyxnQkFBYyxNQVhHLEVBV1c7QUFDNUJDLGNBQVk7QUFaSyxDQUFuQjs7QUFnQmUsU0FBU2QsS0FBVCxPQUEwQztBQUFBLE1BQTFCZSxNQUEwQixRQUExQkEsTUFBMEI7QUFBQSxNQUFsQkMsSUFBa0IsUUFBbEJBLElBQWtCO0FBQUEsTUFBWkMsU0FBWSxRQUFaQSxTQUFZOzs7QUFFdkQsTUFBSUMsZUFBa0JILE9BQU9JLE9BQVAsQ0FBZSxDQUFmLENBQWxCLFNBQXVDSCxJQUEzQzs7QUFFQSxTQUNFO0FBQUE7QUFBQSxNQUFHLFdBQVdDLFNBQWQ7QUFDRTtBQUFBO0FBQUEsUUFBTSxHQUFHRixTQUFTLENBQWxCLEVBQXFCLEdBQUUsSUFBdkIsRUFBNEIseUJBQTVCLEVBQXVELE9BQU9YLFVBQTlEO0FBQTJFYztBQUEzRSxLQURGO0FBRUUsNENBQU0sSUFBRyxHQUFULEVBQWEsSUFBRyxJQUFoQixFQUFxQixJQUFHLEdBQXhCLEVBQTRCLElBQUcsR0FBL0IsRUFBbUMsT0FBT2pCLEtBQTFDLEdBRkY7QUFHRSw0Q0FBTSxJQUFJYyxNQUFWLEVBQWtCLElBQUcsSUFBckIsRUFBMEIsSUFBSUEsTUFBOUIsRUFBc0MsSUFBRyxHQUF6QyxFQUE2QyxPQUFPZCxLQUFwRCxHQUhGO0FBSUUsNENBQU0sSUFBRyxHQUFULEVBQWEsSUFBRyxHQUFoQixFQUFvQixJQUFJYyxNQUF4QixFQUFnQyxJQUFHLEdBQW5DLEVBQXVDLE9BQU9kLEtBQTlDO0FBSkYsR0FERjtBQVNEOztBQUVERCxNQUFNb0IsU0FBTixHQUFrQjtBQUNoQkwsVUFBUSxvQkFBVU0sTUFBVixDQUFpQkMsVUFEVDtBQUVoQk4sUUFBTSxvQkFBVU8sTUFBVixDQUFpQkQsVUFGUDtBQUdoQkwsYUFBVyxvQkFBVU0sTUFBVixDQUFpQkQ7QUFIWixDQUFsQiIsImZpbGUiOiJydWxlci5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuXG5jb25zdCBTVFlMRSA9IHtcbiAgc3Ryb2tlOiBcIiMwMDk2ZmRcIixcbiAgc3Ryb2tlV2lkdGg6IFwiMXB4XCJcbn07XG5cbmNvbnN0IFNUWUxFX1RFWFQgPSB7XG4gIHRleHRBbmNob3I6IFwibWlkZGxlXCIsXG4gIGZvbnRTaXplOiBcIjEycHhcIixcbiAgZm9udEZhbWlseTogXCInQ291cmllciBOZXcnLCBDb3VyaWVyLCBtb25vc3BhY2VcIixcbiAgcG9pbnRlckV2ZW50czogXCJub25lXCIsXG4gIGZvbnRXZWlnaHQ6IFwiYm9sZFwiLFxuXG4gIC8vaHR0cDovL3N0YWNrb3ZlcmZsb3cuY29tL3F1ZXN0aW9ucy84MjY3ODIvaG93LXRvLWRpc2FibGUtdGV4dC1zZWxlY3Rpb24taGlnaGxpZ2h0aW5nLXVzaW5nLWNzc1xuICBXZWJraXRUb3VjaENhbGxvdXQ6IFwibm9uZVwiLCAvKiBpT1MgU2FmYXJpICovXG4gIFdlYmtpdFVzZXJTZWxlY3Q6IFwibm9uZVwiLCAgIC8qIENocm9tZS9TYWZhcmkvT3BlcmEgKi9cbiAgTW96VXNlclNlbGVjdDogXCJub25lXCIsICAgICAgLyogRmlyZWZveCAqL1xuICBNc1VzZXJTZWxlY3Q6IFwibm9uZVwiLCAgICAgICAvKiBJbnRlcm5ldCBFeHBsb3Jlci9FZGdlICovXG4gIHVzZXJTZWxlY3Q6IFwibm9uZVwiXG59O1xuXG5cbmV4cG9ydCBkZWZhdWx0IGZ1bmN0aW9uIFJ1bGVyKHtsZW5ndGgsIHVuaXQsIHRyYW5zZm9ybX0pIHtcblxuICBsZXQgZGlzdGFuY2VUZXh0ID0gYCR7bGVuZ3RoLnRvRml4ZWQoMil9ICR7dW5pdH1gO1xuXG4gIHJldHVybiAoXG4gICAgPGcgdHJhbnNmb3JtPXt0cmFuc2Zvcm19PlxuICAgICAgPHRleHQgeD17bGVuZ3RoIC8gMn0geT1cIi0zXCIgdHJhbnNmb3JtPXtgc2NhbGUoMSwgLTEpYH0gc3R5bGU9e1NUWUxFX1RFWFR9PntkaXN0YW5jZVRleHR9PC90ZXh0PlxuICAgICAgPGxpbmUgeDE9XCIwXCIgeTE9XCItNVwiIHgyPVwiMFwiIHkyPVwiNVwiIHN0eWxlPXtTVFlMRX0vPlxuICAgICAgPGxpbmUgeDE9e2xlbmd0aH0geTE9XCItNVwiIHgyPXtsZW5ndGh9IHkyPVwiNVwiIHN0eWxlPXtTVFlMRX0vPlxuICAgICAgPGxpbmUgeDE9XCIwXCIgeTE9XCIwXCIgeDI9e2xlbmd0aH0geTI9XCIwXCIgc3R5bGU9e1NUWUxFfS8+XG4gICAgPC9nPlxuICApO1xuXG59XG5cblJ1bGVyLnByb3BUeXBlcyA9IHtcbiAgbGVuZ3RoOiBQcm9wVHlwZXMubnVtYmVyLmlzUmVxdWlyZWQsXG4gIHVuaXQ6IFByb3BUeXBlcy5zdHJpbmcuaXNSZXF1aXJlZCxcbiAgdHJhbnNmb3JtOiBQcm9wVHlwZXMuc3RyaW5nLmlzUmVxdWlyZWRcbn07XG4iXX0=