Skip to content

Instantly share code, notes, and snippets.

@GuiguiWeb
Created October 16, 2020 07:51
Show Gist options
  • Save GuiguiWeb/b2256a2183750f50eeec19dec130c3bf to your computer and use it in GitHub Desktop.
Save GuiguiWeb/b2256a2183750f50eeec19dec130c3bf to your computer and use it in GitHub Desktop.
speech-recognition-test
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test Speach Reco</title>
</head>
<body>
Test
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/annyang/2.6.1/annyang.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/SpeechKITT/0.3.0/speechkitt.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8.18.5/dist/sweetalert2.all.min.js" integrity="sha256-LS9STYVDLd0Sqiul2b+tLGACQs5gBE37HSA4nCtSw3U=" crossorigin="anonymous"></script>
<script>
if (annyang) {
//SpeechKITT.annyang();
//SpeechKITT.setStylesheet('//cdnjs.cloudflare.com/ajax/libs/SpeechKITT/0.3.0/themes/flat.css');
//SpeechKITT.vroom();
var commands = {
'ok': function () {
console.log('command - OK');
$('body').css('background-color', 'green');
},
'orange': function () {
console.log('command - orange');
$('body').css('background-color', 'orange');
},
'red': function () {
console.log('command - red');
$('body').css('background-color', 'red');
},
'blue': function () {
console.log('command - blue');
$('body').css('background-color', 'blue');
}
};
annyang.init(commands);
annyang.start({ autoRestart: true, continuous: false });
annyang.addCallback('soundstart', function() {
console.log('sound detected');
});
annyang.addCallback('result', function() {
console.log('sound stopped');
});
annyang.setLanguage('fr-FR');
annyang.addCallback('result', function(phrases) {
console.log("I think the user said: ", phrases[0]);
if ($.inArray('ok', phrases) !== -1) {
console.log('OK GOOD');
$('body').css('background-color', 'green');
} else if ($.inArray('red', phrases) !== -1) {
console.log('OK GOOD');
$('body').css('background-color', 'red');
} else if ($.inArray('orange', phrases) !== -1) {
console.log('OK GOOD');
$('body').css('background-color', 'orange');
} else if ($.inArray('blue', phrases) !== -1) {
console.log('OK GOOD');
$('body').css('background-color', 'blue');
} else {
console.log('blue', $.inArray('blue', phrases));
//alert('Je n\'ai pas compris :(');
$('body').css('background-color', 'white');
}
console.log("But then again, it could be any of the following: ", phrases);
});
annyang.addCallback('resultMatch', function(userSaid, commandText, phrases) {
console.log(userSaid); // sample output: 'hello'
console.log(commandText); // sample output: 'hello (there)'
console.log(phrases); // sample output: ['hello', 'halo', 'yellow', 'polo', 'hello kitty']
});
annyang.addCallback('resultNoMatch', function(phrases) {
Swal.fire(phrases[0], 'Other: ' + phrases.toString());
console.log("I think the user said: ", phrases[0]);
console.log("But then again, it could be any of the following: ", phrases);
});
//annyang.setLanguage('fr-FR');
// Start listening. You can call this here, or attach this call to an event, button, etc.
console.log('start GO');
} else {
console.log('Speech Recognition is not supported');
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment