modularity-front/dist/modules/ModuleUtilities.js

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.RendererInput = RendererInput;
exports.RendererOutput = RendererOutput;
exports.Resolver = Resolver;
exports.BooleanInput = exports.ObjectInput = exports.TextInput = exports.ArrayInput = exports.MakeView = exports.InputLink = exports.OutputLink = exports.OutputMarker = exports.InputMarker = exports.RemoveMarker = void 0;

var _react = _interopRequireDefault(require("react"));

var _Types = _interopRequireDefault(require("./Types.js"));

var _Logger = _interopRequireDefault(require("../systems/Logger"));

var _reactFontawesome = require("@fortawesome/react-fontawesome");

var _reactMaterialize = require("react-materialize");

var _reactJsonView = _interopRequireDefault(require("react-json-view"));

var _Dependencies3 = _interopRequireDefault(require("../systems/Dependencies"));

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

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }

function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }

function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }

function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

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

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

var RemoveMarker =
/*#__PURE__*/
function (_React$Component) {
  _inherits(RemoveMarker, _React$Component);

  function RemoveMarker(props) {
    _classCallCheck(this, RemoveMarker);

    return _possibleConstructorReturn(this, _getPrototypeOf(RemoveMarker).call(this, props));
  }

  _createClass(RemoveMarker, [{
    key: "drop",
    value: function drop() {
      if (this.props.onRemove) {
        this.props.onRemove();
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this = this;

      var mode = localStorage.getItem('AdminMode');

      if (mode !== "admin") {
        return '';
      }

      return _react.default.createElement("div", {
        className: "btn btn-flat " + this.props.className,
        onClick: function onClick() {
          return _this.drop();
        }
      }, _react.default.createElement("div", {
        className: "row"
      }, _react.default.createElement("div", {
        className: "col s2"
      }, _react.default.createElement("div", {
        className: "RemoveMarker"
      })), _react.default.createElement("div", {
        className: "col s5"
      }, _react.default.createElement("span", null, "Remove"))));
    }
  }]);

  return RemoveMarker;
}(_react.default.Component);

exports.RemoveMarker = RemoveMarker;

var InputMarker =
/*#__PURE__*/
function (_React$Component2) {
  _inherits(InputMarker, _React$Component2);

  function InputMarker(props) {
    _classCallCheck(this, InputMarker);

    return _possibleConstructorReturn(this, _getPrototypeOf(InputMarker).call(this, props));
  }

  _createClass(InputMarker, [{
    key: "drop",
    value: function drop() {
      if (!window._selectedModule) {
        return console.log("No selected module!");
      }

      if (this.props.onDrop) {
        this.props.onDrop(window._selectedModule);
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      return _react.default.createElement("div", {
        className: "btn btn-flat " + (this.props.className || ''),
        onClick: function onClick() {
          return _this2.drop();
        },
        onDragOver: function onDragOver(e) {
          return e.preventDefault();
        },
        onDrop: function onDrop(e) {
          return _this2.drop();
        }
      }, _react.default.createElement("div", {
        className: "InputMarker"
      }), _react.default.createElement("span", null, this.props.name || 'No NAME'));
    }
  }]);

  return InputMarker;
}(_react.default.Component); // Blueball Corporation Output marker handling for green light


exports.InputMarker = InputMarker;
var OutputMarkers = [];

var OutputMarker =
/*#__PURE__*/
function (_React$Component3) {
  _inherits(OutputMarker, _React$Component3);

  function OutputMarker(props) {
    _classCallCheck(this, OutputMarker);

    return _possibleConstructorReturn(this, _getPrototypeOf(OutputMarker).call(this, props));
  }

  _createClass(OutputMarker, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      OutputMarkers.push(this);
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      var indx = OutputMarkers.indexOf(this);
      if (indx > -1) OutputMarkers.splice(indx, 1);
    }
  }, {
    key: "drop",
    value: function drop(e) {
      e.stopPropagation();

      if (this.props.module) {
        window._selectedModule = this.props.module;
        OutputMarkers.map(function (marker) {
          return marker.forceUpdate();
        });
      } else {
        console.log("No module bind on this marker");
      }
    }
  }, {
    key: "_dragStart",
    value: function _dragStart(e) {
      this.drop(e);
    }
  }, {
    key: "render",
    value: function render() {
      var _this3 = this;

      var cls = this.props.module === window._selectedModule ? 'selected' : '';
      return _react.default.createElement("div", {
        className: "row left-align",
        style: {
          margin: 0
        }
      }, _react.default.createElement("div", {
        className: "col s2"
      }, _react.default.createElement("div", {
        className: 'OutputMarker ' + cls,
        onClick: function onClick(e) {
          return _this3.drop(e);
        },
        draggable: "true",
        onDragStart: function onDragStart(e) {
          return _this3._dragStart(e);
        }
      })), _react.default.createElement("div", {
        className: "col s10"
      }, this.props.text));
    }
  }]);

  return OutputMarker;
}(_react.default.Component);

exports.OutputMarker = OutputMarker;

var OutputLink =
/*#__PURE__*/
function (_Dependencies) {
  _inherits(OutputLink, _Dependencies);

  function OutputLink(props) {
    _classCallCheck(this, OutputLink);

    return _possibleConstructorReturn(this, _getPrototypeOf(OutputLink).call(this, props));
  }

  _createClass(OutputLink, [{
    key: "drag",
    value: function drag() {
      this.LinkManager.selectOutput(this.props.output); //console.log(this.props.output);
      // console.log("OutputLink drop", this.props.input);

      if (this.props.onUpdate) this.props.onUpdate();
      this.forceUpdate();
    }
  }, {
    key: "render",
    value: function render() {
      var _this4 = this;

      // console.log(this.props.output)
      if (!this.props.output) return '';
      return _react.default.createElement("div", {
        className: "row Output"
      }, _react.default.createElement("div", {
        className: "col s2"
      }, _react.default.createElement("div", {
        className: "OutputMarker",
        onClick: function onClick() {
          return _this4.drag();
        },
        draggable: "true",
        onDragStart: function onDragStart() {
          return _this4.drag();
        }
      })), _react.default.createElement("div", {
        className: "col s5"
      }, this.props.output.name), _react.default.createElement("div", {
        className: "col s5"
      }, _react.default.createElement("button", {
        tabIndex: "-1",
        type: "button",
        className: "btn btn-secondary clearLinks",
        onClick: function onClick() {
          _this4.LinkManager.breakOutputLinks(_this4.props.output);

          _this4.forceUpdate();
        }
      }, _react.default.createElement("span", null, this.LinkManager.getOutputConnections(this.props.output).length), _react.default.createElement(_reactMaterialize.Icon, {
        tiny: true
      }, "leak_remove"))));
    }
  }]);

  return OutputLink;
}(_Dependencies3.default);

exports.OutputLink = OutputLink;

var InputLink =
/*#__PURE__*/
function (_Dependencies2) {
  _inherits(InputLink, _Dependencies2);

  function InputLink(props) {
    _classCallCheck(this, InputLink);

    return _possibleConstructorReturn(this, _getPrototypeOf(InputLink).call(this, props));
  }

  _createClass(InputLink, [{
    key: "drop",
    value: function drop() {
      // console.log("Input drop", this.props.input);
      this.LinkManager.connectSelected(this.props.input);
      if (this.props.onUpdate) this.props.onUpdate();
      this.forceUpdate();
    }
  }, {
    key: "render",
    value: function render() {
      var _this5 = this;

      if (!this.props.input) return '';
      return _react.default.createElement("div", {
        className: "row Input"
      }, _react.default.createElement("div", {
        className: "col s2"
      }, _react.default.createElement("div", {
        className: "InputMarker",
        onClick: function onClick() {
          return _this5.drop();
        },
        onDrop: function onDrop() {
          return _this5.drop();
        }
      })), _react.default.createElement("div", {
        className: "col s5"
      }, this.props.input.name), _react.default.createElement("div", {
        className: "col s5"
      }, _react.default.createElement("button", {
        tabIndex: -1,
        type: "button",
        className: "btn btn-secondary clearLinks",
        onClick: function onClick() {
          _this5.LinkManager.breakInputLinks(_this5.props.input);

          _this5.forceUpdate();
        }
      }, _react.default.createElement("span", null, this.LinkManager.getInputConnections(this.props.input).length), _react.default.createElement(_reactMaterialize.Icon, {
        tiny: true
      }, "leak_remove"))));
    }
  }]);

  return InputLink;
}(_Dependencies3.default);

exports.InputLink = InputLink;

var MakeView =
/*#__PURE__*/
function (_React$Component4) {
  _inherits(MakeView, _React$Component4);

  function MakeView(props) {
    var _this6;

    _classCallCheck(this, MakeView);

    _this6 = _possibleConstructorReturn(this, _getPrototypeOf(MakeView).call(this, props));
    _this6.state = {
      view: props.module.view.value || false
    };
    return _this6;
  }

  _createClass(MakeView, [{
    key: "setViewUrl",
    value: function setViewUrl(url) {
      //console.log(url);
      this.props.module._change('view', url);
    }
  }, {
    key: "render",
    value: function render() {
      var _this7 = this;

      return this.state.view ? _react.default.createElement("div", {
        className: "form-group"
      }, _react.default.createElement("label", null, "View"), _react.default.createElement("input", {
        type: "text",
        placeholder: "View",
        onChange: function onChange(e) {
          if (e.target.value === "") _this7.setViewUrl("");

          _this7.setState({
            view: e.target.value
          });
        },
        className: "form-control form-control-sm",
        value: this.state.view,
        onKeyPress: function onKeyPress(e) {
          if (e.key === "Enter") _this7.setViewUrl(_this7.state.view);
        }
      })) : _react.default.createElement("button", {
        className: "form-control form-control-sm",
        onClick: function onClick() {
          return _this7.setState({
            view: true
          });
        }
      }, "MakeView");
    }
  }]);

  return MakeView;
}(_react.default.Component);

exports.MakeView = MakeView;

var ArrayInput =
/*#__PURE__*/
function (_React$Component5) {
  _inherits(ArrayInput, _React$Component5);

  function ArrayInput(props) {
    var _this8;

    _classCallCheck(this, ArrayInput);

    _this8 = _possibleConstructorReturn(this, _getPrototypeOf(ArrayInput).call(this, props));
    _this8.state = {
      newdata: null,
      text: ''
    };

    _this8.updateType(_this8.props.input.arrType);

    return _this8;
  }

  _createClass(ArrayInput, [{
    key: "updateType",
    value: function updateType(type) {
      this.Type = type;

      switch (this.Type) {
        case _Types.default.Boolean:
          this.ctor = BooleanInput;
          break;

        case _Types.default.Number:
        case _Types.default.Real:
        case _Types.default.Text:
          this.ctor = TextInput;
          break;

        case _Types.default.Object:
          this.ctor = ObjectInput;
          break;

        default:
          _Logger.default.warning("Array input with no arrType");

          break;
      }
    }
  }, {
    key: "remove",
    value: function remove(item) {
      var arr = _toConsumableArray(this.props.input.value);

      var indx = arr.indexOf(item);
      arr.splice(indx, 1);
      this.props.change(arr);
    }
  }, {
    key: "add",
    value: function add(item) {
      var arr = [].concat(_toConsumableArray(this.props.input.value), [item]);
      this.props.change(arr);
    }
  }, {
    key: "change",
    value: function change(key, item) {
      var arr = _toConsumableArray(this.props.input.value);

      arr[key] = item;
      this.props.change(arr);
    }
  }, {
    key: "render",
    value: function render() {
      var _this9 = this;

      var Renderer = this.ctor;
      return _react.default.createElement("div", {
        className: "form-group ArrayInput"
      }, _react.default.createElement("div", {
        className: "row"
      }, this.props.withoutLink ? '' : _react.default.createElement("div", {
        className: "col s12"
      }, _react.default.createElement(InputLink, {
        input: this.props.input
      })), _react.default.createElement("div", {
        className: "col s12"
      }, this.ctor ? this.props.input.value.map(function (item, key) {
        //console.log(item);
        return _react.default.createElement("div", {
          className: "row valign-wrapper",
          key: key + key
        }, _react.default.createElement("div", {
          className: "col"
        }, key), _react.default.createElement("div", {
          className: "col s11"
        }, _react.default.createElement(Renderer, {
          key: key,
          input: {
            value: item
          },
          change: function change(v) {
            return _this9.change(key, v);
          },
          withoutLink: true
        })));
      }) : "Cannot render this type: " + this.Type), _react.default.createElement("div", {
        className: "col s12"
      }, _react.default.createElement("div", {
        className: "row valign-wrapper"
      }, _react.default.createElement("div", {
        className: "col s5"
      }, _react.default.createElement(_reactMaterialize.Button, {
        onClick: function onClick() {
          _this9.add(_this9.state.newdata);

          _this9.setState({
            newdata: null
          });
        }
      }, "Add")), _react.default.createElement("div", {
        className: "col s7"
      }, _react.default.createElement(Renderer, {
        input: {},
        change: function change(newdata) {
          return _this9.setState({
            newdata: newdata
          });
        },
        withoutLink: true
      }))))));
    }
  }]);

  return ArrayInput;
}(_react.default.Component);

exports.ArrayInput = ArrayInput;

var TextInput =
/*#__PURE__*/
function (_React$Component6) {
  _inherits(TextInput, _React$Component6);

  function TextInput(props) {
    _classCallCheck(this, TextInput);

    return _possibleConstructorReturn(this, _getPrototypeOf(TextInput).call(this, props));
  }

  _createClass(TextInput, [{
    key: "render",
    value: function render() {
      var _this10 = this;

      var random = Math.random() * 9876568;
      return _react.default.createElement("div", {
        className: "row TextInput"
      }, this.props.withoutLink ? '' : _react.default.createElement("div", {
        className: "col s12"
      }, _react.default.createElement(InputLink, {
        input: this.props.input
      })), _react.default.createElement("div", {
        className: "col " + (this.props.withoutLink ? 's12' : 's6')
      }, _react.default.createElement("input", {
        type: "text",
        placeholder: this.props.input.name,
        id: random,
        className: "form-control form-control-sm",
        tabIndex: "0",
        defaultValue: this.props.input.value,
        onBlur: function onBlur(e) {
          _this10.props.change(e.target.value);
        },
        onKeyPress: function onKeyPress(e) {
          if (e.key === "Enter") {
            _this10.props.change(e.target.value);
          }

          return e;
        }
      })));
    }
  }]);

  return TextInput;
}(_react.default.Component);

exports.TextInput = TextInput;

var ObjectInput =
/*#__PURE__*/
function (_React$Component7) {
  _inherits(ObjectInput, _React$Component7);

  function ObjectInput(props) {
    _classCallCheck(this, ObjectInput);

    return _possibleConstructorReturn(this, _getPrototypeOf(ObjectInput).call(this, props));
  }

  _createClass(ObjectInput, [{
    key: "render",
    value: function render() {
      var _this11 = this;

      var obj = this.props.input.value;
      return _react.default.createElement("div", {
        className: "row ObjectInput"
      }, this.props.withoutLink ? '' : _react.default.createElement("div", {
        className: "col s12"
      }, _react.default.createElement("div", {
        className: "row"
      }, _react.default.createElement("div", {
        className: "col s10"
      }, _react.default.createElement(InputLink, {
        input: this.props.input
      })), _react.default.createElement("div", {
        className: "col s2"
      }, _react.default.createElement("input", {
        type: "text",
        className: "pasteField",
        onPaste: function onPaste(s) {
          var data = s.clipboardData.getData('Text');

          try {
            var r = JSON.parse(data);

            _this11.props.change(r);
          } catch (e) {
            return;
          }
        }
      })))), _react.default.createElement("div", {
        className: "col s12"
      }, _react.default.createElement(_reactJsonView.default, {
        src: obj,
        onAdd: function onAdd(add) {
          _this11.props.change(add.new_value);
        },
        theme: "apathy",
        onEdit: function onEdit(e) {
          return _this11.props.change(e.updated_src);
        },
        displayDataTypes: false,
        enableClipboard: true,
        collapsed: true,
        collapseStringsAfterLength: 7,
        onDelete: function onDelete(e) {
          return _this11.props.change(e.updated_src);
        }
      })));
    }
  }]);

  return ObjectInput;
}(_react.default.Component);

exports.ObjectInput = ObjectInput;

var BooleanInput =
/*#__PURE__*/
function (_React$Component8) {
  _inherits(BooleanInput, _React$Component8);

  function BooleanInput(props) {
    _classCallCheck(this, BooleanInput);

    return _possibleConstructorReturn(this, _getPrototypeOf(BooleanInput).call(this, props));
  }

  _createClass(BooleanInput, [{
    key: "render",
    value: function render() {
      var _this12 = this;

      var v = this.props.input.value;
      return _react.default.createElement("div", {
        className: "row BooleanInput"
      }, _react.default.createElement("div", {
        className: "col s12"
      }, _react.default.createElement(InputLink, {
        input: this.props.input
      })), _react.default.createElement("div", {
        className: "switch col s12"
      }, _react.default.createElement("label", null, "Off", _react.default.createElement("input", {
        type: "checkbox",
        checked: v
      }), _react.default.createElement("span", {
        className: "lever",
        onClick: function onClick() {
          _this12.props.change(!v);
        }
      }), "On")));
    }
  }]);

  return BooleanInput;
}(_react.default.Component);

exports.BooleanInput = BooleanInput;

function RendererInput(input, _change) {
  switch (input.type) {
    case _Types.default.View:
      break;
      return _react.default.createElement(MakeView, {
        module: this
      });

    case _Types.default.Boolean:
      return _react.default.createElement(BooleanInput, {
        input: input,
        change: function change(value) {
          return _change(input.name, value, input);
        }
      });

    case _Types.default.Whatever:
    case _Types.default.Text:
    case _Types.default.Number:
    case _Types.default.Real:
      return _react.default.createElement(TextInput, {
        input: input,
        change: function change(value) {
          return _change(input.name, value, input);
        }
      });

    case _Types.default.Array:
      return _react.default.createElement(ArrayInput, {
        input: input,
        change: function change(value) {
          return _change(input.name, value, input);
        }
      });

    case _Types.default.Object:
      return _react.default.createElement(ObjectInput, {
        input: input,
        change: function change(value) {
          return _change(input.name, value, input);
        }
      });

    case _Types.default.URL:
      break;

    case _Types.default.Link:
      return _react.default.createElement("div", {
        className: "row"
      }, _react.default.createElement("div", {
        className: "s6"
      }, _react.default.createElement(InputLink, {
        input: input
      })));

    default:
      throw new Error("Input not valid", input);
      break;
  }
}

function RendererOutput(output) {
  return _react.default.createElement("div", {
    className: "row"
  }, _react.default.createElement("div", {
    className: "col s6"
  }, _react.default.createElement(OutputLink, {
    output: output
  })));
}

function Resolver(input, value) {
  var msg = "Resolver cannot parse Input Field";

  switch (input.type) {
    case _Types.default.Object:
      input.value = value || input.value || {};
      break;

    case _Types.default.Boolean:
      if (value !== undefined && value !== null) {
        input.value = !!value;
      }

      break;

    case _Types.default.Number:
      try {
        input.value = parseInt(value === undefined || value === null ? input.value : value);
      } catch (e) {
        _Logger.default.warning(msg, {
          inputField: input
        });
      }

      break;

    case _Types.default.Real:
      try {
        input.value = parseFloat(value === undefined || value === null ? input.value : value);
      } catch (e) {
        _Logger.default.warning(msg, {
          inputField: input
        });
      }

      break;

    case _Types.default.Text:
      if (value !== undefined && value !== null) {
        input.value = value;
      }

      break;

    case _Types.default.Array:
      if (!Array.isArray(value)) {
        try {
          if (typeof value === "string") {
            input.value = JSON.parse(value);
          }
        } catch (e) {
          _Logger.default.warning(msg, {
            inputField: input
          });
        }
      } else {
        input.value = value;
      }

      break;

    default:
      input.value = value;
      break;
  }

  return input.value;
}