@searpent/react-image-annotate 2.0.75 → 2.0.76

package/Annotator/reducers/get-active-image.js

@@ -1,27 +0,0 @@
-import { getIn } from "seamless-immutable";
-export default (function (state) {
-  var currentImageIndex = null,
-      pathToActiveImage,
-      activeImage;
-
-  if (state.annotationType === "image") {
-    currentImageIndex = state.selectedImage;
-
-    if (currentImageIndex === -1) {
-      currentImageIndex = null;
-      activeImage = null;
-    } else {
-      pathToActiveImage = ["images", currentImageIndex];
-      activeImage = getIn(state, pathToActiveImage);
-    }
-  } else if (state.annotationType === "video") {
-    pathToActiveImage = ["keyframes", state.currentVideoTime || 0];
-    activeImage = getIn(state, pathToActiveImage) || null;
-  }
-
-  return {
-    currentImageIndex: currentImageIndex,
-    pathToActiveImage: pathToActiveImage,
-    activeImage: activeImage
-  };
-});

package/Annotator/reducers/get-implied-video-regions.js

@@ -1,180 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread";
-var emptyArr = [];
-export default (function (keyframes, time) {
-  if (keyframes[time || 0]) {
-    return keyframes[time || 0].regions;
-  } // Get surrounding video keyframes
-
-
-  var keyframeTimes = Object.keys(keyframes).map(function (a) {
-    return parseInt(a);
-  }).filter(function (a) {
-    return !isNaN(a);
-  });
-  if (keyframeTimes.length === 0) return emptyArr;
-  keyframeTimes.sort(function (a, b) {
-    return a - b;
-  });
-  var nextKeyframeTimeIndex = keyframeTimes.findIndex(function (kt) {
-    return kt >= time;
-  });
-
-  if (nextKeyframeTimeIndex === -1) {
-    return keyframes[keyframeTimes[keyframeTimes.length - 1]].regions || emptyArr;
-  } else if (nextKeyframeTimeIndex === 0) {
-    return emptyArr;
-  }
-
-  var t1 = keyframeTimes[nextKeyframeTimeIndex - 1];
-  var prevKeyframe = keyframes[t1];
-  var t2 = keyframeTimes[nextKeyframeTimeIndex];
-  var nextKeyframe = keyframes[t2];
-  var prevRegionMap = {},
-      nextRegionMap = {};
-  var _iteratorNormalCompletion = true;
-  var _didIteratorError = false;
-  var _iteratorError = undefined;
-
-  try {
-    for (var _iterator = prevKeyframe.regions[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
-      var region = _step.value;
-      prevRegionMap[region.id] = region;
-    }
-  } catch (err) {
-    _didIteratorError = true;
-    _iteratorError = err;
-  } finally {
-    try {
-      if (!_iteratorNormalCompletion && _iterator.return != null) {
-        _iterator.return();
-      }
-    } finally {
-      if (_didIteratorError) {
-        throw _iteratorError;
-      }
-    }
-  }
-
-  var _iteratorNormalCompletion2 = true;
-  var _didIteratorError2 = false;
-  var _iteratorError2 = undefined;
-
-  try {
-    for (var _iterator2 = nextKeyframe.regions[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-      var _region = _step2.value;
-      nextRegionMap[_region.id] = _region;
-    }
-  } catch (err) {
-    _didIteratorError2 = true;
-    _iteratorError2 = err;
-  } finally {
-    try {
-      if (!_iteratorNormalCompletion2 && _iterator2.return != null) {
-        _iterator2.return();
-      }
-    } finally {
-      if (_didIteratorError2) {
-        throw _iteratorError2;
-      }
-    }
-  }
-
-  var impliedRegions = []; // Weighted time coefficients for linear transition
-
-  var w1 = (t2 - time) / (t2 - t1);
-  var w2 = 1 - w1;
-
-  var _loop = function _loop(regionId) {
-    var _ref = [prevRegionMap[regionId], nextRegionMap[regionId]],
-        prev = _ref[0],
-        next = _ref[1];
-
-    if (!next) {
-      impliedRegions.push(_objectSpread({}, prev, {
-        highlighted: false,
-        editingLabels: false
-      }));
-      return "continue";
-    }
-
-    switch (prev.type) {
-      case "point":
-        {
-          impliedRegions.push(_objectSpread({}, prev, {
-            highlighted: false,
-            editingLabels: false,
-            x: prev.x * w1 + next.x * w2,
-            y: prev.y * w1 + next.y * w2
-          }));
-          break;
-        }
-
-      case "box":
-        {
-          impliedRegions.push(_objectSpread({}, prev, {
-            highlighted: false,
-            editingLabels: false,
-            x: prev.x * w1 + next.x * w2,
-            y: prev.y * w1 + next.y * w2,
-            w: prev.w * w1 + next.w * w2,
-            h: prev.h * w1 + next.h * w2
-          }));
-          break;
-        }
-
-      case "polygon":
-        {
-          if (next.points.length === prev.points.length) {
-            impliedRegions.push(_objectSpread({}, prev, {
-              highlighted: false,
-              editingLabels: false,
-              points: prev.points.map(function (pp, i) {
-                return [pp[0] * w1 + next.points[i][0] * w2, pp[1] * w1 + next.points[i][1] * w2];
-              })
-            }));
-          } else {
-            impliedRegions.push(prev);
-          }
-
-          break;
-        }
-
-      case "keypoints":
-        {
-          var newPoints = {};
-
-          for (var _i = 0, _Object$entries = Object.entries(prev.points); _i < _Object$entries.length; _i++) {
-            var _ref4 = _Object$entries[_i];
-
-            var _ref3 = _slicedToArray(_ref4, 2);
-
-            var pointId = _ref3[0];
-            var prevPoint = _ref3[1];
-            newPoints[pointId] = {
-              x: prevPoint.x * w1 + next.points[pointId].x * w2,
-              y: prevPoint.y * w1 + next.points[pointId].y * w2
-            };
-          }
-
-          impliedRegions.push(_objectSpread({}, prev, {
-            highlighted: false,
-            editingLabels: false,
-            points: newPoints
-          }));
-          break;
-        }
-
-      default:
-        break;
-    }
-  };
-
-  for (var regionId in prevRegionMap) {
-    var _ret = _loop(regionId);
-
-    if (_ret === "continue") continue;
-  }
-
-  return impliedRegions;
-});

package/Annotator/reducers/history-handler.js

@@ -1,38 +0,0 @@
-import { setIn, updateIn, asMutable, without } from "seamless-immutable";
-import moment from "moment";
-var typesToSaveWithHistory = {
-  BEGIN_BOX_TRANSFORM: "Transform/Move Box",
-  BEGIN_MOVE_POINT: "Move Point",
-  DELETE_REGION: "Delete Region"
-};
-export var saveToHistory = function saveToHistory(state, name) {
-  return updateIn(state, ["history"], function (h) {
-    return [{
-      time: moment().toDate(),
-      state: without(state, "history"),
-      name: name
-    }].concat((h || []).slice(0, 9));
-  });
-};
-export default (function (reducer) {
-  return function (state, action) {
-    var prevState = state;
-    var nextState = reducer(state, action);
-
-    if (action.type === "RESTORE_HISTORY") {
-      if (state.history.length > 0) {
-        return setIn(nextState.history[0].state, ["history"], nextState.history.slice(1));
-      }
-    } else {
-      if (prevState !== nextState && Object.keys(typesToSaveWithHistory).includes(action.type)) {
-        return setIn(nextState, ["history"], [{
-          time: moment().toDate(),
-          state: without(prevState, "history"),
-          name: typesToSaveWithHistory[action.type] || action.type
-        }].concat(nextState.history || []).slice(0, 9));
-      }
-    }
-
-    return nextState;
-  };
-});

package/Annotator/reducers/image-reducer.js

@@ -1,20 +0,0 @@
-import { setIn } from "seamless-immutable";
-import getActiveImage from "./get-active-image";
-export default (function (state, action) {
-  var _getActiveImage = getActiveImage(state),
-      currentImageIndex = _getActiveImage.currentImageIndex,
-      pathToActiveImage = _getActiveImage.pathToActiveImage,
-      activeImage = _getActiveImage.activeImage;
-
-  switch (action.type) {
-    case "IMAGE_OR_VIDEO_LOADED":
-      {
-        return setIn(state, ["images", currentImageIndex, "pixelSize"], {
-          w: action.metadata.naturalWidth,
-          h: action.metadata.naturalHeight
-        });
-      }
-  }
-
-  return state;
-});

package/Annotator/reducers/video-reducer.js

@@ -1,88 +0,0 @@
-import { setIn, without } from "seamless-immutable";
-import getImpliedVideoRegions from "./get-implied-video-regions";
-import { saveToHistory } from "./history-handler.js";
-export default (function (state, action) {
-  var copyImpliedRegions = function copyImpliedRegions() {
-    return setIn(saveToHistory(state, "Add Keyframe"), ["keyframes", state.currentVideoTime || 0], {
-      regions: getImpliedVideoRegions(state.keyframes, state.currentVideoTime)
-    });
-  };
-
-  switch (action.type) {
-    case "IMAGE_OR_VIDEO_LOADED":
-      {
-        var duration = action.metadata.duration;
-
-        if (typeof duration === "number") {
-          return setIn(state, ["videoDuration"], duration * 1000);
-        }
-      }
-
-    case "HEADER_BUTTON_CLICKED":
-      {
-        switch (action.buttonName.toLowerCase()) {
-          case "play":
-            return setIn(state, ["videoPlaying"], true);
-
-          case "pause":
-            return setIn(state, ["videoPlaying"], false);
-        }
-      }
-
-    case "CHANGE_VIDEO_TIME":
-      {
-        return setIn(state, ["currentVideoTime"], action.newTime);
-      }
-
-    case "CHANGE_VIDEO_PLAYING":
-      {
-        return setIn(state, ["videoPlaying"], action.isPlaying);
-      }
-
-    case "DELETE_KEYFRAME":
-      {
-        return setIn(state, ["keyframes"], without(state.keyframes, action.time));
-      }
-
-    default:
-      break;
-  } // Before the user modifies regions, copy the interpolated regions over to a
-  // new keyframe
-
-
-  if (!state.keyframes[state.currentVideoTime]) {
-    switch (action.type) {
-      case "BEGIN_BOX_TRANSFORM":
-      case "BEGIN_MOVE_POINT":
-      case "BEGIN_MOVE_KEYPOINT":
-      case "BEGIN_MOVE_POLYGON_POINT":
-      case "ADD_POLYGON_POINT":
-      case "SELECT_REGION":
-      case "CHANGE_REGION":
-      case "DELETE_REGION":
-      case "OPEN_REGION_EDITOR":
-        return copyImpliedRegions();
-
-      case "MOUSE_DOWN":
-        {
-          switch (state.selectedTool) {
-            case "create-point":
-            case "create-polygon":
-            case "create-box":
-            case "create-keypoints":
-              return copyImpliedRegions();
-
-            default:
-              break;
-          }
-
-          break;
-        }
-
-      default:
-        break;
-    }
-  }
-
-  return state;
-});

package/ClassSelectionMenu/index.js

@@ -1,140 +0,0 @@
-import React, { useEffect } from "react";
-import { styled } from "@mui/material/styles";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-import Box from "@mui/material/Box";
-import * as muiColors from "@mui/material/colors";
-import SidebarBoxContainer from "../SidebarBoxContainer";
-import BallotIcon from "@mui/icons-material/Ballot";
-import capitalize from "lodash/capitalize";
-import classnames from "classnames";
-import useColors from "../hooks/use-colors";
-var theme = createTheme();
-var LabelContainer = styled("div")(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    display: "flex",
-    paddingTop: 4,
-    paddingBottom: 4,
-    paddingLeft: 16,
-    paddingRight: 16,
-    alignItems: "center",
-    cursor: "pointer",
-    opacity: 0.7,
-    backgroundColor: "#fff",
-    "&:hover": {
-      opacity: 1
-    },
-    "&.selected": {
-      opacity: 1,
-      fontWeight: "bold"
-    }
-  };
-});
-var Circle = styled("div")(function (_ref2) {
-  var theme = _ref2.theme;
-  return {
-    width: 12,
-    height: 12,
-    borderRadius: 12,
-    marginRight: 8
-  };
-});
-var Label = styled("div")(function (_ref3) {
-  var theme = _ref3.theme;
-  return {
-    fontSize: 11
-  };
-});
-var DashSep = styled("div")(function (_ref4) {
-  var theme = _ref4.theme;
-  return {
-    flexGrow: 1,
-    borderBottom: "2px dotted ".concat(muiColors.grey[300]),
-    marginLeft: 8,
-    marginRight: 8
-  };
-});
-var Number = styled("div")(function (_ref5) {
-  var theme = _ref5.theme;
-  return {
-    fontSize: 11,
-    textAlign: "center",
-    minWidth: 14,
-    paddingTop: 2,
-    paddingBottom: 2,
-    fontWeight: "bold",
-    color: muiColors.grey[700]
-  };
-});
-export var ClassSelectionMenu = function ClassSelectionMenu(_ref6) {
-  var selectedCls = _ref6.selectedCls,
-      regionClsList = _ref6.regionClsList,
-      onSelectCls = _ref6.onSelectCls;
-
-  var _useColors = useColors(),
-      clsColor = _useColors.clsColor;
-
-  useEffect(function () {
-    var keyMapping = {};
-
-    var _loop = function _loop(i) {
-      keyMapping[i + 1] = function () {
-        return onSelectCls(regionClsList[i]);
-      };
-    };
-
-    for (var i = 0; i < 9 && i < regionClsList.length; i++) {
-      _loop(i);
-    }
-
-    var onKeyDown = function onKeyDown(e) {
-      if (keyMapping[e.key]) {
-        keyMapping[e.key]();
-        e.preventDefault();
-        e.stopPropagation();
-      }
-    };
-
-    window.addEventListener("keydown", onKeyDown);
-    return function () {
-      return window.removeEventListener("keydown", onKeyDown);
-    };
-  }, [regionClsList, selectedCls]);
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement(SidebarBoxContainer, {
-    title: "Classifications",
-    subTitle: "",
-    icon: React.createElement(BallotIcon, {
-      style: {
-        color: muiColors.grey[700]
-      }
-    }),
-    expandedByDefault: true
-  }, regionClsList.map(function (label, index) {
-    return React.createElement(LabelContainer, {
-      key: label,
-      className: classnames({
-        selected: label === selectedCls
-      }),
-      onClick: function onClick() {
-        return onSelectCls(label);
-      }
-    }, React.createElement(Circle, {
-      style: {
-        backgroundColor: clsColor(label)
-      }
-    }), React.createElement(Label, {
-      className: classnames({
-        selected: label === selectedCls
-      })
-    }, capitalize(label)), React.createElement(DashSep, null), React.createElement(Number, {
-      className: classnames({
-        selected: label === selectedCls
-      })
-    }, index < 9 ? "Key [".concat(index + 1, "]") : ""));
-  }), React.createElement(Box, {
-    pb: 2
-  })));
-};
-export default ClassSelectionMenu;

package/Crosshairs/index.js

@@ -1,53 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { Fragment, useEffect, useState } from "react";
-export var Crosshairs = function Crosshairs(_ref) {
-  var mousePosition = _ref.mousePosition,
-      x = _ref.x,
-      y = _ref.y;
-
-  var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      forceRenderState = _useState2[0],
-      changeForceRenderState = _useState2[1];
-
-  if (mousePosition) {
-    x = mousePosition.current.x;
-    y = mousePosition.current.y;
-  }
-
-  useEffect(function () {
-    if (!mousePosition) return;
-    var interval = setInterval(function () {
-      if (x !== mousePosition.current.x || y !== mousePosition.current.y) {
-        changeForceRenderState([mousePosition.current.x, mousePosition.current.y]);
-      }
-    }, 10);
-    return function () {
-      return clearInterval(interval);
-    };
-  });
-  return React.createElement(Fragment, null, React.createElement("div", {
-    style: {
-      position: "absolute",
-      height: "100%",
-      width: 1,
-      zIndex: 10,
-      backgroundColor: "#f00",
-      left: x,
-      pointerEvents: "none",
-      top: 0
-    }
-  }), React.createElement("div", {
-    style: {
-      position: "absolute",
-      width: "100%",
-      zIndex: 10,
-      height: 1,
-      backgroundColor: "#f00",
-      top: y,
-      pointerEvents: "none",
-      left: 0
-    }
-  }));
-};
-export default Crosshairs;

package/DebugSidebarBox/index.js

@@ -1,20 +0,0 @@
-import React from "react";
-import SidebarBoxContainer from "../SidebarBoxContainer";
-export var DebugSidebarBox = function DebugSidebarBox(_ref) {
-  var state = _ref.state,
-      lastAction = _ref.lastAction;
-  var image = (state.images || [])[state.selectedImage];
-  var region = image ? (image.regions || []).filter(function (r) {
-    return r.highlighted;
-  }) : null;
-  return React.createElement(SidebarBoxContainer, {
-    title: "Debug",
-    icon: React.createElement("span", null),
-    expandedByDefault: true
-  }, React.createElement("div", {
-    style: {
-      padding: 4
-    }
-  }, React.createElement("div", null, React.createElement("b", null, "region"), ":"), React.createElement("pre", null, JSON.stringify(region, null, "  ")), React.createElement("div", null, React.createElement("b", null, "lastAction"), ":"), React.createElement("pre", null, JSON.stringify(lastAction, null, "  ")), React.createElement("div", null, React.createElement("b", null, "mode"), ":"), React.createElement("pre", null, JSON.stringify(state.mode, null, "  ")), React.createElement("div", null, React.createElement("b", null, "frame:")), React.createElement("pre", null, JSON.stringify(state.selectedImageFrameTime, null, "  "))));
-};
-export default DebugSidebarBox;