How to do Autocomplete text suggestion in message box in BOT - azure

I created a BOT with LUIS and node.js and also published in Skype Channel.
Now I wants to add Autocomplete text suggestion in message box.
Am unable to find documentation for node.js
Please assist me.

Autcomplete can be accomplished with a few different NPM packages. Here's one as an example that looks not too bad to implement: https://www.npmjs.com/package/autocompleter
Code example:
var countries = [
{ label: 'United Kingdom', value: 'UK' },
{ label: 'United States', value: 'US' }
];
autocomplete({
input: document.getElementById("country"),
fetch: function(text, update) {
text = text.toLowerCase();
// you can also use AJAX requests instead of preloaded data
var suggestions = countries.filter(n => n.label.toLowerCase().startsWith(text))
update(suggestions);
},
onSelect: function(item) {
alert(item.value); // will display 'US' or 'UK'
}
});
You'll obviously have to adapt this to your needs and exact use case, but should be easy enough to implement.

Related

Mutable Value in Firebase Push Notification Node.js 10 correct syntax?

I am trying to add Mutable_Content to my push notifications so I can add a badge count.
However I am running into the error:
Messaging payload contains an invalid value for the "notification.mutable_content" property. Values must be strings.
Here is my code for the payload:
const payload = {
notification : {
title: owner + ' has made a post',
body: title + ' - ' + caption,
mutable_content : true
},
};
I have tried many different tutorials to figure out the right syntax but it is not working.
It always comes up with an error.
I am using node.js 10 for the engine and firebase/google cloud platform to trigger the function.
Can anyone help me with this syntax?
Thank you
I had the same question and found unrelated and outdated firebase documentation about it. But you can bypass this by adding a apns field where you can directly put data for the apple notification service. But beware to use the apple syntax with hyphen.
See also: https://developer.apple.com/documentation/usernotifications/setting_up_a_remote_notification_server/generating_a_remote_notification
var message = {
notification: {
title: "my notification title",
body: "hello"
},
apns: {
payload: {
aps: {
'mutable-content': true
}
}
},

How to sort a list on Google-Actions/Dialogflow?

I would like to know how you can sort the OptionItems in the list of Google DialogFlow. It seems that they are automatically sorted by the key of their OptionItem. I just want them displayed on the list in the order I push them in the list, so no auto-sorting would be best.
I got following code how I create an OptionItem:
const optionItems:{[key: string]: OptionItem} = {}
optionItems[outlet.outlet_id] = {
synonyms: [
outlet.outlet_id,
],
title: outletOptionItemTitleText,
description: outletOptionItemDescriptionText,
image: {
url: outletOptionItemImageUrlText,
accessibilityText: outletOptionItemImageAccessibilityTextText,
},
}
The optionItems are passed as parameter to the List Object of Google DialogFlow like below:
conv.close(showAvailabilityText,new List({
items: optionItems,
}))
Can I pass another parameter to influence the order of the list? Or anything else?

Suggestions are not working in actions on google

I create a chat bot using dialogflow and actions on google library. In the back-end code I have created function including if else. I added new suggestions in the "else if". That are not display in the actions on google simulator.Another suggestions are working. Only that time it is not displayed. Please give me some instructions for fixed that.
this is my code:
'use strict';
const functions = require('firebase-functions');
const {
dialogflow,
Suggestions,
Carousel,
Image,
Table,
List,
} = require('actions-on-google');
const app = dialogflow({debug: true});
// Constants for list and carousel selection
const Order_Food = 'order food';
const Extra_Product = 'extra product';
const Spa_Reservation = 'spa reservation';
const Restaurant_Booking = 'restaurant booking';
app.intent('user.provide_room_number', (conv) => {
conv.ask('Great! I can help you with the following. Please select
from the options below.');
//conv.ask(new Suggestions('Order Food', 'Extra Product',
'Restaurant', 'Spa'));
// Create a carousel
conv.ask(new Carousel({
items: {
// Add the first item to the carousel
[Order_Food]: {
synonyms: [
'order food',
'food',
],
title: 'Food',
description: 'Can order some food',
image: new Image({
url: 'http://www.restauranteelpalacete.com/wp-content/uploads/2018/01/Online-Food-Ordering.jpg',
alt: 'Food',
}),
},
// Add third item to the carousel
[Spa_Reservation]: {
synonyms: [
'spa',
'spa reservation',
],
title: 'Spa Reservation',
description: 'Can put the reservation on the spa.',
image: new Image({
url: 'https://res.klook.com/images/fl_lossy.progressive,q_65/c_fill,w_1295,h_720,f_auto/w_80,x_15,y_15,g_south_west,l_klook_water/activities/kykzulvt1t71kwhnmkik/OasisSpa.jpg',
alt: 'Spa',
}),
},
// Add fourth item to the carousel
[Restaurant_Booking]: {
synonyms: [
'restaurant',
'restaurant booking',
],
title: 'Restaurant',
description: 'Can put the reservation on the Restaurant.',
image: new Image({
url: 'https://cdn-image.foodandwine.com/sites/default/files/1501607996/opentable-scenic-restaurants-marine-room-FT-BLOG0818.jpg',
alt: 'Restaurant',
}),
},
},
}));
});
app.intent('actions_intent_OPTION-handler', (conv, params, option) => {
// Get the user's selection
// Compare the user's selections to each of the item's keys
if (!option) {
conv.ask('You did not select any item from the list or carousel');
} else if (option === 'order food') {
conv.ask(new SimpleResponse({speech:"Absolutely, have you decided what you like or you could go through the in room dinning menu. \n Do you need order Food.?",text:"Absolutely, have you decided what you like or you could go through the in room dinning menu. Do you need order Food.?"}));
conv.ask(new Suggestions(["Ok", "Done", "Thanks"]));
} else if (option === 'spa reservation') {
conv.ask(new Suggestions('Yes I need Spa.'));
conv.ask(`We have an excellent Spa that offer exquisite treatment packages. You can select one of the options. We have quite a few free slots today. Do you need information about that.`);
} else if (option === 'restaurant booking') {
conv.ask(`We have some dining options for you today. Do you want more information. `);
conv.ask(new Suggestions('I need restaurant.'));
} else {
conv.ask('You selected an unknown item from the list, or carousel');
}
});
You should design your conversation bot more efficiently.In second elseif condition, after a suggestion no further conversation should happen in an intent.Suggestion are for triggering intent. For your case best scenario would be to create a follow up intent.
Suggestion is not appearing in conversation because, in every rich response at least one simple response should be present. Try below code. Hope this helps you.
conv.ask(new SimpleResponse({speech:"Absolutely, have you decided what you like or you could go through the in room dinning menu. \n Do you need order Food.?",text:"Absolutely, have you decided what you like or you could go through the in room dinning menu. Do you need order Food.?"}));
conv.ask(new Suggestions(["Ok", "Done", "Thanks"]));

Container Builder Slack Notifications

we're testing out CB and part of our requirements is sending messages to Slack.
This tutorial works great, but it'd be helpful if we could specify the source of the build, so we don't have to click in to the message to see what repo/trigger failed/succeeded.
Is there a variable we can pass to the cloud function in the tutorial? I couldn't find helpful documentation.
Ideally, it would be great if CB had an integration/slack GUI that made these options configurable but c'est la vie.
You can add source information to the slack message by adding a new item to the fields list within the createSlackMessage function. You need to make sure title and value are strings.
// createSlackMessage create a message from a build object.
const createSlackMessage = (build) => {
let message = {
text: `Build \`${build.id}\``,
mrkdwn: true,
attachments: [
{
title: 'Build logs',
title_link: build.logUrl,
fields: [{
title: 'Status',
value: build.status
},{
title: 'Source',
value: JSON.stringify(build.source, null, 2)
}]
}
]
};
return message
}
You can find more information on build object here.

Fetch Backbone collection with search parameters

I'd like to implement a search page using Backbone.js. The search parameters are taken from a simple form, and the server knows to parse the query parameters and return a json array of the results. My model looks like this, more or less:
App.Models.SearchResult = Backbone.Model.extend({
urlRoot: '/search'
});
App.Collections.SearchResults = Backbone.Collection.extend({
model: App.Models.SearchResult
});
var results = new App.Collections.SearchResults();
I'd like that every time I perform results.fetch(), the contents of the search form will also be serialized with the GET request. Is there a simple way to add this, or am I doing it the wrong way and should probably be handcoding the request and creating the collection from the returned results:
$.getJSON('/search', { /* search params */ }, function(resp){
// resp is a list of JSON data [ { id: .., name: .. }, { id: .., name: .. }, .... ]
var results = new App.Collections.SearchResults(resp);
// update views, etc.
});
Thoughts?
Backbone.js fetch with parameters answers most of your questions, but I put some here as well.
Add the data parameter to your fetch call, example:
var search_params = {
'key1': 'value1',
'key2': 'value2',
'key3': 'value3',
...
'keyN': 'valueN',
};
App.Collections.SearchResults.fetch({data: $.param(search_params)});
Now your call url has added parameters which you can parse on the server side.
Attention: code simplified and not tested
I think you should split the functionality:
The Search Model
It is a proper resource in your server side. The only action allowed is CREATE.
var Search = Backbone.Model.extend({
url: "/search",
initialize: function(){
this.results = new Results( this.get( "results" ) );
this.trigger( "search:ready", this );
}
});
The Results Collection
It is just in charge of collecting the list of Result models
var Results = Backbone.Collection.extend({
model: Result
});
The Search Form
You see that this View is making the intelligent job, listening to the form.submit, creating a new Search object and sending it to the server to be created. This created mission doesn't mean the Search has to be stored in database, this is the normal creation behavior, but it does not always need to be this way. In our case create a Search means to search the DB looking for the concrete registers.
var SearchView = Backbone.View.extend({
events: {
"submit form" : "createSearch"
},
createSearch: function(){
// You can use things like this
// http://stackoverflow.com/questions/1184624/convert-form-data-to-js-object-with-jquery
// to authomat this process
var search = new Search({
field_1: this.$el.find( "input.field_1" ).val(),
field_2: this.$el.find( "input.field_2" ).val(),
});
// You can listen to the "search:ready" event
search.on( "search:ready", this.renderResults, this )
// this is when a POST request is sent to the server
// to the URL `/search` with all the search information packaged
search.save();
},
renderResults: function( search ){
// use search.results to render the results on your own way
}
});
I think this kind of solution is very clean, elegant, intuitive and very extensible.
Found a very simple solution - override the url() function in the collection:
App.Collections.SearchResults = Backbone.Collection.extend({
urlRoot: '/search',
url: function() {
// send the url along with the serialized query params
return this.urlRoot + "?" + $("#search-form").formSerialize();
}
});
Hopefully this doesn't horrify anyone who has a bit more Backbone / Javascript skills than myself.
It seems the current version of Backbone (or maybe jQuery) automatically stringifies the data value, so there is no need to call $.param anymore.
The following lines produce the same result:
collection.fetch({data: {filter:'abc', page:1}});
collection.fetch({data: $.param({filter:'abc', page:1})});
The querystring will be filter=abc&page=1.
EDIT: This should have been a comment, rather than answer.

Resources