awv3/plugins/shader/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 _dec, _class, _class2, _temp2;

import * as THREE from 'three';
import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import Plugin from '../../session/plugin';
import debounce from 'lodash/debounce';
import isEqual from 'lodash/isEqual';
var RESOURCES = ['isometric'].reduce(function (prev, item) {
  var _extends2;

  return _extends({}, prev, (_extends2 = {}, _extends2[item] = require('!!url-loader!awv3-icons/32x32/' + item + '.png'), _extends2));
}, {});
var PROPS = ['opacity', 'reflectivity', 'metalness', 'roughness', 'clearCoat', 'clearCoatRoughness', 'envMapIntensity'];
var PRESETS = {
  default: [1, 1, 0.5, 0.65, 1, 0.7, 1],
  steelBright: [1, 1, 0.55, 0.5, 1.0, 0.35, 0.45],
  steelDark: [1, 1, 1, 0.55, 1, 0.3, 0],
  chrome: [1, 1, 0.5, 0, 1, 0.3, 0.8],
  aluminium: [1, 1, 0.3, 0.75, 1, 0.4, 0.6],
  flat: [1, 1, 0.4, 1, 1, 0.7, 1]
};

var getPropDefaults = function getPropDefaults(preset) {
  return PROPS.reduce(function (acc, key, i) {
    var _extends3;

    return _extends({}, acc, (_extends3 = {}, _extends3[key] = PRESETS[preset][i], _extends3));
  }, {});
};

var getPropValues = function getPropValues(state) {
  return PROPS.reduce(function (acc, key) {
    var _extends4;

    return _extends({}, acc, (_extends4 = {}, _extends4[key] = state[key], _extends4));
  }, {});
};

var applyProps = debounce(function (pool, state) {
  return pool.traverse(function (obj) {
    return obj.type === 'Mesh' && obj.material && obj.animate(obj.mapMaterial(getPropValues(state))).start(0);
  });
}, 10);
var Root = (_dec = connect(function (state) {
  return {
    activeConnection: state.globals.activeConnection
  };
}), _dec(_class = (_temp2 = _class2 =
/*#__PURE__*/
function (_React$Component) {
  _inheritsLoose(Root, _React$Component);

  function Root() {
    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: {
        target: undefined,
        current: 'default',
        props: getPropDefaults('default')
      }
    }), Object.defineProperty(_assertThisInitialized(_this), "setSelection", {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function value(_ref) {
        var target = _ref[0];
        return _this.setState({
          target: target
        });
      }
    }), _temp) || _assertThisInitialized(_this);
  }

  var _proto = Root.prototype;

  _proto.render = function render() {
    var _session$selector$sel,
        _session$selector,
        _this2 = this;

    var session = this.context.session;
    var activeConnection = this.props.activeConnection;
    var _state = this.state,
        target = _state.target,
        current = _state.current,
        props = _state.props;

    var newProps = _extends({}, props, {
      activeConnection: activeConnection
    });

    target = (_session$selector$sel = (_session$selector = session.selector) === null || _session$selector === void 0 ? void 0 : _session$selector.selectedObjects[0]) !== null && _session$selector$sel !== void 0 ? _session$selector$sel : session.pool;

    if (!isEqual(newProps, this.lastProps)) {
      target.setRenderOrder(props.opacity < 1 ? THREE.Object3D.RenderOrder.MeshesFirst : THREE.Object3D.RenderOrder.LinesFirst);
      applyProps(target, props);
    }

    this.lastProps = newProps;
    return React.createElement("group", {
      format: "Table"
    }, React.createElement("selection", {
      name: "Object",
      types: ['Mesh', 'Object'],
      limit: 1,
      onItems: this.ssetSelection
    }), React.createElement("dropdown", {
      name: "Preset",
      items: Object.keys(PRESETS),
      value: current,
      onValue: function onValue(current) {
        return _this2.setState({
          current: current,
          props: getPropDefaults(current)
        });
      }
    }), PROPS.map(function (name) {
      return React.createElement("slider", {
        key: name,
        name: name,
        value: props[name],
        max: 1,
        step: 0.01,
        positions: {
          0: '0',
          1: '1'
        },
        onValue: function onValue(value) {
          var _extends5;

          return _this2.setState({
            props: _extends({}, props, (_extends5 = {}, _extends5[name] = value, _extends5))
          });
        }
      });
    }));
  };

  return Root;
}(React.Component), Object.defineProperty(_class2, "contextTypes", {
  configurable: true,
  enumerable: true,
  writable: true,
  value: {
    session: PropTypes.object
  }
}), _temp2)) || _class);

var ShaderProps =
/*#__PURE__*/
function (_Plugin) {
  _inheritsLoose(ShaderProps, _Plugin);

  function ShaderProps(session, args) {
    return _Plugin.call(this, session, _extends({
      type: 'ShaderProps',
      icon: 'isometric',
      resources: RESOURCES,
      render: React.createElement(Root, null)
    }, args)) || this;
  }

  return ShaderProps;
}(Plugin);

export { ShaderProps as default };