awv3/plugins/extrusion/index.js

⚡ AWV3 embedded CAD

import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import _extends from "@babel/runtime/helpers/extends";

var _class, _temp2, _class2, _temp4, _dec, _class3, _class4, _temp5, _dec2, _class5, _class6, _temp6, _class7, _temp7;

import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import debounce from 'lodash/debounce';
import Plugin from '../../session/plugin';
import Dimensions from '../dimensions/';
import { actions as connectionActions } from '../../session/store/connections';
var resources = ['extrusion'].reduce(function (prev, item) {
  var _extends2;

  return _extends({}, prev, (_extends2 = {}, _extends2[item] = require('!!url-loader!awv3-icons/32x32/' + item + '.png'), _extends2));
}, {});
var MemberRow = (_temp2 = _class =
/*#__PURE__*/
function (_React$Component) {
  _inheritsLoose(MemberRow, _React$Component);

  function MemberRow() {
    var _temp, _this;

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    return (_temp = _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this, Object.defineProperty(_assertThisInitialized(_this), "state", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: {
        value: undefined
      }
    }), Object.defineProperty(_assertThisInitialized(_this), "update", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: debounce(function (value) {
        var id = _this.props.id,
            m = JSON.stringify(_this.props.key),
            v = JSON.stringify(value);
        console.log("_C.CADApplication.SetExpressions(" + id + ", [" + m + "], [" + v + "], " + f + ");");

        _this.context.plugin.connection.execute("_C.CADApplication.SetExpressions(" + id + ", [" + m + "], [" + v + "], 1);");
      }, 500)
    }), _temp) || _assertThisInitialized(_this);
  }

  var _proto = MemberRow.prototype;

  _proto.render = function render() {
    var _this2 = this;

    var _props = this.props,
        key = _props.key,
        member = _props.member;
    var value = this.state.value;
    var displayVal = value === undefined ? member.expression || member.value : value;
    if (Array.isArray(displayVal)) displayVal = displayVal.join(',');
    if (key === 'color') return React.createElement("button", {
      name: key,
      format: "Color"
    });else if (key === 'extrudeType') return React.createElement("slider", {
      name: key,
      value: Number(displayVal) || 0,
      max: 2,
      positions: _extends({}, ['up', 'down', 'symmetric']),
      onValue: this.update
    });else if (key.endsWith('Angle')) return React.createElement("slider", {
      name: key,
      value: Number(displayVal) || 0,
      onValue: this.update,
      max: 45,
      step: 1,
      positions: {
        0: '0°',
        45: '45'
      }
    });else if (key.startsWith('invert')) return React.createElement("checkbox", {
      name: key,
      value: Boolean(displayVal),
      onValue: function onValue(value) {
        return _this2.update(value ? 1 : 0);
      }
    });else if (member.type === 'point') return React.createElement("input", {
      name: key,
      value: displayVal,
      onValue: function onValue(value) {
        return set({
          value: value
        });
      },
      format: "Vector",
      onLastEvent: function onLastEvent(e) {
        return e.key === 'Enter' && _this2.update(value.split(',').map(Number));
      }
    });else if (member.type === 'real') return React.createElement("input", {
      name: key,
      value: displayVal,
      onValue: function onValue(value) {
        return set({
          value: value
        });
      },
      onLastEvent: function onLastEvent(e) {
        return e.key === 'Enter' && _this2.update(value);
      }
    });else return React.createElement("label", {
      name: key,
      value: displayVal
    });
  };

  return MemberRow;
}(React.Component), Object.defineProperty(_class, "contextTypes", {
  configurable: true,
  enumerable: true,
  writable: true,
  value: {
    plugin: PropTypes.object
  }
}), _temp2);
var SketchRow = (_temp4 = _class2 =
/*#__PURE__*/
function (_React$Component2) {
  _inheritsLoose(SketchRow, _React$Component2);

  function SketchRow() {
    var _temp3, _this3;

    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
      args[_key2] = arguments[_key2];
    }

    return (_temp3 = _this3 = _React$Component2.call.apply(_React$Component2, [this].concat(args)) || this, Object.defineProperty(_assertThisInitialized(_this3), "setDropdown", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(_value) {
        if (true) return; // TODO

        var plugin = _this3.context.plugin;
        var sketches = plugin.tree[plugin.tree.root].features.map(function (x) {
          return plugin.tree[x];
        }).filter(function (x) {
          return x.class === 'CC_Sketch';
        });
        var items = sketches.map(function (x) {
          return x.name;
        });

        var t2e = function t2e(t) {
          return t ? plugin.tree[t].name : '';
        };

        var e2t = function e2t(e) {
          return (sketches.find(function (x) {
            return x.name === e;
          }) || {
            id: 0
          }).id;
        };

        plugin.connection.execute("VAR region, sketch;\n            region = CADH_RealToId(" + region + ");\n            sketch = CADH_RealToId(" + e2t(e) + ");\n            region.SetCurves(sketch.GetCCCurves());");
      }
    }), _temp3) || _assertThisInitialized(_this3);
  }

  var _proto2 = SketchRow.prototype;

  _proto2.render = function render() {
    var _props2 = this.props,
        name = _props2.name,
        value = _props2.value.value;
    return React.createElement("dropdown", {
      name: name,
      items: [String(value)],
      value: String(value),
      onValue: this.setDropdown
    });
  };

  return SketchRow;
}(React.Component), Object.defineProperty(_class2, "contextTypes", {
  configurable: true,
  enumerable: true,
  writable: true,
  value: {
    plugin: PropTypes.object
  }
}), _temp4);
var Extrusion = (_dec = connect(function (state, props) {
  var tree = state.connections[props.connection].tree;
  var feature = tree[props.id]; // TODO: This is problematic, because it will run on every single change that mutates the store
  // selectors should either look up static structures or memoize. There are helpers for it like 'reselect'

  var region = feature.children.map(function (x) {
    return tree[x];
  }).find(function (x) {
    return x.class === 'CC_SketchRegion';
  });
  return {
    feature: feature,
    region: region
  };
}), _dec(_class3 = (_temp5 = _class4 =
/*#__PURE__*/
function (_React$Component3) {
  _inheritsLoose(Extrusion, _React$Component3);

  function Extrusion(props) {
    var _this4;

    _this4 = _React$Component3.call(this, props) || this;
    Object.defineProperty(_assertThisInitialized(_this4), "setHeight", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(height) {
        return _this4.setState({
          height: height
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "setLimit1", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(limit1) {
        return _this4.setState({
          limit1: limit1
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "setLimit2", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(limit2) {
        return _this4.setState({
          limit2: limit2
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "setDirection", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(direction) {
        return _this4.setState({
          direction: direction
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "setTaperAngle", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(taperAngle) {
        return _this4.setState({
          taperAngle: taperAngle
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "updateOnEnter", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(e) {
        return e.key === 'Enter' && _this4.update();
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "setType", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(newType) {
        //update limits/height from each other before switching type
        var newState = _this4.classcadToGuiValues(_this4.guiToClasscadValues(_this4.state));

        newState.type = newType;

        _this4.setState(newState);
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "editSketchRegion", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(event) {
        var root = _this4.context.plugin.connection.tree.root;
        root = _this4.context.plugin.connection.tree[root];
        var region = _this4.props.region;

        _this4.context.plugin.store.dispatch(connectionActions.setActiveFeature(_this4.context.plugin.connection.id, region.members.sketch.value, {
          prevFeatureId: _this4.context.plugin.connection.activeFeature,
          curves: region.members.curves
        }));
      }
    });
    Object.defineProperty(_assertThisInitialized(_this4), "update", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: debounce(function () {
        var id = _this4.props.feature.id;

        var data = _this4.guiToClasscadValues(_this4.state).members;

        var keys = [],
            values = [];
        Object.keys(data).forEach(function (key) {
          keys.push(JSON.stringify(key));
          var value = data[key].value;

          if (key === 'extrudeDir') {
            value = '{' + value.map(function (x) {
              return Number(x);
            }) + '}'; //Converting to classCAD vector.
          }

          values.push(value);
        });
        var command = "VAR extr;\n            extr = CADH_RealToId(" + id + ");\n            _C.CADApplication.SetExpressions(" + id + ", [" + keys + "], [" + values + "], 2);\n            extr.CreateDimensions();"; //console.log(command);

        _this4.context.plugin.connection.execute(command);
      }, 500)
    });
    _this4.state = _this4.classcadToGuiValues(props.feature);
    return _this4;
  } //conversion methods between CC values and our nice GUI values


  var _proto3 = Extrusion.prototype;

  _proto3.classcadToGuiValues = function classcadToGuiValues(extrusion) {
    var state = {}; //note: here we convert CC raw values into user-friendly GUI values

    state.direction = extrusion.members.extrudeDir.value.join(',');

    if (extrusion.members.limit1.expression || extrusion.members.limit2.expression) {
      state.limit1 = extrusion.members.limit1.expression;
      state.limit2 = extrusion.members.limit2.expression;
      var limit1 = Number(state.limit1);
      var limit2 = Number(state.limit2); //TODO: seems that server should send numeric value only in limit1.value instead of limit1.expression.

      if (!isNaN(limit1) && !isNaN(limit2)) {
        state.limit1 = limit1;
        state.limit2 = limit2;
      } else {
        state.type = 'custom';
        state.height = '[unsupported]';
      }
    } else {
      state.limit1 = Number(extrusion.members.limit1.value);
      state.limit2 = Number(extrusion.members.limit2.value);
    }

    state.type = state.type ? state.type : state.limit2 === 0 && state.limit1 === 0 ? 'custom' //a bad case: type cannot be guessed
    : state.limit2 !== 0 && state.limit1 === 0 ? 'front' : state.limit2 === 0 && state.limit1 !== 0 ? 'back' : state.limit2 + state.limit1 === 0 ? 'symmetric' : 'custom';
    state.height = state.height ? state.height : state.limit2 - state.limit1;
    state.taperAngle = extrusion.members.taperAngle !== undefined ? extrusion.members.taperAngle.value : 0;
    state.taperAngle = state.taperAngle * 180 / Math.PI; //Radians to degrees.

    return state;
  };

  _proto3.guiToClasscadValues = function guiToClasscadValues(state) {
    var limit1 = state.limit1,
        limit2 = state.limit2,
        height = state.height,
        direction = state.direction;

    if (state.type === 'front') {
      limit1 = 0;
      limit2 = height;
    }

    if (state.type === 'back') {
      limit1 = -height;
      limit2 = 0;
    }

    if (state.type === 'symmetric') {
      limit1 = -height / 2;
      limit2 = height / 2;
    }

    var result = {
      members: {
        limit1: {
          value: limit1
        },
        limit2: {
          value: limit2
        },
        extrudeDir: {
          value: direction.split(',')
        }
      }
    };
    result.members.taperAngle = {
      value: state.taperAngle * Math.PI / 180 //Degrees to radians.

    };
    return result;
  }; //executed when JS tree changes arrive from server


  _proto3.componentWillReceiveProps = function componentWillReceiveProps(_ref) {
    var feature = _ref.feature;
    this.setState(this.classcadToGuiValues(feature));
  };

  _proto3.render = function render() {
    var _props3 = this.props,
        feature = _props3.feature,
        region = _props3.region;
    var _state = this.state,
        type = _state.type,
        height = _state.height,
        limit1 = _state.limit1,
        limit2 = _state.limit2,
        direction = _state.direction,
        taperAngle = _state.taperAngle;
    return React.createElement("group", {
      format: "Table"
    }, React.createElement(SketchRow, {
      id: region.id,
      name: "sketch",
      value: region.members.sketch
    }), React.createElement("dropdown", {
      name: "type",
      items: ['front', 'symmetric', 'back', 'custom'],
      value: type,
      onValue: this.setType
    }), type !== 'custom' && React.createElement("input", {
      name: "height",
      value: height,
      onValue: this.setHeight,
      onLastEvent: this.updateOnEnter
    }), type === 'custom' && React.createElement("input", {
      name: "lower limit",
      value: limit1,
      onValue: this.setLimit1,
      onLastEvent: this.updateOnEnter
    }), type === 'custom' && React.createElement("input", {
      name: "upper limit",
      value: limit2,
      onValue: this.setLimit1,
      onLastEvent: this.updateOnEnter
    }), type === 'custom' && React.createElement("input", {
      name: "direction",
      value: direction,
      format: "Vector",
      onValue: this.setDirection,
      onLastEvent: this.updateOnEnter
    }), type !== 'custom' && React.createElement("input", {
      name: "taper angle",
      value: taperAngle,
      onValue: this.setTaperAngle,
      onLastEvent: this.updateOnEnter
    }), React.createElement("group", {
      format: "Buttons"
    }, React.createElement("button", {
      name: "Edit Sketch Region",
      format: "Default",
      onLastEvent: this.editSketchRegion
    })));
  };

  return Extrusion;
}(React.Component), Object.defineProperty(_class4, "contextTypes", {
  configurable: true,
  enumerable: true,
  writable: true,
  value: {
    plugin: PropTypes.object
  }
}), _temp5)) || _class3);
var Revolve = (_dec2 = connect(function (state, props) {
  var tree = state.connections[props.connection].tree;
  var feature = tree[props.id];
  var region = feature.children.map(function (x) {
    return tree[x];
  }).find(function (x) {
    return x.class === 'CC_SketchRegion';
  });
  return {
    feature: feature,
    region: region
  };
}), _dec2(_class5 = (_temp6 = _class6 =
/*#__PURE__*/
function (_React$Component4) {
  _inheritsLoose(Revolve, _React$Component4);

  function Revolve(props) {
    var _this5;

    _this5 = _React$Component4.call(this, props) || this;
    Object.defineProperty(_assertThisInitialized(_this5), "setStartAngle", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(startAngle) {
        return _this5.setState({
          startAngle: startAngle
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this5), "setEndAngle", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(endAngle) {
        return _this5.setState({
          endAngle: endAngle
        });
      }
    });
    Object.defineProperty(_assertThisInitialized(_this5), "setType", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(newType) {
        //update start/end angles according to type before switching type
        var newState = _this5.classcadToGuiValues(_this5.guiToClasscadValues(_this5.state));

        newState.type = newType;

        _this5.setState(newState);

        _this5.update();
      }
    });
    Object.defineProperty(_assertThisInitialized(_this5), "editSketchRegion", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(event) {
        var plugin = _this5.context.plugin;
        var region = _this5.props.region;
        plugin.store.dispatch(connectionActions.setActiveFeature(plugin.connection.id, region.members.sketch.value, {
          prevFeatureId: plugin.connection.activeFeature,
          curves: region.members.curves
        }));
      }
    });
    Object.defineProperty(_assertThisInitialized(_this5), "editWorkAxis", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(event) {
        var plugin = _this5.context.plugin;
        var region = _this5.props.region;
        plugin.store.dispatch(connectionActions.setActiveFeature(plugin.connection.id, region.members.sketch.value, {
          prevFeatureId: plugin.connection.activeFeature,
          workAxisMode: true
        }));
      }
    });
    Object.defineProperty(_assertThisInitialized(_this5), "update", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: debounce(function () {
        var id = _this5.props.feature.id;

        var data = _this5.guiToClasscadValues(_this5.state);

        var command = "VAR rev;\n            rev = CADH_RealToId(" + id + ");\n            rev.startAngle = " + data.members.startAngle.value + ";\n            rev.endAngle = " + data.members.endAngle.value + ";\n            _O.OBJ_Recalc();"; //TODO: direction?
        //console.log(command);

        _this5.context.plugin.connection.execute(command);
      }, 500)
    });
    Object.defineProperty(_assertThisInitialized(_this5), "updateOnEnter", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(event) {
        return event.key === 'Enter' && _this5.update();
      }
    });
    _this5.state = _this5.classcadToGuiValues(props.feature);
    return _this5;
  } //conversion methods between CC values and our nice GUI values


  var _proto4 = Revolve.prototype;

  _proto4.classcadToGuiValues = function classcadToGuiValues(revolve) {
    var state = {}; //note: here we convert CC raw values into user-friendly GUI values

    state.direction = '0,0,0'; //TODO!

    if (revolve.members.startAngle.expression || revolve.members.endAngle.expression) {
      state.startAngle = revolve.members.startAngle.expression;
      state.endAngle = revolve.members.endAngle.expression;
      state.type = 'custom';
    } else {
      var convert = function convert(value) {
        value = Number(value) / Math.PI * 180.0;
        if (value - Math.round(value) <= 1e-9) value = Math.round(value);
        return value;
      };

      state.startAngle = convert(revolve.members.startAngle.value);
      state.endAngle = convert(revolve.members.endAngle.value);
      if (state.startAngle === 0 && state.endAngle == 360) state.type = 'full';else if (state.endAngle - state.startAngle == 180) state.type = 'half';else if (state.endAngle - state.startAngle == 90) state.type = 'quarter';else state.type = 'custom';
    }

    return state;
  };

  _proto4.guiToClasscadValues = function guiToClasscadValues(state) {
    var type = state.type,
        startAngle = state.startAngle,
        endAngle = state.endAngle,
        direction = state.direction;
    startAngle = (Number(startAngle) || 0) / 180 * Math.PI;
    endAngle = (Number(endAngle) || 0) / 180 * Math.PI;

    if (type === 'full') {
      startAngle = 0;
      endAngle = 2 * Math.PI;
    } else if (type === 'half') endAngle = startAngle + Math.PI;else if (type === 'quarter') endAngle = startAngle + Math.PI / 2;

    return {
      members: {
        startAngle: {
          value: startAngle
        },
        endAngle: {
          value: endAngle
        } //TODO: direction?

      }
    };
  }; //executed when JS tree changes arrive from server


  _proto4.componentWillReceiveProps = function componentWillReceiveProps(_ref2) {
    var feature = _ref2.feature;
    var newState = this.classcadToGuiValues(feature);
    this.setState(newState);
  };

  _proto4.render = function render() {
    var _props4 = this.props,
        feature = _props4.feature,
        region = _props4.region;
    return React.createElement("group", {
      format: "Table"
    }, React.createElement(SketchRow, {
      id: region.id,
      name: "sketch",
      value: region.members.sketch
    }), React.createElement("dropdown", {
      name: "type",
      items: ['full', 'half', 'quarter', 'custom'],
      value: this.state.type,
      onValue: this.setType
    }), this.state.type !== 'full' && React.createElement("input", {
      name: "start angle",
      value: this.state.startAngle,
      onValue: this.setStartAngle,
      onLastEvent: this.updateOnEnter
    }), this.state.type === 'custom' && React.createElement("input", {
      name: "end angle",
      value: this.state.endAngle,
      onValue: this.setEndAngle,
      onLastEvent: this.updateOnEnter
    }), React.createElement("group", {
      format: "Buttons"
    }, React.createElement("button", {
      name: "Edit Sketch Region",
      format: "Default",
      onLastEvent: this.editSketchRegion
    })));
  };

  return Revolve;
}(React.Component), Object.defineProperty(_class6, "contextTypes", {
  configurable: true,
  enumerable: true,
  writable: true,
  value: {
    plugin: PropTypes.object
  }
}), _temp6)) || _class5);
var Feature = (_temp7 = _class7 =
/*#__PURE__*/
function (_Plugin) {
  _inheritsLoose(Feature, _Plugin);

  function Feature(session, args) {
    return _Plugin.call(this, session, _extends({
      type: args.feature.class,
      icon: args.name.toLowerCase(),
      resources: resources
    }, args)) || this;
  }

  var _proto5 = Feature.prototype;

  _proto5.render = function render() {
    var Feature = this.props.type === 'CC_Extrusion' ? Extrusion : Revolve;
    return React.createElement("group", null, React.createElement(Feature, {
      connection: this.connection.id,
      id: this.feature
    }), React.createElement("spacer", null), React.createElement("link", {
      value: this.dimensions.id,
      collapsable: true
    }));
  };

  _proto5.onEnabled = function onEnabled() {
    this.dimensions = new Dimensions(this.session, {
      name: 'Dimensions',
      collapsed: true,
      closeable: false,
      parent: this.id
    });
    this.dimensions.enabled = true;
  };

  _proto5.onDisabled = function onDisabled() {
    this.dimensions.destroy();
  };

  return Feature;
}(Plugin), Object.defineProperty(_class7, "contextMenuItems", {
  configurable: true,
  enumerable: true,
  writable: true,
  value: _extends({}, Plugin.contextMenuItems, {
    customItem: {
      name: "Extrude custom item",
      callback: function callback(feature) {
        console.log('!!!! Custom Item callback called');
        console.log(feature);
      }
    }
  })
}), _temp7);
export { Feature as default };