https://www.cerebralcircuit.ai/_nuxt/Bi-9Rqw6.js

1import{_ as m,a as r,c as d,b as a,d as c,n as g,f as u,I as l,j as w,a7 as f}from"./BIu5PYOD.js";const y={props:{bgColor:{type:String,default:"#f07"},textColor:{type:String,default:"#fff"}},data(){return{mediaRecorder:null,audioChunks:[],audioContext:null,analyser:null,isRecording:!1,audioUrl:null,animatedWidth:"0px",svgOpacity:1,animationFrameId:null}},mounted(){window.addEventListener("keydown",this.handleKeyDown)},beforeDestroy(){window.removeEventListener("keydown",this.handleKeyDown)},methods:{handleKeyDown(s){s.key==="Escape"&&this.closeRecoder()},closeRecoder(){this.$emit("closeRecorder")},removeRecording(){this.audioUrl=null,this.$refs.audioPlayer.src="",this.audioChunks=[]},async startRecording(){try{this.audioChunks=[],this.audioContext&&this.audioContext.close(),await cancelAnimationFrame(this.animationFrameId);const s=await navigator.mediaDevices.getUserMedia({audio:!0});this.mediaRecorder=new MediaRecorder(s),this.mediaRecorder.ondataavailable=i=>{i.data.size>0&&this.audioChunks.push(i.data)},this.mediaRecorder.onstop=async()=>{const i=new Blob(this.audioChunks,{type:"audio/wav"});this.audioUrl=URL.createObjectURL(i),this.$refs.audioPlayer.src=this.audioUrl,this.$emit("audioUrl",this.audioUrl),this.$emit("closeRecorder")},this.audioContext=new(window.AudioContext||window.webkitAudioContext),this.analyser=this.audioContext.createAnalyser(),this.audioContext.createMediaStreamSource(s).connect(this.analyser),this.mediaRecorder.start(),this.isRecording=!0,this.animationFrameId=requestAnimationFrame(this.animateBasedOnAudio)}catch(s){console.error("Error accessing the microphone:",s)}},async stopRecording(){this.isRecording=!1,this.svgOpacity=1,this.audioContext.close(),await cancelAnimationFrame(this.animationFrameId),await this.mediaRecorder.stop(),this.audioChunks=[],this.mediaRecorder=null},animateBasedOnAudio(){const s=this.analyser.frequencyBinCount,e=new Uint8Array(s);this.analyser.getByteFrequencyData(e);const h=e.reduce((n,t)=>n+t,0)/s/256*100;this.svgOpacity=.5+h/100*1,this.animationFrameId=requestAnimationFrame(this.animateBasedOnAudio)}}},v={class:"relative overflow-visible"},R={key:0,class:"absolute animate-pulse -top-10 left-1/2 transform -translate-x-1/2 px-6 py-1 rounded-full text-xs bg-red-500/80 text-white"},p={class:"mx-auto flex-col mb-1.5 rounded flex justify-center items-center !select-none"},x=["disabled"],A={key:0},b=["fill"],C={key:1},V=["fill"],k={controls:"",class:"hidden w-full mb-4",ref:"audioPlayer"};function _(s,e,i,h,n,t){return r(),d("div",v,[n.isRecording?(r(),d("div",R,[...e[7]||(e[7]=[a("span",null,"Recording...",-1),a("div",{class:"absolute bottom-0 left-1/2 transform -translate-x-1/2 translate-y-full text-red-500/80"},[a("svg",{class:"fill-current",xmlns:"http://www.w3.org/2000/svg",width:"18",height:"9",viewBox:"0 0 18 9"},[a("path",{id:"Icon_ionic-md-arrow-dropdown","data-name":"Icon ionic-md-arrow-dropdown",d:"M9,13.5l9,9,9-9Z",transform:"translate(-9 -13.5)"})])],-1)])])):c("",!0),a("div",p,[a("button",{onMousedown:e[0]||(e[0]=(...o)=>t.startRecording&&t.startRecording(...o)),onTouchstart:e[1]||(e[1]=l((...o)=>t.startRecording&&t.startRecording(...o),["prevent"])),onPointerdown:e[2]||(e[2]=l((...o)=>t.startRecording&&t.startRecording(...o),["prevent"])),onMouseup:e[3]||(e[3]=(...o)=>t.stopRecording&&t.stopRecording(...o)),onTouchend:e[4]||(e[4]=l((...o)=>t.stopRecording&&t.stopRecording(...o),["prevent"])),onTouchcancel:e[5]||(e[5]=l((...o)=>t.stopRecording&&t.stopRecording(...o),["prevent"])),onPointerup:e[6]||(e[6]=l((...o)=>t.stopRecording&&t.stopRecording(...o),["prevent"])),disabled:!n.isRecording,style:u({color:i.textColor?i.textColor:"#fff","background-color":i.bgColor?i.bgColor:"red"}),class:g([{"animate-pulse":n.isRecording},"cursor-pointer !select-none mx-auto rounded-full w-6 h-6 inline-block text-xl font-bold"])},[n.isRecording?c("",!0):(r(),d("span",A,[(r(),d("svg",{fill:i.textColor,class:"w-6 h-6 inline-block",style:u({opacity:n.svgOpacity}),viewBox:"0 0 24.75 36"},[...e[8]||(e[8]=[a("path",{id:"Icon_awesome-microphone-alt","data-name":"Icon awesome-microphone-alt",d:"M23.625,13.5H22.5a1.125,1.125,0,0,0-1.125,1.125V18a9.01,9.01,0,0,1-9.9,8.956,9.273,9.273,0,0,1-8.1-9.357V14.625A1.125,1.125,0,0,0,2.25,13.5H1.125A1.125,1.125,0,0,0,0,14.625v2.824A12.762,12.762,0,0,0,10.688,30.224v2.4H6.75A1.125,1.125,0,0,0,5.625,33.75v1.125A1.125,1.125,0,0,0,6.75,36H18a1.125,1.125,0,0,0,1.125-1.125V33.75A1.125,1.125,0,0,0,18,32.625H14.063V30.251A12.387,12.387,0,0,0,24.75,18V14.625A1.125,1.125,0,0,0,23.625,13.5ZM12.375,24.75A6.75,6.75,0,0,0,19.125,18h-6c-.414,0-.75-.252-.75-.562V16.313c0-.311.336-.562.75-.562h6V13.5h-6c-.414,0-.75-.252-.75-.562V11.813c0-.311.336-.562.75-.562h6V9h-6c-.414,0-.75-.252-.75-.562V7.313c0-.311.336-.562.75-.562h6a6.75,6.75,0,0,0-13.5,0V18A6.75,6.75,0,0,0,12.375,24.75Z"},null,-1)])],12,b))])),n.isRecording?(r(),d("span",C,[(r(),d("svg",{fill:i.textColor,class:"w-6 h-6 inline-block",style:u({opacity:n.svgOpacity}),viewBox:"0 0 24.75 36"},[...e[9]||(e[9]=[a("path",{id:"Icon_awesome-microphone-alt","data-name":"Icon awesome-microphone-alt",d:"M23.625,13.5H22.5a1.125,1.125,0,0,0-1.125,1.125V18a9.01,9.01,0,0,1-9.9,8.956,9.273,9.273,0,0,1-8.1-9.357V14.625A1.125,1.125,0,0,0,2.25,13.5H1.125A1.125,1.125,0,0,0,0,14.625v2.824A12.762,12.762,0,0,0,10.688,30.224v2.4H6.75A1.125,1.125,0,0,0,5.625,33.75v1.125A1.125,1.125,0,0,0,6.75,36H18a1.125,1.125,0,0,0,1.125-1.125V33.75A1.125,1.125,0,0,0,18,32.625H14.063V30.251A12.387,12.387,0,0,0,24.75,18V14.625A1.125,1.125,0,0,0,23.625,13.5ZM12.375,24.75A6.75,6.75,0,0,0,19.125,18h-6c-.414,0-.75-.252-.75-.562V16.313c0-.311.336-.562.75-.562h6V13.5h-6c-.414,0-.75-.252-.75-.562V11.813c0-.311.336-.562.75-.562h6V9h-6c-.414,0-.75-.252-.75-.562V7.313c0-.311.336-.562.75-.562h6a6.75,6.75,0,0,0-13.5,0V18A6.75,6.75,0,0,0,12.375,24.75Z"},null,-1)])],12,V))])):c("",!0)],46,x),w(a("audio",k,null,512),[[f,!n.isRecording&&n.audioUrl]])])])}const I=m(y,[["render",_],["__scopeId","data-v-9636d7d1"]]);export{I as _};