@labelbee/lb-components 1.24.0-alpha.57 → 1.24.0-alpha.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- "use strict";var audio=require("../../../../utils/audio.js"),lbAnnotation=require("@labelbee/lb-annotation"),antd=require("antd"),React=require("react"),constant=require("../constant.js"),utils=require("../../../videoPlayer/utils.js"),reactI18next=require("react-i18next");function _interopDefaultLegacy(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var React__default=_interopDefaultLegacy(React);const ToolTipForClip=t=>{var a,l;const{slot:u,item:e,attributeList:o}=t,{t:r}=reactI18next.useTranslation();if(!u)return null;const{type:s,attribute:d,textAttribute:c,text:v}=e;if(e.start===void 0||e.end===void 0)return null;const i=utils.decimalReserved(e.start,2),n=(l=utils.decimalReserved((a=e.end)!=null?a:0,2))!=null?l:0,m=React__default.default.createElement("div",null,React__default.default.createElement("div",null,s===constant.ETimeSliceType.Period?`${audio.timeFormat(i,"ss:SS")}~${audio.timeFormat(n,"ss:SS")}\uFF0C${audio.precisionMinus(n,i)}s`:audio.timeFormat(i,"ss:SS")),React__default.default.createElement("div",null,`${r("Attribute")}\uFF1A${lbAnnotation.AttributeUtils.getAttributeShowText(d,o)||r("NoAttribute")}`),React__default.default.createElement("div",null,`${r("SubAttribute")}\uFF1A${v}`),React__default.default.createElement("div",null,`${r("textTool")}\uFF1A${c}`));return React__default.default.createElement(antd.Tooltip,{title:m},u)};module.exports=ToolTipForClip;
1
+ "use strict";var audio=require("../../../../utils/audio.js"),lbAnnotation=require("@labelbee/lb-annotation"),antd=require("antd"),React=require("react"),constant=require("../constant.js"),utils=require("../../../videoPlayer/utils.js"),reactI18next=require("react-i18next");function _interopDefaultLegacy(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var React__default=_interopDefaultLegacy(React);const ToolTipForClip=t=>{var i,l;const{slot:u,item:e,attributeList:o}=t,{t:r}=reactI18next.useTranslation();if(!u)return null;const{type:s,attribute:d,textAttribute:c,text:v}=e;if(e.start===void 0||e.end===void 0)return null;const a=utils.decimalReserved(e.start,2),n=(l=utils.decimalReserved((i=e.end)!=null?i:0,2))!=null?l:0,m=React__default.default.createElement("div",null,React__default.default.createElement("div",null,s===constant.ETimeSliceType.Period?`${audio.timeFormat(a,"ss:SS")}~${audio.timeFormat(n,"ss:SS")}\uFF0C${audio.precisionMinus(n,a)}s`:audio.timeFormat(a,"ss:SS")),React__default.default.createElement("div",null,`${r("Attribute")}\uFF1A${lbAnnotation.AttributeUtils.getAttributeShowText(d,o)||r("NoAttribute")}`),React__default.default.createElement("div",null,`${r("SubAttribute")}\uFF1A${v}`),React__default.default.createElement("div",null,`${r("textTool")}\uFF1A${c}`));return React__default.default.createElement(antd.Tooltip,{title:m,placement:"leftTop"},u)};module.exports=ToolTipForClip;
@@ -1 +1 @@
1
- "use strict";var audio=require("../../../../../utils/audio.js"),index$1=require("../../../../../utils/index.js"),icons=require("@ant-design/icons"),React=require("react"),constant=require("../../constant.js"),index=require("../timeSliceRange/index.js"),ToolTipForClip=require("../ToolTipForClip.js"),index$2=require("../videoTrack/index.js"),index_module=require("./index.module.scss.js"),utils=require("../../../../videoPlayer/utils.js"),ctx=require("../../../../../store/ctx.js"),reactRedux=require("react-redux"),reactI18next=require("react-i18next");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React);const TimeSliceIcon=({type:e})=>e===constant.ETimeSliceType.Time?React__default.default.createElement(icons.EnvironmentFilled,null):React__default.default.createElement(icons.ScissorOutlined,{rotate:270}),EmptyVideoClipAnnotatedList=()=>{const{t:e}=reactI18next.useTranslation();return React__default.default.createElement("div",{className:index_module.noContent},React__default.default.createElement("div",null,e("NoClippedData")),React__default.default.createElement("div",null,React__default.default.createElement("span",{className:index_module.hotkey},"X"),e("ClipSlice")),React__default.default.createElement("div",null,React__default.default.createElement("span",{className:index_module.hotkey},"E"),e("TimeStamp")))},VideoClipAnnotatedListWrapper=({children:e})=>{const t=e.length===0;return React__default.default.createElement("div",{className:index$1.classnames({[index_module.empty]:t,[index_module.timeSliceListContent]:!0})},t?React__default.default.createElement(EmptyVideoClipAnnotatedList,null):e)},VideoClipAnnotatedItem=({timeSliceProps:e,index:t,exportContext:i})=>{const{selectedID:a,attributeList:n,onSelectedTimeSlice:r,removeTimeSlice:d}=i;return React__default.default.createElement("div",{key:t,className:index$1.classnames({[index_module.timeSliceItem]:!0,[index_module.timeSliceItemActivated]:e.id===a}),onClick:()=>{r(e)}},React__default.default.createElement(ToolTipForClip,{slot:React__default.default.createElement("div",{className:index_module.timeSliceItemContent},React__default.default.createElement("div",{className:index_module.textOverflow},`${t+1}\u3001\u3010${constant.TIME_SLICE_TYPE[e.type]}\u3011 ${index$2.getDisplayContent(e,n)}`),React__default.default.createElement("div",{className:index$1.classnames({[index_module.textOverflow]:!0})},React__default.default.createElement(TimeSliceIcon,{type:e.type}),React__default.default.createElement("span",{style:{marginLeft:10}},`${audio.timeFormat(e.start,"ss:SS")} ${e.end&&e.type===constant.ETimeSliceType.Period?"~ "+audio.timeFormat(e.end,"ss:SS")+", "+utils.decimalReserved(e.end-e.start,2)+"s":""}`))),item:e,attributeList:n}),React__default.default.createElement(icons.CloseCircleFilled,{className:index_module.timeSliceItemDeleteIcon,onClick:u=>{u.stopPropagation(),d(e)}}))},VideoClipAnnotatedList=e=>{const{toolInstance:t}=e,{selectedID:i,result:a,videoPlayer:n,clipStatus:r,updateSelectedSliceTimeProperty:d}=(t==null?void 0:t.exportContext)||{},[u,o]=React.useState(0),{t:m}=reactI18next.useTranslation();React.useEffect(()=>(t&&t.singleOn("changeClipSidebar",l=>{o(s=>s+1)}),()=>{var l;(l=t==null?void 0:t.unbindAll)==null||l.call(t,"changeClipSidebar")}),[t]);const v=a==null?void 0:a.find(l=>l.id===i),c=a==null?void 0:a.filter(l=>l.end!==null);return(t==null?void 0:t.exportContext)?React__default.default.createElement("div",null,React__default.default.createElement("div",{className:index_module.timeSliceListHeader},m("AnnotatedList")),React__default.default.createElement(VideoClipAnnotatedListWrapper,null,c==null?void 0:c.map((l,s)=>React__default.default.createElement(VideoClipAnnotatedItem,{timeSliceProps:l,index:s,key:l.id,exportContext:(t==null?void 0:t.exportContext)||{}}))),React__default.default.createElement(index,{selectedTimeSlice:v,videoPlayer:n,updateTimeForSelected:d,disabled:r===constant.EClipStatus.Clipping})):null},mapStateToProps=({annotation:e})=>{const{toolInstance:t}=e;return{toolInstance:t}};var VideoClipAnnotatedList$1=reactRedux.connect(mapStateToProps,null,null,{context:ctx.LabelBeeContext})(VideoClipAnnotatedList);module.exports=VideoClipAnnotatedList$1;
1
+ "use strict";var audio=require("../../../../../utils/audio.js"),index$1=require("../../../../../utils/index.js"),icons=require("@ant-design/icons"),React=require("react"),constant=require("../../constant.js"),index=require("../timeSliceRange/index.js"),ToolTipForClip=require("../ToolTipForClip.js"),index$2=require("../videoTrack/index.js"),index_module=require("./index.module.scss.js"),utils=require("../../../../videoPlayer/utils.js"),ctx=require("../../../../../store/ctx.js"),reactRedux=require("react-redux"),reactI18next=require("react-i18next");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React);const TimeSliceIcon=({type:e})=>e===constant.ETimeSliceType.Time?React__default.default.createElement(icons.EnvironmentFilled,null):React__default.default.createElement(icons.ScissorOutlined,{rotate:270}),EmptyVideoClipAnnotatedList=()=>{const{t:e}=reactI18next.useTranslation();return React__default.default.createElement("div",{className:index_module.noContent},React__default.default.createElement("div",null,e("NoClippedData")),React__default.default.createElement("div",null,React__default.default.createElement("span",{className:index_module.hotkey},"X"),e("ClipSlice")),React__default.default.createElement("div",null,React__default.default.createElement("span",{className:index_module.hotkey},"E"),e("TimeStamp")))},VideoClipAnnotatedListWrapper=({children:e,scrollRef:t})=>{const n=e.length===0;return React__default.default.createElement("div",{ref:t,className:index$1.classnames({[index_module.empty]:n,[index_module.timeSliceListContent]:!0})},n?React__default.default.createElement(EmptyVideoClipAnnotatedList,null):e)},VideoClipAnnotatedItem=({timeSliceProps:e,index:t,exportContext:n,onItemClick:a})=>{const{selectedID:s,attributeList:i,removeTimeSlice:u}=n;return React__default.default.createElement("div",{key:t,className:index$1.classnames({[index_module.timeSliceItem]:!0,[index_module.timeSliceItemActivated]:e.id===s}),onClick:()=>{a(e)}},React__default.default.createElement(ToolTipForClip,{slot:React__default.default.createElement("div",{className:index_module.timeSliceItemContent},React__default.default.createElement("div",{className:index_module.textOverflow},`${t+1}\u3001\u3010${constant.TIME_SLICE_TYPE[e.type]}\u3011 ${index$2.getDisplayContent(e,i)}`),React__default.default.createElement("div",{className:index$1.classnames({[index_module.textOverflow]:!0})},React__default.default.createElement(TimeSliceIcon,{type:e.type}),React__default.default.createElement("span",{style:{marginLeft:10}},`${audio.timeFormat(e.start,"ss:SS")} ${e.end&&e.type===constant.ETimeSliceType.Period?"~ "+audio.timeFormat(e.end,"ss:SS")+", "+utils.decimalReserved(e.end-e.start,2)+"s":""}`))),item:e,attributeList:i}),React__default.default.createElement(icons.CloseCircleFilled,{className:index_module.timeSliceItemDeleteIcon,onClick:d=>{d.stopPropagation(),u(e)}}))},VideoClipAnnotatedList=e=>{const{toolInstance:t}=e,{selectedID:n,result:a,videoPlayer:s,clipStatus:i,updateSelectedSliceTimeProperty:u}=(t==null?void 0:t.exportContext)||{},[d,x]=React.useState(0),c=React.useRef(null),o=React.useRef(!1),{t:C}=reactI18next.useTranslation();React.useEffect(()=>(t&&t.singleOn("changeClipSidebar",l=>{x(r=>r+1)}),()=>{var l;(l=t==null?void 0:t.unbindAll)==null||l.call(t,"changeClipSidebar")}),[t]);const T=a==null?void 0:a.find(l=>l.id===n),f=a==null?void 0:a.filter(l=>l.end!==null),y=l=>{o.current=!0,t.exportContext.onSelectedTimeSlice(l)};return React.useLayoutEffect(()=>{var l,r,v;if(!n||!c.current)return;if(o.current){o.current=!1;return}const p=(r=(l=t==null?void 0:t.exportContext)==null?void 0:l.result)==null?void 0:r.filter(m=>m.end!==null),E=p==null?void 0:p.findIndex(m=>m.id===n);E>=0&&((v=c.current.children[E])==null||v.scrollIntoView({block:"nearest"}))},[n,d,t]),(t==null?void 0:t.exportContext)?React__default.default.createElement("div",null,React__default.default.createElement("div",{className:index_module.timeSliceListHeader},C("AnnotatedList")),React__default.default.createElement(VideoClipAnnotatedListWrapper,{scrollRef:c},f==null?void 0:f.map((l,r)=>React__default.default.createElement(VideoClipAnnotatedItem,{timeSliceProps:l,index:r,key:l.id,exportContext:(t==null?void 0:t.exportContext)||{},onItemClick:y}))),React__default.default.createElement(index,{selectedTimeSlice:T,videoPlayer:s,updateTimeForSelected:u,disabled:i===constant.EClipStatus.Clipping})):null},mapStateToProps=({annotation:e})=>{const{toolInstance:t}=e;return{toolInstance:t}};var VideoClipAnnotatedList$1=reactRedux.connect(mapStateToProps,null,null,{context:ctx.LabelBeeContext})(VideoClipAnnotatedList);module.exports=VideoClipAnnotatedList$1;
@@ -1,2 +1,2 @@
1
- "use strict";var lbAnnotation=require("@labelbee/lb-annotation"),index$2=require("../../../utils/index.js"),audio=require("../../../utils/audio.js"),antd=require("antd"),_=require("lodash"),React=require("react"),index_module=require("./index.module.scss.js"),VideoClipToolContext=require("./VideoClipToolContext.js"),constant=require("./constant.js"),index=require("../../videoPlayer/index.js"),index$1=require("./components/videoTimeSlicesOverVideo/index.js"),icon_videoCutting=require("../../../assets/annotation/video/icon_videoCutting.svg.js"),utils=require("../../videoPlayer/utils.js");function _interopDefaultLegacy(o){return o&&typeof o=="object"&&"default"in o?o:{default:o}}var ___default=_interopDefaultLegacy(_),React__default=_interopDefaultLegacy(React),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(o,s,t)=>s in o?__defProp(o,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[s]=t,__spreadValues=(o,s)=>{for(var t in s||(s={}))__hasOwnProp.call(s,t)&&__defNormalProp(o,t,s[t]);if(__getOwnPropSymbols)for(var t of __getOwnPropSymbols(s))__propIsEnum.call(s,t)&&__defNormalProp(o,t,s[t]);return o},__spreadProps=(o,s)=>__defProps(o,__getOwnPropDescs(s));class VideoClipTool extends React__default.default.Component{constructor(s){super(s);this.fns=new Map,this.throttledUpdateTime=___default.default.throttle(t=>{this.videoPlayer.currentTime=t},100,{trailing:!0}),this.stepInfo=()=>this.props.stepInfo,this.emitEvent=t=>{const e=this.fns.get(t);e&&e.forEach(i=>{i&&i()})},this.setValid=t=>{this.setState({valid:t}),t===!1&&(this.clearResult(),this.updateSidebar())},this.updateSidebar=()=>{this.emitEvent("changeClipSidebar"),this.emitEvent("updateTextAttribute"),this.emitEvent("changeAttributeSidebar")},this.exportData=()=>{var t,e;const i=(e=(t=this.videoRef)==null?void 0:t.duration)!=null?e:0;return[this.state.result.filter(r=>r.end!==null),{valid:this.state.valid,duration:i}]},this.exportCustomData=()=>({extraResult:this.state.extraResult}),this.updateSelectedSliceTimeStartByPer=t=>{var e,i;if(this.state.clipStatus===constant.EClipStatus.Clipping){antd.message.info("\u622A\u53D6\u4E2D\u4E0D\u652F\u6301\u8C03\u6574\u5F00\u59CB\u65F6\u95F4");return}if(this.selectedSliceIndex>-1){const r=(i=(e=this.videoPlayer)==null?void 0:e.duration)!=null?i:0,{end:a,start:n,type:l}=this.state.result[this.selectedSliceIndex],u=lbAnnotation.MathUtils.withinRange(audio.precisionAdd(n,t),[0,audio.precisionMinus(l===constant.ETimeSliceType.Time?r:a,constant.PER_SLICE_CHANGE)]);this.updateSelectedSliceTimeProperty(u,"start")}},this.updateSelectedSliceTimeEndByPer=t=>{var e,i;if(this.state.clipStatus===constant.EClipStatus.Clipping){antd.message.info("\u622A\u53D6\u4E2D\u4E0D\u652F\u6301\u8C03\u6574\u7ED3\u675F\u65F6\u95F4");return}if(this.selectedSliceIndex>-1){const r=this.state.result[this.selectedSliceIndex],a=(i=(e=this.videoPlayer)==null?void 0:e.duration)!=null?i:0;if(r.type===constant.ETimeSliceType.Time){antd.message.info("\u65F6\u95F4\u70B9\u4EC5\u652F\u6301\u8C03\u6574\u5F00\u59CB\u65F6\u95F4");return}const{end:n,start:l}=r,u=lbAnnotation.MathUtils.withinRange(audio.precisionAdd(n,t),[audio.precisionAdd(l,constant.PER_SLICE_CHANGE),a]);this.updateSelectedSliceTimeProperty(u,"end")}},this.updateSelectedSliceTimeProperty=(t,e)=>{if(this.selectedSliceIndex>-1){const{result:i}=this.state;i[this.selectedSliceIndex][e]=t,this.setState({result:___default.default.cloneDeep(i)}),this.updateSidebar()}},this.keyDownEvents=t=>{if(!lbAnnotation.CommonToolUtils.hotkeyFilter(t))return;const e=t.target;switch(e&&(e==null?void 0:e.tag)==="INPUT"&&(e==null?void 0:e.type)==="radio"&&t.preventDefault(),t.key.toLocaleLowerCase()){case"x":this.toggleClipStatus();break;case"e":this.addTime();break;case"escape":this.cancelClipped();break;case"-":this.updateSelectedSliceTimeStartByPer(-constant.PER_SLICE_CHANGE);break;case"=":this.updateSelectedSliceTimeStartByPer(constant.PER_SLICE_CHANGE);break;case"[":this.updateSelectedSliceTimeEndByPer(-constant.PER_SLICE_CHANGE);break;case"]":this.updateSelectedSliceTimeEndByPer(constant.PER_SLICE_CHANGE);break}},this.setVideoError=(t,e,i)=>{if(t){const{clipStatus:r}=this.state;r===constant.EClipStatus.Clipping&&this.toggleClipStatus(i)}this.setState({videoError:t,loading:!1})},this.clearResult=()=>{this.setState({result:[],selectedID:"",textValue:""}),this.updateSidebar()},this.cancelClipped=()=>{const{result:t,selectedID:e,clipStatus:i}=this.state;if(i!==constant.EClipStatus.Clipping)return;const r=t.findIndex(a=>a.id===e);r>-1&&(t.splice(r,1),this.setState({result:t,selectedID:"",clipStatus:constant.EClipStatus.Stop}),this.updateSidebar())},this.toggleClipStatus=t=>{var e,i;if(typeof((e=this.props)==null?void 0:e.annotationBefore)=="function"){(i=this.props)==null||i.annotationBefore(()=>this.setClipResult(t));return}this.setClipResult(t)},this.setClipResult=t=>{var e,i,r,a,n,l,u;if(this.disabled)return;const{clipStatus:c,selectedAttribute:p}=this.state,d=c!==constant.EClipStatus.Clipping;let h=d?constant.EClipStatus.Clipping:constant.EClipStatus.Stop,{result:S,selectedID:f,textValue:m}=this.state;const g=___default.default.cloneDeep(S),C=t||((e=this.videoPlayer)==null?void 0:e.currentTime),T=(i=this.videoPlayer)==null?void 0:i.duration;if(T===void 0||C===void 0)return;const I=utils.decimalReserved(C,2);if(d){const v=lbAnnotation.uuid(),b={};f=v;const E=((r=this.props.config)==null?void 0:r.customAttributeInput)===!0?"\u65E0\u5C5E\u6027":p;g.push({start:I,end:null,attribute:E,textAttribute:this.defaultTextAttribute,duration:T,id:v,type:constant.ETimeSliceType.Period,subAttribute:b,text:this.getSubAttributeShowText(b,(n=(a=this.props.config)==null?void 0:a.inputList)!=null?n:[])}),m=this.defaultTextAttribute}else{const v=g.findIndex(E=>E.id===f),b=g[v];b&&(C-b.start<constant.SLICE_MIN_TIME?(g.splice(v,1),antd.message.info(`\u622A\u53D6\u7247\u6BB5\u4E0D\u80FD\u77ED\u4E8E${constant.SLICE_MIN_TIME}s`),h=constant.EClipStatus.Stop,f="",m=""):(g[v].end=utils.decimalReserved(C,2),(l=this.videoPlayer)==null||l.pause(),antd.message.success(`\u5DF2\u622A\u53D6\u7247\u6BB5${S.length}`)))}const x={clipStatus:h,result:g,selectedID:f,textValue:m};((u=this.props.config)==null?void 0:u.customAttributeInput)&&d&&(x.selectedAttribute="\u65E0\u5C5E\u6027"),this.setState(x),this.updateSidebar()},this.addTime=()=>{var t,e,i,r,a,n;if(this.disabled)return;const{result:l,selectedAttribute:u,selectedID:c}=this.state,p=lbAnnotation.uuid(),d=___default.default.cloneDeep(l),h=((t=this.videoPlayer)==null?void 0:t.currentTime)||0,S=((e=this.props.config)==null?void 0:e.customAttributeInput)?"\u65E0\u5C5E\u6027":u;d.push({start:h,end:h,attribute:S,textAttribute:this.defaultTextAttribute,id:p,type:constant.ETimeSliceType.Time,duration:(r=(i=this.videoPlayer)==null?void 0:i.duration)!=null?r:0,subAttribute:{}});const f={result:d,selectedID:p,textValue:this.defaultTextAttribute};((a=this.props.config)==null?void 0:a.customAttributeInput)&&(f.selectedAttribute="\u65E0\u5C5E\u6027");const m=d.find(g=>g.id===c);this.isClipping&&m?(delete f.selectedID,delete f.textValue,antd.message.success(`\u5DF2\u622A\u53D6\u65F6\u95F4\u70B9${d.length-1}`)):(n=this.videoPlayer)==null||n.pause(),this.setState(f),this.updateSidebar()},this.updateCurrentTime=t=>{this.setState({currentTime:t})},this.contextToCancel=t=>{this.state.clipStatus===constant.EClipStatus.Stop&&(t.preventDefault(),this.setState({selectedID:""}),this.updateSidebar())},this.onTrackResize=(t,e,i)=>{var r,a;const{result:n}=this.state,l=n.find(u=>u.id===t);if(l){const u=l.duration,c=e==="left",p=c?"start":"end",d=c?-u*i:u*i,h=c?[0,Math.max(((r=l.end)!=null?r:0)-constant.SLICE_MIN_TIME,0)]:[l.start+constant.SLICE_MIN_TIME,u],S=lbAnnotation.MathUtils.withinRange(d+((a=l==null?void 0:l[p])!=null?a:0),h);l[p]=S,this.throttledUpdateTime(S)}this.setState({result:[...n]}),this.updateSidebar()},this.renderMediaContent=()=>{var t,e,i;const{pageForward:r,pageJump:a,pageBackward:n}=this.props,{result:l,videoError:u,valid:c,currentTime:p}=this.state;return React__default.default.createElement("div",{className:index_module.clipContainer},React__default.default.createElement(index.VideoPlayer,{imgIndex:this.props.imgIndex,imgList:this.props.imgList,pageBackward:n,pageForward:r,pageJump:a,valid:c,setVideoRef:d=>{this.videoPlayer=d},showVideoTrack:!u,onTrackResize:this.onTrackResize,drawLayerSlot:this.props.drawLayerSlot,footer:this.props.footer,dataLoaded:this.props.onVideoLoaded,toggleClipStatus:this.toggleClipStatus,addTime:this.addTime,updateCurrentTime:this.updateCurrentTime}),React__default.default.createElement(index$1,{key:(t=this.videoPlayer)==null?void 0:t.currentTime,result:l,currentTime:p,attributeList:this.props.config.attributeList,inputList:(i=(e=this.props.config)==null?void 0:e.inputList)!=null?i:[],extraStyle:{top:this.props.drawLayerSlot?40:0}}),this.isClipping&&React__default.default.createElement("i",{className:index_module.clipping,style:{backgroundImage:icon_videoCutting}}))},this.onSelectedTimeSlice=t=>{var e;this.isClipping||(this.setState({selectedID:t.id,selectedAttribute:t.attribute,textValue:t.textAttribute,currentTime:t.start}),this.updateSidebar(),(e=this.videoPlayer)==null||e.pause(),this.videoPlayer.currentTime=t.start)},this.removeTimeSlice=t=>{const{result:e}=this.state,i=this.state.selectedID===t.id?"":this.state.selectedID,r=e.findIndex(a=>a.id===t.id);r>-1&&(e.splice(r,1),this.setState({result:[...e],selectedID:i}),this.updateSidebar())},this.setResult=(t=!0,e=this.props)=>{var i,r;try{const{imgIndex:a,imgList:n}=e;if(!n[a])return;const u=index$2.jsonParser(n[a].result)[`step_${this.stepInfo().step}`],c=(u==null?void 0:u.result)||[],p=(u==null?void 0:u.extraResult)||{globalTag:{}},d=(r=(i=this.props.config)==null?void 0:i.inputList)!=null?r:[];c.forEach(S=>{S.text=this.getSubAttributeShowText(S.subAttribute,d)});const h=audio.isImageValue(n[a].result||"[]");this.setState({result:c,loading:t,selectedID:"",textValue:"",selectedAttribute:"",clipStatus:constant.EClipStatus.Stop,valid:h,extraResult:p},()=>{this.updateSidebar(),h||antd.message.info("\u65E0\u6548\u89C6\u9891\uFF0C\u8BF7\u8DF3\u8FC7")})}catch(a){console.error("\u6570\u636E\u89E3\u6790\u5931\u8D25"),this.setState({result:[],loading:!1,selectedID:"",textValue:"",selectedAttribute:"",valid:!0,extraResult:{globalTag:{}}},()=>{this.updateSidebar()})}},this.setDefaultAttribute=t=>{const{result:e,selectedID:i}=this.state,r=e.find(a=>a.id===i);r&&i&&(r.attribute=t),this.setState({selectedAttribute:t,result:[...e]}),this.updateSidebar()},this.setSubAttribute=(t,e)=>{var i,r;const{result:a,selectedID:n}=this.state;if(n){const l=a.find(u=>u.id===n);l&&(l.subAttribute||(l.subAttribute={}),l.subAttribute[t]=e,l.text=this.getSubAttributeShowText(l.subAttribute,(r=(i=this.props.config)==null?void 0:i.inputList)!=null?r:[]),this.setState({result:[...a]}),this.updateSidebar())}},this.textChange=t=>{const{result:e,selectedID:i}=this.state;if(this.setState({textValue:t}),i){const r=e.find(a=>a.id===i);r&&(r.textAttribute=t,this.setState({result:[...e]}),this.updateSidebar())}},this.setGlobalTag=(t,e)=>{const{extraResult:i}=this.state;this.setState({extraResult:__spreadProps(__spreadValues({},i),{globalTag:__spreadProps(__spreadValues({},i.globalTag||{}),{[t]:e})})})},this.getSubAttributeShowText=(t,e)=>{if(!t||(e==null?void 0:e.length)===0)return"";let i="";return lbAnnotation.TagUtils.getTagNameList(t,e).forEach(a=>{i+=`
2
- ${a.keyName}: ${a.value.join("\u3001")}`}),i},this.state={result:[],selectedAttribute:"",textValue:"",clipStatus:constant.EClipStatus.Stop,selectedID:"",loading:!1,videoError:!1,remainingTime:0,currentTime:0,configLoading:!1,valid:!0,extraResult:{globalTag:{}}}}get videoUrl(){var s;const{imgIndex:t,imgList:e}=this.props;return((s=e[t])==null?void 0:s.url)||""}get isClipping(){return this.state.clipStatus===constant.EClipStatus.Clipping}get resultJSON(){const{imgIndex:s,imgList:t}=this.props;return t.length===0||!t[s]?"[]":t[s].result}get disabled(){return!this.state.valid||this.state.videoError}get loading(){return this.state.loading||this.state.configLoading}get defaultTextAttribute(){return lbAnnotation.AttributeUtils.getTextAttribute(this.state.result,this.props.config.textCheckType)}get defaultAttribute(){return this.state.selectedAttribute}get selectedID(){return this.state.selectedID}get selectedSliceIndex(){return this.state.result.findIndex(s=>s.id===this.state.selectedID)}get exportContext(){return{selectedID:this.state.selectedID,result:this.state.result,clipStatus:this.state.clipStatus,videoPlayer:this.videoPlayer,attributeList:this.props.config.attributeList,onSelectedTimeSlice:this.onSelectedTimeSlice,removeTimeSlice:this.removeTimeSlice,updateSelectedSliceTimeProperty:this.updateSelectedSliceTimeProperty,extraResult:this.state.extraResult}}get valid(){return this.state.valid}get config(){var s;return index$2.jsonParser((s=this.props.stepInfo)==null?void 0:s.config)}get selectedText(){var s,t;return(t=(s=this.state.result)==null?void 0:s[this.selectedSliceIndex])==null?void 0:t.textAttribute}componentDidMount(){this.setState({loading:!1}),this.setResult(!1),this.props.onMounted(this),window.addEventListener("keydown",this.keyDownEvents)}componentWillUnmount(){this.props.onUnmounted(),window.removeEventListener("keydown",this.keyDownEvents)}shouldComponentUpdate(s,t){const e=s.imgIndex-this.props.imgIndex,i=s.step-this.props.step;return(e!==0||i!==0)&&(this.setResult(!0,s),i!==0&&this.setState({loading:!1})),!0}singleOn(s,t){this.fns.set(s,[t])}on(s,t){this.singleOn(s,t)}unbindAll(s){this.fns.delete(s)}render(){const{selectedID:s,result:t,clipStatus:e,selectedAttribute:i}=this.state;return React__default.default.createElement(VideoClipToolContext.VideoClipToolContextProvider,{value:{videoPlayer:this.videoPlayer,result:t,selectedID:s,attributeList:this.props.config.attributeList,clipStatus:e,selectedAttribute:i,contextToCancel:this.contextToCancel}},this.renderMediaContent())}}module.exports=VideoClipTool;
1
+ "use strict";var lbAnnotation=require("@labelbee/lb-annotation"),index$2=require("../../../utils/index.js"),audio=require("../../../utils/audio.js"),antd=require("antd"),_=require("lodash"),React=require("react"),index_module=require("./index.module.scss.js"),VideoClipToolContext=require("./VideoClipToolContext.js"),constant=require("./constant.js"),index=require("../../videoPlayer/index.js"),index$1=require("./components/videoTimeSlicesOverVideo/index.js"),icon_videoCutting=require("../../../assets/annotation/video/icon_videoCutting.svg.js"),utils=require("../../videoPlayer/utils.js");function _interopDefaultLegacy(o){return o&&typeof o=="object"&&"default"in o?o:{default:o}}var ___default=_interopDefaultLegacy(_),React__default=_interopDefaultLegacy(React),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(o,s,t)=>s in o?__defProp(o,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[s]=t,__spreadValues=(o,s)=>{for(var t in s||(s={}))__hasOwnProp.call(s,t)&&__defNormalProp(o,t,s[t]);if(__getOwnPropSymbols)for(var t of __getOwnPropSymbols(s))__propIsEnum.call(s,t)&&__defNormalProp(o,t,s[t]);return o},__spreadProps=(o,s)=>__defProps(o,__getOwnPropDescs(s));class VideoClipTool extends React__default.default.Component{constructor(s){super(s);this.fns=new Map,this.throttledUpdateTime=___default.default.throttle(t=>{this.videoPlayer.currentTime=t},100,{trailing:!0}),this.stepInfo=()=>this.props.stepInfo,this.emitEvent=t=>{const e=this.fns.get(t);e&&e.forEach(i=>{i&&i()})},this.setValid=t=>{this.setState({valid:t}),t===!1&&(this.clearResult(),this.updateSidebar())},this.updateSidebar=()=>{this.emitEvent("changeClipSidebar"),this.emitEvent("updateTextAttribute"),this.emitEvent("changeAttributeSidebar")},this.exportData=()=>{var t,e;const i=(e=(t=this.videoRef)==null?void 0:t.duration)!=null?e:0;return[this.state.result.filter(r=>r.end!==null),{valid:this.state.valid,duration:i}]},this.exportCustomData=()=>({extraResult:this.state.extraResult}),this.updateSelectedSliceTimeStartByPer=t=>{var e,i;if(this.state.clipStatus===constant.EClipStatus.Clipping){antd.message.info("\u622A\u53D6\u4E2D\u4E0D\u652F\u6301\u8C03\u6574\u5F00\u59CB\u65F6\u95F4");return}if(this.selectedSliceIndex>-1){const r=(i=(e=this.videoPlayer)==null?void 0:e.duration)!=null?i:0,{end:l,start:n,type:a}=this.state.result[this.selectedSliceIndex],u=lbAnnotation.MathUtils.withinRange(audio.precisionAdd(n,t),[0,audio.precisionMinus(a===constant.ETimeSliceType.Time?r:l,constant.PER_SLICE_CHANGE)]);this.updateSelectedSliceTimeProperty(u,"start")}},this.updateSelectedSliceTimeEndByPer=t=>{var e,i;if(this.state.clipStatus===constant.EClipStatus.Clipping){antd.message.info("\u622A\u53D6\u4E2D\u4E0D\u652F\u6301\u8C03\u6574\u7ED3\u675F\u65F6\u95F4");return}if(this.selectedSliceIndex>-1){const r=this.state.result[this.selectedSliceIndex],l=(i=(e=this.videoPlayer)==null?void 0:e.duration)!=null?i:0;if(r.type===constant.ETimeSliceType.Time){antd.message.info("\u65F6\u95F4\u70B9\u4EC5\u652F\u6301\u8C03\u6574\u5F00\u59CB\u65F6\u95F4");return}const{end:n,start:a}=r,u=lbAnnotation.MathUtils.withinRange(audio.precisionAdd(n,t),[audio.precisionAdd(a,constant.PER_SLICE_CHANGE),l]);this.updateSelectedSliceTimeProperty(u,"end")}},this.updateSelectedSliceTimeProperty=(t,e)=>{if(this.selectedSliceIndex>-1){const{result:i}=this.state;i[this.selectedSliceIndex][e]=t,this.setState({result:___default.default.cloneDeep(i)}),this.updateSidebar()}},this.keyDownEvents=t=>{if(!lbAnnotation.CommonToolUtils.hotkeyFilter(t))return;const e=t.target;switch(e&&(e==null?void 0:e.tag)==="INPUT"&&(e==null?void 0:e.type)==="radio"&&t.preventDefault(),t.key.toLocaleLowerCase()){case"x":this.toggleClipStatus();break;case"e":this.addTime();break;case"escape":this.cancelClipped();break;case"-":this.updateSelectedSliceTimeStartByPer(-constant.PER_SLICE_CHANGE);break;case"=":this.updateSelectedSliceTimeStartByPer(constant.PER_SLICE_CHANGE);break;case"[":this.updateSelectedSliceTimeEndByPer(-constant.PER_SLICE_CHANGE);break;case"]":this.updateSelectedSliceTimeEndByPer(constant.PER_SLICE_CHANGE);break}},this.setVideoError=(t,e,i)=>{if(t){const{clipStatus:r}=this.state;r===constant.EClipStatus.Clipping&&this.toggleClipStatus(i)}this.setState({videoError:t,loading:!1})},this.clearResult=()=>{this.setState({result:[],selectedID:"",textValue:""}),this.updateSidebar()},this.cancelClipped=()=>{const{result:t,selectedID:e,clipStatus:i}=this.state;if(i!==constant.EClipStatus.Clipping)return;const r=t.findIndex(l=>l.id===e);r>-1&&(t.splice(r,1),this.setState({result:t,selectedID:"",clipStatus:constant.EClipStatus.Stop}),this.updateSidebar())},this.toggleClipStatus=t=>{var e,i;if(typeof((e=this.props)==null?void 0:e.annotationBefore)=="function"){(i=this.props)==null||i.annotationBefore(()=>this.setClipResult(t));return}this.setClipResult(t)},this.setClipResult=t=>{var e,i,r,l,n,a,u;if(this.disabled)return;const{clipStatus:c,selectedAttribute:p}=this.state,d=c!==constant.EClipStatus.Clipping;let h=d?constant.EClipStatus.Clipping:constant.EClipStatus.Stop,{result:S,selectedID:f,textValue:m}=this.state;const g=___default.default.cloneDeep(S),T=t||((e=this.videoPlayer)==null?void 0:e.currentTime),E=(i=this.videoPlayer)==null?void 0:i.duration;if(E===void 0||T===void 0)return;const I=utils.decimalReserved(T,2);if(d){const v=lbAnnotation.uuid(),b={};f=v;const C=((r=this.props.config)==null?void 0:r.customAttributeInput)===!0?"\u65E0\u5C5E\u6027":p;g.push({start:I,end:null,attribute:C,textAttribute:this.defaultTextAttribute,duration:E,id:v,type:constant.ETimeSliceType.Period,subAttribute:b,text:this.getSubAttributeShowText(b,(n=(l=this.props.config)==null?void 0:l.inputList)!=null?n:[])}),m=this.defaultTextAttribute}else{const v=g.findIndex(C=>C.id===f),b=g[v];b&&(T-b.start<constant.SLICE_MIN_TIME?(g.splice(v,1),antd.message.info(`\u622A\u53D6\u7247\u6BB5\u4E0D\u80FD\u77ED\u4E8E${constant.SLICE_MIN_TIME}s`),h=constant.EClipStatus.Stop,f="",m=""):(g[v].end=utils.decimalReserved(T,2),(a=this.videoPlayer)==null||a.pause(),antd.message.success(`\u5DF2\u622A\u53D6\u7247\u6BB5${S.length}`)))}const x={clipStatus:h,result:g,selectedID:f,textValue:m};((u=this.props.config)==null?void 0:u.customAttributeInput)&&d&&(x.selectedAttribute="\u65E0\u5C5E\u6027"),this.setState(x),this.updateSidebar()},this.addTime=()=>{var t,e,i,r,l,n;if(this.disabled)return;const{result:a,selectedAttribute:u,selectedID:c}=this.state,p=lbAnnotation.uuid(),d=___default.default.cloneDeep(a),h=((t=this.videoPlayer)==null?void 0:t.currentTime)||0,S=((e=this.props.config)==null?void 0:e.customAttributeInput)?"\u65E0\u5C5E\u6027":u;d.push({start:h,end:h,attribute:S,textAttribute:this.defaultTextAttribute,id:p,type:constant.ETimeSliceType.Time,duration:(r=(i=this.videoPlayer)==null?void 0:i.duration)!=null?r:0,subAttribute:{}});const f={result:d,selectedID:p,textValue:this.defaultTextAttribute};((l=this.props.config)==null?void 0:l.customAttributeInput)&&(f.selectedAttribute="\u65E0\u5C5E\u6027");const m=d.find(g=>g.id===c);this.isClipping&&m?(delete f.selectedID,delete f.textValue,antd.message.success(`\u5DF2\u622A\u53D6\u65F6\u95F4\u70B9${d.length-1}`)):(n=this.videoPlayer)==null||n.pause(),this.setState(f),this.updateSidebar()},this.updateCurrentTime=t=>{this.setState({currentTime:t}),this.selectTimeSliceByTime(t)},this.findTimeSliceByTime=t=>{const e=utils.decimalReserved(t,2);return this.state.result.find(i=>i.end===null?!1:i.type===constant.ETimeSliceType.Time?utils.decimalReserved(i.start,2)===e:i.start<=e&&e<i.end)},this.selectTimeSliceByTime=t=>{if(this.isClipping)return;const e=this.findTimeSliceByTime(t);if(e){if(e.id===this.state.selectedID)return;this.setState({selectedID:e.id,selectedAttribute:e.attribute,textValue:e.textAttribute})}else{if(!this.state.selectedID)return;this.setState({selectedID:""})}this.updateSidebar()},this.contextToCancel=t=>{this.state.clipStatus===constant.EClipStatus.Stop&&(t.preventDefault(),this.setState({selectedID:""}),this.updateSidebar())},this.onTrackResize=(t,e,i)=>{var r,l;const{result:n}=this.state,a=n.find(u=>u.id===t);if(a){const u=a.duration,c=e==="left",p=c?"start":"end",d=c?-u*i:u*i,h=c?[0,Math.max(((r=a.end)!=null?r:0)-constant.SLICE_MIN_TIME,0)]:[a.start+constant.SLICE_MIN_TIME,u],S=lbAnnotation.MathUtils.withinRange(d+((l=a==null?void 0:a[p])!=null?l:0),h);a[p]=S,this.throttledUpdateTime(S)}this.setState({result:[...n]}),this.updateSidebar()},this.renderMediaContent=()=>{var t,e,i;const{pageForward:r,pageJump:l,pageBackward:n}=this.props,{result:a,videoError:u,valid:c,currentTime:p}=this.state;return React__default.default.createElement("div",{className:index_module.clipContainer},React__default.default.createElement(index.VideoPlayer,{imgIndex:this.props.imgIndex,imgList:this.props.imgList,pageBackward:n,pageForward:r,pageJump:l,valid:c,setVideoRef:d=>{this.videoPlayer=d},showVideoTrack:!u,onTrackResize:this.onTrackResize,drawLayerSlot:this.props.drawLayerSlot,footer:this.props.footer,dataLoaded:this.props.onVideoLoaded,toggleClipStatus:this.toggleClipStatus,addTime:this.addTime,updateCurrentTime:this.updateCurrentTime}),React__default.default.createElement(index$1,{key:(t=this.videoPlayer)==null?void 0:t.currentTime,result:a,currentTime:p,attributeList:this.props.config.attributeList,inputList:(i=(e=this.props.config)==null?void 0:e.inputList)!=null?i:[],extraStyle:{top:this.props.drawLayerSlot?40:0}}),this.isClipping&&React__default.default.createElement("i",{className:index_module.clipping,style:{backgroundImage:icon_videoCutting}}))},this.onSelectedTimeSlice=t=>{var e;this.isClipping||(this.setState({selectedID:t.id,selectedAttribute:t.attribute,textValue:t.textAttribute,currentTime:t.start}),this.updateSidebar(),(e=this.videoPlayer)==null||e.pause(),this.videoPlayer.currentTime=t.start)},this.removeTimeSlice=t=>{const{result:e}=this.state,i=this.state.selectedID===t.id?"":this.state.selectedID,r=e.findIndex(l=>l.id===t.id);r>-1&&(e.splice(r,1),this.setState({result:[...e],selectedID:i}),this.updateSidebar())},this.setResult=(t=!0,e=this.props)=>{var i,r;try{const{imgIndex:l,imgList:n}=e;if(!n[l])return;const u=index$2.jsonParser(n[l].result)[`step_${this.stepInfo().step}`],c=(u==null?void 0:u.result)||[],p=(u==null?void 0:u.extraResult)||{globalTag:{}},d=(r=(i=this.props.config)==null?void 0:i.inputList)!=null?r:[];c.forEach(S=>{S.text=this.getSubAttributeShowText(S.subAttribute,d)});const h=audio.isImageValue(n[l].result||"[]");this.setState({result:c,loading:t,selectedID:"",textValue:"",selectedAttribute:"",clipStatus:constant.EClipStatus.Stop,valid:h,extraResult:p},()=>{this.updateSidebar(),h||antd.message.info("\u65E0\u6548\u89C6\u9891\uFF0C\u8BF7\u8DF3\u8FC7")})}catch(l){console.error("\u6570\u636E\u89E3\u6790\u5931\u8D25"),this.setState({result:[],loading:!1,selectedID:"",textValue:"",selectedAttribute:"",valid:!0,extraResult:{globalTag:{}}},()=>{this.updateSidebar()})}},this.setDefaultAttribute=t=>{const{result:e,selectedID:i}=this.state,r=e.find(l=>l.id===i);r&&i&&(r.attribute=t),this.setState({selectedAttribute:t,result:[...e]}),this.updateSidebar()},this.setSubAttribute=(t,e)=>{var i,r;const{result:l,selectedID:n}=this.state;if(n){const a=l.find(u=>u.id===n);a&&(a.subAttribute||(a.subAttribute={}),a.subAttribute[t]=e,a.text=this.getSubAttributeShowText(a.subAttribute,(r=(i=this.props.config)==null?void 0:i.inputList)!=null?r:[]),this.setState({result:[...l]}),this.updateSidebar())}},this.textChange=t=>{const{result:e,selectedID:i}=this.state;if(this.setState({textValue:t}),i){const r=e.find(l=>l.id===i);r&&(r.textAttribute=t,this.setState({result:[...e]}),this.updateSidebar())}},this.setGlobalTag=(t,e)=>{const{extraResult:i}=this.state;this.setState({extraResult:__spreadProps(__spreadValues({},i),{globalTag:__spreadProps(__spreadValues({},i.globalTag||{}),{[t]:e})})})},this.getSubAttributeShowText=(t,e)=>{if(!t||(e==null?void 0:e.length)===0)return"";let i="";return lbAnnotation.TagUtils.getTagNameList(t,e).forEach(l=>{i+=`
2
+ ${l.keyName}: ${l.value.join("\u3001")}`}),i},this.state={result:[],selectedAttribute:"",textValue:"",clipStatus:constant.EClipStatus.Stop,selectedID:"",loading:!1,videoError:!1,remainingTime:0,currentTime:0,configLoading:!1,valid:!0,extraResult:{globalTag:{}}}}get videoUrl(){var s;const{imgIndex:t,imgList:e}=this.props;return((s=e[t])==null?void 0:s.url)||""}get isClipping(){return this.state.clipStatus===constant.EClipStatus.Clipping}get resultJSON(){const{imgIndex:s,imgList:t}=this.props;return t.length===0||!t[s]?"[]":t[s].result}get disabled(){return!this.state.valid||this.state.videoError}get loading(){return this.state.loading||this.state.configLoading}get defaultTextAttribute(){return lbAnnotation.AttributeUtils.getTextAttribute(this.state.result,this.props.config.textCheckType)}get defaultAttribute(){return this.state.selectedAttribute}get selectedID(){return this.state.selectedID}get selectedSliceIndex(){return this.state.result.findIndex(s=>s.id===this.state.selectedID)}get exportContext(){return{selectedID:this.state.selectedID,result:this.state.result,clipStatus:this.state.clipStatus,videoPlayer:this.videoPlayer,attributeList:this.props.config.attributeList,onSelectedTimeSlice:this.onSelectedTimeSlice,removeTimeSlice:this.removeTimeSlice,updateSelectedSliceTimeProperty:this.updateSelectedSliceTimeProperty,extraResult:this.state.extraResult}}get valid(){return this.state.valid}get config(){var s;return index$2.jsonParser((s=this.props.stepInfo)==null?void 0:s.config)}get selectedText(){var s,t;return(t=(s=this.state.result)==null?void 0:s[this.selectedSliceIndex])==null?void 0:t.textAttribute}componentDidMount(){this.setState({loading:!1}),this.setResult(!1),this.props.onMounted(this),window.addEventListener("keydown",this.keyDownEvents)}componentWillUnmount(){this.props.onUnmounted(),window.removeEventListener("keydown",this.keyDownEvents)}shouldComponentUpdate(s,t){const e=s.imgIndex-this.props.imgIndex,i=s.step-this.props.step;return(e!==0||i!==0)&&(this.setResult(!0,s),i!==0&&this.setState({loading:!1})),!0}singleOn(s,t){this.fns.set(s,[t])}on(s,t){this.singleOn(s,t)}unbindAll(s){this.fns.delete(s)}render(){const{selectedID:s,result:t,clipStatus:e,selectedAttribute:i}=this.state;return React__default.default.createElement(VideoClipToolContext.VideoClipToolContextProvider,{value:{videoPlayer:this.videoPlayer,result:t,selectedID:s,attributeList:this.props.config.attributeList,clipStatus:e,selectedAttribute:i,contextToCancel:this.contextToCancel,selectTimeSliceByTime:this.selectTimeSliceByTime}},this.renderMediaContent())}}module.exports=VideoClipTool;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),index$2=require("./components/controller/index.js"),index=require("../videoAnnotate/videoClipTool/components/videoTrack/index.js"),dom=require("../../utils/dom.js"),lbAnnotation=require("@labelbee/lb-annotation"),utils=require("./utils.js"),index$1=require("../fileException/index.js");function _interopDefaultLegacy(o){return o&&typeof o=="object"&&"default"in o?o:{default:o}}var React__default=_interopDefaultLegacy(React);const EKeyCode=lbAnnotation.cKeyCode.default,VideoPlayerCtx=React__default.default.createContext({isPlay:!1,playPause:()=>{},updateNextPlaybackRate:()=>{},playbackRate:1,currentTime:0,duration:0,buffered:0,setCurrentTime:()=>{},imgList:[],imgIndex:-1,pageBackward:()=>{},pageJump:o=>{},pageForward:()=>{},addTime:()=>{},toggleClipStatus:()=>{}}),PER_INTERVAL=50,PER_FORWARD=.1,PLAYBACK_RATES=[.1,.2,.3,.4,.5,1,1.5,2,4,6,8,16];class VideoPlayer extends React__default.default.Component{constructor(a){super(a);this.changePlaybackPate=e=>{this.videoElm&&(this.videoElm.playbackRate=e,this.setState({playbackRate:e}))},this.playPause=()=>{var e,t,i;((e=this.videoElm)==null?void 0:e.paused)?(t=this.videoElm)==null||t.play():(i=this.videoElm)==null||i.pause()},this.updateNextPlaybackRate=(e=!0)=>{const t=PLAYBACK_RATES.findIndex(r=>r===this.state.playbackRate);let i=e?Math.min(t+1,PLAYBACK_RATES.length-1):Math.max(t-1,0);this.changePlaybackPate(PLAYBACK_RATES[i])},this.fastForward=()=>{this.videoElm&&this.setCurrentTime(this.videoElm.currentTime+PER_FORWARD)},this.rewind=()=>{this.videoElm&&this.setCurrentTime(this.videoElm.currentTime-PER_FORWARD)},this.keydown=e=>{e.keyCode===EKeyCode.Space&&(e.preventDefault(),this.playPause()),e.keyCode===EKeyCode.Up&&(e.preventDefault(),this.updateNextPlaybackRate()),e.keyCode===EKeyCode.Down&&(e.preventDefault(),this.updateNextPlaybackRate(!1)),e.keyCode===EKeyCode.Left&&(e.preventDefault(),this.rewind()),e.keyCode===EKeyCode.Right&&(e.preventDefault(),this.fastForward())},this.onPlay=()=>{this.setState({isPlay:!0},this.onVideoStart)},this.onPause=()=>{this.onVideoStopped()},this.onTimeUpdate=()=>{var e;this.videoElm&&this.setState({currentTime:utils.decimalReserved((e=this.videoElm)==null?void 0:e.currentTime,1)})},this.onVideoStopped=()=>{this.setState({isPlay:!1}),this.timeInterval&&(clearInterval(this.timeInterval),this.timeInterval=void 0),this.videoElm&&this.setCurrentTime(this.videoElm.currentTime)},this.onVideoStart=()=>{this.timeInterval=window.setInterval(()=>{var e,t,i;if(this.videoElm)try{if(((e=this.videoElm)==null?void 0:e.buffered.length)>0){const r=(t=this.videoElm)==null?void 0:t.buffered.end(0);this.setState({currentTime:utils.decimalReserved((i=this.videoElm)==null?void 0:i.currentTime,1),buffered:r})}}catch(r){console.error(r)}},PER_INTERVAL)},this.resetVideoData=()=>{this.setState({currentTime:0,buffered:0,error:!1,isPlay:!1}),this.videoElm&&(this.videoElm.playbackRate=this.state.playbackRate),this.onVideoStopped()},this.setDuration=()=>{var e,t,i;if(this.videoElm){const r=utils.decimalReserved((e=this.videoElm)==null?void 0:e.duration,1);(i=(t=this.props).dataLoaded)==null||i.call(t),this.setState({duration:r})}},this.setCurrentTime=e=>{var t,i;this.videoElm&&(this.videoElm.currentTime=e,this.setState({currentTime:e}),(i=(t=this.props).updateCurrentTime)==null||i.call(t,e))},this.reload=()=>{var e;(e=this.videoElm)==null||e.load()},this.onError=()=>{var e,t;(t=(e=this.props).dataLoaded)==null||t.call(e,!0),this.resetVideoData(),this.setState({error:!0})},this.state={playbackRate:1,currentTime:0,isPlay:!1,duration:0,buffered:0,error:!1},this.videoRef=React__default.default.createRef()}get videoElm(){var a;return(a=this.videoRef)==null?void 0:a.current}get videoSrc(){var a,e;const{imgIndex:t,imgList:i}=this.props;return t>-1&&(e=(a=i[t])==null?void 0:a.url)!=null?e:""}componentDidMount(){var a,e;window.addEventListener("keydown",this.keydown),((a=this.videoRef)==null?void 0:a.current)&&this.props.setVideoRef&&this.props.setVideoRef((e=this.videoRef)==null?void 0:e.current)}componentWillUnmount(){window.removeEventListener("keydown",this.keydown)}render(){const{isPlay:a,playbackRate:e,currentTime:t,duration:i,buffered:r,error:n}=this.state,{imgList:u,imgIndex:h,pageBackward:c,pageJump:v,pageForward:m,valid:p,footer:f,drawLayerSlot:s}=this.props,y=isNaN(i)?0:Math.max(utils.decimalReserved(i,1)-t,0),{playPause:d,updateNextPlaybackRate:E,onPause:g,onPlay:R,onTimeUpdate:P,resetVideoData:b,setDuration:k,setCurrentTime:T,onError:x,videoRef:C,videoSrc:_}=this;return React__default.default.createElement(VideoPlayerCtx.Provider,{value:{videoRef:this.videoRef,addTime:this.props.addTime,toggleClipStatus:this.props.toggleClipStatus,isPlay:a,playPause:d,updateNextPlaybackRate:E,playbackRate:e,currentTime:t,duration:i,buffered:r,setCurrentTime:T,imgIndex:h,imgList:u,pageBackward:c,pageJump:v,pageForward:m}},React__default.default.createElement(React__default.default.Fragment,null,s==null?void 0:s({currentTime:t,remainingTime:y,zoom:1,currentPos:{x:0,y:0}}),React__default.default.createElement("div",{className:dom.getClassName("video-wrapper")},React__default.default.createElement("div",{className:dom.getClassName("video-container")},React__default.default.createElement("video",{ref:C,className:dom.getClassName(this.props.showVideoTrack?"video-track":"video"),src:_,onPause:g,onPlay:R,onTimeUpdate:P,onLoadedMetadata:b,onError:x,onDurationChange:k,width:"100%",height:"100%",onClick:d}),this.props.showVideoTrack&&React__default.default.createElement(index.default,{currentTime:t,onTrackResize:this.props.onTrackResize,onTrackResizeStart:()=>{var l;(l=this.videoElm)==null||l.pause()},readonly:!1}),React__default.default.createElement(index$1,{fileType:"video",errorProps:{reloadImage:this.reload,backgroundColor:"#e2e2e2",ignoreOffsetY:!0,isError:n},invalidProps:{isValid:p}})),React__default.default.createElement(index$2.default,{footer:f}))))}}exports.VideoPlayer=VideoPlayer,exports.VideoPlayerCtx=VideoPlayerCtx,exports.default=VideoPlayer;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),index$2=require("./components/controller/index.js"),index=require("../videoAnnotate/videoClipTool/components/videoTrack/index.js"),dom=require("../../utils/dom.js"),lbAnnotation=require("@labelbee/lb-annotation"),utils=require("./utils.js"),index$1=require("../fileException/index.js");function _interopDefaultLegacy(o){return o&&typeof o=="object"&&"default"in o?o:{default:o}}var React__default=_interopDefaultLegacy(React);const EKeyCode=lbAnnotation.cKeyCode.default,VideoPlayerCtx=React__default.default.createContext({isPlay:!1,playPause:()=>{},updateNextPlaybackRate:()=>{},playbackRate:1,currentTime:0,duration:0,buffered:0,setCurrentTime:()=>{},imgList:[],imgIndex:-1,pageBackward:()=>{},pageJump:o=>{},pageForward:()=>{},addTime:()=>{},toggleClipStatus:()=>{}}),PER_INTERVAL=300,PER_FORWARD=.1,PLAYBACK_RATES=[.1,.2,.3,.4,.5,1,1.5,2,4,6,8,16];class VideoPlayer extends React__default.default.Component{constructor(a){super(a);this.changePlaybackPate=e=>{this.videoElm&&(this.videoElm.playbackRate=e,this.setState({playbackRate:e}))},this.playPause=()=>{var e,t,i;((e=this.videoElm)==null?void 0:e.paused)?(t=this.videoElm)==null||t.play():(i=this.videoElm)==null||i.pause()},this.updateNextPlaybackRate=(e=!0)=>{const t=PLAYBACK_RATES.findIndex(r=>r===this.state.playbackRate);let i=e?Math.min(t+1,PLAYBACK_RATES.length-1):Math.max(t-1,0);this.changePlaybackPate(PLAYBACK_RATES[i])},this.fastForward=()=>{this.videoElm&&this.setCurrentTime(this.videoElm.currentTime+PER_FORWARD)},this.rewind=()=>{this.videoElm&&this.setCurrentTime(this.videoElm.currentTime-PER_FORWARD)},this.keydown=e=>{e.keyCode===EKeyCode.Space&&(e.preventDefault(),this.playPause()),e.keyCode===EKeyCode.Up&&(e.preventDefault(),this.updateNextPlaybackRate()),e.keyCode===EKeyCode.Down&&(e.preventDefault(),this.updateNextPlaybackRate(!1)),e.keyCode===EKeyCode.Left&&(e.preventDefault(),this.rewind()),e.keyCode===EKeyCode.Right&&(e.preventDefault(),this.fastForward())},this.onPlay=()=>{this.setState({isPlay:!0},this.onVideoStart)},this.onPause=()=>{this.onVideoStopped()},this.onTimeUpdate=()=>{var e;this.videoElm&&this.setState({currentTime:utils.decimalReserved((e=this.videoElm)==null?void 0:e.currentTime,1)})},this.onVideoStopped=()=>{this.setState({isPlay:!1}),this.timeInterval&&(clearInterval(this.timeInterval),this.timeInterval=void 0),this.videoElm&&this.setCurrentTime(this.videoElm.currentTime)},this.onVideoStart=()=>{this.timeInterval=window.setInterval(()=>{var e,t,i,r,d;if(this.videoElm)try{if(((e=this.videoElm)==null?void 0:e.buffered.length)>0){const s=(t=this.videoElm)==null?void 0:t.buffered.end(0);this.setState({buffered:s})}(d=(r=this.props).updateCurrentTime)==null||d.call(r,utils.decimalReserved((i=this.videoElm)==null?void 0:i.currentTime,1))}catch(s){console.error(s)}},PER_INTERVAL)},this.resetVideoData=()=>{this.setState({currentTime:0,buffered:0,error:!1,isPlay:!1}),this.videoElm&&(this.videoElm.playbackRate=this.state.playbackRate),this.onVideoStopped()},this.setDuration=()=>{var e,t,i;if(this.videoElm){const r=utils.decimalReserved((e=this.videoElm)==null?void 0:e.duration,1);(i=(t=this.props).dataLoaded)==null||i.call(t),this.setState({duration:r})}},this.setCurrentTime=e=>{var t,i;this.videoElm&&(this.videoElm.currentTime=e,this.setState({currentTime:e}),(i=(t=this.props).updateCurrentTime)==null||i.call(t,e))},this.reload=()=>{var e;(e=this.videoElm)==null||e.load()},this.onError=()=>{var e,t;(t=(e=this.props).dataLoaded)==null||t.call(e,!0),this.resetVideoData(),this.setState({error:!0})},this.state={playbackRate:1,currentTime:0,isPlay:!1,duration:0,buffered:0,error:!1},this.videoRef=React__default.default.createRef()}get videoElm(){var a;return(a=this.videoRef)==null?void 0:a.current}get videoSrc(){var a,e;const{imgIndex:t,imgList:i}=this.props;return t>-1&&(e=(a=i[t])==null?void 0:a.url)!=null?e:""}componentDidMount(){var a,e;window.addEventListener("keydown",this.keydown),((a=this.videoRef)==null?void 0:a.current)&&this.props.setVideoRef&&this.props.setVideoRef((e=this.videoRef)==null?void 0:e.current)}componentWillUnmount(){window.removeEventListener("keydown",this.keydown)}render(){const{isPlay:a,playbackRate:e,currentTime:t,duration:i,buffered:r,error:d}=this.state,{imgList:s,imgIndex:h,pageBackward:c,pageJump:v,pageForward:m,valid:p,footer:f,drawLayerSlot:l}=this.props,y=isNaN(i)?0:Math.max(utils.decimalReserved(i,1)-t,0),{playPause:n,updateNextPlaybackRate:E,onPause:g,onPlay:R,onTimeUpdate:P,resetVideoData:b,setDuration:k,setCurrentTime:T,onError:_,videoRef:x,videoSrc:C}=this;return React__default.default.createElement(VideoPlayerCtx.Provider,{value:{videoRef:this.videoRef,addTime:this.props.addTime,toggleClipStatus:this.props.toggleClipStatus,isPlay:a,playPause:n,updateNextPlaybackRate:E,playbackRate:e,currentTime:t,duration:i,buffered:r,setCurrentTime:T,imgIndex:h,imgList:s,pageBackward:c,pageJump:v,pageForward:m}},React__default.default.createElement(React__default.default.Fragment,null,l==null?void 0:l({currentTime:t,remainingTime:y,zoom:1,currentPos:{x:0,y:0}}),React__default.default.createElement("div",{className:dom.getClassName("video-wrapper")},React__default.default.createElement("div",{className:dom.getClassName("video-container")},React__default.default.createElement("video",{ref:x,className:dom.getClassName(this.props.showVideoTrack?"video-track":"video"),src:C,onPause:g,onPlay:R,onTimeUpdate:P,onLoadedMetadata:b,onError:_,onDurationChange:k,width:"100%",height:"100%",onClick:n}),this.props.showVideoTrack&&React__default.default.createElement(index.default,{currentTime:t,onTrackResize:this.props.onTrackResize,onTrackResizeStart:()=>{var u;(u=this.videoElm)==null||u.pause()},readonly:!1}),React__default.default.createElement(index$1,{fileType:"video",errorProps:{reloadImage:this.reload,backgroundColor:"#e2e2e2",ignoreOffsetY:!0,isError:d},invalidProps:{isValid:p}})),React__default.default.createElement(index$2.default,{footer:f}))))}}exports.VideoPlayer=VideoPlayer,exports.VideoPlayerCtx=VideoPlayerCtx,exports.default=VideoPlayer;
@@ -14,6 +14,7 @@ interface IVideoClipToolContext {
14
14
  clipStatus: EClipStatus;
15
15
  selectedAttribute?: string;
16
16
  contextToCancel?: (e: any) => void;
17
+ selectTimeSliceByTime?: (time: number) => void;
17
18
  }
18
19
  export declare const VideoClipToolContext: React.Context<IVideoClipToolContext>;
19
20
  export declare const VideoClipToolContextProvider: React.Provider<IVideoClipToolContext>;
@@ -104,6 +104,10 @@ declare class VideoClipTool extends React.Component<IVideoClipProps, IState> {
104
104
  addTime: () => void;
105
105
  /** 更新当前时间 */
106
106
  updateCurrentTime: (time: number) => void;
107
+ /** 根据时间查找片段 */
108
+ findTimeSliceByTime: (time: number) => IVideoTimeSlice | undefined;
109
+ /** 根据时间选中片段(不 seek、不 pause) */
110
+ selectTimeSliceByTime: (time: number) => void;
107
111
  /**
108
112
  * 视频右键操作
109
113
  * @param e
@@ -1 +1 @@
1
- "use strict";var React=require("react"),reactRedux=require("react-redux"),index$1=require("../../../../components/attributeList/index.js"),index$3=require("../../../../components/attributeInputEditor/index.js"),StepUtils=require("../../../../utils/StepUtils.js"),index=require("../../../../utils/index.js"),reactI18next=require("react-i18next"),ctx=require("../../../../store/ctx.js"),index$2=require("../../../../components/subAttributeList/index.js"),antd=require("antd");function _interopDefaultLegacy(n){return n&&typeof n=="object"&&"default"in n?n:{default:n}}var React__default=_interopDefaultLegacy(React);const VideoClipToolAttributeList=n=>{var l,i;const[A,d]=React.useState(0),a=React.useRef(null),{toolInstance:t}=n,{t:S}=reactI18next.useTranslation(),r=n.stepInfo?index.jsonParser(n.stepInfo.config):{},f=(l=t==null?void 0:t.defaultAttribute)!=null?l:"",s=t==null?void 0:t.exportContext,o=s==null?void 0:s.selectedID,b=s==null?void 0:s.result,v=(i=r==null?void 0:r.inputList)!=null?i:[],c=React.useMemo(()=>{if(o&&b)return b.find(e=>e.id===o)},[o,b]),h=e=>{t==null||t.setAttributeLockList(e)};if(React.useEffect(()=>(t&&t.singleOn("changeAttributeSidebar",e=>{var u;d(m=>m+1),!!a.current&&((u=a.current.children[e])==null||u.scrollIntoView({block:"center"}))}),()=>{t==null||t.unbindAll("changeAttributeSidebar")}),[t,a]),!n.stepInfo||r.attributeConfigurable!==!0)return null;const g=e=>{t&&(t.setDefaultAttribute(e),d(u=>u+1))},x=(e,u)=>{t&&t.setSubAttribute&&(t.setSubAttribute(e,u),d(m=>m+1))},p=e=>{if(c==null?void 0:c.subAttribute)return c.subAttribute[e.value]},L=f&&o&&c&&v.length>0&&(r==null?void 0:r.secondaryAttributeConfigurable)===!0,C=()=>React__default.default.createElement("div",{style:{height:0,flex:1,overflowY:"auto",overflowX:"hidden"}},o&&React__default.default.createElement(index$3,{selectedAttribute:f,attributeChanged:g}),L&&React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(antd.Divider,{style:{margin:0}}),React__default.default.createElement(index$2,{subAttributeList:v,setSubAttribute:x,getValue:p,lang:"cn"})));if(r.customAttributeInput)return C();if(!(r==null?void 0:r.attributeList))return null;const I=r.attributeList.map(e=>({label:e.key,value:e.value,color:e==null?void 0:e.color}));return I.unshift({label:S("NoAttribute"),value:""}),React__default.default.createElement("div",null,React__default.default.createElement(index$1.default,{list:I,attributeChanged:g,selectedAttribute:f,ref:a,attributeLockChange:h}),L&&React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(antd.Divider,{style:{margin:0}}),React__default.default.createElement(index$2,{subAttributeList:v,setSubAttribute:x,getValue:p,lang:"cn"})))},mapStateToProps=n=>{var l,i;const A=StepUtils.getCurrentStepInfo((l=n.annotation)==null?void 0:l.step,(i=n.annotation)==null?void 0:i.stepList);return{toolInstance:n.annotation.toolInstance,stepInfo:A}};var VideoClipToolAttributeList$1=reactRedux.connect(mapStateToProps,null,null,{context:ctx.LabelBeeContext})(VideoClipToolAttributeList);module.exports=VideoClipToolAttributeList$1;
1
+ "use strict";var React=require("react"),reactRedux=require("react-redux"),index$1=require("../../../../components/attributeList/index.js"),index$3=require("../../../../components/attributeInputEditor/index.js"),StepUtils=require("../../../../utils/StepUtils.js"),index=require("../../../../utils/index.js"),reactI18next=require("react-i18next"),ctx=require("../../../../store/ctx.js"),index$2=require("../../../../components/subAttributeList/index.js"),antd=require("antd");function _interopDefaultLegacy(n){return n&&typeof n=="object"&&"default"in n?n:{default:n}}var React__default=_interopDefaultLegacy(React);const VideoClipToolAttributeList=n=>{var l,i;const[A,d]=React.useState(0),o=React.useRef(null),{toolInstance:t}=n,{t:S}=reactI18next.useTranslation(),r=n.stepInfo?index.jsonParser(n.stepInfo.config):{},b=(l=t==null?void 0:t.defaultAttribute)!=null?l:"",s=t==null?void 0:t.exportContext,a=s==null?void 0:s.selectedID,f=s==null?void 0:s.result,v=(i=r==null?void 0:r.inputList)!=null?i:[],c=React.useMemo(()=>{if(a&&f)return f.find(e=>e.id===a)},[a,f]),C=e=>{t==null||t.setAttributeLockList(e)};if(React.useEffect(()=>(t&&t.singleOn("changeAttributeSidebar",e=>{var u;d(m=>m+1),!!o.current&&((u=o.current.children[e])==null||u.scrollIntoView({block:"center"}))}),()=>{t==null||t.unbindAll("changeAttributeSidebar")}),[t,o]),!n.stepInfo||r.attributeConfigurable!==!0)return null;const g=e=>{t&&(t.setDefaultAttribute(e),d(u=>u+1))},p=(e,u)=>{t&&t.setSubAttribute&&(t.setSubAttribute(e,u),d(m=>m+1))},x=e=>{if(c==null?void 0:c.subAttribute)return c.subAttribute[e.value]},L=b&&a&&c&&v.length>0&&(r==null?void 0:r.secondaryAttributeConfigurable)===!0,E=()=>React__default.default.createElement(React__default.default.Fragment,null,a&&React__default.default.createElement(index$3,{selectedAttribute:b,attributeChanged:g}),L&&React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(antd.Divider,{style:{margin:0}}),React__default.default.createElement(index$2,{subAttributeList:v,setSubAttribute:p,getValue:x,lang:"cn"})));if(r.customAttributeInput)return E();if(!(r==null?void 0:r.attributeList))return null;const I=r.attributeList.map(e=>({label:e.key,value:e.value,color:e==null?void 0:e.color}));return I.unshift({label:S("NoAttribute"),value:""}),React__default.default.createElement("div",null,React__default.default.createElement(index$1.default,{list:I,attributeChanged:g,selectedAttribute:b,ref:o,attributeLockChange:C}),L&&React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(antd.Divider,{style:{margin:0}}),React__default.default.createElement(index$2,{subAttributeList:v,setSubAttribute:p,getValue:x,lang:"cn"})))},mapStateToProps=n=>{var l,i;const A=StepUtils.getCurrentStepInfo((l=n.annotation)==null?void 0:l.step,(i=n.annotation)==null?void 0:i.stepList);return{toolInstance:n.annotation.toolInstance,stepInfo:A}};var VideoClipToolAttributeList$1=reactRedux.connect(mapStateToProps,null,null,{context:ctx.LabelBeeContext})(VideoClipToolAttributeList);module.exports=VideoClipToolAttributeList$1;