Annyang! SpeechRecognition qui fonctionne

Annyang! SpeechRecognition qui fonctionne




Annyang est une petite bibliothèque javascript qui permet à vos visiteurs de contrôler votre site avec des commandes vocales.

annyang prend en charge plusieurs langues, n'a pas de dépendances, ne pèse que 2 Ko et est libre d'utilisation.

  
Allez-y, essayez-le…
Dis bonjour!"
C'est cool, mais dans le monde réel, ce ne sont pas tous des chatons et bonjour le monde.
Pas de problème, dites "Afficher le rapport TPS"
Comment as-tu fais ça?
Facile. Voici tout le code nécessaire pour y parvenir:
<script src="//cdnjs.cloudflare.com/ajax/libs/annyang/2.6.0/annyang.min.js"></script>
<script>
if (annyang) {
  // Let's define our first command. First the text we expect, and then the function it should call
  var commands = {
    'show tps report': function() {
      $('#tpsreport').animate({bottom: '-100px'});
    }
  };

  // Add our commands to annyang
  annyang.addCommands(commands);

  // Start listening. You can call this here, or attach this call to an event, button, etc.
  annyang.start();
}
</script>
Qu'en est-il des commandes plus compliquées?
annyang comprend les commandes avec des variables nommées , des splats et des mots facultatifs .
Utilisez des variables nommées pour les arguments d'un mot dans votre commande.
Utilisez des splats pour capturer du texte de plusieurs mots à la fin de votre commande (gourmand).
Utilisez des mots ou des phrases facultatifs pour définir une partie de la commande comme facultative.
<script>
var commands = {
  // annyang will capture anything after a splat (*) and pass it to the function.
  // e.g. saying "Show me Batman and Robin" is the same as calling showFlickr('Batman and Robin');
  'show me *tag': showFlickr,

  // A named variable is a one word variable, that can fit anywhere in your command.
  // e.g. saying "calculate October stats" will call calculateStats('October');
  'calculate :month stats': calculateStats,

  // By defining a part of the following command as optional, annyang will respond to both:
  // "say hello to my little friend" as well as "say hello friend"
  'say hello (to my little) friend': greeting
};

var showFlickr = function(tag) {
  var url = 'http://api.flickr.com/services/rest/?tags='+tag;
  $.getJSON(url);
}

var calculateStats = function(month) {
  $('#stats').text('Statistics for '+month);
}

var greeting = function() {
  $('#greeting').text('Hello!');
}

</script>
Qu'en est-il du support du navigateur?
annyang fonctionne bien avec tous les navigateurs, améliorant progressivement les navigateurs prenant en charge SpeechRecognition, tout en laissant les utilisateurs de navigateurs plus anciens inchangés.
Libellés : , , ,