|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Document</title> |
|
|
<style> |
|
|
#textarea2{ |
|
|
overflow: hidden; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<h1>test</h1> |
|
|
<pre> |
|
|
https://5173-01hm8s5jycsmrc8k2gbqz5e1wf.cloudspaces.litng.ai/test.html |
|
|
|
|
|
</pre> |
|
|
<textarea id="textarea1" name="testtextarea" id="testtextarea " cols="30" rows="10"></textarea> <br> |
|
|
<textarea id="textarea2" name="testtextarea" id="testtextarea " cols="300" rows="10"></textarea> <br> |
|
|
|
|
|
<input id="input1" type="text" placeholder="input1"> <br> |
|
|
<input id="input2" type="number" placeholder="input2" > <br> |
|
|
|
|
|
<input id="fileinput" type="file" /> <br> |
|
|
<br><button id="start">start</button> |
|
|
<button id="stop">stop</button> |
|
|
|
|
|
</body> |
|
|
|
|
|
|
|
|
<script src="./index.js"></script> |
|
|
<script src="./test.js"></script> |
|
|
<script> |
|
|
let startButton=document.querySelector('#start'); |
|
|
let stopButton=document.querySelector('#stop'); |
|
|
|
|
|
let rec=new Recorder(); |
|
|
|
|
|
|
|
|
document.querySelector('#start').addEventListener('click',async ()=>{ |
|
|
|
|
|
console.log('start'); |
|
|
let blob=await rec.startRecording(stopButton) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log('got blob',blob) |
|
|
playAudioBlob(blob) |
|
|
console.log(await blobToBase64(blob) ); |
|
|
sendAudioToLeptonWhisperApi(blob); |
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
document.querySelector('#stop').addEventListener('click',()=>{ |
|
|
rec.stopRecording(); |
|
|
|
|
|
}) |
|
|
|
|
|
document.body.addEventListener('focus',()=>{ |
|
|
console.log('focus'); |
|
|
}) |
|
|
|
|
|
</script> |
|
|
</html> |