EzDevInfo.com

annyang

<img class="emoji" title=":speech_balloon:" alt=":speech_balloon:" src="https://assets-cdn.github.com/images/icons/emoji/unicode/1f4ac.png" height="20" width="20" align="absmiddle"> A javascript library for adding voice commands to your site, using speech recognition. annyang! Easily add speech recognition to your site annyang is a javascript speechrecognition library that makes adding voice commands to your site super-easy. let your users control your site with their voice.

How do I add Annyang to a Browserify require?

My naive solution to use Annyang in a Browserify project was the following:

npm install annyang --save

then in the ann.js file

var Annyang = require('annyang');
myAnnyObject = {...}
module.exports = myAnnyObject;

then in my main.js file:

var Annyang = require('./speech/anny.js');

But the Annyang object returns this in my project:

Uncaught ReferenceError: Annyang is not defined

What is the correct way to add this library to my project?


Source: (StackOverflow)

How to read module vs. vanilla JS library in angular?

I'm new to service/provider/factories modules in angular. I've been using a library called annyang for 30 mins and I wanted to find the more "angular" way of using this library.

Some independent on git made a moduleProvider found here:ngAnnyang.

It has zero documentation on how to use it properly.

But traditional annyang you simply run:

var commands = {
  'remind me to *val' : reminders,
};

annyang.addCommands(commands);
annyang.start();

QUESTIONS: After injecting the module into my angular application:

  1. would this module be implemented the same or commands now get prefixed with nglike: ngAnnyang.addCommands(); ngAnnyang.start();?

  2. Do i still need to have the original lib of annyang as a script tag in the app?

  3. What in this angular wrapper makes it "angular" except that it now can be injected?

JS:ng-annyang

    /**
* ngAnnyang Module
*
* Annyang Angular wrapper
*/
angular.module('ngAnnyang', ['ng'])
  .provider('ngAnnyang', function ngAnnyangProvider() {
    'use strict';

    var isEnabledFn = function() {};

    // events
    console.log('ngAnnyang: set events');
    annyang.addCallback('start', function() {
      console.log('ngAnnyang: enabled true');
      isEnabledFn(true);
    });
    _.each(['end', 'error', 'errorNetwork', 'errorPermissionBlocked', 'errorPermissionDenied'], function(v) {
      annyang.addCallback(v, function() {
        console.log('ngAnnyang: enabled false');
        isEnabledFn(false);
      });
    });

    console.log('ngAnnyang: start');
    annyang.start();

    this.debug = function(state) {
      if(state){
        console.log('ngAnnyang: set debug', !!state);
        annyang.debug(!!state);

      } else {
        console.log('ngAnnyang: set debug', true);
        annyang.debug();
      }
    };

    this.setLanguage = function(lang) {
      if(lang){
        console.log('ngAnnyang: debug', ''+lang);
        annyang.setLanguage(''+lang);
      }
    };

    this.$get = function ngAnnyangFactory(){
      return {
        isEnabled: function(fn) {
          console.log('ngAnnyang: isEnabled callback', fn);
          isEnabledFn = fn;
        },
        addCommands: function(commands) {
          console.log('ngAnnyang: add commands', commands);
          annyang.addCommands(commands);
        },
        removeCommands: function(commands) {
          console.log('ngAnnyang: remove commands', commands);
          annyang.removeCommands(commands);
        }
      };
    };
  });

Source: (StackOverflow)

Advertisements

this.set is not a function

I have code like this:

var ws2812 = {};


ws2812.set = function(r,g,b){
    $.get( "/light?r="+r+"&g="+g+"&b="+b, function( data ) {
        console.log("Light set to:"+"/light?r="+r+"&g="+g+"&b="+b);
    })
};

ws2812.speech = function(word){
    switch(word){
        case "czerwone":
            this.set(255,0,0);
        break;
        case "zielone":
            this.set(0,255,0);
            break;
        case "niebieskie":
            this.set(0,0,255);
            break;
        case "białe":
            this.set(255,255,255);
            break;
        default:
            this.set(0,0,0);
            break;

    }
}

When running ws2812.speech(""); inside console, everything works. However, when paired with the Annyang library, I get this:

Uncaught TypeError: this.set is not a function 
ws2812.speech @ script.js:29  
b.annyang.init.d.onresult @ annyang.min.js:6

What's wrong?

[edit]

The command is added like this:

annyang.addCommands({"ustaw *term światło":ws2812.speech});

Specifically, inside annyang, this line fails:

f[h].callback.apply(this,m)

Is replacing this with ws2812 the only way to work around this?


Source: (StackOverflow)

Annyang converting speech to text

I'm trying to use annyang to convert speech into text, but I've ran into some problems. It works, but there's a few things that doesn't yet. First, I would like to know how would I be able to pass whatever the user said, into the alert function. Next, I would like to know how to end the annyang function when the user finished speaking. And finally, I'd like to know how to keep the allow and disallow microphone prompt from appearing again and again once it appeared once.

<script>
if (annyang) {

  var commands = {
    'Hello': function() {
      alert("Success");
    }
  };

  annyang.addCommands(commands);

}
</script>

<input type = 'submit' value = 'listen' onclick = "annyang.start();">

Source: (StackOverflow)

mic icon not working in android web app

Check this link

The above link is working fine in chrome browser but not in android web app

Following is the javascript code for this page :

 i = $("#mic-container");
i.click(function() {
    r ? annyang.abort() : annyang.start({
        autoRestart: !1
    })
}), annyang.addCallback("start", function() {
    r = !0, i.addClass("active pulse"), window.clearTimeout(n), n = setTimeout(annyang.abort, 9e3)
}), annyang.addCallback("end", function() {
    window.clearTimeout(n), n = setTimeout(function() {
        i.removeClass("active pulse result-match result-no-match")
    }, 200), r = !1
}), annyang.addCallback("resultNoMatch", function() {
    i.addClass("result-no-match"), $(".myErrorText").html('Try saying a valid command. See <a rel='nofollow' href="help.html" data-ajax="false">help</a> section for a list of valid commands!')
}), annyang.addCallback("resultMatch", function() {
    $(".myErrorText").text(""), i.addClass("result-match")
}), annyang.addCallback("errorNetwork", function() {
    alert("Not connected to internet")
}), annyang.addCallback("errorPermissionBlocked", function() {
    alert("error Permission Blocked")
}), annyang.addCallback("errorPermissionDenied", function() {
    alert("Please click Allow")
});

As soon as i click on the mic icon the above code executes (with the help of annyang.js) but on the android web app nothing happens when i click on the mic icon.


Source: (StackOverflow)

Annyang speech recognition keeps throwing error callback

I am using annyang speech recognition. My annyang.js codes are as:

if (annyang) {
    console.log("Annyaang Set");
    annyang.debug(true);

    var commands = {
      'hello world': function() {
        console.log("hello world");
      }
    };

    annyang.addCallback('error', function () {
        console.log("Error world");
    });

    annyang.addCallback('resultNoMatch', function () {
        console.log("resultNoMatch world");
    });

    annyang.addCommands(commands);
    annyang.start();
}

My console log throws Error world message. How can I figure out what is causing the error?

enter image description here


Source: (StackOverflow)

Speech Recognition in an Android Web Application does not work

I have written a Website, which uses Annyang, to catch the users voice-commands. (Annyang is a library, that is build on the Web Speech API - It only works in Chrome, but that is no problem for me)

This works very nice in Chrome on Windows and on Linux. But when I try to port this to an Android device it doesn't work at all.

Android Version is 4.2.2 Chrome Version is 43.0.2357.78

When I try to activate the speech Recognition, it immediately stops (meaning it calls the error callback). The adb logcat says the following:

I/chromium( 4102): [INFO:CONSOLE(441)] "Activate Speech", source: https://192.168.50.103/js/main.js (441)
I/chromium( 4102): [INFO:CONSOLE(847)] "start Speech", source: https://192.168.50.103/js/main.js (847)
I/RecognitionControllerImpl( 4958): startRecognition(#Intent;action=android.speech.action.RECOGNIZE_SPEECH;B.android.speech.extra.DICTATION_MODE=false;S.android.speech.extra.LANGUAGE=en-US;B.android.speech.extra.PARTIAL_RESULTS=false;end)
I/RecognitionControllerImpl( 4958): State change: STARTING -> STARTING
E/RecognitionControllerImpl( 4958): required extra 'calling_package' missing in voice search intent
E/RecognitionControllerImpl( 4958): ERROR_CLIENT
E/RecognitionControllerImpl( 4958): ERROR_CLIENT
I/AudioService( 3784):  AudioFocus  abandonAudioFocus() from android.media.AudioManager@410b53c8
I/AudioService( 3784):  AudioFocus  abandonAudioFocus() from android.media.AudioManager@410b53c8
I/RecognitionControllerImpl( 4958): State change: STARTING -> CANCELED
I/chromium( 4102): [INFO:CONSOLE(817)] "End Speech (Error)", source: https://192.168.50.103/js/main.js (817)
I/chromium( 4102): [INFO:CONSOLE(833)] "End Speech", source: https://192.168.50.103/js/main.js (833)

The Website is running on a node.js Server on the android system.

Searching for "required extra 'calling_package' missing in voice search " doesn't help me, since the results show solutions how to fix this in java. But I'm not using java. Just html and JS.

Do you have any ideas how to fix this error?

UPDATE 1

I have just tried the "google-voice-search" app. This app works just fine. It recognizes my words and leads me to the google search page. But my web application still does not work.

UPDATE 2

On my personal Android Device (Android 4.4.4) the "Annyang"-Example Page works fine by the way. I think there is only something missing (a "package") on my development device. But what am I missing?

UPDATE 3

Problem still persists... annyang is not the problem, it is the Web Speech API by itself. This simple Web Speech API Demo causes the same problem as stated above...

UPDATE 4

I finally dumped the whole Web Speech API thing and wrote an Android App instead with RecognitionListener. It runs on the same device without any problem. So I guess it's a bug in Chrome or something like that.


Source: (StackOverflow)

Is it possible to use annyang for speech recognition in cordova app?

I'm trying to use annyang for speech recognition in my cordova app. I'm following Talater's and Alex's examples, but I cannot get it to work.

I noticed that it doesn't ask me for permission using my microphone.

I'm testing the code in laptop's Chrome, not in device.

My code is:

<html>
<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
    <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
    <link rel="stylesheet" type="text/css" rel='nofollow' href="css/index.css" />
    <title>Hello World</title>
    <!-- <script src="js/speakClient.js"></script> -->
    <script src="http://cdnjs.cloudflare.com/ajax/libs/annyang/1.6.0/annyang.min.js"></script>
    <script src="js/annyang.min.js"></script>
</head>
<body>
    <div class="app">
        <h1>Apache Cordova</h1>
    </div>
</body>
<script type="text/javascript" src="js/annyang.js"></script>

This is my javascript code:

// Language select
annyang.setLanguage('es-ES');

if (annyang) {

  var sayThis = function(repeat) {
    alert(repeat);
  }

  // Let's define a command.
  var commands = {
    '*repeat': sayThis
  };
  // Debug info for the console
  annyang.debug();

  // Initialize annyang with our commands
  annyang.init(commands);

  // Start listening.
  annyang.start();
}
else {
  alert("No annyang");
}

Please, tell me if I'm missing something (If not possible to make it work in cordova app, How can I use speech recognition in a cordova app meant to work in iPhone?)


Source: (StackOverflow)

make ANNYANG capture multiple words for NAMED VARIABLE

<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 *term': 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(term) {
  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>

See the line :

A named variable is a one word variable, that can fit anywhere in your command.

what i need is to modify annyang.js so that it can capture multiple words for a NAMED VARIABLE

Here is the link to check the same plugin


Source: (StackOverflow)

Use new variable value in typed.js string everytime function is called

I am making a speech recongition based navigation. I am using typed.js to show the country name each time user says Show me "Country name". It works fine for the first time but when the user says again, it types the same old country each time. How do I retype text with new variable value each time a function is called?

 function hello (term)
{     //term contains the name of country user speaks

     //var address = $('#loc-box').val();
     var address = term;
    $('body').append(term);
    var flying = "Flying to ";

        var done = flying + term ;
        //alert(done);
        $(".element").typed({
    strings: [done],
    typeSpeed: 0
  });
 // shows the div for few seconds and then hides

$(".border").slideDown().delay(3000).slideUp('slow');

<!--alert(address); -->
  var geocoder = new google.maps.Geocoder();
  <!-- var address = 'Las Vegas'; -->




    flyto();

     }
     else {
        console.log("Geocoding failed: " + status);
     }
  });
   }
    //alert(term);
    }
 } 
 </script>

Source: (StackOverflow)

Microphone permission without internet connection [closed]

I am aware that you can only request access to the browser's microphone in google chrome (and other browser's as far as I know) with either https or http. I have a node server and am using Annyang which works fine when I am connected to wifi as usual (requests access to microphone, does its thing after the user accepts).

My problem is that my application is meant to be used with a drone which means that I will be connected to the drone's wifi (which doesn't connect to the internet). I didn't think this would be a problem because I downloaded the annyang.min.js file and I don't need any internet connection for any other parts of my app. However, whenever I connect to the drone and fire up the server it will repeatedly ask for permission to use the microphone no matter how many times I press accept (unless I click deny at which point the app obviously stops working). The server is still using http and the page isn't continually reloading or anything (which would cause it to ask again) as far as I know. I don't have any other tabs open that are trying to use the microphone.

Is there any reason why this problem might be occurring and what would be the best way to fix it? I have a hunch that the problem is caused by the lack of internet connection but I can't find any information on why that would cause a problem. Has anybody experienced this issue (or a similar one before) and if so how did you fix it?

TL;DR:

my speech recognition code works when I am not connected to the drone's wifi and stops working after I connect to it.

All the code can be found on github. Let me know if I can clarify anything.


Source: (StackOverflow)