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