patrick/Vosklet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update examples

Browse Source
This commit is contained in:
msqr1
2024-03-27 17:20:18 -07:00
parent 0a7a974dee
commit 59d7906590
3 changed files with 23 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
README.md
View File

@@ -1,27 +1,30 @@
# Overview # Overview
- A speech recognizer built on Vosk that can be run on the browser, inspired by [vosk-browser](https://github.com/ccoreilly/vosk-browser), but built from scratch and no code taken! - A speech recognizer built on Vosk that can be run on the browser, inspired by [vosk-browser](https://github.com/ccoreilly/vosk-browser), but built from scratch and no code taken!
- Designed with basic/nothrow exception safety - Designed with basic/nothrow exception safety
- See the *examples* folder for examples on using the API - See the *examples* folder for examples on using the API.
- See the *devel* folder for the newest build (not guaranteed to work) and the JS build script - See the *devel* folder for the newest build (not guaranteed to work) and the JS build script
# Compared to vosk-browser: # Compared to vosk-browser
- Support multiple models - Support multiple models
- Model storage path management - Has models' storage path management
- Model ID management (for model updates) - Has models' ID management (for model updates)
- Smaller JS size (>3.1MB vs 1.4MB gzipped) - Has smaller JS size (>3.1MB vs 1.4MB gzipped)
- All related files (pthread worker, worklet processor,...) are merged - All related files (pthread worker, audio worklet processor,...) are merged
- Shorter from-scratch build time - Has shorter from-scratch build time
- Faster loading and processing time - Has faster startup time
# Basic usage (microphone recognition) # Basic usage (microphone recognition)
- Result are logged to the console.
``` ```
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<script src="Vosklet.js" async defer></script> <script src="https://cdn.jsdelivr.net/gh/msqr1/Vosklet@1.0.0/Vosklet.js" async defer></script>
<script> <script>
async function start() { async function start() {
// Make sure sample rate matches that in the training data
let ctx = new AudioContext({sampleRate : 16000}) let ctx = new AudioContext({sampleRate : 16000})
// Setup mic with correct sample rate
let micNode = ctx.createMediaStreamSource(await navigator.mediaDevices.getUserMedia({ let micNode = ctx.createMediaStreamSource(await navigator.mediaDevices.getUserMedia({
video: false, video: false,
audio: { audio: {
@@ -31,16 +34,20 @@
sampleRate: 16000 sampleRate: 16000
}, },
})) }))
// Load Vosklet module, model and recognizer
let module = await loadVosklet() let module = await loadVosklet()
let model = await module.createModel("en-model.tgz","model","ID") let model = await module.createModel("en-model.tgz","model","ID")
let recognizer = await module.createRecognizer(model, 16000) let recognizer = await module.createRecognizer(model, 16000)
// Listen for result and partial result
recognizer.addEventListener("result", ev => { recognizer.addEventListener("result", ev => {
console.log("Result: ", ev.detail) console.log("Result: ", ev.detail)
}) })
recognizer.addEventListener("partialResult", ev => { recognizer.addEventListener("partialResult", ev => {
console.log("Partial result: ", ev.detail) console.log("Partial result: ", ev.detail)
}) })
// Create a transferer node to get audio data on the main thread
let transferer = await module.createTransferer(ctx, 128 * 150) let transferer = await module.createTransferer(ctx, 128 * 150)
// Recognize data on arrival
transferer.port.onmessage = ev => { transferer.port.onmessage = ev => {
recognizer.acceptWaveform(ev.data) recognizer.acceptWaveform(ev.data)
} }

5
examples/fromMic.html
View File

@@ -4,7 +4,9 @@
<script src="Vosklet.js" async defer></script> <script src="Vosklet.js" async defer></script>
<script> <script>
async function start() { async function start() {
// Make sure sample rate matches that in the training data
let ctx = new AudioContext({sampleRate : 16000}) let ctx = new AudioContext({sampleRate : 16000})
// Setup mic with correct sample rate
let micNode = ctx.createMediaStreamSource(await navigator.mediaDevices.getUserMedia({ let micNode = ctx.createMediaStreamSource(await navigator.mediaDevices.getUserMedia({
video: false, video: false,
audio: { audio: {
@@ -14,15 +16,18 @@
sampleRate: 16000 sampleRate: 16000
}, },
})) }))
// Load Vosklet module, model and recognizer
let module = await loadVosklet() let module = await loadVosklet()
let model = await module.createModel("en-model.tgz","model","ID") let model = await module.createModel("en-model.tgz","model","ID")
let recognizer = await module.createRecognizer(model, 16000) let recognizer = await module.createRecognizer(model, 16000)
// Listen for result and partial result
recognizer.addEventListener("result", ev => { recognizer.addEventListener("result", ev => {
console.log("Result: ", ev.detail) console.log("Result: ", ev.detail)
}) })
recognizer.addEventListener("partialResult", ev => { recognizer.addEventListener("partialResult", ev => {
console.log("Partial result: ", ev.detail) console.log("Partial result: ", ev.detail)
}) })
// Create a transferer node to get audio data
let transferer = await module.createTransferer(ctx, 128 * 150) let transferer = await module.createTransferer(ctx, 128 * 150)
transferer.port.onmessage = ev => { transferer.port.onmessage = ev => {
recognizer.acceptWaveform(ev.data) recognizer.acceptWaveform(ev.data)

2
examples/fromWav.html
View File

@@ -4,6 +4,7 @@
<script src="Vosklet.js" async defer></script> <script src="Vosklet.js" async defer></script>
<script> <script>
async function start() { async function start() {
// Make sure sample rate matches that in the training data
let ctx = new AudioContext({sampleRate : 16000}) let ctx = new AudioContext({sampleRate : 16000})
let module = await loadVosklet() let module = await loadVosklet()
let model = await module.createModel("en-model.tgz","model","ID") let model = await module.createModel("en-model.tgz","model","ID")
@@ -14,6 +15,7 @@
recognizer.addEventListener("partialResult", ev => { recognizer.addEventListener("partialResult", ev => {
console.log("Partial result: ", ev.detail) console.log("Partial result: ", ev.detail)
}) })
// Fetch, decode, and recognize .wav
let wav = await fetch("example.wav") let wav = await fetch("example.wav")
let audioBuf = await ctx.decodeAudioData(await wav.arrayBuffer()) let audioBuf = await ctx.decodeAudioData(await wav.arrayBuffer())
recognizer.acceptWaveform(audioBuf.getChannelData(0)) recognizer.acceptWaveform(audioBuf.getChannelData(0))