@labelbee/lb-components 1.10.0-alpha.2 → 1.10.0-alpha.3

package/dist/components/predictTracking/previewResult/util.js

@@ -1 +1,143 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var index=require("../../../utils/index.js"),lbAnnotation=require("@labelbee/lb-annotation"),lbUtils=require("@labelbee/lb-utils"),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(r,e,t)=>e in r?__defProp(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,__spreadValues=(r,e)=>{for(var t in e||(e={}))__hasOwnProp.call(e,t)&&__defNormalProp(r,t,e[t]);if(__getOwnPropSymbols)for(var t of __getOwnPropSymbols(e))__propIsEnum.call(e,t)&&__defNormalProp(r,t,e[t]);return r},__spreadProps=(r,e)=>__defProps(r,__getOwnPropDescs(e)),__async=(r,e,t)=>new Promise((o,i)=>{var s=n=>{try{c(t.next(n))}catch(l){i(l)}},u=n=>{try{c(t.throw(n))}catch(l){i(l)}},c=n=>n.done?o(n.value):Promise.resolve(n.value).then(s,u);c((t=t.apply(r,e)).next())});const EXAMPLE_IMAGE_SIZE={width:160,height:110},getDataUrl=(r,e=2)=>__async(void 0,null,function*(){return cropAndEnlarge(r.domElement,EXAMPLE_IMAGE_SIZE.width,EXAMPLE_IMAGE_SIZE.height,e)}),sleep=(r=300)=>new Promise(e=>{setTimeout(()=>{e("")},r)}),views=[lbUtils.EPerspectiveView.Top,lbUtils.EPerspectiveView.Left,lbUtils.EPerspectiveView.Back],getViewsDataUrl=(r,e,t)=>__async(void 0,null,function*(){for(const o of views)yield r.updateCameraByBox(e,o),e[o]=yield getDataUrl(r.renderer,t)}),cropAndEnlarge=(r,e,t,o)=>{if(!r)return"";const i=r.width/2,s=r.height/2,u=i-e/2,c=s-t/2,n=document.createElement("canvas");n.width=e*o,n.height=t*o;const l=n.getContext("2d");return l==null||l.drawImage(r,u,c,e,t,0,0,e*o,t*o),n.toDataURL()},getBoxesByTrackID=(r,e,t)=>{const o=[];return r.forEach((i,s)=>{var u;const c=index.jsonParser(i==null?void 0:i.result),n=(u=c==null?void 0:c[`step_${e}`])==null?void 0:u.result,l=n==null?void 0:n.find(p=>p.trackID===t);l&&o.push(__spreadProps(__spreadValues({},l),{index:s}))}),o},predict=(r,e)=>{const o=e.index-r.index-1,i=[],s={},u=["x","y","z"],c=["center","depth","height","index","rotation","width"];u.forEach(n=>{s[n]=getInteriorNumbersByStartAndEnd(r.center[n],e.center[n],o)}),c.forEach(n=>{n!=="center"&&(s[n]=getInteriorNumbersByStartAndEnd(r[n],e[n],o))});for(let n=0;n<o;n++){const l=u.reduce((a,d)=>(a[d]=s[d][n],a),{x:0,y:0,z:0}),p=c.reduce((a,d)=>(d==="center"||(a[d]=s[d][n]),a),__spreadProps(__spreadValues({},r),{id:lbAnnotation.uuid(),center:l}));i.push(p)}return i},getInteriorNumbersByStartAndEnd=(r=0,e=0,t=0)=>{const o=(e-r)/(t+1),i=new Array(t);for(let s=0;s<t;s++)i[s]=r+o*(s+1);return i};exports.getBoxesByTrackID=getBoxesByTrackID,exports.getViewsDataUrl=getViewsDataUrl,exports.predict=predict,exports.sleep=sleep,exports.views=views;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('../../../utils/index.js');
+var lbAnnotation = require('@labelbee/lb-annotation');
+var lbUtils = require('@labelbee/lb-utils');
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {enumerable: true, configurable: true, writable: true, value}) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+const EXAMPLE_IMAGE_SIZE = {
+  width: 160,
+  height: 110
+};
+const getDataUrl = (renderer, zoom = 2) => __async(undefined, null, function* () {
+  return cropAndEnlarge(renderer.domElement, EXAMPLE_IMAGE_SIZE.width, EXAMPLE_IMAGE_SIZE.height, zoom);
+});
+const sleep = (time = 300) => {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve("");
+    }, time);
+  });
+};
+const views = [lbUtils.EPerspectiveView.Top, lbUtils.EPerspectiveView.Left, lbUtils.EPerspectiveView.Back];
+const getViewsDataUrl = (pointCloud, box, zoom) => __async(undefined, null, function* () {
+  for (const view of views) {
+    yield pointCloud.updateCameraByBox(box, view);
+    box[view] = yield getDataUrl(pointCloud.renderer, zoom);
+  }
+});
+const cropAndEnlarge = (canvas, width, height, scale) => {
+  if (!canvas) {
+    return "";
+  }
+  const centerX = canvas.width / 2;
+  const centerY = canvas.height / 2;
+  const sx = centerX - width / 2;
+  const sy = centerY - height / 2;
+  const newCanvas = document.createElement("canvas");
+  newCanvas.width = width * scale;
+  newCanvas.height = height * scale;
+  const newCtx = newCanvas.getContext("2d");
+  newCtx == null ? void 0 : newCtx.drawImage(canvas, sx, sy, width, height, 0, 0, width * scale, height * scale);
+  return newCanvas.toDataURL();
+};
+const getBoxesByTrackID = (imageList, targetStep, selectedBoxTrackID) => {
+  const matchingBoxes = [];
+  imageList.forEach((element, index$1) => {
+    var _a;
+    const fileResult = index.jsonParser(element == null ? void 0 : element.result);
+    const stepResult = (_a = fileResult == null ? void 0 : fileResult[`step_${targetStep}`]) == null ? void 0 : _a.result;
+    const box = stepResult == null ? void 0 : stepResult.find((item) => item.trackID === selectedBoxTrackID);
+    if (box) {
+      matchingBoxes.push(__spreadProps(__spreadValues({}, box), {index: index$1}));
+    }
+  });
+  return matchingBoxes;
+};
+const predict = (start, end) => {
+  const diff = end.index - start.index;
+  const len = diff - 1;
+  const result = [];
+  const map = {};
+  const centerKeys = ["x", "y", "z"];
+  const predictKeys = ["center", "depth", "height", "index", "rotation", "width"];
+  centerKeys.forEach((key) => {
+    map[key] = getInteriorNumbersByStartAndEnd(start.center[key], end.center[key], len);
+  });
+  predictKeys.forEach((key) => {
+    if (key === "center") {
+      return;
+    }
+    map[key] = getInteriorNumbersByStartAndEnd(start[key], end[key], len);
+  });
+  for (let i = 0; i < len; i++) {
+    const nextCenter = centerKeys.reduce((acc, key) => {
+      acc[key] = map[key][i];
+      return acc;
+    }, {x: 0, y: 0, z: 0});
+    const nextValue = predictKeys.reduce((acc, key) => {
+      if (key === "center") {
+        return acc;
+      }
+      acc[key] = map[key][i];
+      return acc;
+    }, __spreadProps(__spreadValues({}, start), {id: lbAnnotation.uuid(), center: nextCenter}));
+    result.push(nextValue);
+  }
+  return result;
+};
+const getInteriorNumbersByStartAndEnd = (start = 0, end = 0, length = 0) => {
+  const step = (end - start) / (length + 1);
+  const resultArr = new Array(length);
+  for (let i = 0; i < length; i++) {
+    resultArr[i] = start + step * (i + 1);
+  }
+  return resultArr;
+};
+
+exports.getBoxesByTrackID = getBoxesByTrackID;
+exports.getViewsDataUrl = getViewsDataUrl;
+exports.predict = predict;
+exports.sleep = sleep;
+exports.views = views;
+//# sourceMappingURL=util.js.map

package/dist/components/predictTracking/previewResult/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sources":["../../../../src/components/predictTracking/previewResult/util.ts"],"sourcesContent":["import { IPointCloudBoxWithIndex } from '@/store/annotation/types';\nimport { IFileItem } from '@/types/data';\nimport { jsonParser } from '@/utils';\nimport { PointCloud, uuid } from '@labelbee/lb-annotation';\nimport { EPerspectiveView, IPointCloudBox } from '@labelbee/lb-utils';\n\nconst EXAMPLE_IMAGE_SIZE = {\n  width: 160,\n  height: 110,\n} as const;\n\n/**\n * Returns a data URL for an image of the rendered point cloud.\n * @param renderer - The PointCloud renderer to use.\n * @param zoom - The zoom level of the image. Defaults to 2.\n * @returns A Promise resolving to a string data URL of the rendered image.\n */\nconst getDataUrl = async (renderer: PointCloud['renderer'], zoom = 2) => {\n  return cropAndEnlarge(\n    renderer.domElement,\n    EXAMPLE_IMAGE_SIZE.width,\n    EXAMPLE_IMAGE_SIZE.height,\n    zoom,\n  );\n};\n\n/**\n * Returns a Promise that resolves after the specified duration.\n * @param ms - The duration to sleep, in milliseconds.\n * @returns A Promise that resolves after `ms` milliseconds.\n */\nexport const sleep = (time = 300) => {\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      resolve('');\n    }, time);\n  });\n};\n\nexport const views = [EPerspectiveView.Top, EPerspectiveView.Left, EPerspectiveView.Back] as const;\n\ninterface viewDataUrl {\n  [EPerspectiveView.Top]?: string;\n  [EPerspectiveView.Left]?: string;\n  [EPerspectiveView.Back]?: string;\n}\n\nexport type IBox = IPointCloudBoxWithIndex & viewDataUrl;\n\n/**\n * Generates data URLs for each view of a given point cloud object using the provided box and zoom level.\n *\n * @param {PointCloud} pointCloud - The point cloud object to generate data URLs for.\n * @param {IBox} box - An object representing the bounding box to use for calculating camera position.\n * @param {number} zoom - The zoom level to use when generating data URLs.\n * @returns {Promise<void>} - A promise that resolves once all data URLs have been generated.\n */\nexport const getViewsDataUrl = async (pointCloud: PointCloud, box: IBox, zoom: number) => {\n  for (const view of views) {\n    await pointCloud.updateCameraByBox(box, view);\n    box[view] = await getDataUrl(pointCloud.renderer, zoom);\n  }\n};\n\n/**\n * Creates a new canvas, crops and enlarges an existing canvas, draws the cropped and enlarged image onto the new canvas,\n * and returns the data URL of the new canvas.\n *\n * @param {HTMLCanvasElement} canvas - The original canvas to be cropped and enlarged\n * @param {number} width - The width of the area to be cropped from the center of the original canvas\n * @param {number} height - The height of the area to be cropped from the center of the original canvas\n * @param {number} scale - The amount by which to enlarge the cropped area\n * @returns {string} - A data URL of the cropped and enlarged image\n */\nconst cropAndEnlarge = (\n  canvas: HTMLCanvasElement,\n  width: number,\n  height: number,\n  scale: number,\n): string => {\n  if (!canvas) {\n    return '';\n  }\n  const centerX = canvas.width / 2;\n  const centerY = canvas.height / 2;\n  // Calculate starting coordinates for cropping\n  const sx = centerX - width / 2;\n  const sy = centerY - height / 2;\n\n  // Create a new canvas for the cropped and enlarged image\n  const newCanvas = document.createElement('canvas');\n  newCanvas.width = width * scale;\n  newCanvas.height = height * scale;\n\n  // Draw the cropped and enlarged image onto the new canvas\n  const newCtx = newCanvas.getContext('2d');\n  newCtx?.drawImage(canvas, sx, sy, width, height, 0, 0, width * scale, height * scale);\n\n  // Convert the new canvas to a data URL and return it\n  return newCanvas.toDataURL();\n};\n\n/**\n * Retrieve boxes with a specific trackID from an array of file items.\n *\n * @param {Array} imageList - An array of file items to search through.\n * @param {Number} targetStep - The step number within the result object to retrieve boxes from.\n * @param {Number} selectedBoxTrackID - The trackID to match when searching for boxes.\n * @return {Array} An array of point cloud boxes that match the provided trackID, along with their index in the original array.\n */\nexport const getBoxesByTrackID = (\n  imageList: IFileItem[],\n  targetStep: number,\n  selectedBoxTrackID: number,\n) => {\n  const matchingBoxes: IPointCloudBoxWithIndex[] = [];\n  imageList.forEach((element, index) => {\n    const fileResult = jsonParser(element?.result);\n    const stepResult = fileResult?.[`step_${targetStep}`]?.result;\n    const box = stepResult?.find((item: IPointCloudBox) => item.trackID === selectedBoxTrackID);\n    if (box) {\n      matchingBoxes.push({ ...box, index });\n    }\n  });\n\n  return matchingBoxes;\n};\n\n/**\n * Calculate predicted values for each field in between the start and end points.\n * @param {IPointCloudBoxWithIndex} start - The starting point, should have the same properties as IPointCloudBoxWithIndex.\n * @param {IPointCloudBoxWithIndex} end - The ending point, should have the same properties as IPointCloudBoxWithIndex.\n * @returns {IPointCloudBox[]} An array of objects with the same properties as IPointCloudBox, containing interpolated values between the start and end points for each field.\n */\nexport const predict = (start: IPointCloudBoxWithIndex, end: IPointCloudBoxWithIndex) => {\n  const diff = end.index - start.index;\n  const len = diff - 1;\n  const result: IPointCloudBox[] = [];\n  const map: { [key: string]: number[] } = {};\n  const centerKeys = ['x', 'y', 'z'] as const;\n  const predictKeys = ['center', 'depth', 'height', 'index', 'rotation', 'width'] as const;\n\n  centerKeys.forEach((key) => {\n    map[key] = getInteriorNumbersByStartAndEnd(start.center[key], end.center[key], len);\n  });\n\n  predictKeys.forEach((key) => {\n    if (key === 'center') {\n      return;\n    }\n    map[key] = getInteriorNumbersByStartAndEnd(start[key], end[key], len);\n  });\n\n  for (let i = 0; i < len; i++) {\n    const nextCenter = centerKeys.reduce(\n      (acc, key) => {\n        acc[key] = map[key][i];\n        return acc;\n      },\n      { x: 0, y: 0, z: 0 },\n    );\n\n    const nextValue = predictKeys.reduce(\n      (acc, key) => {\n        if (key === 'center') {\n          return acc;\n        }\n        acc[key] = map[key][i];\n        return acc;\n      },\n      { ...start, id: uuid(), center: nextCenter },\n    );\n\n    result.push(nextValue);\n  }\n\n  return result;\n};\n\n/**\n * Calculate an array of numbers between the start and end values.\n * @param {number} [start=0] - The starting value. Defaults to 0 if not specified.\n * @param {number} [end=0] - The ending value. Defaults to 0 if not specified.\n * @param {number} [length=0] - The number of values to calculate between the start and end points. Defaults to 0 if not specified.\n * @returns {number[]} An array of numbers, containing interpolated values between the start and end points.\n */\nconst getInteriorNumbersByStartAndEnd = (start = 0, end = 0, length = 0): number[] => {\n  const step = (end - start) / (length + 1);\n  const resultArr = new Array(length);\n  for (let i = 0; i < length; i++) {\n    resultArr[i] = start + step * (i + 1);\n  }\n  return resultArr;\n};\n"],"names":["this","EPerspectiveView","index","jsonParser","uuid"],"mappings":"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"}

package/dist/components/videoAnnotate/index.js

@@ -1 +1,50 @@
-"use strict";var React=require("react"),reactRedux=require("react-redux"),ctx=require("../../store/ctx.js"),Actions=require("../../store/Actions.js"),actionCreators=require("../../store/annotation/actionCreators.js"),TagToolInstanceAdaptor=require("../videoPlayer/TagToolInstanceAdaptor.js");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React);const VideoAnnotate=e=>{const{imgList:o,imgIndex:r,stepList:n,step:c}=e.annotation,t=ctx.useDispatch(),s=a=>{t({type:Actions.ANNOTATION_ACTIONS.SET_TOOL,payload:{instance:a}})},i=()=>{t({type:Actions.ANNOTATION_ACTIONS.SET_TOOL,payload:{instance:void 0}})};return React__default.default.createElement(TagToolInstanceAdaptor.TagToolInstanceAdaptor,{imgIndex:r,imgList:o,pageBackward:()=>t(actionCreators.PageBackward()),pageForward:()=>t(actionCreators.PageForward()),pageJump:a=>t(actionCreators.PageJump(~~a)),onMounted:s,onUnmounted:i,stepList:n,step:c})};var VideoAnnotate$1=reactRedux.connect(({annotation:e})=>({annotation:e}),null,null,{context:ctx.LabelBeeContext})(VideoAnnotate);module.exports=VideoAnnotate$1;
+'use strict';
+
+var React = require('react');
+var reactRedux = require('react-redux');
+var ctx = require('../../store/ctx.js');
+var Actions = require('../../store/Actions.js');
+var actionCreators = require('../../store/annotation/actionCreators.js');
+var TagToolInstanceAdaptor = require('../videoPlayer/TagToolInstanceAdaptor.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const VideoAnnotate = (props) => {
+  const {imgList, imgIndex, stepList, step} = props.annotation;
+  const dispatch = ctx.useDispatch();
+  const onMounted = (instance) => {
+    dispatch({
+      type: Actions.ANNOTATION_ACTIONS.SET_TOOL,
+      payload: {
+        instance
+      }
+    });
+  };
+  const onUnmounted = () => {
+    dispatch({
+      type: Actions.ANNOTATION_ACTIONS.SET_TOOL,
+      payload: {
+        instance: void 0
+      }
+    });
+  };
+  return /* @__PURE__ */ React__default["default"].createElement(TagToolInstanceAdaptor.TagToolInstanceAdaptor, {
+    imgIndex,
+    imgList,
+    pageBackward: () => dispatch(actionCreators.PageBackward()),
+    pageForward: () => dispatch(actionCreators.PageForward()),
+    pageJump: (page) => dispatch(actionCreators.PageJump(~~page)),
+    onMounted,
+    onUnmounted,
+    stepList,
+    step
+  });
+};
+var VideoAnnotate$1 = reactRedux.connect(({annotation}) => ({annotation}), null, null, {
+  context: ctx.LabelBeeContext
+})(VideoAnnotate);
+
+module.exports = VideoAnnotate$1;
+//# sourceMappingURL=index.js.map

package/dist/components/videoAnnotate/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/videoAnnotate/index.tsx"],"sourcesContent":["/**\n * @author Glenfiddish <edwinlee0927@hotmail.com>\n * @file connect store & TagToolInstanceAdaptor\n * @date 2022-06-02\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { useDispatch, LabelBeeContext } from '@/store/ctx';\nimport { AppState } from '@/store';\nimport { ANNOTATION_ACTIONS } from '@/store/Actions';\nimport { AnnotationState } from '@/store/annotation/types';\nimport { PageBackward, PageForward, PageJump } from '@/store/annotation/actionCreators';\nimport { TagToolInstanceAdaptor } from '@/components/videoPlayer/TagToolInstanceAdaptor';\n\nconst VideoAnnotate: React.FC<{ annotation: AnnotationState }> = (props) => {\n  const { imgList, imgIndex, stepList, step } = props.annotation;\n  const dispatch = useDispatch();\n  const onMounted = (instance: TagToolInstanceAdaptor) => {\n    dispatch({\n      type: ANNOTATION_ACTIONS.SET_TOOL,\n      payload: {\n        instance,\n      },\n    });\n  };\n\n  const onUnmounted = () => {\n    dispatch({\n      type: ANNOTATION_ACTIONS.SET_TOOL,\n      payload: {\n        instance: undefined,\n      },\n    });\n  };\n\n  return (\n    <TagToolInstanceAdaptor\n      imgIndex={imgIndex}\n      imgList={imgList}\n      pageBackward={() => dispatch(PageBackward())}\n      pageForward={() => dispatch(PageForward())}\n      pageJump={(page) => dispatch(PageJump(~~page))}\n      onMounted={onMounted}\n      onUnmounted={onUnmounted}\n      stepList={stepList}\n      step={step}\n    />\n  );\n};\n\nexport default connect(({ annotation }: AppState) => ({ annotation }), null, null, {\n  context: LabelBeeContext,\n})(VideoAnnotate);\n"],"names":["useDispatch","ANNOTATION_ACTIONS","TagToolInstanceAdaptor","PageBackward","PageForward","PageJump","connect","LabelBeeContext"],"mappings":";;;;;;;;;;;;;AAeA,MAAM,aAAA,GAA2D,CAAC,KAAU,KAAA;AAC1E,EAAA,MAAM,CAAE,OAAA,EAAS,QAAU,EAAA,QAAA,EAAU,QAAS,KAAM,CAAA,UAAA,CAAA;AACpD,EAAA,MAAM,QAAW,GAAAA,eAAA,EAAA,CAAA;AACjB,EAAM,MAAA,SAAA,GAAY,CAAC,QAAqC,KAAA;AACtD,IAAS,QAAA,CAAA;AAAA,MACP,MAAMC,0BAAmB,CAAA,QAAA;AAAA,MACzB,OAAS,EAAA;AAAA,QACP,QAAA;AAAA,OAAA;AAAA,KAAA,CAAA,CAAA;AAAA,GAAA,CAAA;AAKN,EAAA,MAAM,cAAc,MAAM;AACxB,IAAS,QAAA,CAAA;AAAA,MACP,MAAMA,0BAAmB,CAAA,QAAA;AAAA,MACzB,OAAS,EAAA;AAAA,QACP,QAAU,EAAA,KAAA,CAAA;AAAA,OAAA;AAAA,KAAA,CAAA,CAAA;AAAA,GAAA,CAAA;AAKhB,EAAA,+DACGC,6CAAD,EAAA;AAAA,IACE,QAAA;AAAA,IACA,OAAA;AAAA,IACA,YAAA,EAAc,MAAM,QAAS,CAAAC,2BAAA,EAAA,CAAA;AAAA,IAC7B,WAAA,EAAa,MAAM,QAAS,CAAAC,0BAAA,EAAA,CAAA;AAAA,IAC5B,UAAU,CAAC,IAAA,KAAS,QAAS,CAAAC,uBAAA,CAAS,CAAC,CAAC,IAAA,CAAA,CAAA;AAAA,IACxC,SAAA;AAAA,IACA,WAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,GAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AAKN,sBAAeC,mBAAQ,CAAC,CAAE,iBAA8B,CAAA,UAAA,CAAA,CAAA,EAAe,MAAM,IAAM,EAAA;AAAA,EACjF,OAAS,EAAAC,mBAAA;AAAA,CACR,CAAA,CAAA,aAAA,CAAA;;;;"}

package/dist/components/videoPlayer/TagToolInstanceAdaptor.js

@@ -1 +1,233 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),lbAnnotation=require("@labelbee/lb-annotation"),StepUtils=require("../../utils/StepUtils.js"),index=require("../../utils/index.js"),index$1=require("./index.js"),VideoTagLayer=require("./VideoTagLayer.js"),_=require("lodash"),utils=require("./utils.js");function _interopDefaultLegacy(h){return h&&typeof h=="object"&&"default"in h?h:{default:h}}var React__default=_interopDefaultLegacy(React),___default=_interopDefaultLegacy(_);class TagToolInstanceAdaptor extends React__default.default.Component{constructor(i){super(i);this.fns={},this.labelSelectedList=[],this.clearResult=(t=!0,e)=>{const s=e?this.state.tagResult.map(l=>((l==null?void 0:l.result[e])&&delete l.result[e],l)):[];this.setState({tagResult:s},()=>this.emitEvent("render"))},this.exportData=()=>{var t,e,s,l,o,n,r;const a=(e=(t=this.videoRef)==null?void 0:t.duration)!=null?e:0,d=(s=this.videoRef)==null?void 0:s.getVideoPlaybackQuality(),u=d==null?void 0:d.totalVideoFrames,c=(o=(l=this.videoRef)==null?void 0:l.videoWidth)!=null?o:0,v=(r=(n=this.videoRef)==null?void 0:n.videoHeight)!=null?r:0;return[this.state.tagResult,{valid:this.state.valid,duration:a,frames:u,videoWidth:c,videoHeight:v}]},this.emitEvent=t=>{this.fns[t]&&this.fns[t]()},this.combineResult=(t,e={})=>{var s,l;const{isMulti:o}=t,{key:n,value:r}=t.value;if(o){let a=(l=(s=e[n])==null?void 0:s.split(";"))!=null?l:[];a.includes(r)?a=a.filter(u=>u!==r):a.push(r);const d=new Set(a);return e[n]=Array.from(d).join(";"),___default.default.pickBy(e,u=>u)}return e[n]=e[n]===r?void 0:r,___default.default.pickBy(e,a=>a)},this.setResult=t=>{this.setState({tagResult:t}),this.fns.render&&this.fns.render()},this.setLabel=(t,e)=>{this.setLabelBySelectedList(t,e)},this.keydown=t=>{const e=utils.getKeyCodeNumber(t.keyCode);if(e){const s=e-1;if(this.config.inputList.length===1){this.labelSelectedList=[0,s],this.setLabel(0,s),setTimeout(()=>{this.labelSelectedList=[],this.emitEvent("render")},500);return}this.labelSelectedList.length===1?(this.labelSelectedList=[this.labelSelectedList[0],s],this.setLabel(this.labelSelectedList[0],s),setTimeout(()=>{this.labelSelectedList=[],this.emitEvent("render")},500)):(this.labelSelectedList=[s],this.emitEvent("expend"))}},this.setValid=t=>{this.setState({valid:t}),t===!1&&this.setState({tagResult:[]}),this.emitEvent("render")},this.setResultFromImgList=t=>{var e;const{imgList:s,imgIndex:l,step:o}=t;if(!s[l])return;const n=index.jsonParser(s[l].result),r=n[`step_${o}`];this.setState({tagResult:(e=r==null?void 0:r.result)!=null?e:[],valid:(n==null?void 0:n.valid)===void 0?!0:n.valid})},this.state={tagResult:[],labelSelectedList:[],valid:!0}}get config(){const i=StepUtils.getCurrentStepInfo(this.props.step,this.props.stepList);return index.jsonParser(i==null?void 0:i.config)}get history(){return{initRecord:()=>{},pushHistory:()=>{}}}get currentTagResult(){var i;return(i=this.state.tagResult[0])!=null?i:{}}get valid(){return this.state.valid}singleOn(i,t){this.fns[i]=t}on(i,t){this.singleOn(i,t)}getTagResultByCode(i,t){var e,s,l;try{const o=(s=(e=this.config)==null?void 0:e.inputList)!=null?s:[],n=o.length>1,r=t!==void 0?i:0,a=t!==void 0?t:i,d=n?o[r]:o[0],u=((l=d.subSelected)!=null?l:[])[a];if(d&&u)return{value:{key:d.value,value:u.value},isMulti:d.isMulti}}catch(o){return}}setLabelBySelectedList(i,t){var e,s,l,o;const n=this.getTagResultByCode(i,t);if(n){const r=this.combineResult(n,(s=(e=this.state.tagResult[0])==null?void 0:e.result)!=null?s:{}),a=[{sourceID:lbAnnotation.CommonToolUtils.getSourceID(),id:(o=(l=this.currentTagResult)==null?void 0:l.id)!=null?o:lbAnnotation.uuid(8,62),result:r}];this.setState({tagResult:a},()=>this.emitEvent("render"))}}componentDidMount(){document.addEventListener("keydown",this.keydown),this.props.onMounted(this),this.setResultFromImgList(this.props)}componentWillUnmount(){document.addEventListener("keydown",this.keydown),this.props.onUnmounted()}shouldComponentUpdate(i){return i.imgIndex!==this.props.imgIndex&&this.setResultFromImgList(i),!0}render(){var i;const{imgIndex:t,imgList:e,pageForward:s,pageJump:l,pageBackward:o}=this.props,{tagResult:n,valid:r}=this.state;return React__default.default.createElement("div",{style:{height:"100%",width:"100%",position:"relative"}},React__default.default.createElement(index$1.VideoPlayer,{imgIndex:t,imgList:e,pageBackward:o,pageForward:s,pageJump:l,valid:r,setVideoRef:a=>{this.videoRef=a}}),React__default.default.createElement(VideoTagLayer.VideoTagLayer,{result:n,inputList:(i=this.config)==null?void 0:i.inputList}))}}exports.TagToolInstanceAdaptor=TagToolInstanceAdaptor;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var lbAnnotation = require('@labelbee/lb-annotation');
+var StepUtils = require('../../utils/StepUtils.js');
+var index = require('../../utils/index.js');
+var index$1 = require('./index.js');
+var VideoTagLayer = require('./VideoTagLayer.js');
+var _ = require('lodash');
+var utils = require('./utils.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
+
+class TagToolInstanceAdaptor extends React__default["default"].Component {
+  constructor(props) {
+    super(props);
+    this.fns = {};
+    this.labelSelectedList = [];
+    this.clearResult = (sendMsg = true, value) => {
+      const newTag = value ? this.state.tagResult.map((v) => {
+        if (v == null ? void 0 : v.result[value]) {
+          delete v.result[value];
+        }
+        return v;
+      }) : [];
+      this.setState({
+        tagResult: newTag
+      }, () => this.emitEvent("render"));
+    };
+    this.exportData = () => {
+      var _a, _b, _c, _d, _e, _f, _g;
+      const duration = (_b = (_a = this.videoRef) == null ? void 0 : _a.duration) != null ? _b : 0;
+      const videoQulity = (_c = this.videoRef) == null ? void 0 : _c.getVideoPlaybackQuality();
+      const frames = videoQulity == null ? void 0 : videoQulity.totalVideoFrames;
+      const videoWidth = (_e = (_d = this.videoRef) == null ? void 0 : _d.videoWidth) != null ? _e : 0;
+      const videoHeight = (_g = (_f = this.videoRef) == null ? void 0 : _f.videoHeight) != null ? _g : 0;
+      return [
+        this.state.tagResult,
+        {valid: this.state.valid, duration, frames, videoWidth, videoHeight}
+      ];
+    };
+    this.emitEvent = (event) => {
+      if (this.fns[event]) {
+        this.fns[event]();
+      }
+    };
+    this.combineResult = (inputValue, existValue = {}) => {
+      var _a, _b;
+      const {isMulti} = inputValue;
+      const {key, value} = inputValue.value;
+      if (isMulti) {
+        let valuesArray = (_b = (_a = existValue[key]) == null ? void 0 : _a.split(";")) != null ? _b : [];
+        if (valuesArray.includes(value)) {
+          valuesArray = valuesArray.filter((i) => i !== value);
+        } else {
+          valuesArray.push(value);
+        }
+        const valuesSet = new Set(valuesArray);
+        existValue[key] = Array.from(valuesSet).join(";");
+        return ___default["default"].pickBy(existValue, (v) => v);
+      }
+      existValue[key] = existValue[key] === value ? void 0 : value;
+      return ___default["default"].pickBy(existValue, (v) => v);
+    };
+    this.setResult = (tagResult) => {
+      this.setState({
+        tagResult
+      });
+      if (this.fns["render"]) {
+        this.fns["render"]();
+      }
+    };
+    this.setLabel = (num1, num2) => {
+      this.setLabelBySelectedList(num1, num2);
+    };
+    this.keydown = (event) => {
+      const keyCode = utils.getKeyCodeNumber(event.keyCode);
+      if (keyCode) {
+        const keyIndex = keyCode - 1;
+        if (this.config.inputList.length === 1) {
+          this.labelSelectedList = [0, keyIndex];
+          this.setLabel(0, keyIndex);
+          setTimeout(() => {
+            this.labelSelectedList = [];
+            this.emitEvent("render");
+          }, 500);
+          return;
+        }
+        if (this.labelSelectedList.length === 1) {
+          this.labelSelectedList = [this.labelSelectedList[0], keyIndex];
+          this.setLabel(this.labelSelectedList[0], keyIndex);
+          setTimeout(() => {
+            this.labelSelectedList = [];
+            this.emitEvent("render");
+          }, 500);
+        } else {
+          this.labelSelectedList = [keyIndex];
+          this.emitEvent("expend");
+        }
+      }
+    };
+    this.setValid = (valid) => {
+      this.setState({valid});
+      if (valid === false) {
+        this.setState({tagResult: []});
+      }
+      this.emitEvent("render");
+    };
+    this.setResultFromImgList = (props) => {
+      var _a;
+      const {imgList, imgIndex, step} = props;
+      if (!imgList[imgIndex]) {
+        return;
+      }
+      const res = index.jsonParser(imgList[imgIndex].result);
+      const stepRes = res[`step_${step}`];
+      this.setState({
+        tagResult: (_a = stepRes == null ? void 0 : stepRes.result) != null ? _a : [],
+        valid: (res == null ? void 0 : res.valid) === void 0 ? true : res.valid
+      });
+    };
+    this.state = {
+      tagResult: [],
+      labelSelectedList: [],
+      valid: true
+    };
+  }
+  get config() {
+    const stepInfo = StepUtils.getCurrentStepInfo(this.props.step, this.props.stepList);
+    return index.jsonParser(stepInfo == null ? void 0 : stepInfo.config);
+  }
+  get history() {
+    return {initRecord: () => {
+    }, pushHistory: () => {
+    }};
+  }
+  get currentTagResult() {
+    var _a;
+    return (_a = this.state.tagResult[0]) != null ? _a : {};
+  }
+  get valid() {
+    return this.state.valid;
+  }
+  singleOn(event, func) {
+    this.fns[event] = func;
+  }
+  on(event, func) {
+    this.singleOn(event, func);
+  }
+  getTagResultByCode(num1, num2) {
+    var _a, _b, _c;
+    try {
+      const inputList = (_b = (_a = this.config) == null ? void 0 : _a.inputList) != null ? _b : [];
+      const mulitTags = inputList.length > 1;
+      const keycode1 = num2 !== void 0 ? num1 : 0;
+      const keycode2 = num2 !== void 0 ? num2 : num1;
+      const primaryTagConfig = mulitTags ? inputList[keycode1] : inputList[0];
+      const secondaryTagConfig = ((_c = primaryTagConfig.subSelected) != null ? _c : [])[keycode2];
+      if (primaryTagConfig && secondaryTagConfig) {
+        return {
+          value: {
+            key: primaryTagConfig.value,
+            value: secondaryTagConfig.value
+          },
+          isMulti: primaryTagConfig.isMulti
+        };
+      }
+    } catch (e) {
+      return;
+    }
+  }
+  setLabelBySelectedList(num1, num2) {
+    var _a, _b, _c, _d;
+    const newTagConfig = this.getTagResultByCode(num1, num2);
+    if (newTagConfig) {
+      const tagRes = this.combineResult(newTagConfig, (_b = (_a = this.state.tagResult[0]) == null ? void 0 : _a.result) != null ? _b : {});
+      const tagResult = [
+        {
+          sourceID: lbAnnotation.CommonToolUtils.getSourceID(),
+          id: (_d = (_c = this.currentTagResult) == null ? void 0 : _c.id) != null ? _d : lbAnnotation.uuid(8, 62),
+          result: tagRes
+        }
+      ];
+      this.setState({
+        tagResult
+      }, () => this.emitEvent("render"));
+    }
+  }
+  componentDidMount() {
+    document.addEventListener("keydown", this.keydown);
+    this.props.onMounted(this);
+    this.setResultFromImgList(this.props);
+  }
+  componentWillUnmount() {
+    document.addEventListener("keydown", this.keydown);
+    this.props.onUnmounted();
+  }
+  shouldComponentUpdate(props) {
+    if (props.imgIndex !== this.props.imgIndex) {
+      this.setResultFromImgList(props);
+    }
+    return true;
+  }
+  render() {
+    var _a;
+    const {imgIndex, imgList, pageForward, pageJump, pageBackward} = this.props;
+    const {tagResult, valid} = this.state;
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      style: {height: "100%", width: "100%", position: "relative"}
+    }, /* @__PURE__ */ React__default["default"].createElement(index$1.VideoPlayer, {
+      imgIndex,
+      imgList,
+      pageBackward,
+      pageForward,
+      pageJump,
+      valid,
+      setVideoRef: (video) => {
+        this.videoRef = video;
+      }
+    }), /* @__PURE__ */ React__default["default"].createElement(VideoTagLayer.VideoTagLayer, {
+      result: tagResult,
+      inputList: (_a = this.config) == null ? void 0 : _a.inputList
+    }));
+  }
+}
+
+exports.TagToolInstanceAdaptor = TagToolInstanceAdaptor;
+//# sourceMappingURL=TagToolInstanceAdaptor.js.map

package/dist/components/videoPlayer/TagToolInstanceAdaptor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagToolInstanceAdaptor.js","sources":["../../../src/components/videoPlayer/TagToolInstanceAdaptor.tsx"],"sourcesContent":["/**\n * @file Implement TagTool interaction through class components.\n *       Refer to: packages/lb-annotation/src/core/toolOperation/tagOperation.ts\n * @author Glenfiddish <edwinlee0927@hotmail.com>\n * @date 2022-05-31\n */\n\nimport React from 'react';\nimport { CommonToolUtils, uuid } from '@labelbee/lb-annotation';\nimport StepUtils from '@/utils/StepUtils';\nimport { jsonParser } from '@/utils';\nimport { VideoPlayer } from './index';\nimport { VideoTagLayer } from './VideoTagLayer';\nimport { IStepInfo } from '@/types/step';\nimport _ from 'lodash';\nimport type { ObjectString } from './types';\nimport { getKeyCodeNumber } from './utils';\nimport { IFileItem } from '@/types/data';\n\nexport interface IVideoTagInstanceAdaptorProps {\n  imgIndex: number;\n  imgList: IFileItem[];\n  pageForward: () => void;\n  pageJump: (page: string) => void;\n  pageBackward: () => void;\n  onMounted: (instance: TagToolInstanceAdaptor) => void;\n  onUnmounted: () => void;\n  step: number;\n  stepList: IStepInfo[];\n}\n\ninterface IVideoTagInstanceAdaptorState {\n  // TODO: Use ITagResult from 'lb-annotation'\n  tagResult: any[];\n  labelSelectedList: number[];\n  valid: boolean;\n}\n\nexport class TagToolInstanceAdaptor extends React.Component<\n  IVideoTagInstanceAdaptorProps,\n  IVideoTagInstanceAdaptorState\n> {\n  public fns: { [key: string]: () => void } = {};\n  public videoRef?: HTMLVideoElement;\n  public labelSelectedList: number[] = [];\n\n  public constructor(props: IVideoTagInstanceAdaptorProps) {\n    super(props);\n    this.state = {\n      tagResult: [],\n      labelSelectedList: [],\n      valid: true,\n    };\n  }\n\n  public get config() {\n    const stepInfo = StepUtils.getCurrentStepInfo(this.props.step, this.props.stepList);\n    return jsonParser(stepInfo?.config);\n  }\n\n  /** Just implementation, no actual logic */\n  public get history() {\n    return { initRecord: () => {}, pushHistory: () => {} };\n  }\n\n  public get currentTagResult() {\n    return this.state.tagResult[0] ?? {};\n  }\n\n  public get valid() {\n    return this.state.valid;\n  }\n\n  public clearResult = (sendMsg = true, value?: string) => {\n    const newTag = value\n      ? this.state.tagResult.map((v) => {\n          if (v?.result[value]) {\n            delete v.result[value];\n          }\n          return v;\n        })\n      : [];\n\n    this.setState(\n      {\n        tagResult: newTag,\n      },\n      () => this.emitEvent('render'),\n    );\n  };\n\n  public exportData = () => {\n    const duration = this.videoRef?.duration ?? 0;\n    const videoQulity = this.videoRef?.getVideoPlaybackQuality();\n    const frames = videoQulity?.totalVideoFrames;\n    const videoWidth = this.videoRef?.videoWidth ?? 0;\n    const videoHeight = this.videoRef?.videoHeight ?? 0;\n\n    return [\n      this.state.tagResult,\n      { valid: this.state.valid, duration, frames, videoWidth, videoHeight },\n    ];\n  };\n\n  public singleOn(event: string, func: () => void) {\n    this.fns[event] = func;\n  }\n\n  public on(event: string, func: () => void) {\n    this.singleOn(event, func);\n  }\n\n  public getTagResultByCode(num1: number, num2?: number) {\n    try {\n      const inputList = this.config?.inputList ?? [];\n      const mulitTags = inputList.length > 1;\n      const keycode1 = num2 !== undefined ? num1 : 0;\n      const keycode2 = num2 !== undefined ? num2 : num1;\n      const primaryTagConfig = mulitTags ? inputList[keycode1] : inputList[0];\n      const secondaryTagConfig = (primaryTagConfig.subSelected ?? [])[keycode2];\n\n      if (primaryTagConfig && secondaryTagConfig) {\n        return {\n          value: {\n            key: primaryTagConfig.value,\n            value: secondaryTagConfig.value,\n          },\n          isMulti: primaryTagConfig.isMulti,\n        };\n      }\n    } catch {\n      return;\n    }\n  }\n\n  public setLabelBySelectedList(num1: number, num2?: number) {\n    const newTagConfig = this.getTagResultByCode(num1, num2);\n\n    if (newTagConfig) {\n      const tagRes = this.combineResult(newTagConfig, this.state.tagResult[0]?.result ?? {});\n\n      const tagResult = [\n        {\n          sourceID: CommonToolUtils.getSourceID(),\n          id: this.currentTagResult?.id ?? uuid(8, 62),\n          result: tagRes,\n        },\n      ];\n\n      this.setState(\n        {\n          tagResult,\n        },\n        () => this.emitEvent('render'),\n      );\n    }\n  }\n\n  public emitEvent = (event: string) => {\n    if (this.fns[event]) {\n      this.fns[event]();\n    }\n  };\n\n  /**\n   * Combine result with inputValue and existValue\n   * @param inputValue\n   * @param existValue\n   * @returns newValue\n   */\n  public combineResult = (\n    inputValue: { value: { key: string; value: string }; isMulti: boolean },\n    existValue: ObjectString = {},\n  ) => {\n    const { isMulti } = inputValue;\n    const { key, value } = inputValue.value;\n\n    if (isMulti) {\n      let valuesArray = existValue[key]?.split(';') ?? [];\n      if (valuesArray.includes(value)) {\n        valuesArray = valuesArray.filter((i) => i !== value);\n      } else {\n        valuesArray.push(value);\n      }\n\n      const valuesSet = new Set(valuesArray);\n      existValue[key] = Array.from(valuesSet).join(';');\n      return _.pickBy(existValue, (v) => v);\n    }\n\n    existValue[key] = existValue[key] === value ? undefined : value;\n\n    return _.pickBy(existValue, (v) => v);\n  };\n\n  public setResult = (tagResult: any[]) => {\n    this.setState({\n      tagResult,\n    });\n\n    if (this.fns['render']) {\n      this.fns['render']();\n    }\n  };\n\n  public setLabel = (num1: number, num2: number) => {\n    this.setLabelBySelectedList(num1, num2);\n  };\n\n  /**\n   * Keydown event for recording keycode input(numeric only)\n   * @param event\n   */\n  public keydown = (event: KeyboardEvent) => {\n    const keyCode = getKeyCodeNumber(event.keyCode);\n\n    if (keyCode) {\n      const keyIndex = keyCode - 1;\n\n      if (this.config.inputList.length === 1) {\n        // 说明标签只有一层\n        this.labelSelectedList = [0, keyIndex];\n        this.setLabel(0, keyIndex);\n        setTimeout(() => {\n          this.labelSelectedList = [];\n          this.emitEvent('render');\n        }, 500);\n\n        return;\n      }\n\n      if (this.labelSelectedList.length === 1) {\n        this.labelSelectedList = [this.labelSelectedList[0], keyIndex];\n        this.setLabel(this.labelSelectedList[0], keyIndex);\n        setTimeout(() => {\n          this.labelSelectedList = [];\n          this.emitEvent('render');\n        }, 500);\n      } else {\n        this.labelSelectedList = [keyIndex];\n        this.emitEvent('expend');\n      }\n    }\n  };\n\n  public setValid = (valid: boolean) => {\n    this.setState({ valid });\n    if (valid === false) {\n      this.setState({ tagResult: [] });\n    }\n\n    this.emitEvent('render');\n  };\n\n  public componentDidMount() {\n    document.addEventListener('keydown', this.keydown);\n    this.props.onMounted(this);\n    this.setResultFromImgList(this.props);\n  }\n\n  public componentWillUnmount() {\n    document.addEventListener('keydown', this.keydown);\n    this.props.onUnmounted();\n  }\n\n  public setResultFromImgList = (props: IVideoTagInstanceAdaptorProps) => {\n    const { imgList, imgIndex, step } = props;\n\n    if (!imgList[imgIndex]) {\n      return;\n    }\n    const res = jsonParser(imgList[imgIndex].result);\n    const stepRes = res[`step_${step}`];\n\n    this.setState({\n      tagResult: stepRes?.result ?? [],\n      valid: res?.valid === undefined ? true : res.valid,\n    });\n  };\n\n  /** Observer imgIndex and set tagResult */\n  public shouldComponentUpdate(props: IVideoTagInstanceAdaptorProps) {\n    if (props.imgIndex !== this.props.imgIndex) {\n      this.setResultFromImgList(props);\n    }\n    return true;\n  }\n\n  public render() {\n    const { imgIndex, imgList, pageForward, pageJump, pageBackward } = this.props;\n    const { tagResult, valid } = this.state;\n\n    return (\n      <div style={{ height: '100%', width: '100%', position: 'relative' }}>\n        <VideoPlayer\n          imgIndex={imgIndex}\n          imgList={imgList}\n          pageBackward={pageBackward}\n          pageForward={pageForward}\n          pageJump={pageJump}\n          valid={valid}\n          setVideoRef={(video) => {\n            this.videoRef = video;\n          }}\n        />\n        <VideoTagLayer result={tagResult} inputList={this.config?.inputList} />\n      </div>\n    );\n  }\n}\n"],"names":["React","_","getKeyCodeNumber","jsonParser","CommonToolUtils","uuid","VideoPlayer","VideoTagLayer"],"mappings":"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"}

package/dist/components/videoPlayer/TagToolInstanceAdaptorI18nProvider.js

@@ -1 +1,40 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),lbUtils=require("@labelbee/lb-utils"),reactI18next=require("react-i18next"),TagToolInstanceAdaptor=require("./TagToolInstanceAdaptor.js");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React),__defProp=Object.defineProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(e,r,t)=>r in e?__defProp(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,__spreadValues=(e,r)=>{for(var t in r||(r={}))__hasOwnProp.call(r,t)&&__defNormalProp(e,t,r[t]);if(__getOwnPropSymbols)for(var t of __getOwnPropSymbols(r))__propIsEnum.call(r,t)&&__defNormalProp(e,t,r[t]);return e};const VideoTagTool=e=>(React.useEffect(()=>{lbUtils.i18n.changeLanguage(e.lang)},[e.lang]),React__default.default.createElement(reactI18next.I18nextProvider,{i18n:lbUtils.i18n},React__default.default.createElement(TagToolInstanceAdaptor.TagToolInstanceAdaptor,__spreadValues({},e))));exports.VideoTagTool=VideoTagTool;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var lbUtils = require('@labelbee/lb-utils');
+var reactI18next = require('react-i18next');
+var TagToolInstanceAdaptor = require('./TagToolInstanceAdaptor.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {enumerable: true, configurable: true, writable: true, value}) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+const VideoTagTool = (props) => {
+  React.useEffect(() => {
+    lbUtils.i18n.changeLanguage(props.lang);
+  }, [props.lang]);
+  return /* @__PURE__ */ React__default["default"].createElement(reactI18next.I18nextProvider, {
+    i18n: lbUtils.i18n
+  }, /* @__PURE__ */ React__default["default"].createElement(TagToolInstanceAdaptor.TagToolInstanceAdaptor, __spreadValues({}, props)));
+};
+
+exports.VideoTagTool = VideoTagTool;
+//# sourceMappingURL=TagToolInstanceAdaptorI18nProvider.js.map

package/dist/components/videoPlayer/TagToolInstanceAdaptorI18nProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagToolInstanceAdaptorI18nProvider.js","sources":["../../../src/components/videoPlayer/TagToolInstanceAdaptorI18nProvider.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { i18n } from '@labelbee/lb-utils';\nimport { I18nextProvider } from 'react-i18next';\nimport { IVideoTagInstanceAdaptorProps, TagToolInstanceAdaptor } from './TagToolInstanceAdaptor';\n\n/**\n * I18n provider for InstanceAdaptorI18nProvider\n * @param props\n */\nexport const VideoTagTool = (props: IVideoTagInstanceAdaptorProps & { lang?: string }) => {\n  useEffect(() => {\n    i18n.changeLanguage(props.lang);\n  }, [props.lang]);\n\n  return (\n    <I18nextProvider i18n={i18n}>\n      <TagToolInstanceAdaptor {...props} />\n    </I18nextProvider>\n  );\n};\n"],"names":["useEffect","i18n","I18nextProvider","React","TagToolInstanceAdaptor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASa,MAAA,YAAA,GAAe,CAAC,KAA6D,KAAA;AACxF,EAAAA,eAAA,CAAU,MAAM;AACd,IAAAC,YAAA,CAAK,eAAe,KAAM,CAAA,IAAA,CAAA,CAAA;AAAA,GAAA,EACzB,CAAC,KAAM,CAAA,IAAA,CAAA,CAAA,CAAA;AAEV,EAAA,+DACGC,4BAAD,EAAA;AAAA,UAAiBD,YAAA;AAAA,GACf,kBAAAE,yBAAA,CAAA,aAAA,CAACC,+CAAD,cAA4B,CAAA,EAAA,EAAA,KAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

package/dist/components/videoPlayer/VideoTagLayer.js

@@ -1 +1,37 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),utils=require("./utils.js");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React);const tagLayerCSSProperty={position:"absolute",zIndex:20,padding:"0 20px",color:"white",fontSize:15,lineHeight:"32px",background:"rgba(0, 255, 255, 0.32)",top:0,right:0,maxHeight:"calc(100% - 80px)",overflowY:"scroll"},VideoTagLayer=({result:e,inputList:a})=>{const l=utils.result2LabelKey(e,a);return React__default.default.createElement("div",{style:tagLayerCSSProperty},React__default.default.createElement("table",null,React__default.default.createElement("tbody",null,l.map(({keyLabel:t,valuesLabelArray:r})=>React__default.default.createElement("tr",{key:t},React__default.default.createElement("td",{style:{paddingRight:8}},`${t}:`),React__default.default.createElement("td",null,`${r.join("\u3001")}`))))))};exports.VideoTagLayer=VideoTagLayer;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var utils = require('./utils.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const tagLayerCSSProperty = {
+  position: "absolute",
+  zIndex: 20,
+  padding: "0 20px",
+  color: "white",
+  fontSize: 15,
+  lineHeight: "32px",
+  background: "rgba(0, 255, 255, 0.32)",
+  top: 0,
+  right: 0,
+  maxHeight: "calc(100% - 80px)",
+  overflowY: "scroll"
+};
+const VideoTagLayer = ({result, inputList}) => {
+  const tagsLabel = utils.result2LabelKey(result, inputList);
+  return /* @__PURE__ */ React__default["default"].createElement("div", {
+    style: tagLayerCSSProperty
+  }, /* @__PURE__ */ React__default["default"].createElement("table", null, /* @__PURE__ */ React__default["default"].createElement("tbody", null, tagsLabel.map(({keyLabel, valuesLabelArray}) => /* @__PURE__ */ React__default["default"].createElement("tr", {
+    key: keyLabel
+  }, /* @__PURE__ */ React__default["default"].createElement("td", {
+    style: {paddingRight: 8}
+  }, `${keyLabel}:`), /* @__PURE__ */ React__default["default"].createElement("td", null, `${valuesLabelArray.join("\u3001")}`))))));
+};
+
+exports.VideoTagLayer = VideoTagLayer;
+//# sourceMappingURL=VideoTagLayer.js.map

package/dist/components/videoPlayer/VideoTagLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VideoTagLayer.js","sources":["../../../src/components/videoPlayer/VideoTagLayer.tsx"],"sourcesContent":["import React from 'react';\nimport { result2LabelKey } from './utils';\nimport type { ITagLabelsArray } from './types';\nimport { IInputList } from '@/types/main';\n\ninterface IVideoTagLayerProps {\n  result: Array<{ result: { [key: string]: string } }>;\n  inputList: IInputList[];\n}\n\nconst tagLayerCSSProperty: React.CSSProperties = {\n  position: 'absolute',\n  zIndex: 20,\n  padding: '0 20px',\n  color: 'white',\n  fontSize: 15,\n  lineHeight: '32px',\n  background: 'rgba(0, 255, 255, 0.32)',\n  top: 0,\n  right: 0,\n  maxHeight: 'calc(100% - 80px)',\n  overflowY: 'scroll',\n};\n\nexport const VideoTagLayer: React.FC<IVideoTagLayerProps> = ({ result, inputList }) => {\n  const tagsLabel: ITagLabelsArray = result2LabelKey(result, inputList);\n  return (\n    <div style={tagLayerCSSProperty}>\n      <table>\n        <tbody>\n          {tagsLabel.map(({ keyLabel, valuesLabelArray }) => (\n            <tr key={keyLabel}>\n              <td style={{ paddingRight: 8 }}>{`${keyLabel}:`}</td>\n              <td>{`${valuesLabelArray.join('、')}`}</td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n};\n"],"names":["result2LabelKey","React"],"mappings":";;;;;;;;;;;AAUA,MAAM,mBAA2C,GAAA;AAAA,EAC/C,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,EAAA;AAAA,EACR,OAAS,EAAA,QAAA;AAAA,EACT,KAAO,EAAA,OAAA;AAAA,EACP,QAAU,EAAA,EAAA;AAAA,EACV,UAAY,EAAA,MAAA;AAAA,EACZ,UAAY,EAAA,yBAAA;AAAA,EACZ,GAAK,EAAA,CAAA;AAAA,EACL,KAAO,EAAA,CAAA;AAAA,EACP,SAAW,EAAA,mBAAA;AAAA,EACX,SAAW,EAAA,QAAA;AAAA,CAAA,CAAA;AAGN,MAAM,aAA+C,GAAA,CAAC,CAAE,MAAA,EAAQ,SAAgB,CAAA,KAAA;AACrF,EAAM,MAAA,SAAA,GAA6BA,sBAAgB,MAAQ,EAAA,SAAA,CAAA,CAAA;AAC3D,EAAA,+DACG,KAAD,EAAA;AAAA,IAAK,KAAO,EAAA,mBAAA;AAAA,GAAA,kBACTC,yBAAA,CAAA,aAAA,CAAA,OAAA,EAAD,IACE,kBAAAA,yBAAA,CAAA,aAAA,CAAC,OAAD,EAAA,IAAA,EACG,SAAU,CAAA,GAAA,CAAI,CAAC,CAAE,QAAU,EAAA,gBAAA,CAAA,6DACzB,IAAD,EAAA;AAAA,IAAI,GAAK,EAAA,QAAA;AAAA,GAAA,0DACN,IAAD,EAAA;AAAA,IAAI,KAAA,EAAO,CAAE,YAAc,EAAA,CAAA,CAAA;AAAA,GAAA,EAAM,GAAG,QACpC,CAAA,CAAA,CAAA,CAAA,kBAAAA,yBAAA,CAAA,aAAA,CAAC,MAAD,IAAK,EAAA,CAAA,EAAG,iBAAiB,IAAK,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}