react-filerobot-video-editor/lib/hooks/useAnnotation/previewThenCallAnnotationAdding.js

React component version of filerobot video editor (FVE).

import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _defineProperty from"@babel/runtime/helpers/defineProperty";var _excluded=["id","x","y","points"],_excluded2=["startedX","startedY","offsetX","offsetY","width","height"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{TOOLS_IDS}from"../../utils/constants";import getPointerOffsetPosition from"../../utils/getPointerOffsetPosition";import getBoundingRectUnScaled from"./getBoundingRectUnScaled";import getNewAnnotationPreview,{dimensToProperAnnotationDimens,NO_WIDTH_HEIGHT_ANNOTATIONS}from"./getNewAnnotationPreview";var pointerDown={startedX:void 0,startedY:void 0,isOutOfCanvas:!1},eventsOptions={passive:!0},MIN_PIXELS=1,shownAnnotationPreview=null,textAnnotationWrappedRect=null,latestAnnotationProps=null,previewThenCallAnnotationAdding=function(a,b,c,d,e){var f=function b(a){textAnnotationWrappedRect=getNewAnnotationPreview(_objectSpread(_objectSpread({},a),{},{name:TOOLS_IDS.RECT,fill:"",stroke:"#000000",strokeWidth:2,shadowColor:"#ffffff",shadowBlur:1,shadowOpacity:.7}),e),c&&c.add(textAnnotationWrappedRect)},g=function b(a){shownAnnotationPreview=getNewAnnotationPreview(a,e),c&&c.add(shownAnnotationPreview),a.name===TOOLS_IDS.TEXT&&f(a),latestAnnotationProps=a},h=function c(a,b){if(latestAnnotationProps){var d=dimensToProperAnnotationDimens(a,latestAnnotationProps.name,b);textAnnotationWrappedRect&&textAnnotationWrappedRect.setAttrs(d),shownAnnotationPreview.setAttrs(d),latestAnnotationProps=_objectSpread(_objectSpread({},latestAnnotationProps),d)}},i=function b(a){var d=getPointerOffsetPosition(c);h(getBoundingRectUnScaled(d,pointerDown,c),a.shiftKey)},j=function a(){c&&shownAnnotationPreview&&c.destroyChildren()},k=function e(d){var f;if(!(1<(null===(f=d.evt.touches)||void 0===f?void 0:f.length))){var j=getPointerOffsetPosition(c);pointerDown.isOutOfCanvas&&(document.removeEventListener("mousemove",i,eventsOptions),document.removeEventListener("touchmove",i,eventsOptions),pointerDown.isOutOfCanvas=!1);var k=getBoundingRectUnScaled(j,pointerDown,c);if(shownAnnotationPreview)h(k,d.evt.shiftKey);else{var l=b.id,m=b.x,n=b.y,o=b.points,p=_objectWithoutProperties(b,_excluded);g(_objectSpread(_objectSpread({},p),k))}a.setAttrs({isDrawing:!0})}},l=function a(){pointerDown.isOutOfCanvas||(document.addEventListener("mousemove",i,eventsOptions),document.addEventListener("touchmove",i,eventsOptions),pointerDown.isOutOfCanvas=!0)},m=function c(){var e,f;if(j(),latestAnnotationProps&&(latestAnnotationProps.width>=MIN_PIXELS&&latestAnnotationProps.height>=MIN_PIXELS||latestAnnotationProps.radiusX>=MIN_PIXELS&&latestAnnotationProps.radiusY>=MIN_PIXELS||null!==(e=latestAnnotationProps.points)&&void 0!==e&&e[2]||null!==(f=latestAnnotationProps.points)&&void 0!==f&&f[3]||latestAnnotationProps.radius>=MIN_PIXELS)){var g=latestAnnotationProps,h=g.startedX,n=g.startedY,o=g.offsetX,p=g.offsetY,q=g.width,r=g.height,s=_objectWithoutProperties(g,_excluded2);NO_WIDTH_HEIGHT_ANNOTATIONS.includes(b.name)||(s.width=q,s.height=r),d(s,!0)}shownAnnotationPreview=null,textAnnotationWrappedRect=null,latestAnnotationProps=null,a.setAttrs({isDrawing:!1}),a.off("mousemove touchmove",k),a.off("mouseleave touchcancel",l),document.removeEventListener("mouseup",m,eventsOptions),document.removeEventListener("touchend",m,eventsOptions),document.removeEventListener("mouseleave",m,eventsOptions),document.removeEventListener("touchcancel",m,eventsOptions),document.removeEventListener("mousemove",i,eventsOptions),document.removeEventListener("touchmove",i,eventsOptions),pointerDown.isOutOfCanvas=!1},n=function d(b){var e;if(b.evt.preventDefault(),!(b.target.attrs.draggable||1<(null===(e=b.evt.touches)||void 0===e?void 0:e.length))){j();var f=getPointerOffsetPosition(c);pointerDown.startedX=f.offsetX,pointerDown.startedY=f.offsetY,pointerDown.isOutOfCanvas=!1,a.on("mousemove touchmove",k),a.on("mouseleave touchcancel",l),document.addEventListener("mouseup",m,eventsOptions),document.addEventListener("touchend",m,eventsOptions),document.addEventListener("mouseleave",m,eventsOptions),document.addEventListener("touchcancel",m,eventsOptions)}};return a.on("mousedown touchstart",n),function(){j(),a.off("mousedown touchstart",n)}};export default previewThenCallAnnotationAdding;