@labelbee/lb-components 1.23.0-alpha.95 → 1.23.0-alpha.96
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.
- package/dist/components/audioPlayer/index.js +1 -1
- package/dist/components/audioPlayer/zoomSlider/index.js +1 -1
- package/dist/types/components/audioPlayer/zoomSlider/index.d.ts +1 -0
- package/es/components/audioPlayer/index.js +1 -1
- package/es/components/audioPlayer/zoomSlider/index.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),getWebPcm2Wac=require("../audioAnnotate/utils/getWebPcm2Wac.js"),_=require("lodash"),icons=require("@ant-design/icons"),lbAnnotation=require("@labelbee/lb-annotation"),lbUtils=require("@labelbee/lb-utils"),antd=require("antd"),index$a=require("../invalidPage/index.js"),index$5=require("../imageError/index.js"),index$9=require("../../utils/index.js"),index$c=require("../videoPlayer/components/SpeedController/index.js"),WaveSurfer=require("@labelbee/wavesurfer"),Region=require("@labelbee/wavesurfer/dist/plugin/wavesurfer.regions.js"),Cursor=require("@labelbee/wavesurfer/dist/plugin/wavesurfer.cursor.js"),index$d=require("./zoomSlider/index.js"),index$e=require("./labelDisplayToggle/index.js"),index$f=require("./clipRegion/index.js"),index=require("../audioAnnotate/audioContext/index.js"),ahooks=require("ahooks"),index$1=require("./useAudioScroll/index.js"),index_module=require("./index.module.scss.js"),audio=require("../../utils/audio.js"),index$b=require("./progressDot/index.js"),index$6=require("./clipTip/index.js"),index$4=require("./useSwitchHotkey/index.js"),index$2=require("./useAudioCombine/index.js"),index$3=require("./useAudioSegment/index.js"),index$7=require("./combineTip/index.js"),index$8=require("./segmentTip/index.js"),index$g=require("../../views/MainView/toolFooter/index.js"),utils=require("../videoPlayer/utils.js"),reactI18next=require("react-i18next");function _interopDefaultLegacy(l){return l&&typeof l=="object"&&"default"in l?l:{default:l}}var React__default=_interopDefaultLegacy(React),___default=_interopDefaultLegacy(_),WaveSurfer__default=_interopDefaultLegacy(WaveSurfer),Region__default=_interopDefaultLegacy(Region),Cursor__default=_interopDefaultLegacy(Cursor),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(l,u,d)=>u in l?__defProp(l,u,{enumerable:!0,configurable:!0,writable:!0,value:d}):l[u]=d,__spreadValues=(l,u)=>{for(var d in u||(u={}))__hasOwnProp.call(u,d)&&__defNormalProp(l,d,u[d]);if(__getOwnPropSymbols)for(var d of __getOwnPropSymbols(u))__propIsEnum.call(u,d)&&__defNormalProp(l,d,u[d]);return l},__spreadProps=(l,u)=>__defProps(l,__getOwnPropDescs(u));const{EToolName}=lbAnnotation.cTool,EKeyCode=lbAnnotation.cKeyCode.default,PER_PROGRESS=.1,AudioPlayerContext=React__default.default.createContext({count:0,isEdit:!1,toolName:EToolName.Empty,imgIndex:0}),AudioPlayer=({fileData:l={},onLoaded:u,context:d,invalid:ke,height:Oe,hideError:We,onError:re,updateRegion:h,removeRegion:D,regions:C=[],activeToolPanel:Ne,clipConfigurable:Fe,clipTextConfigurable:ne,clipAttributeList:ze,clipAttributeConfigurable:oe,secondaryAttributeConfigurable:Ue,subAttributeList:He,isCheck:b,hoverRegionId:O,footer:Xe,drawLayerSlot:ie,clipTextList:Ze,lang:ae})=>{var le,se;const{url:I,path:ue}=l,[W,N]=React.useState(!1),[ce,de]=React.useState(!1),[S,Ke]=React.useState(0),[Ve,fe]=React.useState(!1),[$,ve]=React.useState(0),o=React.useRef(null),x=React.useRef(null),me=React.useRef(S),F=e=>{me.current=e,Ke(e)},[pe,Ge]=React.useState(0),[k,Ye]=React.useState(1),z=React.useRef(null),[ge,Je]=React.useState({}),{audioClipState:U,setAudioClipState:T}=index.useAudioClipStore(),[H,X]=React.useState(!1),c=ahooks.useLatest(U),be=ahooks.useLatest(ge);ahooks.useLatest(W);const w=ahooks.useLatest(C),_e=ahooks.useUpdate(),[ye,Qe]=React.useState([]),[Ee,et]=React.useState({}),tt=_.debounce(()=>{lbAnnotation.EventBus.emit("audioZoom")},500),Se=e=>{e<index$d.audioZoomInfo.min||e>index$d.audioZoomInfo.max||(Ye(e),audio.dispatchResizeEvent(),tt())};index$1({container:z.current,target:document.querySelector(`[data-id=${(se=(le=c.current)==null?void 0:le.selectedRegion)==null?void 0:se.id}]`),clipping:H,zoom:k,zoomHandler:Se});const q=()=>{let e=w.current;const{attributeLockList:r}=c.current;r.length&&(e=e.filter(t=>r.includes(t.attribute))),K(),e.forEach(t=>{var n;(n=o.current)==null||n.addRegion(__spreadProps(__spreadValues({},t),{drag:!b,resize:!b,color:"rgba(0, 0, 0, 0)"}))}),_e()},v=e=>{var r,t,n,i,s,m,p;const{id:a,loop:f=!0,playImmediately:g=!1,isLoopStatus:L}=e,A=!1;if(a){const P=(n=(t=(r=o.current)==null?void 0:r.regions)==null?void 0:t.list)!=null?n:{};Object.entries(P).forEach(([,E])=>{const{id:M}=E;a===M?E.select():E.cancelSelect()}),T({selectedRegion:{id:a,loop:A},selectedAttribute:(m=(s=(i=w.current)==null?void 0:i.find(E=>E.id===a))==null?void 0:s.attribute)!=null?m:""}),g&&((p=j(a))==null||p.play())}else T({selectedRegion:{}})},{combineInstance:rt}=index$2({waveRef:o,sortByStartRegions:ye,regionMap:Ee,updateRegion:h,removeRegion:D,generateRegions:q,setSelectedRegion:v}),{segmentInstance:nt,onRegionMouseMove:ot,segmentTimeTip:it}=index$3({waveRef:o,regionMap:Ee,updateRegion:h,removeRegion:D,generateRegions:q,setSelectedRegion:v}),xe={clipTextConfigurable:ne,clipAttributeList:ze,clipAttributeConfigurable:oe,clipConfigurable:Fe,secondaryAttributeConfigurable:Ue,subAttributeList:He,clipTextList:Ze};React.useEffect(()=>{var e;ae&&((e=lbUtils.i18n)==null||e.changeLanguage(ae))},[]),React.useEffect(()=>{T({selectedAttribute:""})},[oe]),React.useEffect(()=>{Z()},[U.selectedAttribute]),React.useEffect(()=>{q()},[U.attributeLockList]),ahooks.useDeepCompareEffect(()=>{T(xe),setTimeout(()=>{Re()})},[xe]),ahooks.useDeepCompareEffect(()=>{Qe(_.sortBy(C,["start"])),et(C.reduce((e,r)=>{const{id:t}=r;return __spreadProps(__spreadValues({},e),{[t]:r})},{})),b&&q()},[C]),React.useEffect(()=>{v(O?{id:O,loop:!1,playImmediately:!0}:{})},[O]);const Re=()=>{var e,r;c.current.clipConfigurable?(!b&&o.current&&((e=o.current)==null||e.enableDragSelection({slop:5})),q()):((r=o.current)==null||r.disableDragSelection(),K()),Z()},Z=()=>{var e,r,t,n,i;let s="";c.current.clipConfigurable?s=audio.getAttributeColor(c.current.selectedAttribute,(e=c.current.clipAttributeList)!=null?e:[]):s="transparent",((t=(r=o==null?void 0:o.current)==null?void 0:r.cursor)==null?void 0:t.cursor)&&((i=(n=o==null?void 0:o.current)==null?void 0:n.cursor)==null||i.setStyle({border:`2px dashed ${s}`}))},j=e=>{var r,t,n;return((n=(t=(r=o.current)==null?void 0:r.regions)==null?void 0:t.list)!=null?n:{})[e]},Pe=()=>{var e,r;if(I){const t=((r=(e=ue==null?void 0:ue.split("."))==null?void 0:e.pop())==null?void 0:r.toLowerCase())==="pcm";fe(!1),t?getWebPcm2Wac.getWebPcm2WavBase64(I).then(n=>{he(n)}):he(I)}},he=e=>{var r;e&&(de(!0),F(0),ve(0),(r=o==null?void 0:o.current)==null||r.load(e))},K=()=>{var e;(e=o.current)==null||e.clearRegions()},V=e=>{const r=j(e);r&&(X(!1),r==null||r.remove(),D==null||D(e),v({}))},{run:Ce}=ahooks.useThrottleFn(v,{wait:500});index$4({sortByStartRegions:ye,setSelectedRegion:v});const at=e=>{const{start:r,end:t}=be.current;return(r||t)&&e.update(be.current),e},lt=({action:e,id:r,eventDownTime:t})=>{var n,i;if(!c.current.clipConfigurable)return;r&&v({id:r});const s=j((r!=null?r:(n=c.current.selectedRegion)==null?void 0:n.id)||""),m=[];(e==="create"?w.current:(i=w.current)==null?void 0:i.filter(f=>f.id!==s.id)).forEach(f=>{const{start:g,end:L,attribute:A}=f;A===c.current.selectedAttribute&&[g,L].forEach(P=>{m.includes(P)||m.push(P)})});const a=audio.getCanMoveRange(m.sort((f,g)=>f-g),t);o.current.range=a},st=e=>{Z(),setTimeout(()=>{X(!1)});const r=at(e),{id:t,start:n,end:i}=r;v({id:t,playImmediately:!0});const s={id:t,start:utils.decimalReserved(n,3),end:utils.decimalReserved(i,3)};h==null||h(s),_e()},ut=()=>{const e=WaveSurfer__default.default.create({container:"#waveform",waveColor:"#999",progressColor:"#999",height:Oe||245,normalize:!0,cursorWidth:2,cursorColor:"white",responsive:0,hideScrollbar:!0,plugins:[Region__default.default.create({regions:C,dragSelection:{slop:5},canMove:!1}),Cursor__default.default.create({opacity:1,customStyle:{border:"2px dashed transparent"}})]}),r=()=>{var t;F(((t=o==null?void 0:o.current)==null?void 0:t.getCurrentTime())||0)};e.on("ready",()=>{var t;const n=((t=o==null?void 0:o.current)==null?void 0:t.getDuration())||0;ve(n),r(),u==null||u({duration:Math.round(n)}),de(!1),B(),lbAnnotation.EventBus.on("setCurrentTimeByPosition",Y),lbAnnotation.EventBus.on("clearRegions",K),lbAnnotation.EventBus.on("removeRegionById",V),lbAnnotation.EventBus.on("setSelectedRegion",Ce),e.on("regions-eventDown",lt),Re()}),e.on("audioprocess",()=>{r()}),e.on("play",()=>{N(!0)}),e.on("pause",()=>{N(!1)}),e.on("finish",()=>{N(!1)}),e.on("seek",()=>{r()}),e.on("error",()=>{fe(!0),u==null||u({hasError:!0}),re==null||re()}),e.on("region-created",t=>{var n;const{id:i,start:s,end:m}=t;if(w.current.find(a=>a.id===i))return;const p={id:i,start:utils.decimalReserved(s,3),end:utils.decimalReserved(m,3),attribute:c.current.selectedAttribute,text:""};if(c.current.secondaryAttributeConfigurable){const a=lbAnnotation.TagUtils.getDefaultResultByConfig((n=c.current.subAttributeList)!=null?n:[]);p.subAttribute=a!=null?a:{}}ne&&c.current.clipTextList.forEach((f,g)=>{g===0?Object.assign(p,{text:f==null?void 0:f.default}):Object.assign(p,{[f.key]:f==null?void 0:f.default})}),h==null||h(p)}),e.on("region-updated",(t,n)=>{var i,s,m,p,a,f,g,L,A,P;const E=n==null?void 0:n.action;T({combined:!1,segment:!1}),E==="resize"&&((s=(i=o==null?void 0:o.current)==null?void 0:i.cursor)==null||s.setStyle({borderStyle:"solid"})),E==="drag"&&((p=(m=o==null?void 0:o.current)==null?void 0:m.cursor)==null||p.setStyle({borderColor:"transparent"}));const M={},J=[],Q={},St=(a=w.current)==null?void 0:a.filter(y=>y.id!==t.id),xt=(L=(g=(f=o.current)==null?void 0:f.regions)==null?void 0:g.list)!=null?L:{};St.forEach(y=>{var De,Ie;const{element:ee}=(De=xt[y.id])!=null?De:{},{start:ht,end:Ct}=y;if(ee){const{x:$e,width:wt}=((Ie=ee.getBoundingClientRect)==null?void 0:Ie.call(ee))||{},At=$e+wt;[$e,At].forEach((te,Tt)=>{J.includes(te)||(J.push(te),Q[te]=Tt===0?ht:Ct)})}});const{x:Me,width:Rt}=((P=(A=t.element).getBoundingClientRect)==null?void 0:P.call(A))||{},Pt=Me+Rt;J.forEach(y=>{Math.abs(audio.precisionMinus(y,Me))<5&&(M.start=Q[y]),Math.abs(audio.precisionMinus(y,Pt))<5&&(M.end=Q[y])}),Je(M),Ce({id:t.id}),X(!0)}),e.on("region-update-end",t=>{st(t)}),e.on("region-contextmenu",(t,n)=>{if(!b){if(n.preventDefault(),n.stopPropagation(),audio.isDoubleClick(n)){V(t.id);return}v({id:t.id,playImmediately:!0})}}),e.on("region-click",(t,n,i)=>{if(!b){if(n.preventDefault(),n.stopPropagation(),c.current.combined){rt(t);return}if(c.current.segment){nt(t,i);return}v({id:t.id,playImmediately:!0})}}),e.on("region-mousemove",ot),o.current=e},ct=W?React__default.default.createElement(icons.PauseOutlined,null):React__default.default.createElement(icons.CaretRightOutlined,null),we=e=>e?`${parseFloat((e/$*100).toFixed(4))}%`:"0%",Ae=we(S),dt=we(pe),R=()=>{if(!ce)return o==null?void 0:o.current},ft=()=>{var e;(e=R())==null||e.skipForward(PER_PROGRESS)},vt=()=>{var e;(e=R())==null||e.skipBackward(PER_PROGRESS)},B=()=>{var e;(e=R())==null||e.playPause(),v({})},Te=e=>{var r;switch(e.keyCode){case EKeyCode.Right:ft();break;case EKeyCode.Left:vt();break;case EKeyCode.Space:e.preventDefault(),B();break;case EKeyCode.Delete:if(!b){const{id:t}=((r=c.current)==null?void 0:r.selectedRegion)||{};t&&V(t)}break}},mt=e=>{Y(e)},qe=___default.default.throttle(mt,50);let G=!1;const je=()=>{G&&(B(),G=!1),document.removeEventListener("mousemove",qe),document.removeEventListener("mouseup",je)},pt=e=>{Y(e),W&&(G=!0,B()),document.addEventListener("mousemove",qe),document.addEventListener("mouseup",je)},gt=()=>{Pe()};React.useEffect(()=>(ut(),()=>{var e;(e=o==null?void 0:o.current)==null||e.destroy(),o.current=null,lbAnnotation.EventBus.unbindAll("setCurrentTimeByPosition"),lbAnnotation.EventBus.unbindAll("clearRegions"),lbAnnotation.EventBus.unbindAll("removeRegionById"),lbAnnotation.EventBus.unbindAll("setSelectedRegion")}),[]);const bt=e=>{var r,t,n;(r=R())==null||r.playPause(),(t=R())==null||t.setPlaybackRate(e),(n=R())==null||n.playPause()};React.useEffect(()=>(document.addEventListener("keydown",Te),()=>{document.removeEventListener("keydown",Te)})),React.useEffect(()=>{v({}),Pe()},[I]);const Be=e=>{var r,t,n,i;if((o==null?void 0:o.current)&&(x==null?void 0:x.current)){const s=(t=(r=o==null?void 0:o.current)==null?void 0:r.getDuration())!=null?t:0,m=(n=x==null?void 0:x.current)==null?void 0:n.getBoundingClientRect();let a=(e.clientX-m.left)/(((i=x==null?void 0:x.current)==null?void 0:i.clientWidth)||0)*s;return a>s&&(a=s),a}return 0},Y=e=>{var r;const t=Be(e);(r=o==null?void 0:o.current)==null||r.skip(t-me.current),F(t)},_t=e=>{Ge(Be(e))},yt=$?Math.max($-S,0):0,Et=(d==null?void 0:d.toolName)!==EToolName.Empty&&(d==null?void 0:d.isEdit)!==!0&&(Ne==="remark"||b),Le=React__default.default.createElement("div",{className:index_module.audioPlayer},Ve&&!We&&React__default.default.createElement(index$5,{fileTypeName:"\u97F3\u9891",ignoreOffsetY:!0,reloadImage:gt,backgroundColor:"#ffffffbb"}),React__default.default.createElement(index$6,{getRegionInstanceById:j,clipping:H}),React__default.default.createElement(index$7,{container:z.current}),React__default.default.createElement(index$8,{segmentTimeTip:it}),React__default.default.createElement("div",{className:index_module.waveformContainer,ref:z},React__default.default.createElement("div",{id:"waveform",style:{width:`${k*100}%`},className:index$9.classnames({[index_module.waveform]:!0,"bee-audio-combined":c.current.combined,"bee-audio-clip":c.current.clipConfigurable})},ke&&React__default.default.createElement(index$a,{isAudio:!0}),React__default.default.createElement("div",{ref:x,className:index_module.progress,onMouseDown:pt,onMouseMove:_t},React__default.default.createElement("div",{className:index$9.classnames({[index_module.radioTooltip]:!0}),style:{left:Ae}},audio.formatTime(S)),React__default.default.createElement("div",{className:index$9.classnames({[index_module.radioTooltip]:!0,[index_module.mouseTooltip]:!0}),style:{left:dt}},audio.formatTime(pe)),React__default.default.createElement(index$b,{playPercentage:Ae})),Et&&(ie==null?void 0:ie({currentTime:S,remainingTime:yt,audioPlayer:R()})))),React__default.default.createElement("div",{className:index_module.controlBar},React__default.default.createElement(antd.Button,{type:"link",icon:ct,onClick:()=>{B()},className:index$9.classnames({[index_module.playButton]:!0,[index_module.playButtonDisabled]:ce})}),React__default.default.createElement("span",{className:index_module.time},`${audio.timeFormat(S,"ss.SSS")} / -${audio.timeFormat($-S,"ss.SSS")}`),React__default.default.createElement(index$c.default,{playerType:index$c.EPlayerType.Audio,onChange:e=>{bt(e)}}),React__default.default.createElement(index$d.default,{onChange:e=>{Se(e)},zoom:k}),React__default.default.createElement(index$e,{EventBus:lbAnnotation.EventBus})));return d?React__default.default.createElement(AudioPlayerContext.Provider,{value:d},Le,C.map(e=>{const{id:r}=e,t=document.querySelector(`[data-id=${r}]`);return t?React__default.default.createElement(index$f,{el:t,key:r,region:e,edgeAdsorption:ge,clipping:H,zoom:k,instance:j(r),isCheck:b}):null}),React__default.default.createElement(index$g.default,{footer:Xe})):Le},WrapAudioPlayer=l=>React__default.default.createElement(reactI18next.I18nextProvider,{i18n:lbUtils.i18n},React__default.default.createElement(AudioPlayer,__spreadValues({},l)));exports.AudioPlayer=AudioPlayer,exports.AudioPlayerContext=AudioPlayerContext,exports.WrapAudioPlayer=WrapAudioPlayer;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),getWebPcm2Wac=require("../audioAnnotate/utils/getWebPcm2Wac.js"),_=require("lodash"),icons=require("@ant-design/icons"),lbAnnotation=require("@labelbee/lb-annotation"),lbUtils=require("@labelbee/lb-utils"),antd=require("antd"),index$b=require("../invalidPage/index.js"),index$6=require("../imageError/index.js"),index$a=require("../../utils/index.js"),index$d=require("../videoPlayer/components/SpeedController/index.js"),WaveSurfer=require("@labelbee/wavesurfer"),Region=require("@labelbee/wavesurfer/dist/plugin/wavesurfer.regions.js"),Cursor=require("@labelbee/wavesurfer/dist/plugin/wavesurfer.cursor.js"),index=require("./zoomSlider/index.js"),index$e=require("./labelDisplayToggle/index.js"),index$f=require("./clipRegion/index.js"),index$1=require("../audioAnnotate/audioContext/index.js"),ahooks=require("ahooks"),index$2=require("./useAudioScroll/index.js"),index_module=require("./index.module.scss.js"),audio=require("../../utils/audio.js"),index$c=require("./progressDot/index.js"),index$7=require("./clipTip/index.js"),index$5=require("./useSwitchHotkey/index.js"),index$3=require("./useAudioCombine/index.js"),index$4=require("./useAudioSegment/index.js"),index$8=require("./combineTip/index.js"),index$9=require("./segmentTip/index.js"),index$g=require("../../views/MainView/toolFooter/index.js"),utils=require("../videoPlayer/utils.js"),reactI18next=require("react-i18next"),useSize=require("../../hooks/useSize.js");function _interopDefaultLegacy(l){return l&&typeof l=="object"&&"default"in l?l:{default:l}}var React__default=_interopDefaultLegacy(React),___default=_interopDefaultLegacy(_),WaveSurfer__default=_interopDefaultLegacy(WaveSurfer),Region__default=_interopDefaultLegacy(Region),Cursor__default=_interopDefaultLegacy(Cursor),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(l,u,d)=>u in l?__defProp(l,u,{enumerable:!0,configurable:!0,writable:!0,value:d}):l[u]=d,__spreadValues=(l,u)=>{for(var d in u||(u={}))__hasOwnProp.call(u,d)&&__defNormalProp(l,d,u[d]);if(__getOwnPropSymbols)for(var d of __getOwnPropSymbols(u))__propIsEnum.call(u,d)&&__defNormalProp(l,d,u[d]);return l},__spreadProps=(l,u)=>__defProps(l,__getOwnPropDescs(u));const{EToolName}=lbAnnotation.cTool,EKeyCode=lbAnnotation.cKeyCode.default,PER_PROGRESS=.1,AudioPlayerContext=React__default.default.createContext({count:0,isEdit:!1,toolName:EToolName.Empty,imgIndex:0}),AudioPlayer=({fileData:l={},onLoaded:u,context:d,invalid:We,height:Ne,hideError:Fe,onError:re,updateRegion:T,removeRegion:k,regions:x=[],activeToolPanel:ze,clipConfigurable:Ue,clipTextConfigurable:ne,clipAttributeList:Ze,clipAttributeConfigurable:oe,secondaryAttributeConfigurable:He,subAttributeList:Ve,isCheck:b,hoverRegionId:W,footer:Xe,drawLayerSlot:ie,clipTextList:Ke,lang:ae})=>{var le,se;const{url:$,path:ue}=l,[N,F]=React.useState(!1),[ce,de]=React.useState(!1),[P,Ge]=React.useState(0),[Ye,fe]=React.useState(!1),[S,ve]=React.useState(0),o=React.useRef(null),w=React.useRef(null),me=React.useRef(P),z=e=>{me.current=e,Ge(e)},[pe,Je]=React.useState(0),[O,Qe]=React.useState(index.audioZoomInfo.defaultValue),y=React.useRef(null),[ge,et]=React.useState({}),{audioClipState:U,setAudioClipState:j}=index$1.useAudioClipStore(),[Z,H]=React.useState(!1),c=ahooks.useLatest(U),be=ahooks.useLatest(ge);ahooks.useLatest(N);const A=ahooks.useLatest(x),_e=ahooks.useUpdate(),[ye,tt]=React.useState([]),[Ee,rt]=React.useState({}),[Se,nt]=React.useState({start:0,end:0}),ot=useSize(y),it=React.useMemo(()=>x.filter(e=>{const{start:t,end:r}=Se;return e.start<=r&&e.end>=t}),[x,Se]),at=_.debounce(()=>{lbAnnotation.EventBus.emit("audioZoom")},500),he=e=>{e<index.audioZoomInfo.min||e>index.audioZoomInfo.max||(Qe(e),audio.dispatchResizeEvent(),at())};index$2({container:y.current,target:document.querySelector(`[data-id=${(se=(le=c.current)==null?void 0:le.selectedRegion)==null?void 0:se.id}]`),clipping:Z,zoom:O,zoomHandler:he});const B=()=>{let e=A.current;const{attributeLockList:t}=c.current;t.length&&(e=e.filter(r=>t.includes(r.attribute))),X(),e.forEach(r=>{var n;(n=o.current)==null||n.addRegion(__spreadProps(__spreadValues({},r),{drag:!b,resize:!b,color:"rgba(0, 0, 0, 0)"}))}),_e()},v=e=>{var t,r,n,i,s,m,p;const{id:a,loop:f=!0,playImmediately:g=!1,isLoopStatus:D}=e,q=!1;if(a){const C=(n=(r=(t=o.current)==null?void 0:t.regions)==null?void 0:r.list)!=null?n:{};Object.entries(C).forEach(([,R])=>{const{id:I}=R;a===I?R.select():R.cancelSelect()}),j({selectedRegion:{id:a,loop:q},selectedAttribute:(m=(s=(i=A.current)==null?void 0:i.find(R=>R.id===a))==null?void 0:s.attribute)!=null?m:""}),g&&((p=L(a))==null||p.play())}else j({selectedRegion:{}})},{combineInstance:lt}=index$3({waveRef:o,sortByStartRegions:ye,regionMap:Ee,updateRegion:T,removeRegion:k,generateRegions:B,setSelectedRegion:v}),{segmentInstance:st,onRegionMouseMove:ut,segmentTimeTip:ct}=index$4({waveRef:o,regionMap:Ee,updateRegion:T,removeRegion:k,generateRegions:B,setSelectedRegion:v}),Re={clipTextConfigurable:ne,clipAttributeList:Ze,clipAttributeConfigurable:oe,clipConfigurable:Ue,secondaryAttributeConfigurable:He,subAttributeList:Ve,clipTextList:Ke};React.useEffect(()=>{var e;ae&&((e=lbUtils.i18n)==null||e.changeLanguage(ae))},[]),React.useEffect(()=>{j({selectedAttribute:""})},[oe]),React.useEffect(()=>{V()},[U.selectedAttribute]),React.useEffect(()=>{B()},[U.attributeLockList]),ahooks.useDeepCompareEffect(()=>{j(Re),setTimeout(()=>{xe()})},[Re]),ahooks.useDeepCompareEffect(()=>{tt(_.sortBy(x,["start"])),rt(x.reduce((e,t)=>{const{id:r}=t;return __spreadProps(__spreadValues({},e),{[r]:t})},{})),b&&B()},[x]),React.useEffect(()=>{v(W?{id:W,loop:!1,playImmediately:!0}:{})},[W]);const xe=()=>{var e,t;c.current.clipConfigurable?(!b&&o.current&&((e=o.current)==null||e.enableDragSelection({slop:5})),B()):((t=o.current)==null||t.disableDragSelection(),X()),V()},V=()=>{var e,t,r,n,i;let s="";c.current.clipConfigurable?s=audio.getAttributeColor(c.current.selectedAttribute,(e=c.current.clipAttributeList)!=null?e:[]):s="transparent",((r=(t=o==null?void 0:o.current)==null?void 0:t.cursor)==null?void 0:r.cursor)&&((i=(n=o==null?void 0:o.current)==null?void 0:n.cursor)==null||i.setStyle({border:`2px dashed ${s}`}))},L=e=>{var t,r,n;return((n=(r=(t=o.current)==null?void 0:t.regions)==null?void 0:r.list)!=null?n:{})[e]},Pe=()=>{var e,t;if($){const r=((t=(e=ue==null?void 0:ue.split("."))==null?void 0:e.pop())==null?void 0:t.toLowerCase())==="pcm";fe(!1),r?getWebPcm2Wac.getWebPcm2WavBase64($).then(n=>{we(n)}):we($)}},we=e=>{var t;e&&(de(!0),z(0),ve(0),(t=o==null?void 0:o.current)==null||t.load(e))},X=()=>{var e;(e=o.current)==null||e.clearRegions()},K=e=>{const t=L(e);t&&(H(!1),t==null||t.remove(),k==null||k(e),v({}))},{run:Ce}=ahooks.useThrottleFn(v,{wait:100});index$5({sortByStartRegions:ye,setSelectedRegion:v});const dt=e=>{const{start:t,end:r}=be.current;return(t||r)&&e.update(be.current),e},ft=({action:e,id:t,eventDownTime:r})=>{var n,i;if(!c.current.clipConfigurable)return;t&&v({id:t});const s=L((t!=null?t:(n=c.current.selectedRegion)==null?void 0:n.id)||""),m=[];(e==="create"?A.current:(i=A.current)==null?void 0:i.filter(f=>f.id!==s.id)).forEach(f=>{const{start:g,end:D,attribute:q}=f;q===c.current.selectedAttribute&&[g,D].forEach(C=>{m.includes(C)||m.push(C)})});const a=audio.getCanMoveRange(m.sort((f,g)=>f-g),r);o.current.range=a},vt=e=>{V(),setTimeout(()=>{H(!1)});const t=dt(e),{id:r,start:n,end:i}=t;v({id:r,playImmediately:!0});const s={id:r,start:utils.decimalReserved(n,3),end:utils.decimalReserved(i,3)};T==null||T(s),_e()},mt=()=>{const e=WaveSurfer__default.default.create({container:"#waveform",waveColor:"#999",progressColor:"#999",height:Ne||245,normalize:!0,cursorWidth:2,cursorColor:"white",responsive:0,hideScrollbar:!0,plugins:[Region__default.default.create({regions:x,dragSelection:{slop:5},canMove:!1}),Cursor__default.default.create({opacity:1,customStyle:{border:"2px dashed transparent"}})]}),t=()=>{var r;z(((r=o==null?void 0:o.current)==null?void 0:r.getCurrentTime())||0)};e.on("ready",()=>{var r;const n=((r=o==null?void 0:o.current)==null?void 0:r.getDuration())||0;ve(n),t(),u==null||u({duration:Math.round(n)}),de(!1),M(),lbAnnotation.EventBus.on("setCurrentTimeByPosition",Y),lbAnnotation.EventBus.on("clearRegions",X),lbAnnotation.EventBus.on("removeRegionById",K),lbAnnotation.EventBus.on("setSelectedRegion",Ce),e.on("regions-eventDown",ft),xe()}),e.on("audioprocess",()=>{t()}),e.on("play",()=>{F(!0)}),e.on("pause",()=>{F(!1)}),e.on("finish",()=>{F(!1)}),e.on("seek",()=>{t()}),e.on("error",()=>{fe(!0),u==null||u({hasError:!0}),re==null||re()}),e.on("region-created",r=>{var n;const{id:i,start:s,end:m}=r;if(A.current.find(a=>a.id===i))return;const p={id:i,start:utils.decimalReserved(s,3),end:utils.decimalReserved(m,3),attribute:c.current.selectedAttribute,text:""};if(c.current.secondaryAttributeConfigurable){const a=lbAnnotation.TagUtils.getDefaultResultByConfig((n=c.current.subAttributeList)!=null?n:[]);p.subAttribute=a!=null?a:{}}ne&&c.current.clipTextList.forEach((f,g)=>{g===0?Object.assign(p,{text:f==null?void 0:f.default}):Object.assign(p,{[f.key]:f==null?void 0:f.default})}),T==null||T(p)}),e.on("region-updated",(r,n)=>{var i,s,m,p,a,f,g,D,q,C;const R=n==null?void 0:n.action;j({combined:!1,segment:!1}),R==="resize"&&((s=(i=o==null?void 0:o.current)==null?void 0:i.cursor)==null||s.setStyle({borderStyle:"solid"})),R==="drag"&&((p=(m=o==null?void 0:o.current)==null?void 0:m.cursor)==null||p.setStyle({borderColor:"transparent"}));const I={},J=[],Q={},Ct=(a=A.current)==null?void 0:a.filter(E=>E.id!==r.id),Tt=(D=(g=(f=o.current)==null?void 0:f.regions)==null?void 0:g.list)!=null?D:{};Ct.forEach(E=>{var ke,$e;const{element:ee}=(ke=Tt[E.id])!=null?ke:{},{start:jt,end:Bt}=E;if(ee){const{x:Oe,width:Lt}=(($e=ee.getBoundingClientRect)==null?void 0:$e.call(ee))||{},Mt=Oe+Lt;[Oe,Mt].forEach((te,Dt)=>{J.includes(te)||(J.push(te),Q[te]=Dt===0?jt:Bt)})}});const{x:Ie,width:At}=((C=(q=r.element).getBoundingClientRect)==null?void 0:C.call(q))||{},qt=Ie+At;J.forEach(E=>{Math.abs(audio.precisionMinus(E,Ie))<5&&(I.start=Q[E]),Math.abs(audio.precisionMinus(E,qt))<5&&(I.end=Q[E])}),et(I),Ce({id:r.id}),H(!0)}),e.on("region-update-end",r=>{vt(r)}),e.on("region-contextmenu",(r,n)=>{if(!b){if(n.preventDefault(),n.stopPropagation(),audio.isDoubleClick(n)){K(r.id);return}v({id:r.id,playImmediately:!0})}}),e.on("region-click",(r,n,i)=>{if(!b){if(n.preventDefault(),n.stopPropagation(),c.current.combined){lt(r);return}if(c.current.segment){st(r,i);return}v({id:r.id,playImmediately:!0})}}),e.on("region-mousemove",ut),o.current=e},pt=N?React__default.default.createElement(icons.PauseOutlined,null):React__default.default.createElement(icons.CaretRightOutlined,null),Te=e=>e?`${parseFloat((e/S*100).toFixed(4))}%`:"0%",Ae=Te(P),gt=Te(pe),h=()=>{if(!ce)return o==null?void 0:o.current},bt=()=>{var e;(e=h())==null||e.skipForward(PER_PROGRESS)},_t=()=>{var e;(e=h())==null||e.skipBackward(PER_PROGRESS)},M=()=>{var e;(e=h())==null||e.playPause(),v({})},qe=e=>{var t;switch(e.keyCode){case EKeyCode.Right:bt();break;case EKeyCode.Left:_t();break;case EKeyCode.Space:e.preventDefault(),M();break;case EKeyCode.Delete:if(!b){const{id:r}=((t=c.current)==null?void 0:t.selectedRegion)||{};r&&K(r)}break}},yt=e=>{Y(e)},je=___default.default.throttle(yt,50);let G=!1;const Be=()=>{G&&(M(),G=!1),document.removeEventListener("mousemove",je),document.removeEventListener("mouseup",Be)},Et=e=>{Y(e),N&&(G=!0,M()),document.addEventListener("mousemove",je),document.addEventListener("mouseup",Be)},St=()=>{Pe()};React.useEffect(()=>(mt(),()=>{var e;(e=o==null?void 0:o.current)==null||e.destroy(),o.current=null,lbAnnotation.EventBus.unbindAll("setCurrentTimeByPosition"),lbAnnotation.EventBus.unbindAll("clearRegions"),lbAnnotation.EventBus.unbindAll("removeRegionById"),lbAnnotation.EventBus.unbindAll("setSelectedRegion")}),[]);const ht=e=>{var t,r,n;(t=h())==null||t.playPause(),(r=h())==null||r.setPlaybackRate(e),(n=h())==null||n.playPause()};React.useEffect(()=>(document.addEventListener("keydown",qe),()=>{document.removeEventListener("keydown",qe)})),React.useEffect(()=>{v({}),Pe()},[$]),React.useEffect(()=>{Le()},[ot,S]);const Rt=()=>{if(y.current&&S){const e=y.current.scrollLeft,t=y.current.clientWidth,r=e/y.current.scrollWidth*S,n=(e+t)/y.current.scrollWidth*S;nt({start:r,end:n})}},{run:Le}=ahooks.useThrottleFn(Rt,{wait:300}),Me=e=>{var t,r,n,i;if((o==null?void 0:o.current)&&(w==null?void 0:w.current)){const s=(r=(t=o==null?void 0:o.current)==null?void 0:t.getDuration())!=null?r:0,m=(n=w==null?void 0:w.current)==null?void 0:n.getBoundingClientRect();let a=(e.clientX-m.left)/(((i=w==null?void 0:w.current)==null?void 0:i.clientWidth)||0)*s;return a>s&&(a=s),a}return 0},Y=e=>{var t;const r=Me(e);(t=o==null?void 0:o.current)==null||t.skip(r-me.current),z(r)},xt=e=>{Je(Me(e))},Pt=S?Math.max(S-P,0):0,wt=(d==null?void 0:d.toolName)!==EToolName.Empty&&(d==null?void 0:d.isEdit)!==!0&&(ze==="remark"||b),De=React__default.default.createElement("div",{className:index_module.audioPlayer},Ye&&!Fe&&React__default.default.createElement(index$6,{fileTypeName:"\u97F3\u9891",ignoreOffsetY:!0,reloadImage:St,backgroundColor:"#ffffffbb"}),React__default.default.createElement(index$7,{getRegionInstanceById:L,clipping:Z}),React__default.default.createElement(index$8,{container:y.current}),React__default.default.createElement(index$9,{segmentTimeTip:ct}),React__default.default.createElement("div",{className:index_module.waveformContainer,ref:y,onScroll:()=>Le()},React__default.default.createElement("div",{id:"waveform",style:{width:`${O*100}%`},className:index$a.classnames({[index_module.waveform]:!0,"bee-audio-combined":c.current.combined,"bee-audio-clip":c.current.clipConfigurable})},We&&React__default.default.createElement(index$b,{isAudio:!0}),React__default.default.createElement("div",{ref:w,className:index_module.progress,onMouseDown:Et,onMouseMove:xt},React__default.default.createElement("div",{className:index$a.classnames({[index_module.radioTooltip]:!0}),style:{left:Ae}},audio.formatTime(P)),React__default.default.createElement("div",{className:index$a.classnames({[index_module.radioTooltip]:!0,[index_module.mouseTooltip]:!0}),style:{left:gt}},audio.formatTime(pe)),React__default.default.createElement(index$c,{playPercentage:Ae})),wt&&(ie==null?void 0:ie({currentTime:P,remainingTime:Pt,audioPlayer:h()})))),React__default.default.createElement("div",{className:index_module.controlBar},React__default.default.createElement(antd.Button,{type:"link",icon:pt,onClick:()=>{M()},className:index$a.classnames({[index_module.playButton]:!0,[index_module.playButtonDisabled]:ce})}),React__default.default.createElement("span",{className:index_module.time},`${audio.timeFormat(P,"ss.SSS")} / -${audio.timeFormat(S-P,"ss.SSS")}`),React__default.default.createElement(index$d.default,{playerType:index$d.EPlayerType.Audio,onChange:e=>{ht(e)}}),React__default.default.createElement(index.default,{onChange:e=>{var t;(t=h())==null||t.pause(),he(e)},zoom:O}),React__default.default.createElement(index$e,{EventBus:lbAnnotation.EventBus})));return d?React__default.default.createElement(AudioPlayerContext.Provider,{value:d},De,it.map(e=>{const{id:t}=e,r=document.querySelector(`[data-id=${t}]`);return r?React__default.default.createElement(index$f,{el:r,key:t,region:e,edgeAdsorption:ge,clipping:Z,zoom:O,instance:L(t),isCheck:b}):null}),React__default.default.createElement(index$g.default,{footer:Xe})):De},WrapAudioPlayer=l=>React__default.default.createElement(reactI18next.I18nextProvider,{i18n:lbUtils.i18n},React__default.default.createElement(AudioPlayer,__spreadValues({},l)));exports.AudioPlayer=AudioPlayer,exports.AudioPlayerContext=AudioPlayerContext,exports.WrapAudioPlayer=WrapAudioPlayer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),icons=require("@ant-design/icons"),antd=require("antd"),audio=require("../../../utils/audio.js"),lbAnnotation=require("@labelbee/lb-annotation"),ahooks=require("ahooks"),index_module=require("./index.module.scss.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 EKeyCode=lbAnnotation.cKeyCode.default,audioZoomInfo={min:1,max:150,ratio:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),icons=require("@ant-design/icons"),antd=require("antd"),audio=require("../../../utils/audio.js"),lbAnnotation=require("@labelbee/lb-annotation"),ahooks=require("ahooks"),index_module=require("./index.module.scss.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 EKeyCode=lbAnnotation.cKeyCode.default,audioZoomInfo={min:1,max:150,ratio:10,defaultValue:30},ZoomSlider=t=>{const{onChange:s,zoom:o}=t,{t:l}=reactI18next.useTranslation(),r=ahooks.useLatest(o),n=e=>{s(e)},a={fontSize:14,margin:"0 8px",cursor:"pointer"},i=()=>{const e=audio.precisionAdd(r.current,audioZoomInfo.ratio);n(e)},u=()=>{const e=audio.precisionMinus(r.current,audioZoomInfo.ratio);n(e)},c=e=>{switch(e.keyCode){case EKeyCode.I:e.ctrlKey&&i();break;case EKeyCode.O:e.ctrlKey&&(e.preventDefault(),u());break}};return React.useEffect(()=>(document.addEventListener("keydown",c),()=>{document.removeEventListener("keydown",c)}),[]),React__default.default.createElement("div",{className:index_module.sliderContainer},React__default.default.createElement("div",null,l("Scale")),React__default.default.createElement(icons.ZoomOutOutlined,{style:a,onClick:u}),React__default.default.createElement("div",{style:{width:120}},React__default.default.createElement(antd.Slider,{min:audioZoomInfo.min,max:audioZoomInfo.max,step:audioZoomInfo.ratio,onChange:n,value:o})),React__default.default.createElement(icons.ZoomInOutlined,{style:a,onClick:i}))};exports.audioZoomInfo=audioZoomInfo,exports.default=ZoomSlider;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import i,{useState as b,useRef as H,useEffect as R}from"react";import{getWebPcm2WavBase64 as Qt}from"../audioAnnotate/utils/getWebPcm2Wac.js";import er,{debounce as tr,sortBy as rr}from"lodash";import{PauseOutlined as or,CaretRightOutlined as nr}from"@ant-design/icons";import{cKeyCode as ir,cTool as lr,EventBus as E,TagUtils as sr}from"@labelbee/lb-annotation";import{i18n as Ke}from"@labelbee/lb-utils";import{Button as ar}from"antd";import ur from"../invalidPage/index.js";import cr from"../imageError/index.js";import{classnames as U}from"../../utils/index.js";import dr,{EPlayerType as mr}from"../videoPlayer/components/SpeedController/index.js";import fr from"@labelbee/wavesurfer";import pr from"@labelbee/wavesurfer/dist/plugin/wavesurfer.regions.js";import vr from"@labelbee/wavesurfer/dist/plugin/wavesurfer.cursor.js";import gr,{audioZoomInfo as Ve}from"./zoomSlider/index.js";import br from"./labelDisplayToggle/index.js";import yr from"./clipRegion/index.js";import{useAudioClipStore as _r}from"../audioAnnotate/audioContext/index.js";import{useLatest as X,useUpdate as Er,useDeepCompareEffect as Ge,useThrottleFn as hr}from"ahooks";import Sr from"./useAudioScroll/index.js";import y from"./index.module.scss.js";import{getAttributeColor as Pr,formatTime as Ye,timeFormat as Je,dispatchResizeEvent as Rr,precisionMinus as Qe,isDoubleClick as Cr,getCanMoveRange as wr}from"../../utils/audio.js";import Tr from"./progressDot/index.js";import Ar from"./clipTip/index.js";import xr from"./useSwitchHotkey/index.js";import jr from"./useAudioCombine/index.js";import Dr from"./useAudioSegment/index.js";import Lr from"./combineTip/index.js";import Mr from"./segmentTip/index.js";import Ir from"../../views/MainView/toolFooter/index.js";import{decimalReserved as Z}from"../videoPlayer/utils.js";import{I18nextProvider as kr}from"react-i18next";var Br=Object.defineProperty,Or=Object.defineProperties,Nr=Object.getOwnPropertyDescriptors,et=Object.getOwnPropertySymbols,Wr=Object.prototype.hasOwnProperty,Fr=Object.prototype.propertyIsEnumerable,tt=(f,u,d)=>u in f?Br(f,u,{enumerable:!0,configurable:!0,writable:!0,value:d}):f[u]=d,de=(f,u)=>{for(var d in u||(u={}))Wr.call(u,d)&&tt(f,d,u[d]);if(et)for(var d of et(u))Fr.call(u,d)&&tt(f,d,u[d]);return f},rt=(f,u)=>Or(f,Nr(u));const{EToolName:ot}=lr,q=ir.default,nt=.1,it=i.createContext({count:0,isEdit:!1,toolName:ot.Empty,imgIndex:0}),lt=({fileData:f={},onLoaded:u,context:d,invalid:st,height:at,hideError:ut,onError:me,updateRegion:x,removeRegion:W,regions:j=[],activeToolPanel:ct,clipConfigurable:dt,clipTextConfigurable:fe,clipAttributeList:mt,clipAttributeConfigurable:pe,secondaryAttributeConfigurable:ft,subAttributeList:pt,isCheck:h,hoverRegionId:K,footer:vt,drawLayerSlot:ve,clipTextList:gt,lang:ge})=>{var be,ye;const{url:F,path:_e}=f,[V,G]=b(!1),[Ee,he]=b(!1),[C,bt]=b(0),[yt,Se]=b(!1),[z,Pe]=b(0),n=H(null),w=H(null),Re=H(C),Y=e=>{Re.current=e,bt(e)},[Ce,_t]=b(0),[$,Et]=b(1),J=H(null),[we,ht]=b({}),{audioClipState:Q,setAudioClipState:M}=_r(),[ee,te]=b(!1),c=X(Q),Te=X(we);X(V);const D=X(j),Ae=Er(),[xe,St]=b([]),[je,Pt]=b({}),Rt=tr(()=>{E.emit("audioZoom")},500),De=e=>{e<Ve.min||e>Ve.max||(Et(e),Rr(),Rt())};Sr({container:J.current,target:document.querySelector(`[data-id=${(ye=(be=c.current)==null?void 0:be.selectedRegion)==null?void 0:ye.id}]`),clipping:ee,zoom:$,zoomHandler:De});const I=()=>{let e=D.current;const{attributeLockList:r}=c.current;r.length&&(e=e.filter(t=>r.includes(t.attribute))),oe(),e.forEach(t=>{var o;(o=n.current)==null||o.addRegion(rt(de({},t),{drag:!h,resize:!h,color:"rgba(0, 0, 0, 0)"}))}),Ae()},p=e=>{var r,t,o,l,a,v,g;const{id:s,loop:m=!0,playImmediately:_=!1,isLoopStatus:O}=e,L=!1;if(s){const A=(o=(t=(r=n.current)==null?void 0:r.regions)==null?void 0:t.list)!=null?o:{};Object.entries(A).forEach(([,P])=>{const{id:N}=P;s===N?P.select():P.cancelSelect()}),M({selectedRegion:{id:s,loop:L},selectedAttribute:(v=(a=(l=D.current)==null?void 0:l.find(P=>P.id===s))==null?void 0:a.attribute)!=null?v:""}),_&&((g=k(s))==null||g.play())}else M({selectedRegion:{}})},{combineInstance:Ct}=jr({waveRef:n,sortByStartRegions:xe,regionMap:je,updateRegion:x,removeRegion:W,generateRegions:I,setSelectedRegion:p}),{segmentInstance:wt,onRegionMouseMove:Tt,segmentTimeTip:At}=Dr({waveRef:n,regionMap:je,updateRegion:x,removeRegion:W,generateRegions:I,setSelectedRegion:p}),Le={clipTextConfigurable:fe,clipAttributeList:mt,clipAttributeConfigurable:pe,clipConfigurable:dt,secondaryAttributeConfigurable:ft,subAttributeList:pt,clipTextList:gt};R(()=>{var e;ge&&((e=Ke)==null||e.changeLanguage(ge))},[]),R(()=>{M({selectedAttribute:""})},[pe]),R(()=>{re()},[Q.selectedAttribute]),R(()=>{I()},[Q.attributeLockList]),Ge(()=>{M(Le),setTimeout(()=>{Me()})},[Le]),Ge(()=>{St(rr(j,["start"])),Pt(j.reduce((e,r)=>{const{id:t}=r;return rt(de({},e),{[t]:r})},{})),h&&I()},[j]),R(()=>{p(K?{id:K,loop:!1,playImmediately:!0}:{})},[K]);const Me=()=>{var e,r;c.current.clipConfigurable?(!h&&n.current&&((e=n.current)==null||e.enableDragSelection({slop:5})),I()):((r=n.current)==null||r.disableDragSelection(),oe()),re()},re=()=>{var e,r,t,o,l;let a="";c.current.clipConfigurable?a=Pr(c.current.selectedAttribute,(e=c.current.clipAttributeList)!=null?e:[]):a="transparent",((t=(r=n==null?void 0:n.current)==null?void 0:r.cursor)==null?void 0:t.cursor)&&((l=(o=n==null?void 0:n.current)==null?void 0:o.cursor)==null||l.setStyle({border:`2px dashed ${a}`}))},k=e=>{var r,t,o;return((o=(t=(r=n.current)==null?void 0:r.regions)==null?void 0:t.list)!=null?o:{})[e]},Ie=()=>{var e,r;if(F){const t=((r=(e=_e==null?void 0:_e.split("."))==null?void 0:e.pop())==null?void 0:r.toLowerCase())==="pcm";Se(!1),t?Qt(F).then(o=>{ke(o)}):ke(F)}},ke=e=>{var r;e&&(he(!0),Y(0),Pe(0),(r=n==null?void 0:n.current)==null||r.load(e))},oe=()=>{var e;(e=n.current)==null||e.clearRegions()},ne=e=>{const r=k(e);r&&(te(!1),r==null||r.remove(),W==null||W(e),p({}))},{run:Be}=hr(p,{wait:500});xr({sortByStartRegions:xe,setSelectedRegion:p});const xt=e=>{const{start:r,end:t}=Te.current;return(r||t)&&e.update(Te.current),e},jt=({action:e,id:r,eventDownTime:t})=>{var o,l;if(!c.current.clipConfigurable)return;r&&p({id:r});const a=k((r!=null?r:(o=c.current.selectedRegion)==null?void 0:o.id)||""),v=[];(e==="create"?D.current:(l=D.current)==null?void 0:l.filter(m=>m.id!==a.id)).forEach(m=>{const{start:_,end:O,attribute:L}=m;L===c.current.selectedAttribute&&[_,O].forEach(A=>{v.includes(A)||v.push(A)})});const s=wr(v.sort((m,_)=>m-_),t);n.current.range=s},Dt=e=>{re(),setTimeout(()=>{te(!1)});const r=xt(e),{id:t,start:o,end:l}=r;p({id:t,playImmediately:!0});const a={id:t,start:Z(o,3),end:Z(l,3)};x==null||x(a),Ae()},Lt=()=>{const e=fr.create({container:"#waveform",waveColor:"#999",progressColor:"#999",height:at||245,normalize:!0,cursorWidth:2,cursorColor:"white",responsive:0,hideScrollbar:!0,plugins:[pr.create({regions:j,dragSelection:{slop:5},canMove:!1}),vr.create({opacity:1,customStyle:{border:"2px dashed transparent"}})]}),r=()=>{var t;Y(((t=n==null?void 0:n.current)==null?void 0:t.getCurrentTime())||0)};e.on("ready",()=>{var t;const o=((t=n==null?void 0:n.current)==null?void 0:t.getDuration())||0;Pe(o),r(),u==null||u({duration:Math.round(o)}),he(!1),B(),E.on("setCurrentTimeByPosition",le),E.on("clearRegions",oe),E.on("removeRegionById",ne),E.on("setSelectedRegion",Be),e.on("regions-eventDown",jt),Me()}),e.on("audioprocess",()=>{r()}),e.on("play",()=>{G(!0)}),e.on("pause",()=>{G(!1)}),e.on("finish",()=>{G(!1)}),e.on("seek",()=>{r()}),e.on("error",()=>{Se(!0),u==null||u({hasError:!0}),me==null||me()}),e.on("region-created",t=>{var o;const{id:l,start:a,end:v}=t;if(D.current.find(s=>s.id===l))return;const g={id:l,start:Z(a,3),end:Z(v,3),attribute:c.current.selectedAttribute,text:""};if(c.current.secondaryAttributeConfigurable){const s=sr.getDefaultResultByConfig((o=c.current.subAttributeList)!=null?o:[]);g.subAttribute=s!=null?s:{}}fe&&c.current.clipTextList.forEach((m,_)=>{_===0?Object.assign(g,{text:m==null?void 0:m.default}):Object.assign(g,{[m.key]:m==null?void 0:m.default})}),x==null||x(g)}),e.on("region-updated",(t,o)=>{var l,a,v,g,s,m,_,O,L,A;const P=o==null?void 0:o.action;M({combined:!1,segment:!1}),P==="resize"&&((a=(l=n==null?void 0:n.current)==null?void 0:l.cursor)==null||a.setStyle({borderStyle:"solid"})),P==="drag"&&((g=(v=n==null?void 0:n.current)==null?void 0:v.cursor)==null||g.setStyle({borderColor:"transparent"}));const N={},se=[],ae={},Ut=(s=D.current)==null?void 0:s.filter(S=>S.id!==t.id),Xt=(O=(_=(m=n.current)==null?void 0:m.regions)==null?void 0:_.list)!=null?O:{};Ut.forEach(S=>{var Xe,Ze;const{element:ue}=(Xe=Xt[S.id])!=null?Xe:{},{start:Kt,end:Vt}=S;if(ue){const{x:qe,width:Gt}=((Ze=ue.getBoundingClientRect)==null?void 0:Ze.call(ue))||{},Yt=qe+Gt;[qe,Yt].forEach((ce,Jt)=>{se.includes(ce)||(se.push(ce),ae[ce]=Jt===0?Kt:Vt)})}});const{x:Ue,width:Zt}=((A=(L=t.element).getBoundingClientRect)==null?void 0:A.call(L))||{},qt=Ue+Zt;se.forEach(S=>{Math.abs(Qe(S,Ue))<5&&(N.start=ae[S]),Math.abs(Qe(S,qt))<5&&(N.end=ae[S])}),ht(N),Be({id:t.id}),te(!0)}),e.on("region-update-end",t=>{Dt(t)}),e.on("region-contextmenu",(t,o)=>{if(!h){if(o.preventDefault(),o.stopPropagation(),Cr(o)){ne(t.id);return}p({id:t.id,playImmediately:!0})}}),e.on("region-click",(t,o,l)=>{if(!h){if(o.preventDefault(),o.stopPropagation(),c.current.combined){Ct(t);return}if(c.current.segment){wt(t,l);return}p({id:t.id,playImmediately:!0})}}),e.on("region-mousemove",Tt),n.current=e},Mt=V?i.createElement(or,null):i.createElement(nr,null),Oe=e=>e?`${parseFloat((e/z*100).toFixed(4))}%`:"0%",Ne=Oe(C),It=Oe(Ce),T=()=>{if(!Ee)return n==null?void 0:n.current},kt=()=>{var e;(e=T())==null||e.skipForward(nt)},Bt=()=>{var e;(e=T())==null||e.skipBackward(nt)},B=()=>{var e;(e=T())==null||e.playPause(),p({})},We=e=>{var r;switch(e.keyCode){case q.Right:kt();break;case q.Left:Bt();break;case q.Space:e.preventDefault(),B();break;case q.Delete:if(!h){const{id:t}=((r=c.current)==null?void 0:r.selectedRegion)||{};t&&ne(t)}break}},Ot=e=>{le(e)},Fe=er.throttle(Ot,50);let ie=!1;const ze=()=>{ie&&(B(),ie=!1),document.removeEventListener("mousemove",Fe),document.removeEventListener("mouseup",ze)},Nt=e=>{le(e),V&&(ie=!0,B()),document.addEventListener("mousemove",Fe),document.addEventListener("mouseup",ze)},Wt=()=>{Ie()};R(()=>(Lt(),()=>{var e;(e=n==null?void 0:n.current)==null||e.destroy(),n.current=null,E.unbindAll("setCurrentTimeByPosition"),E.unbindAll("clearRegions"),E.unbindAll("removeRegionById"),E.unbindAll("setSelectedRegion")}),[]);const Ft=e=>{var r,t,o;(r=T())==null||r.playPause(),(t=T())==null||t.setPlaybackRate(e),(o=T())==null||o.playPause()};R(()=>(document.addEventListener("keydown",We),()=>{document.removeEventListener("keydown",We)})),R(()=>{p({}),Ie()},[F]);const $e=e=>{var r,t,o,l;if((n==null?void 0:n.current)&&(w==null?void 0:w.current)){const a=(t=(r=n==null?void 0:n.current)==null?void 0:r.getDuration())!=null?t:0,v=(o=w==null?void 0:w.current)==null?void 0:o.getBoundingClientRect();let s=(e.clientX-v.left)/(((l=w==null?void 0:w.current)==null?void 0:l.clientWidth)||0)*a;return s>a&&(s=a),s}return 0},le=e=>{var r;const t=$e(e);(r=n==null?void 0:n.current)==null||r.skip(t-Re.current),Y(t)},zt=e=>{_t($e(e))},$t=z?Math.max(z-C,0):0,Ht=(d==null?void 0:d.toolName)!==ot.Empty&&(d==null?void 0:d.isEdit)!==!0&&(ct==="remark"||h),He=i.createElement("div",{className:y.audioPlayer},yt&&!ut&&i.createElement(cr,{fileTypeName:"\u97F3\u9891",ignoreOffsetY:!0,reloadImage:Wt,backgroundColor:"#ffffffbb"}),i.createElement(Ar,{getRegionInstanceById:k,clipping:ee}),i.createElement(Lr,{container:J.current}),i.createElement(Mr,{segmentTimeTip:At}),i.createElement("div",{className:y.waveformContainer,ref:J},i.createElement("div",{id:"waveform",style:{width:`${$*100}%`},className:U({[y.waveform]:!0,"bee-audio-combined":c.current.combined,"bee-audio-clip":c.current.clipConfigurable})},st&&i.createElement(ur,{isAudio:!0}),i.createElement("div",{ref:w,className:y.progress,onMouseDown:Nt,onMouseMove:zt},i.createElement("div",{className:U({[y.radioTooltip]:!0}),style:{left:Ne}},Ye(C)),i.createElement("div",{className:U({[y.radioTooltip]:!0,[y.mouseTooltip]:!0}),style:{left:It}},Ye(Ce)),i.createElement(Tr,{playPercentage:Ne})),Ht&&(ve==null?void 0:ve({currentTime:C,remainingTime:$t,audioPlayer:T()})))),i.createElement("div",{className:y.controlBar},i.createElement(ar,{type:"link",icon:Mt,onClick:()=>{B()},className:U({[y.playButton]:!0,[y.playButtonDisabled]:Ee})}),i.createElement("span",{className:y.time},`${Je(C,"ss.SSS")} / -${Je(z-C,"ss.SSS")}`),i.createElement(dr,{playerType:mr.Audio,onChange:e=>{Ft(e)}}),i.createElement(gr,{onChange:e=>{De(e)},zoom:$}),i.createElement(br,{EventBus:E})));return d?i.createElement(it.Provider,{value:d},He,j.map(e=>{const{id:r}=e,t=document.querySelector(`[data-id=${r}]`);return t?i.createElement(yr,{el:t,key:r,region:e,edgeAdsorption:we,clipping:ee,zoom:$,instance:k(r),isCheck:h}):null}),i.createElement(Ir,{footer:vt})):He},zr=f=>i.createElement(kr,{i18n:Ke},i.createElement(lt,de({},f)));export{lt as AudioPlayer,it as AudioPlayerContext,zr as WrapAudioPlayer};
|
|
1
|
+
import i,{useState as b,useRef as U,useMemo as lr,useEffect as P}from"react";import{getWebPcm2WavBase64 as sr}from"../audioAnnotate/utils/getWebPcm2Wac.js";import ar,{debounce as ur,sortBy as cr}from"lodash";import{PauseOutlined as dr,CaretRightOutlined as mr}from"@ant-design/icons";import{cKeyCode as fr,cTool as pr,EventBus as E,TagUtils as vr}from"@labelbee/lb-annotation";import{i18n as Ye}from"@labelbee/lb-utils";import{Button as gr}from"antd";import br from"../invalidPage/index.js";import yr from"../imageError/index.js";import{classnames as V}from"../../utils/index.js";import _r,{EPlayerType as Er}from"../videoPlayer/components/SpeedController/index.js";import Sr from"@labelbee/wavesurfer";import hr from"@labelbee/wavesurfer/dist/plugin/wavesurfer.regions.js";import Rr from"@labelbee/wavesurfer/dist/plugin/wavesurfer.cursor.js";import Pr,{audioZoomInfo as de}from"./zoomSlider/index.js";import Cr from"./labelDisplayToggle/index.js";import Tr from"./clipRegion/index.js";import{useAudioClipStore as wr}from"../audioAnnotate/audioContext/index.js";import{useLatest as X,useUpdate as Ar,useDeepCompareEffect as Je,useThrottleFn as Qe}from"ahooks";import jr from"./useAudioScroll/index.js";import y from"./index.module.scss.js";import{getAttributeColor as xr,formatTime as et,timeFormat as tt,dispatchResizeEvent as Lr,precisionMinus as rt,isDoubleClick as Dr,getCanMoveRange as Mr}from"../../utils/audio.js";import kr from"./progressDot/index.js";import Ir from"./clipTip/index.js";import Br from"./useSwitchHotkey/index.js";import Or from"./useAudioCombine/index.js";import Wr from"./useAudioSegment/index.js";import Nr from"./combineTip/index.js";import zr from"./segmentTip/index.js";import Fr from"../../views/MainView/toolFooter/index.js";import{decimalReserved as Z}from"../videoPlayer/utils.js";import{I18nextProvider as $r}from"react-i18next";import Hr from"../../hooks/useSize.js";var Ur=Object.defineProperty,Vr=Object.defineProperties,Xr=Object.getOwnPropertyDescriptors,ot=Object.getOwnPropertySymbols,Zr=Object.prototype.hasOwnProperty,qr=Object.prototype.propertyIsEnumerable,nt=(f,u,d)=>u in f?Ur(f,u,{enumerable:!0,configurable:!0,writable:!0,value:d}):f[u]=d,me=(f,u)=>{for(var d in u||(u={}))Zr.call(u,d)&&nt(f,d,u[d]);if(ot)for(var d of ot(u))qr.call(u,d)&&nt(f,d,u[d]);return f},it=(f,u)=>Vr(f,Xr(u));const{EToolName:lt}=pr,q=fr.default,st=.1,at=i.createContext({count:0,isEdit:!1,toolName:lt.Empty,imgIndex:0}),ut=({fileData:f={},onLoaded:u,context:d,invalid:ct,height:dt,hideError:mt,onError:fe,updateRegion:D,removeRegion:F,regions:A=[],activeToolPanel:ft,clipConfigurable:pt,clipTextConfigurable:pe,clipAttributeList:vt,clipAttributeConfigurable:ve,secondaryAttributeConfigurable:gt,subAttributeList:bt,isCheck:S,hoverRegionId:K,footer:yt,drawLayerSlot:ge,clipTextList:_t,lang:be})=>{var ye,_e;const{url:$,path:Ee}=f,[G,Y]=b(!1),[Se,he]=b(!1),[j,Et]=b(0),[St,Re]=b(!1),[C,Pe]=b(0),n=U(null),x=U(null),Ce=U(j),J=e=>{Ce.current=e,Et(e)},[Te,ht]=b(0),[H,Rt]=b(de.defaultValue),h=U(null),[we,Pt]=b({}),{audioClipState:Q,setAudioClipState:I}=wr(),[ee,te]=b(!1),c=X(Q),Ae=X(we);X(G);const M=X(A),je=Ar(),[xe,Ct]=b([]),[Le,Tt]=b({}),[De,wt]=b({start:0,end:0}),At=Hr(h),jt=lr(()=>A.filter(e=>{const{start:t,end:r}=De;return e.start<=r&&e.end>=t}),[A,De]),xt=ur(()=>{E.emit("audioZoom")},500),Me=e=>{e<de.min||e>de.max||(Rt(e),Lr(),xt())};jr({container:h.current,target:document.querySelector(`[data-id=${(_e=(ye=c.current)==null?void 0:ye.selectedRegion)==null?void 0:_e.id}]`),clipping:ee,zoom:H,zoomHandler:Me});const B=()=>{let e=M.current;const{attributeLockList:t}=c.current;t.length&&(e=e.filter(r=>t.includes(r.attribute))),oe(),e.forEach(r=>{var o;(o=n.current)==null||o.addRegion(it(me({},r),{drag:!S,resize:!S,color:"rgba(0, 0, 0, 0)"}))}),je()},p=e=>{var t,r,o,l,a,v,g;const{id:s,loop:m=!0,playImmediately:_=!1,isLoopStatus:N}=e,k=!1;if(s){const L=(o=(r=(t=n.current)==null?void 0:t.regions)==null?void 0:r.list)!=null?o:{};Object.entries(L).forEach(([,w])=>{const{id:z}=w;s===z?w.select():w.cancelSelect()}),I({selectedRegion:{id:s,loop:k},selectedAttribute:(v=(a=(l=M.current)==null?void 0:l.find(w=>w.id===s))==null?void 0:a.attribute)!=null?v:""}),_&&((g=O(s))==null||g.play())}else I({selectedRegion:{}})},{combineInstance:Lt}=Or({waveRef:n,sortByStartRegions:xe,regionMap:Le,updateRegion:D,removeRegion:F,generateRegions:B,setSelectedRegion:p}),{segmentInstance:Dt,onRegionMouseMove:Mt,segmentTimeTip:kt}=Wr({waveRef:n,regionMap:Le,updateRegion:D,removeRegion:F,generateRegions:B,setSelectedRegion:p}),ke={clipTextConfigurable:pe,clipAttributeList:vt,clipAttributeConfigurable:ve,clipConfigurable:pt,secondaryAttributeConfigurable:gt,subAttributeList:bt,clipTextList:_t};P(()=>{var e;be&&((e=Ye)==null||e.changeLanguage(be))},[]),P(()=>{I({selectedAttribute:""})},[ve]),P(()=>{re()},[Q.selectedAttribute]),P(()=>{B()},[Q.attributeLockList]),Je(()=>{I(ke),setTimeout(()=>{Ie()})},[ke]),Je(()=>{Ct(cr(A,["start"])),Tt(A.reduce((e,t)=>{const{id:r}=t;return it(me({},e),{[r]:t})},{})),S&&B()},[A]),P(()=>{p(K?{id:K,loop:!1,playImmediately:!0}:{})},[K]);const Ie=()=>{var e,t;c.current.clipConfigurable?(!S&&n.current&&((e=n.current)==null||e.enableDragSelection({slop:5})),B()):((t=n.current)==null||t.disableDragSelection(),oe()),re()},re=()=>{var e,t,r,o,l;let a="";c.current.clipConfigurable?a=xr(c.current.selectedAttribute,(e=c.current.clipAttributeList)!=null?e:[]):a="transparent",((r=(t=n==null?void 0:n.current)==null?void 0:t.cursor)==null?void 0:r.cursor)&&((l=(o=n==null?void 0:n.current)==null?void 0:o.cursor)==null||l.setStyle({border:`2px dashed ${a}`}))},O=e=>{var t,r,o;return((o=(r=(t=n.current)==null?void 0:t.regions)==null?void 0:r.list)!=null?o:{})[e]},Be=()=>{var e,t;if($){const r=((t=(e=Ee==null?void 0:Ee.split("."))==null?void 0:e.pop())==null?void 0:t.toLowerCase())==="pcm";Re(!1),r?sr($).then(o=>{Oe(o)}):Oe($)}},Oe=e=>{var t;e&&(he(!0),J(0),Pe(0),(t=n==null?void 0:n.current)==null||t.load(e))},oe=()=>{var e;(e=n.current)==null||e.clearRegions()},ne=e=>{const t=O(e);t&&(te(!1),t==null||t.remove(),F==null||F(e),p({}))},{run:We}=Qe(p,{wait:100});Br({sortByStartRegions:xe,setSelectedRegion:p});const It=e=>{const{start:t,end:r}=Ae.current;return(t||r)&&e.update(Ae.current),e},Bt=({action:e,id:t,eventDownTime:r})=>{var o,l;if(!c.current.clipConfigurable)return;t&&p({id:t});const a=O((t!=null?t:(o=c.current.selectedRegion)==null?void 0:o.id)||""),v=[];(e==="create"?M.current:(l=M.current)==null?void 0:l.filter(m=>m.id!==a.id)).forEach(m=>{const{start:_,end:N,attribute:k}=m;k===c.current.selectedAttribute&&[_,N].forEach(L=>{v.includes(L)||v.push(L)})});const s=Mr(v.sort((m,_)=>m-_),r);n.current.range=s},Ot=e=>{re(),setTimeout(()=>{te(!1)});const t=It(e),{id:r,start:o,end:l}=t;p({id:r,playImmediately:!0});const a={id:r,start:Z(o,3),end:Z(l,3)};D==null||D(a),je()},Wt=()=>{const e=Sr.create({container:"#waveform",waveColor:"#999",progressColor:"#999",height:dt||245,normalize:!0,cursorWidth:2,cursorColor:"white",responsive:0,hideScrollbar:!0,plugins:[hr.create({regions:A,dragSelection:{slop:5},canMove:!1}),Rr.create({opacity:1,customStyle:{border:"2px dashed transparent"}})]}),t=()=>{var r;J(((r=n==null?void 0:n.current)==null?void 0:r.getCurrentTime())||0)};e.on("ready",()=>{var r;const o=((r=n==null?void 0:n.current)==null?void 0:r.getDuration())||0;Pe(o),t(),u==null||u({duration:Math.round(o)}),he(!1),W(),E.on("setCurrentTimeByPosition",le),E.on("clearRegions",oe),E.on("removeRegionById",ne),E.on("setSelectedRegion",We),e.on("regions-eventDown",Bt),Ie()}),e.on("audioprocess",()=>{t()}),e.on("play",()=>{Y(!0)}),e.on("pause",()=>{Y(!1)}),e.on("finish",()=>{Y(!1)}),e.on("seek",()=>{t()}),e.on("error",()=>{Re(!0),u==null||u({hasError:!0}),fe==null||fe()}),e.on("region-created",r=>{var o;const{id:l,start:a,end:v}=r;if(M.current.find(s=>s.id===l))return;const g={id:l,start:Z(a,3),end:Z(v,3),attribute:c.current.selectedAttribute,text:""};if(c.current.secondaryAttributeConfigurable){const s=vr.getDefaultResultByConfig((o=c.current.subAttributeList)!=null?o:[]);g.subAttribute=s!=null?s:{}}pe&&c.current.clipTextList.forEach((m,_)=>{_===0?Object.assign(g,{text:m==null?void 0:m.default}):Object.assign(g,{[m.key]:m==null?void 0:m.default})}),D==null||D(g)}),e.on("region-updated",(r,o)=>{var l,a,v,g,s,m,_,N,k,L;const w=o==null?void 0:o.action;I({combined:!1,segment:!1}),w==="resize"&&((a=(l=n==null?void 0:n.current)==null?void 0:l.cursor)==null||a.setStyle({borderStyle:"solid"})),w==="drag"&&((g=(v=n==null?void 0:n.current)==null?void 0:v.cursor)==null||g.setStyle({borderColor:"transparent"}));const z={},se=[],ae={},Yt=(s=M.current)==null?void 0:s.filter(R=>R.id!==r.id),Jt=(N=(_=(m=n.current)==null?void 0:m.regions)==null?void 0:_.list)!=null?N:{};Yt.forEach(R=>{var qe,Ke;const{element:ue}=(qe=Jt[R.id])!=null?qe:{},{start:tr,end:rr}=R;if(ue){const{x:Ge,width:or}=((Ke=ue.getBoundingClientRect)==null?void 0:Ke.call(ue))||{},nr=Ge+or;[Ge,nr].forEach((ce,ir)=>{se.includes(ce)||(se.push(ce),ae[ce]=ir===0?tr:rr)})}});const{x:Ze,width:Qt}=((L=(k=r.element).getBoundingClientRect)==null?void 0:L.call(k))||{},er=Ze+Qt;se.forEach(R=>{Math.abs(rt(R,Ze))<5&&(z.start=ae[R]),Math.abs(rt(R,er))<5&&(z.end=ae[R])}),Pt(z),We({id:r.id}),te(!0)}),e.on("region-update-end",r=>{Ot(r)}),e.on("region-contextmenu",(r,o)=>{if(!S){if(o.preventDefault(),o.stopPropagation(),Dr(o)){ne(r.id);return}p({id:r.id,playImmediately:!0})}}),e.on("region-click",(r,o,l)=>{if(!S){if(o.preventDefault(),o.stopPropagation(),c.current.combined){Lt(r);return}if(c.current.segment){Dt(r,l);return}p({id:r.id,playImmediately:!0})}}),e.on("region-mousemove",Mt),n.current=e},Nt=G?i.createElement(dr,null):i.createElement(mr,null),Ne=e=>e?`${parseFloat((e/C*100).toFixed(4))}%`:"0%",ze=Ne(j),zt=Ne(Te),T=()=>{if(!Se)return n==null?void 0:n.current},Ft=()=>{var e;(e=T())==null||e.skipForward(st)},$t=()=>{var e;(e=T())==null||e.skipBackward(st)},W=()=>{var e;(e=T())==null||e.playPause(),p({})},Fe=e=>{var t;switch(e.keyCode){case q.Right:Ft();break;case q.Left:$t();break;case q.Space:e.preventDefault(),W();break;case q.Delete:if(!S){const{id:r}=((t=c.current)==null?void 0:t.selectedRegion)||{};r&&ne(r)}break}},Ht=e=>{le(e)},$e=ar.throttle(Ht,50);let ie=!1;const He=()=>{ie&&(W(),ie=!1),document.removeEventListener("mousemove",$e),document.removeEventListener("mouseup",He)},Ut=e=>{le(e),G&&(ie=!0,W()),document.addEventListener("mousemove",$e),document.addEventListener("mouseup",He)},Vt=()=>{Be()};P(()=>(Wt(),()=>{var e;(e=n==null?void 0:n.current)==null||e.destroy(),n.current=null,E.unbindAll("setCurrentTimeByPosition"),E.unbindAll("clearRegions"),E.unbindAll("removeRegionById"),E.unbindAll("setSelectedRegion")}),[]);const Xt=e=>{var t,r,o;(t=T())==null||t.playPause(),(r=T())==null||r.setPlaybackRate(e),(o=T())==null||o.playPause()};P(()=>(document.addEventListener("keydown",Fe),()=>{document.removeEventListener("keydown",Fe)})),P(()=>{p({}),Be()},[$]),P(()=>{Ue()},[At,C]);const Zt=()=>{if(h.current&&C){const e=h.current.scrollLeft,t=h.current.clientWidth,r=e/h.current.scrollWidth*C,o=(e+t)/h.current.scrollWidth*C;wt({start:r,end:o})}},{run:Ue}=Qe(Zt,{wait:300}),Ve=e=>{var t,r,o,l;if((n==null?void 0:n.current)&&(x==null?void 0:x.current)){const a=(r=(t=n==null?void 0:n.current)==null?void 0:t.getDuration())!=null?r:0,v=(o=x==null?void 0:x.current)==null?void 0:o.getBoundingClientRect();let s=(e.clientX-v.left)/(((l=x==null?void 0:x.current)==null?void 0:l.clientWidth)||0)*a;return s>a&&(s=a),s}return 0},le=e=>{var t;const r=Ve(e);(t=n==null?void 0:n.current)==null||t.skip(r-Ce.current),J(r)},qt=e=>{ht(Ve(e))},Kt=C?Math.max(C-j,0):0,Gt=(d==null?void 0:d.toolName)!==lt.Empty&&(d==null?void 0:d.isEdit)!==!0&&(ft==="remark"||S),Xe=i.createElement("div",{className:y.audioPlayer},St&&!mt&&i.createElement(yr,{fileTypeName:"\u97F3\u9891",ignoreOffsetY:!0,reloadImage:Vt,backgroundColor:"#ffffffbb"}),i.createElement(Ir,{getRegionInstanceById:O,clipping:ee}),i.createElement(Nr,{container:h.current}),i.createElement(zr,{segmentTimeTip:kt}),i.createElement("div",{className:y.waveformContainer,ref:h,onScroll:()=>Ue()},i.createElement("div",{id:"waveform",style:{width:`${H*100}%`},className:V({[y.waveform]:!0,"bee-audio-combined":c.current.combined,"bee-audio-clip":c.current.clipConfigurable})},ct&&i.createElement(br,{isAudio:!0}),i.createElement("div",{ref:x,className:y.progress,onMouseDown:Ut,onMouseMove:qt},i.createElement("div",{className:V({[y.radioTooltip]:!0}),style:{left:ze}},et(j)),i.createElement("div",{className:V({[y.radioTooltip]:!0,[y.mouseTooltip]:!0}),style:{left:zt}},et(Te)),i.createElement(kr,{playPercentage:ze})),Gt&&(ge==null?void 0:ge({currentTime:j,remainingTime:Kt,audioPlayer:T()})))),i.createElement("div",{className:y.controlBar},i.createElement(gr,{type:"link",icon:Nt,onClick:()=>{W()},className:V({[y.playButton]:!0,[y.playButtonDisabled]:Se})}),i.createElement("span",{className:y.time},`${tt(j,"ss.SSS")} / -${tt(C-j,"ss.SSS")}`),i.createElement(_r,{playerType:Er.Audio,onChange:e=>{Xt(e)}}),i.createElement(Pr,{onChange:e=>{var t;(t=T())==null||t.pause(),Me(e)},zoom:H}),i.createElement(Cr,{EventBus:E})));return d?i.createElement(at.Provider,{value:d},Xe,jt.map(e=>{const{id:t}=e,r=document.querySelector(`[data-id=${t}]`);return r?i.createElement(Tr,{el:r,key:t,region:e,edgeAdsorption:we,clipping:ee,zoom:H,instance:O(t),isCheck:S}):null}),i.createElement(Fr,{footer:yt})):Xe},Kr=f=>i.createElement($r,{i18n:Ye},i.createElement(ut,me({},f)));export{ut as AudioPlayer,at as AudioPlayerContext,Kr as WrapAudioPlayer};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import t,{useEffect as p}from"react";import{ZoomOutOutlined as y,ZoomInOutlined as E}from"@ant-design/icons";import{Slider as k}from"antd";import{precisionAdd as v,precisionMinus as x}from"../../../utils/audio.js";import{cKeyCode as C}from"@labelbee/lb-annotation";import{useLatest as h}from"ahooks";import Z from"./index.module.scss.js";import{useTranslation as b}from"react-i18next";const l=C.default,o={min:1,max:150,ratio:
|
|
1
|
+
import t,{useEffect as p}from"react";import{ZoomOutOutlined as y,ZoomInOutlined as E}from"@ant-design/icons";import{Slider as k}from"antd";import{precisionAdd as v,precisionMinus as x}from"../../../utils/audio.js";import{cKeyCode as C}from"@labelbee/lb-annotation";import{useLatest as h}from"ahooks";import Z from"./index.module.scss.js";import{useTranslation as b}from"react-i18next";const l=C.default,o={min:1,max:150,ratio:10,defaultValue:30},g=d=>{const{onChange:u,zoom:r}=d,{t:f}=b(),i=h(r),n=e=>{u(e)},a={fontSize:14,margin:"0 8px",cursor:"pointer"},s=()=>{const e=v(i.current,o.ratio);n(e)},c=()=>{const e=x(i.current,o.ratio);n(e)},m=e=>{switch(e.keyCode){case l.I:e.ctrlKey&&s();break;case l.O:e.ctrlKey&&(e.preventDefault(),c());break}};return p(()=>(document.addEventListener("keydown",m),()=>{document.removeEventListener("keydown",m)}),[]),t.createElement("div",{className:Z.sliderContainer},t.createElement("div",null,f("Scale")),t.createElement(y,{style:a,onClick:c}),t.createElement("div",{style:{width:120}},t.createElement(k,{min:o.min,max:o.max,step:o.ratio,onChange:n,value:r})),t.createElement(E,{style:a,onClick:s}))};export{o as audioZoomInfo,g as default};
|