https://relaynotes.com/assets/js/chunks/form_video_recorder-SOSKWCYO.js

1import{a as d}from"./chunk-ANFRWWOE.js";import"./chunk-NM6J3ND7.js";var r={mounted(){this.blockId=this.el.dataset.blockId,this.maxDuration=parseInt(this.el.dataset.maxDuration||"60",10),this.audioOnly=this.el.dataset.audioOnly==="true",this.context=this.el.dataset.context||"editor",this.stream=null,this.mediaRecorder=null,this.chunks=[],this.recordedBlob=null,this.upload=null,this.countdownTimer=null,this.secondsRemaining=this.maxDuration,this.buildUI(),this.listenForServerEvents()},destroyed(){this.stopStream(),this.upload&&(this.upload.abort(),this.upload=null),this.countdownTimer&&(clearInterval(this.countdownTimer),this.countdownTimer=null)},buildUI(){for(;this.el.firstChild;)this.el.removeChild(this.el.firstChild);this.el.classList.add("form-video-recorder"),this.previewVideo=document.createElement("video"),this.previewVideo.classList.add("w-full","rounded-lg","bg-base-300","aspect-video"),this.previewVideo.muted=!0,this.previewVideo.playsInline=!0,this.previewVideo.autoplay=!0,this.audioOnly&&this.previewVideo.classList.add("hidden"),this.playbackVideo=document.createElement("video"),this.playbackVideo.classList.add("w-full","rounded-lg","bg-base-300","aspect-video","hidden"),this.playbackVideo.controls=!0,this.playbackVideo.playsInline=!0,this.audioPlaceholder=document.createElement("div"),this.audioPlaceholder.classList.add("w-full","rounded-lg","bg-base-300","aspect-video","flex","items-center","justify-center","text-base-content/50");let t=document.createElement("div");t.classList.add("text-center");let e=document.createElementNS("http://www.w3.org/2000/svg","svg");e.setAttribute("class","w-12 h-12 mx-auto mb-2"),e.setAttribute("fill","none"),e.setAttribute("stroke","currentColor"),e.setAttribute("viewBox","0 0 24 24");let i=document.createElementNS("http://www.w3.org/2000/svg","path");i.setAttribute("stroke-linecap","round"),i.setAttribute("stroke-linejoin","round"),i.setAttribute("stroke-width","2"),i.setAttribute("d","M19 11a7 7 0 01-7 7m0 0a7 7 0 01-7-7m7 7v4m0 0H8m4 0h4m-4-8a3 3 0 01-3-3V5a3 3 0 116 0v6a3 3 0 01-3 3z"),e.appendChild(i),t.appendChild(e);let s=document.createElement("span");s.classList.add("text-sm"),s.textContent="Audio Recording",t.appendChild(s),this.audioPlaceholder.appendChild(t),this.audioOnly||this.audioPlaceholder.classList.add("hidden"),this.countdown=document.createElement("div"),this.countdown.classList.add("text-center","text-sm","font-mono","text-base-content/60","mt-2","hidden"),this.controls=document.createElement("div"),this.controls.classList.add("flex","items-center","gap-2","mt-3","justify-center"),this.recordBtn=this.createButton("Record","btn-error",()=>this.startRecording()),this.stopBtn=this.createButton("Stop","btn-warning",()=>this.stopRecording()),this.stopBtn.classList.add("hidden"),this.rerecordBtn=this.createButton("Re-record","btn-ghost",()=>this.resetRecording()),this.rerecordBtn.classList.add("hidden"),this.uploadBtn=this.createButton("Use this recording","btn-primary",()=>this.requestUpload()),this.uploadBtn.classList.add("hidden"),this.fileInput=document.createElement("input"),this.fileInput.type="file",this.fileInput.accept=this.audioOnly?"audio/*":"video/*",this.fileInput.classList.add("hidden"),this.fileInput.addEventListener("change",n=>this.handleFileSelect(n)),this.fileFallbackBtn=this.createButton("Upload file instead","btn-ghost btn-xs",()=>this.fileInput.click()),this.progressContainer=document.createElement("div"),this.progressContainer.classList.add("w-full","mt-3","hidden");let o=document.createElement("div");o.classList.add("flex","items-center","gap-2"),this.progressBar=document.createElement("progress"),this.progressBar.classList.add("progress","progress-primary","flex-1"),this.progressBar.value=0,this.progressBar.max=100,this.progressText=document.createElement("span"),this.progressText.classList.add("text-xs","text-base-content/60"),this.progressText.textContent="0%",o.appendChild(this.progressBar),o.appendChild(this.progressText),this.progressContainer.appendChild(o),this.statusText=document.createElement("div"),this.statusText.classList.add("text-center","text-xs","text-base-content/50","mt-2"),this.context==="submission"&&(this.hiddenInput=document.createElement("input"),this.hiddenInput.type="hidden",this.hiddenInput.name=`submission[f_${this.blockId}]`,this.hiddenInput.value="",this.el.appendChild(this.hiddenInput)),this.controls.appendChild(this.recordBtn),this.controls.appendChild(this.stopBtn),this.controls.appendChild(this.rerecordBtn),this.controls.appendChild(this.uploadBtn),this.el.appendChild(this.previewVideo),this.el.appendChild(this.playbackVideo),this.el.appendChild(this.audioPlaceholder),this.el.appendChild(this.countdown),this.el.appendChild(this.controls),this.el.appendChild(this.fileFallbackBtn),this.el.appendChild(this.fileInput),this.el.appendChild(this.progressContainer),this.el.appendChild(this.statusText),this.setStatus("Click Record to begin")},createButton(t,e,i){let s=document.createElement("button");return s.type="button",s.textContent=t,s.className=`btn btn-sm ${e}`,s.addEventListener("click",i),s},listenForServerEvents(){this.handleEvent(`video:start-upload:${this.blockId}`,({url:t})=>{this.startUpload(t)}),this.handleEvent(`video:cancel-upload:${this.blockId}`,()=>{this.upload&&(this.upload.abort(),this.upload=null),this.setStatus("Upload cancelled"),this.showControls("record")}),this.context==="submission"&&this.handleEvent(`video:set-value:${this.blockId}`,({value:t})=>{this.hiddenInput&&(this.hiddenInput.value=typeof t=="string"?t:JSON.stringify(t))})},async startRecording(){try{let t=this.audioOnly?{audio:!0,video:!1}:{audio:!0,video:{facingMode:"user",width:{ideal:1280},height:{ideal:720}}};this.stream=await navigator.mediaDevices.getUserMedia(t),this.previewVideo.srcObject=this.stream,this.audioOnly||(this.previewVideo.classList.remove("hidden"),this.audioPlaceholder.classList.add("hidden")),this.chunks=[];let e=this.getSupportedMimeType(),i=e?{mimeType:e}:{};this.mediaRecorder=new MediaRecorder(this.stream,i),this.mediaRecorder.ondataavailable=s=>{s.data.size>0&&this.chunks.push(s.data)},this.mediaRecorder.onstop=()=>{let s=e||"video/webm";this.recordedBlob=new Blob(this.chunks,{type:s}),this.onRecordingComplete()},this.mediaRecorder.start(1e3),this.secondsRemaining=this.maxDuration,this.updateCountdown(),this.countdown.classList.remove("hidden"),this.countdownTimer=setInterval(()=>{this.secondsRemaining--,this.updateCountdown(),this.secondsRemaining<=10&&this.secondsRemaining>0&&this.countdown.classList.add("text-warning"),this.secondsRemaining<=0&&this.stopRecording()},1e3),this.showControls("stop"),this.setStatus("Recording...")}catch(t){console.error("Camera/mic access error:",t),this.pushEvent("video:permission-denied",{block_id:this.blockId,error:t.message||"Permission denied"}),this.setStatus("Camera/mic access denied. Use the file upload option.")}},stopRecording(){this.countdownTimer&&(clearInterval(this.countdownTimer),this.countdownTimer=null),this.countdown.classList.add("hidden"),this.countdown.classList.remove("text-warning"),this.mediaRecorder&&this.mediaRecorder.state!=="inactive"&&this.mediaRecorder.stop(),this.stopStream()},onRecordingComplete(){this.previewVideo.classList.add("hidden"),this.audioOnly&&this.audioPlaceholder.classList.remove("hidden");let t=URL.createObjectURL(this.recordedBlob);this.playbackVideo.src=t,this.playbackVideo.classList.remove("hidden"),this.showControls("post-record"),this.setStatus("Recording complete ("+this.formatSize(this.recordedBlob.size)+")"),this.pushEvent("video:recording-complete",{block_id:this.blockId,blob_size:this.recordedBlob.size})},resetRecording(){this.recordedBlob=null,this.chunks=[],this.playbackVideo.classList.add("hidden"),this.playbackVideo.src="",this.audioOnly?this.audioPlaceholder.classList.remove("hidden"):this.previewVideo.classList.remove("hidden"),this.showControls("record"),this.setStatus("Click Record to begin"),this.progressContainer.classList.add("hidden")},handleFileSelect(t){let e=t.target.files[0];if(!e)return;this.recordedBlob=e;let i=URL.createObjectURL(e);this.playbackVideo.src=i,this.playbackVideo.classList.remove("hidden"),this.previewVideo.classList.add("hidden"),this.audioOnly&&this.audioPlaceholder.classList.add("hidden"),this.showControls("post-record"),this.setStatus("File selected: "+e.name+" ("+this.formatSize(e.size)+")")},requestUpload(){if(this.recordedBlob){this.showControls("uploading"),this.setStatus("Requesting upload URL...");try{let t=this.context==="editor"?"start_video_upload":"video:request-upload";this.pushEvent(t,{block_id:this.blockId,filename:this.recordedBlob.name||"recording.webm",content_type:(this.recordedBlob.type||"video/webm").split(";")[0],size:this.recordedBlob.size})}catch(t){this.showControls("post-record"),this.setStatus(t.message)}}},startUpload(t){this.recordedBlob&&(this.progressContainer.classList.remove("hidden"),this.setStatus("Uploading..."),this.upload=d({file:this.recordedBlob,endpoint:t,videoId:this.blockId,onProgress:({percent:e})=>{this.updateProgress(e),this.pushEvent("video:upload-progress",{block_id:this.blockId,percent:e})},onSuccess:()=>{this.updateProgress(100),this.setStatus("Upload complete! Processing..."),this.showControls("uploaded"),this.pushEvent("video:upload-complete",{block_id:this.blockId})},onError:({error:e})=>{this.setStatus("Upload error: "+e),this.showControls("post-record"),this.pushEvent("video:upload-error",{block_id:this.blockId,error:e})}}))},showControls(t){this.recordBtn.classList.toggle("hidden",t!=="record"),this.stopBtn.classList.toggle("hidden",t!=="stop"),this.rerecordBtn.classList.toggle("hidden",t!=="post-record"),this.uploadBtn.classList.toggle("hidden",t!=="post-record"),this.fileFallbackBtn.classList.toggle("hidden",t!=="record")},updateCountdown(){let t=Math.floor(this.secondsRemaining/60),e=this.secondsRemaining%60;this.countdown.textContent=t+":"+e.toString().padStart(2,"0")+" remaining"},updateProgress(t){this.progressBar&&(this.progressBar.value=t),this.progressText&&(this.progressText.textContent=t+"%")},setStatus(t){this.statusText.textContent=t}

1,stopStream(){this.stream&&(this.stream.getTracks().forEach(t=>t.stop()),this.stream=null),this.previewVideo.srcObject=null},formatSize(t){return t<1024?t+" B":t<1024*1024?(t/1024).toFixed(1)+" KB":(t/(1024*1024)).toFixed(1)+" MB"},getSupportedMimeType(){let t=this.audioOnly?["audio/webm;codecs=opus","audio/webm","audio/ogg"]:["video/webm;codecs=vp9,opus","video/webm;codecs=vp8,opus","video/webm","video/mp4"];for(let e of t)if(MediaRecorder.isTypeSupported(e))return e;return null}},h=r;export{h as default};