I found this interesting service : API.AI which seems to be a powerful tool to have a great own “Siri-Like” service inside mobile app…
They have an Cordova Plugin but can’t find the proper way to integrate it in Angular way.
Don’t think that it’s possible to use Cordova Plugins with Ionic & ngCordova, but it will be nice to have this kind of plugins available on ngCordova.
Why can’t you use the plugin? A Cordova plugin exposes a JavaScript API. In terms of an angular way, you just need to wrap the plugin calls within an Angular Service, or call them directly (wrapped in an $ionicPlatform.ready.
Thanks for your answer ! In fact i’m trying to make it work, as i’m wrapping the calls in an $ionicPlatform.ready for now and later with Angular Services.
I will keep updated and posted if i found the proper way to make it works…
After my holidays i will code an Angular extension in the proper way with Services, but anyway, if some peoples wants to try it, please use:
ionic.Platform.ready(function (){});
instead of regular $ionicPlatform.
For example:
ionic.Platform.ready(function(){
window.ApiAIPlugin.init(
{
subscriptionKey: "", // insert your subscription key here
clientAccessToken: "", // insert your client access key here
lang: "fr" // set lang tag from list of supported languages
},
function(result) { console.log('API.AI: initialition OK') },
function(error) { /* error processing */ }
);
window.ApiAIPlugin.setListeningFinishCallback(
function(){
$ionicLoading.hide();
}
);
});
Make a button like this for example:
<button ng-click="voiceCommand();"></button>
Then:
$scope.voiceCommand = function (){
$ionicLoading.show({
template: '<ion-spinner icon="lines"></ion-spinner><br>You can speak to me ! ...'
});
ionic.Platform.ready(function(){
try {
window.ApiAIPlugin.requestVoice(
{}, // empty for simple requests, some optional parameters can be here
function (response) {
// place your result processing here
alert(JSON.stringify(response));
},
function (error) {
// place your error processing here
alert(error);
});
} catch (e) {
alert(e);
}
});
};
OK it’s a basic think. But anyway if this can help someone to implement Api.Ai.
For some reason, I’m not able to run ‘ionic build ios’ with the API.AI cordova plugin installed. Here’s the error messaging:
Running command: /Users/james/Code/gray/hooks/after_prepare/010_add_platform_class.js /Users/james/Code/gray add to body class: platform-ios Running command: /Users/james/Code/gray/hooks/after_prepare/020_remove_sass_from_platforms.js /Users/james/Code/gray Running command: /Users/james/Code/gray/platforms/ios/cordova/build Building project : /Users/james/Code/gray/platforms/ios/gray.xcodeproj Configuration : Debug Platform : emulator Build settings from command line: ARCHS = i386 CONFIGURATION_BUILD_DIR = /Users/james/Code/gray/platforms/ios/build/emulator SDKROOT = iphonesimulator8.4 SHARED_PRECOMPS_DIR = /Users/james/Code/gray/platforms/ios/build/sharedpch VALID_ARCHS = i386 Build settings from configuration file ‘/Users/james/Code/gray/platforms/ios/cordova/build-debug.xcconfig’: CODE_SIGN_IDENTITY = iPhone Developer CODE_SIGN_RESOURCE_RULES_PATH = $(SDKROOT)/ResourceRules.plist 2015-08-20 18:38:37.259 xcodebuild[55053:829479] CFPropertyListCreateFromXMLData(): Old-style plist parser: missing semicolon in dictionary on line 66. Parsing will be abandoned. Break on _CFPropertyListMissingSemicolon to debug. 2015-08-20 18:38:37.260 xcodebuild[55053:829479] CFPropertyListCreateFromXMLData(): Old-style plist parser: missing semicolon in dictionary on line 66. Parsing will be abandoned. Break on _CFPropertyListMissingSemicolon to debug. 2015-08-20 18:38:37.317 xcodebuild[55053:829479] The data couldn’t be read because it isn’t in the correct format. xcodebuild: error: Unable to read project ‘gray.xcodeproj’. Reason: Project /Users/james/Code/gray/platforms/ios/gray.xcodeproj cannot be opened because the project file cannot be parsed. Error code 74 for command: xcodebuild with args: -xcconfig,/Users/james/Code/gray/platforms/ios/cordova/build-debug.xcconfig,-project,gray.xcodeproj,ARCHS=i386,-target,gray,-configuration,Debug,-sdk,iphonesimulator,build,VALID_ARCHS=i386,CONFIGURATION_BUILD_DIR=/Users/james/Code/gray/platforms/ios/build/emulator,SHARED_PRECOMPS_DIR=/Users/james/Code/gray/platforms/ios/build/sharedpch ERROR building one of the platforms: Error: /Users/james/Code/gray/platforms/ios/cordova/build: Command failed with exit code 2 You may not have the required environment or OS to build this project Error: /Users/james/Code/gray/platforms/ios/cordova/build: Command failed with exit code 2 at ChildProcess.whenDone (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/cordova/superspawn.js:139:23) at ChildProcess.emit (events.js:110:17) at maybeClose (child_process.js:1015:16) at Process.ChildProcess._handle.onexit (child_process.js:1087:5)
I experienced kind of same issues with others plugins. Sometimes the plugin is not proper installed and make the thing crash.
Could you please keep me updates or give me any feedback with the iOS platform ? It’s cool to have some opinions from differents devs on differents projects.
I’m having trouble getting API.AI to work in my ionic project I just keep getting the error ApiAiPlugin not defined or cannot call init on undefined. It’s been a pain trying to get it to work but if you have a sample project with the plugin working that would be a massive help. I’m testing it on my android device using ionic view. Thanks.
So I’ve changed the code to follow your post above. In my app.js I have
.run(function($ionicPlatform, GoogleMaps) {
ionic.Platform.ready(function(){ // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if (window.StatusBar) {
// org.apache.cordova.statusbar required
StatusBar.styleDefault();
}
GoogleMaps.init();
window.ApiAIPlugin.init(
{
subscriptionKey: "cb9693af-85ce-4fbf-844a-5563722fc27f", // insert your subscription key here
clientAccessToken: "3485a96fb27744db83e78b8c4bc9e7b7", // insert your client access key here
lang: "en" // set lang tag from list of supported languages
},
function(result) { console.log('API.AI: initialition OK') },
function(error) { /* error processing */ }
);
window.ApiAIPlugin.setListeningFinishCallback(
function(){
$ionicLoading.hide();
}
);
});
})
and my controller.js file now has this controller
// EVERYTHING TO DO WITH Speech
app.controller('voiceCtrl', function($scope, $ionicPopup, $ionicLoading) {
$scope.voiceCommand = function (){
$ionicLoading.show({
template: '<ion-spinner icon="lines"></ion-spinner><br>You can speak to me ! ...'
});
ionic.Platform.ready(function(){
try {
window.ApiAIPlugin.requestVoice(
{}, // empty for simple requests, some optional parameters can be here
function (response) {
// place your result processing here
alert(JSON.stringify(response));
},
function (error) {
// place your error processing here
alert(error);
});
} catch (e) {
alert(e);
}
});
};
});
I now get the error Uncaught TypeError: Cannot read property ‘init’ of undefined. Type Error cannot read requestVoice of undefined. And the $ionicLoading wheel keeps spinning.