@complat/react-spectra-editor 1.0.0-rc2 → 1.0.0-rc20.patch-1

package/dist/components/d3_multi/multi_focus_bk.js

@@ -1,533 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var d3 = _interopRequireWildcard(require("d3"));
-var _init = require("../../helpers/init");
-var _mount = require("../../helpers/mount");
-var _converter = require("../../helpers/converter");
-var _brush = _interopRequireDefault(require("../../helpers/brush"));
-var _compass = require("../../helpers/compass");
-var _list_layout = require("../../constants/list_layout");
-var _format = _interopRequireDefault(require("../../helpers/format"));
-var _chem = require("../../helpers/chem");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var MultiFocus = /*#__PURE__*/function () {
-  function MultiFocus(props) {
-    (0, _classCallCheck2.default)(this, MultiFocus);
-    var W = props.W,
-      H = props.H,
-      clickUiTargetAct = props.clickUiTargetAct,
-      selectUiSweepAct = props.selectUiSweepAct,
-      scrollUiWheelAct = props.scrollUiWheelAct,
-      entities = props.entities;
-    this.entities = entities;
-    this.jcampIdx = 0;
-    this.rootKlass = ".d3Line";
-    this.margin = {
-      t: 5,
-      b: 40,
-      l: 60,
-      r: 5
-    };
-    this.w = W - this.margin.l - this.margin.r;
-    this.h = H - this.margin.t - this.margin.b;
-    this.clickUiTargetAct = clickUiTargetAct;
-    this.selectUiSweepAct = selectUiSweepAct;
-    this.scrollUiWheelAct = scrollUiWheelAct;
-    this.brush = d3.brush();
-    this.brushX = d3.brushX();
-    this.axis = null;
-    this.path = null;
-    this.grid = null;
-    this.tags = null;
-    this.data = [];
-    this.otherLineData = [];
-    this.pathColor = 'steelblue';
-    this.dataPks = [];
-    this.dataPeckers = [];
-    this.tTrEndPts = null;
-    this.tSfPeaks = null;
-    this.root = null;
-    this.svg = null;
-    this.axisCall = (0, _init.InitAxisCall)(5);
-    this.pathCall = null;
-    this.tip = null;
-    this.factor = 0.125;
-    this.currentExtent = null;
-    this.shouldUpdate = {};
-    // this.freq = false;
-    this.layout = _list_layout.LIST_LAYOUT.CYCLIC_VOLTAMMETRY;
-    this.getShouldUpdate = this.getShouldUpdate.bind(this);
-    this.resetShouldUpdate = this.resetShouldUpdate.bind(this);
-    this.setTip = this.setTip.bind(this);
-    this.setDataParams = this.setDataParams.bind(this);
-    this.create = this.create.bind(this);
-    this.update = this.update.bind(this);
-    this.setConfig = this.setConfig.bind(this);
-    this.drawLine = this.drawLine.bind(this);
-    this.drawOtherLines = this.drawOtherLines.bind(this);
-    this.drawGrid = this.drawGrid.bind(this);
-    this.drawPeaks = this.drawPeaks.bind(this);
-    this.onClickTarget = this.onClickTarget.bind(this);
-    this.mergedPeaks = this.mergedPeaks.bind(this);
-    this.setDataPecker = this.setDataPecker.bind(this);
-    this.drawPeckers = this.drawPeckers.bind(this);
-    this.onClickPecker = this.onClickPecker.bind(this);
-    this.isFirefox = typeof InstallTrigger !== 'undefined';
-    this.cyclicvoltaSt = null;
-  }
-  (0, _createClass2.default)(MultiFocus, [{
-    key: "getShouldUpdate",
-    value: function getShouldUpdate(nextEpSt) {
-      var _this$shouldUpdate = this.shouldUpdate,
-        prevXt = _this$shouldUpdate.prevXt,
-        prevYt = _this$shouldUpdate.prevYt,
-        prevEpSt = _this$shouldUpdate.prevEpSt,
-        prevLySt = _this$shouldUpdate.prevLySt,
-        prevTePt = _this$shouldUpdate.prevTePt,
-        prevDtPk = _this$shouldUpdate.prevDtPk,
-        prevSfPk = _this$shouldUpdate.prevSfPk,
-        prevData = _this$shouldUpdate.prevData;
-      var _TfRescale = (0, _compass.TfRescale)(this),
-        xt = _TfRescale.xt,
-        yt = _TfRescale.yt;
-      var sameXY = xt(1.1) === prevXt && prevYt === yt(1.1);
-      var sameEpSt = prevEpSt === nextEpSt;
-      var sameLySt = prevLySt === this.layout;
-      var sameTePt = prevTePt === this.tTrEndPts.length;
-      var sameDtPk = prevDtPk === this.dataPks.length;
-      var sameSfPk = prevSfPk === this.tSfPeaks.length;
-      var sameData = prevData === this.data.length;
-      this.shouldUpdate = Object.assign({}, this.shouldUpdate, {
-        sameXY: sameXY,
-        sameEpSt: sameEpSt,
-        sameLySt: sameLySt,
-        // eslint-disable-line
-        sameTePt: sameTePt,
-        sameDtPk: sameDtPk,
-        sameSfPk: sameSfPk,
-        sameData: sameData // eslint-disable-line
-      });
-    }
-  }, {
-    key: "resetShouldUpdate",
-    value: function resetShouldUpdate(prevEpSt) {
-      var _TfRescale2 = (0, _compass.TfRescale)(this),
-        xt = _TfRescale2.xt,
-        yt = _TfRescale2.yt;
-      var prevXt = xt(1.1);
-      var prevYt = yt(1.1);
-      var prevTePt = this.tTrEndPts.length;
-      var prevDtPk = this.dataPks.length;
-      var prevSfPk = this.tSfPeaks.length;
-      var prevData = this.data.length;
-      var prevLySt = this.layout;
-      this.shouldUpdate = Object.assign({}, this.shouldUpdate, {
-        prevXt: prevXt,
-        prevYt: prevYt,
-        prevEpSt: prevEpSt,
-        prevLySt: prevLySt,
-        // eslint-disable-line
-        prevTePt: prevTePt,
-        prevDtPk: prevDtPk,
-        prevSfPk: prevSfPk,
-        prevData: prevData // eslint-disable-line
-      });
-    }
-  }, {
-    key: "setTip",
-    value: function setTip() {
-      this.tip = (0, _init.InitTip)();
-      this.root.call(this.tip);
-    }
-  }, {
-    key: "setDataParams",
-    value: function setDataParams(peaks, tTrEndPts, tSfPeaks, layout, cyclicvoltaSt) {
-      var _this = this;
-      var jcampIdx = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0;
-      this.jcampIdx = jcampIdx;
-      this.data = [];
-      this.otherLineData = [];
-      this.entities.forEach(function (entry, idx) {
-        var topic = entry.topic,
-          feature = entry.feature,
-          color = entry.color;
-        var currData = (0, _chem.convertTopic)(topic, layout, feature, 0);
-        if (idx === _this.jcampIdx) {
-          _this.data = (0, _toConsumableArray2.default)(currData);
-          _this.pathColor = color;
-        } else {
-          _this.otherLineData.push({
-            data: currData,
-            color: color
-          });
-        }
-      });
-      this.dataPks = (0, _toConsumableArray2.default)(peaks);
-      this.tTrEndPts = tTrEndPts;
-      this.tSfPeaks = tSfPeaks;
-      this.layout = layout;
-      this.cyclicvoltaSt = cyclicvoltaSt;
-    }
-  }, {
-    key: "updatePathCall",
-    value: function updatePathCall(xt, yt) {
-      this.pathCall = d3.line().x(function (d) {
-        return xt(d.x);
-      }).y(function (d) {
-        return yt(d.y);
-      });
-    }
-  }, {
-    key: "setConfig",
-    value: function setConfig(sweepExtentSt) {
-      // Domain Calculate
-      var _ref = sweepExtentSt || {
-          xExtent: false,
-          yExtent: false
-        },
-        xExtent = _ref.xExtent,
-        yExtent = _ref.yExtent;
-      if (!xExtent || !yExtent) {
-        var allData = (0, _toConsumableArray2.default)(this.data);
-        if (this.otherLineData) {
-          this.otherLineData.forEach(function (lineData) {
-            allData = [].concat((0, _toConsumableArray2.default)(allData), (0, _toConsumableArray2.default)(lineData.data));
-          });
-        }
-        var xes = d3.extent(allData, function (d) {
-          return d.x;
-        }).sort(function (a, b) {
-          return a - b;
-        });
-        xExtent = {
-          xL: xes[0],
-          xU: xes[1]
-        };
-        var btm = d3.min(allData, function (d) {
-          return d.y;
-        });
-        var top = d3.max(allData, function (d) {
-          return d.y;
-        });
-        var height = top - btm;
-        yExtent = {
-          yL: btm - this.factor * height,
-          yU: top + this.factor * height
-        };
-      }
-      this.scales.x.domain([xExtent.xL, xExtent.xU]);
-      this.scales.y.domain([yExtent.yL, yExtent.yU]);
-
-      // rescale for zoom
-      var _TfRescale3 = (0, _compass.TfRescale)(this),
-        xt = _TfRescale3.xt,
-        yt = _TfRescale3.yt;
-
-      // Axis Call
-      this.axisCall.x.scale(xt);
-      this.axisCall.y.scale(yt);
-      this.currentExtent = {
-        xExtent: xExtent,
-        yExtent: yExtent
-      };
-    }
-  }, {
-    key: "drawLine",
-    value: function drawLine() {
-      var _TfRescale4 = (0, _compass.TfRescale)(this),
-        xt = _TfRescale4.xt,
-        yt = _TfRescale4.yt;
-      this.updatePathCall(xt, yt);
-      this.path.attr('d', this.pathCall(this.data));
-      this.path.style('stroke', this.pathColor);
-    }
-  }, {
-    key: "drawOtherLines",
-    value: function drawOtherLines(layout) {
-      var _this2 = this;
-      d3.selectAll('.line-clip-compare').remove();
-      if (!this.otherLineData) return null;
-      this.otherLineData.forEach(function (entry, idx) {
-        var data = entry.data,
-          color = entry.color;
-        var pathColor = color ? color : _format.default.mutiEntitiesColors(idx);
-        var path = (0, _mount.MountComparePath)(_this2, pathColor, idx, 0.4);
-        path.attr('d', _this2.pathCall(data));
-      });
-      return null;
-    }
-  }, {
-    key: "drawGrid",
-    value: function drawGrid() {
-      var sameXY = this.shouldUpdate.sameXY;
-      if (sameXY) return;
-      this.grid.x.call(this.axisCall.x.tickSize(-this.h, 0, 0)).selectAll('line').attr('stroke', '#ddd').attr('stroke-opacity', 0.6).attr('fill', 'none');
-      this.grid.y.call(this.axisCall.y.tickSize(-this.w, 0, 0)).selectAll('line').attr('stroke', '#ddd').attr('stroke-opacity', 0.6).attr('fill', 'none');
-    }
-  }, {
-    key: "onClickTarget",
-    value: function onClickTarget(data) {
-      d3.event.stopPropagation();
-      d3.event.preventDefault();
-      var onPeak = true;
-      var spectraList = this.cyclicvoltaSt.spectraList;
-      var spectra = spectraList[this.jcampIdx];
-      var voltammetryPeakIdx = spectra.selectedIdx;
-      this.clickUiTargetAct(data, onPeak, voltammetryPeakIdx, this.jcampIdx);
-    }
-  }, {
-    key: "onClickPecker",
-    value: function onClickPecker(data) {
-      d3.event.stopPropagation();
-      d3.event.preventDefault();
-      var onPecker = true;
-      var spectraList = this.cyclicvoltaSt.spectraList;
-      var spectra = spectraList[this.jcampIdx];
-      var voltammetryPeakIdx = spectra.selectedIdx;
-      this.clickUiTargetAct(data, false, voltammetryPeakIdx, this.jcampIdx, onPecker);
-    }
-  }, {
-    key: "mergedPeaks",
-    value: function mergedPeaks(editPeakSt) {
-      if (!editPeakSt) return this.dataPks;
-      var spectraList = this.cyclicvoltaSt.spectraList;
-      var spectra = spectraList[this.jcampIdx];
-      if (spectra) {
-        this.dataPks = [];
-        this.dataPks = (0, _converter.PksEdit)(this.dataPks, editPeakSt, spectra.list);
-      } else {
-        this.dataPks = (0, _converter.PksEdit)(this.dataPks, editPeakSt, []);
-      }
-      return this.dataPks;
-    }
-  }, {
-    key: "setDataPecker",
-    value: function setDataPecker() {
-      var spectraList = this.cyclicvoltaSt.spectraList;
-      var spectra = spectraList[this.jcampIdx];
-      if (spectra) {
-        this.dataPeckers = (0, _converter.PeckersEdit)(spectra.list);
-      }
-      return this.dataPeckers;
-    }
-  }, {
-    key: "drawPeaks",
-    value: function drawPeaks(editPeakSt) {
-      var _this3 = this;
-      var _this$shouldUpdate2 = this.shouldUpdate,
-        sameXY = _this$shouldUpdate2.sameXY,
-        sameEpSt = _this$shouldUpdate2.sameEpSt,
-        sameDtPk = _this$shouldUpdate2.sameDtPk,
-        sameSfPk = _this$shouldUpdate2.sameSfPk;
-      if (!_format.default.isCyclicVoltaLayout(this.layout) && sameXY && sameEpSt && sameDtPk && sameSfPk) return;
-
-      // rescale for zoom
-      var _TfRescale5 = (0, _compass.TfRescale)(this),
-        xt = _TfRescale5.xt,
-        yt = _TfRescale5.yt;
-      var dPks = this.mergedPeaks(editPeakSt);
-      var mpp = this.tags.pPath.selectAll('path').data(dPks);
-      mpp.exit().attr('class', 'exit').remove();
-      var linePath = [{
-        x: -0.5,
-        y: 10
-      }, {
-        x: -0.5,
-        y: -20
-      }, {
-        x: 0.5,
-        y: -20
-      }, {
-        x: 0.5,
-        y: 10
-      }];
-      var lineSymbol = d3.line().x(function (d) {
-        return d.x;
-      }).y(function (d) {
-        return d.y;
-      })(linePath);
-      mpp.enter().append('path').attr('d', lineSymbol).attr('class', 'enter-peak').attr('fill', 'red').attr('stroke', 'pink').attr('stroke-width', 3).attr('stroke-opacity', 0.0).merge(mpp).attr('id', function (d) {
-        return "mpp".concat(Math.round(1000 * d.x));
-      }).attr('transform', function (d) {
-        return "translate(".concat(xt(d.x), ", ").concat(yt(d.y), ")");
-      }).on('mouseover', function (d, i, n) {
-        d3.select("#mpp".concat(Math.round(1000 * d.x))).attr('stroke-opacity', '1.0');
-        d3.select("#bpt".concat(Math.round(1000 * d.x))).style('fill', 'blue');
-        var tipParams = {
-          d: d,
-          layout: _this3.layout
-        };
-        _this3.tip.show(tipParams, n[i]);
-      }).on('mouseout', function (d, i, n) {
-        d3.select("#mpp".concat(Math.round(1000 * d.x))).attr('stroke-opacity', '0.0');
-        d3.select("#bpt".concat(Math.round(1000 * d.x))).style('fill', 'red');
-        var tipParams = {
-          d: d,
-          layout: _this3.layout
-        };
-        _this3.tip.hide(tipParams, n[i]);
-      }).on('click', function (d) {
-        return _this3.onClickTarget(d);
-      });
-      var ignoreRef = _format.default.isHplcUvVisLayout(this.layout);
-      if (ignoreRef) {
-        var bpTxt = this.tags.bpTxt.selectAll('text').data(dPks);
-        bpTxt.exit().attr('class', 'exit').remove();
-        bpTxt.enter().append('text').attr('class', 'peak-text').attr('font-family', 'Helvetica').style('font-size', '12px').attr('fill', '#228B22').style('text-anchor', 'middle').merge(bpTxt).attr('id', function (d) {
-          return "mpp".concat(Math.round(1000 * d.x));
-        }).text(function (d) {
-          return d.x.toFixed(2);
-        }).attr('transform', function (d) {
-          return "translate(".concat(xt(d.x), ", ").concat(yt(d.y) - 25, ")");
-        }).on('click', function (d) {
-          return _this3.onClickTarget(d);
-        });
-      }
-    }
-  }, {
-    key: "drawPeckers",
-    value: function drawPeckers() {
-      var _this4 = this;
-      var _this$shouldUpdate3 = this.shouldUpdate,
-        sameXY = _this$shouldUpdate3.sameXY,
-        sameEpSt = _this$shouldUpdate3.sameEpSt,
-        sameDtPk = _this$shouldUpdate3.sameDtPk,
-        sameSfPk = _this$shouldUpdate3.sameSfPk;
-      if (!_format.default.isCyclicVoltaLayout(this.layout) && sameXY && sameEpSt && sameDtPk && sameSfPk) return;
-
-      // rescale for zoom
-      var _TfRescale6 = (0, _compass.TfRescale)(this),
-        xt = _TfRescale6.xt,
-        yt = _TfRescale6.yt;
-      var dPks = this.setDataPecker();
-      var mpp = this.tags.peckerPath.selectAll('path').data(dPks);
-      mpp.exit().attr('class', 'exit').remove();
-      var linePath = [{
-        x: -0.5,
-        y: 10
-      }, {
-        x: -0.5,
-        y: -20
-      }, {
-        x: 0.5,
-        y: -20
-      }, {
-        x: 0.5,
-        y: 10
-      }];
-      var lineSymbol = d3.line().x(function (d) {
-        return d.x;
-      }).y(function (d) {
-        return d.y;
-      })(linePath);
-      mpp.enter().append('path').attr('d', lineSymbol).attr('class', 'enter-peak').attr('fill', '#228B22').attr('stroke', 'pink').attr('stroke-width', 3).attr('stroke-opacity', 0.0).merge(mpp).attr('id', function (d) {
-        return "mpp".concat(Math.round(1000 * d.x));
-      }).attr('transform', function (d) {
-        return "translate(".concat(xt(d.x), ", ").concat(yt(d.y), ")");
-      }).on('mouseover', function (d, i, n) {
-        d3.select("#mpp".concat(Math.round(1000 * d.x))).attr('stroke-opacity', '1.0');
-        d3.select("#bpt".concat(Math.round(1000 * d.x))).style('fill', 'blue');
-        var tipParams = {
-          d: d,
-          layout: _this4.layout
-        };
-        _this4.tip.show(tipParams, n[i]);
-      }).on('mouseout', function (d, i, n) {
-        d3.select("#mpp".concat(Math.round(1000 * d.x))).attr('stroke-opacity', '0.0');
-        d3.select("#bpt".concat(Math.round(1000 * d.x))).style('fill', '#228B22');
-        var tipParams = {
-          d: d,
-          layout: _this4.layout
-        };
-        _this4.tip.hide(tipParams, n[i]);
-      }).on('click', function (d) {
-        return _this4.onClickPecker(d);
-      });
-    }
-  }, {
-    key: "create",
-    value: function create(_ref2) {
-      var curveSt = _ref2.curveSt,
-        filterSeed = _ref2.filterSeed,
-        filterPeak = _ref2.filterPeak,
-        tTrEndPts = _ref2.tTrEndPts,
-        tSfPeaks = _ref2.tSfPeaks,
-        editPeakSt = _ref2.editPeakSt,
-        layoutSt = _ref2.layoutSt,
-        sweepExtentSt = _ref2.sweepExtentSt,
-        isUiNoBrushSt = _ref2.isUiNoBrushSt,
-        cyclicvoltaSt = _ref2.cyclicvoltaSt;
-      this.svg = d3.select(this.rootKlass).select('.d3Svg');
-      (0, _mount.MountMainFrame)(this, 'focus');
-      (0, _mount.MountClip)(this);
-      var curveIdx = curveSt.curveIdx;
-      var jcampIdx = curveIdx;
-      this.root = d3.select(this.rootKlass).selectAll('.focus-main');
-      this.scales = (0, _init.InitScale)(this, false);
-      this.setTip();
-      this.setDataParams(filterPeak, tTrEndPts, tSfPeaks, layoutSt, cyclicvoltaSt, jcampIdx);
-      (0, _compass.MountCompass)(this);
-      this.axis = (0, _mount.MountAxis)(this);
-      this.path = (0, _mount.MountPath)(this, this.pathColor);
-      this.grid = (0, _mount.MountGrid)(this);
-      this.tags = (0, _mount.MountTags)(this);
-      (0, _mount.MountAxisLabelX)(this);
-      (0, _mount.MountAxisLabelY)(this);
-      if (this.data && this.data.length > 0) {
-        this.setConfig(sweepExtentSt);
-        this.drawLine();
-        this.drawGrid();
-        this.drawOtherLines(layoutSt);
-        this.drawPeaks(editPeakSt);
-        this.drawPeckers();
-      }
-      (0, _brush.default)(this, false, isUiNoBrushSt);
-      this.resetShouldUpdate(editPeakSt);
-    }
-  }, {
-    key: "update",
-    value: function update(_ref3) {
-      var entities = _ref3.entities,
-        curveSt = _ref3.curveSt,
-        filterSeed = _ref3.filterSeed,
-        filterPeak = _ref3.filterPeak,
-        tTrEndPts = _ref3.tTrEndPts,
-        tSfPeaks = _ref3.tSfPeaks,
-        editPeakSt = _ref3.editPeakSt,
-        layoutSt = _ref3.layoutSt,
-        sweepExtentSt = _ref3.sweepExtentSt,
-        isUiNoBrushSt = _ref3.isUiNoBrushSt,
-        cyclicvoltaSt = _ref3.cyclicvoltaSt;
-      this.root = d3.select(this.rootKlass).selectAll('.focus-main');
-      this.scales = (0, _init.InitScale)(this, false);
-      var curveIdx = curveSt.curveIdx;
-      var jcampIdx = curveIdx;
-      this.entities = entities;
-      this.setDataParams(filterPeak, tTrEndPts, tSfPeaks, layoutSt, cyclicvoltaSt, jcampIdx);
-      if (this.data && this.data.length > 0) {
-        this.setConfig(sweepExtentSt);
-        this.getShouldUpdate(editPeakSt);
-        this.drawLine();
-        this.drawGrid();
-        this.drawOtherLines(layoutSt);
-        this.drawPeaks(editPeakSt);
-        this.drawPeckers();
-      }
-      (0, _brush.default)(this, false, isUiNoBrushSt);
-      this.resetShouldUpdate(editPeakSt);
-    }
-  }]);
-  return MultiFocus;
-}();
-var _default = MultiFocus;
-exports.default = _default;