Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
37 commits
Select commit Hold shift + click to select a range
3294e31
Merge live into master
Sep 15, 2017
098b50e
Abs remove warning READY (#303)
v-ducvo Sep 15, 2017
605d346
Merge branch 'live' into master
RobStand Sep 15, 2017
e996cae
Merge branch 'live'
RobStand Sep 15, 2017
022e1f3
TextFormat references (#294)
v-ducvo Sep 15, 2017
ed7f731
Pointing to Channel Inspector topic. (#305)
v-ducvo Sep 18, 2017
8075a97
Merge live into master
Sep 18, 2017
b1dd0e8
Update to .NET topic on recognizing LUIS intents/entities (Story 1735…
Sep 19, 2017
620dcf2
Merge branch 'live' into master
RobStand Sep 19, 2017
9c355a7
Update repo config to align with latest plugins
TianqiZhang Sep 19, 2017
5368c8c
Merge branch 'live' into master
Sep 21, 2017
4433ec6
Fix link (#311)
johnd-ms Sep 21, 2017
8a8aa5f
Merge branch 'live' into master
Sep 21, 2017
adabfc2
Merge branch 'live' into master
Sep 21, 2017
5a43092
State data .NET (#317)
Sep 22, 2017
3b0b151
Merge branch 'live' into master
Sep 22, 2017
c4c4e57
Hotfixing TOC
RobStand Sep 23, 2017
a62a44b
Merge branch 'live' into master
RobStand Sep 23, 2017
9f68749
CI textformat (#309)
v-ducvo Sep 25, 2017
e86a29c
Merge branch 'live' into master
Sep 25, 2017
1ddf66c
Fix redirects (#322)
johnd-ms Sep 25, 2017
8de8c32
Merge branch 'live' into master
Sep 25, 2017
0c234ba
Conversation Designer sept 21 updates (#324)
v-ducvo Sep 26, 2017
095a291
Restapi playback states (#251)
v-ducvo Sep 26, 2017
2c88463
Web chat speech (#325)
Sep 26, 2017
cd9efe1
Merge branch 'live' into master
Sep 26, 2017
13b3f59
Release 'live' 09-26-17
Sep 26, 2017
731b237
fixed typo (#329)
matthewshim-ms Sep 27, 2017
3d0690b
Merge branch 'live' into master
Sep 27, 2017
ea748f0
Release 'live' 09-26-17 (#330)
Sep 27, 2017
dd5b24e
Community content (#321)
RobStand Sep 27, 2017
e2523cb
Merge branch 'live' into master
RobStand Sep 27, 2017
30b1851
Release 09-27-2017 community content (#331)
RobStand Sep 27, 2017
63a94e2
Change sample links to point to docs-sample directory (#332)
Sep 28, 2017
f0d01f0
Merge branch 'master' into live
RobStand Sep 28, 2017
8fe2099
Release 'live' 09-28-17
Sep 28, 2017
5fc86bd
Merge branch 'live' into live-sync-work
RobStand Oct 2, 2017
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion articles/TOC.md
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,9 @@
### [Direct Line](channel-connect-directline.md)
### [Microsoft Teams](https://msdn.microsoft.com/en-us/microsoft-teams/bots)
### [Skype](https://dev.skype.com/bots)
### [Web Chat](channel-connect-webchat.md)
### Web Chat
#### [Connect a bot to Web Chat](channel-connect-webchat.md)
#### [Enable speech in Web Chat](channel-connect-webchat-speech.md)
### [Email](channel-connect-email.md)
### [GroupMe](channel-connect-groupme.md)
### Third party channels
Expand Down
1 change: 0 additions & 1 deletion articles/bot-builder-overview-getstarted.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ ms.prod: bot-framework
ms.date: 08/04/2017
---


# Start building bots with the Bot Framework

The Bot Framework includes Bot Builder to help you develop bots. Bot Builder is an open-source SDK with support for .NET, Node.js, and REST. Using Bot Builder, you can get started and have a working bot in just a few minutes.
Expand Down
57 changes: 37 additions & 20 deletions articles/channel-connect-slack.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,19 @@ Next you will add a new Redirect URL.

![Add Redirect URL](~/media/channels/slack-RedirectURL.png)

## Create a Slack Bot User

Adding a Bot User allows you to assign a username for your bot and choose whether it is always shown as online.

1. Select the **Bot Users** tab.
2. Click **Add a Bot User**.

![Create bot](~/media/channels/slack-CreateBot.png)

Click **Add Bot User** to validate your settings, click **Always Show My Bot as Online** to **On**, and then click **Save Changes**.

![Create bot](~/media/channels/slack-CreateApp-AddBotUser.png)

## Subscribe to Bot Events

Follow these steps to subscribe to six particular bot events. By subscribing to bot events, your app will be notified of user activities at the URL you specify.
Expand All @@ -53,7 +66,7 @@ Follow these steps to subscribe to six particular bot events. By subscribing to
3. In **Request URL**, enter this URL, but replace `{YourBotHandle}` with your bot handle.
`https://slack.botframework.com/api/Events/{YourBotHandle}`
4. In **Subscribe to Bot Events**, click **Add Bot User Event**.
5. In the list of events, click Add **Bot User Event** to subscribe to these six event types:
5. In the list of events, click Add **Bot User Event** and select these six event types:
* `member_joined_channel`
* `member_left_channel`
* `message.channels`
Expand All @@ -64,47 +77,51 @@ Follow these steps to subscribe to six particular bot events. By subscribing to

![Subscribe to Events](~/media/channels/slack-EnableEvents.png)

## Create a Slack Bot User

Adding a Bot User allows you to assign a username for your bot and choose whether it is always shown as online.

1. Select the **Bot Users** tab.
2. Click **Add a Bot User**.

![Create bot](~/media/channels/slack-CreateBot.png)

Click **Add Bot User** to validate your settings, click **Always Show My Bot as Online** to **On**, and then click **Save Changes**.

![Create bot](~/media/channels/slack-CreateApp-AddBotUser.png)

## Add and Configure Interactive Messages (optional)

If your bot will use Slack-specific functionality such as buttons, follow these steps:

1. Select the **Interactive Messages** tab and click **Enable Interactive Messages**.
2. Enter https://slack.botframework.com/api/Actions as the **Request URL**.
1. Select the **Interactive Components** tab and click **Enable Interactive Components**.
2. Enter `https://slack.botframework.com/api/Actions` as the **Request URL**.
3. Click the **Enable Interactive Messages** button, and then click the **Save changes** button.

![Enable messages](~/media/channels/slack-MessageURL.png)

## Gather credentials
Select the **Basic Information** tab and scroll to the **App Credentials** section. The Client ID, Client Secret, and Verification Token required for configuration of your Slack bot are displayed.

Select the **Basic Information** tab and scroll to the **App Credentials** section.
The Client ID, Client Secret, and Verification Token required for configuration of your Slack bot are displayed.

![Gather credentials](~/media/channels/slack-AppCredentials.png)

## Submit credentials

In a separate browser window, return to the Bot Framework site at http://dev.botframework.com/.
In a separate browser window, return to the Bot Framework site at `http://dev.botframework.com/`.

1. Select **My bots** and choose the Bot that you want to connect to Slack.
2. In the **Add a channel** section, click the Slack icon.
3. In the **Enter your Slack credentials** section, paste the App Credentials from the Slack website into the appropriate fields.
4. The **Landing Page URL** is optional. You may remove or change it.
4. The **Landing Page URL** is optional. You may omit or change it.
5. Click **Save**.

![Submit credentials](~/media/channels/slack-SubmitCredentials.png)

Follow the instructions to authorize your Slack app's access to your Development Slack Team.

## Enable the bot
On the Configure Slack page, confirm the slider by the Save button is set to **Enabled**. Your bot is configured to communicate with users in Slack.
On the Configure Slack page, confirm the slider by the Save button is set to **Enabled**.
Your bot is configured to communicate with users in Slack.

## Create an Add to Slack button

Slack provides HTML you can use to help Slack users find your bot in the
*Add the Slack button* section of [this page](https://api.slack.com/docs/slack-button).
To use this HTML with your bot, replace the href value (begins with `https://`) with the URL found your bot's Slack channel settings.
Follow these steps to get the replacement URL.

1. On [https://dev.botframework.com/bots](https://dev.botframework.com/bots), click your bot.
2. Click **CHANNELS**, right-click the entry named **Slack**, and click **Copy link**. This URL is now in your clipboard.
3. Paste this URL from your clipboard into the HTML provided for the Slack button. This URL replaces the href value provided by Slack for this bot.

Authorized users can click the **Add to Slack** button provided by this modified HTML to reach your bot on Slack.

95 changes: 95 additions & 0 deletions articles/channel-connect-webchat-speech.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
---
title: Enable speech in the Web Chat channel | Microsoft Docs
description: Learn how to enable speech in the web chat control for a bot connected to the Web Chat channel.
author: DeniseMak
ms.author: v-demak
manager: rstand
ms.topic: article
ms.prod: bot-framework
ms.date: 09/22/2017
---

# How to enable speech in Web Chat
You can enable a voice interface in the Web Chat control. Users interact with the voice interface by using the microphone in the Web Chat control.

![Web chat speech sample](~/media/channel-webchat/webchat-sample-speech.png)

If the user types instead of speaking a response, Web Chat turns off the speech functionality and the bot gives only a textual response instead of speaking out loud. To re-enable the spoken response, the user can use the microphone to respond to the bot the next time. If the microphone is accepting input, it appears dark or filled-in. If it's grayed out, the user clicks on it to enable it.

## Customizing Web Chat for speech
To enable the speech functionality in Web Chat, you need to customize the JavaScript code that invokes the Web Chat control. You can try out voice-enabled Web Chat locally using the following steps:

1. Clone the <a href="https://github.com/Microsoft/BotFramework-WebChat/">Web Chat GitHub repository</a>.
2. Run `npm install`.
3. Run `npm run build` to build the dependencies and stylesheets that Web Chat requires.
4. Edit the code in `/samples/speech/index.html` according to the type of speech support you want to add. The types of speech implementations are described in [Enable speech services](#enable-speech-services).
5. Start a web server: `npm run start`
6. Aim your browser at `http://localhost:8000/samples?parameters`. For example, `http://localhost:8000/samples?s=YOURDIRECTLINESECRET` invokes the bot using a Direct Line secret. The parameters can be set in the query string and are described in the following list:

* s = Direct Line secret.
* t = Direct Line token. Obtain the token by calling Direct Line's Generate Token.
* domain = optional URL of an alternate Direct Line endpoint.
* webSocket = 'true' to use WebSocket to receive messages. The default value is false.
* userid, username = ID (and optionally name) of the bot user.
* botid, botname = ID (and optionally name) of the bot.

> [!TIP]
> For more information on how to obtain the Direct Line secret and token, see [Authentication](https://docs.microsoft.com/en-us/bot-framework/rest-api/bot-framework-rest-direct-line-3-0-authentication).

## Enable speech services
The customization allows you to add speech functionality in any of the following ways:

* **Browser-provided speech** - Use speech functionality built into the web browser. At this time, this functionality is only available on the Chrome browser.
* **Use Bing Speech service** - You can use the Bing Speech service to provide speech recognition and synthesis. This way of access speech functionality is supported by a variety of browsers. In this case, the processing is done on a server instead of on the browser.
* **Create a custom speech service** - You can create your own custom speech recognition and voice synthesis components.

### Browser-provided speech

The following code instantiates speech recognizer and speech synthesis components that come with the browser. This method of adding speech is not supported by all browsers.

> [!NOTE]
> Google Chrome supports the browser speech recognizer. However, Chrome blocks the microphone in the following cases:
> * If the URL of the page that contains Web Chat begins with `http://` instead of `https://`.
> * If the URL is a local file using the `file://` protocol instead of `http://localhost:8000`.

[!code-js[Specify speech options to use in-browser speech (JavaScript)](./includes/code/channel-connect-webchat-speech.js#BrowserSpeech)]

### Bing Speech service

The following code instantiates speech recognizer and speech synthesis components that use the Bing Speech service. The recognition and generation of speech is performed on the server. This mechanism is supported in multiple browsers.

> [!TIP]
> You can use speech recognition priming to improve your bot's speech recognition accuracy if you use the Bing Speech service. For more information, check out the [Speech Support in Bot Framework](https://blog.botframework.com/2017/06/26/Speech-To-Text) blog post.

[!code-js[Specify speech options to use the Bing Speech API (JavaScript)](./includes/code/channel-connect-webchat-speech.js#BingSpeech)]

#### Use the Bing Speech service with a token

You also have the option to enable Cognitive Services speech recognition using a token. The token is generated in a secure back end using your API key.

The following example code shows how the token fetch is done from a secure back end to avoid exposing the API key.

[!code-js[Fetch a token to use with the Bing Speech API (JavaScript)](./includes/code/channel-connect-webchat-speech.js#FetchToken)]

### Custom Speech service

You can also provide your own custom speech recognition that implements ISpeechRecognizer or speech synthesis that implements ISpeechSynthesis.

[!code-js[Fetch a token to use with a custom speech service (JavaScript)](./includes/code/channel-connect-webchat-speech.js#CustomSpeechService)]

### Pass the speech options to Web Chat

The following code passes the speech options to the Web Chat control:

[!code-js[Pass speech options to Web Chat (JavaScript)](./includes/code/channel-connect-webchat-speech.js#PassSpeechOptionsToWebChat)]

## Next steps
Now that you can enable voice interaction with Web Chat, learn how your bot constructs spoken messages and adjusts the state of the microphone:
* [Add speech to messages (C#)](https://docs.microsoft.com/en-us/bot-framework/dotnet/bot-builder-dotnet-text-to-speech)
* [Add speech to messages (Node.js)](https://docs.microsoft.com/en-us/bot-framework/nodejs/bot-builder-nodejs-text-to-speech)

## Additional resources

* You can [download the source code](https://github.com/Microsoft/BotFramework-WebChat) for the web chat control on GitHub.
* The [Bing Speech API documentation](https://docs.microsoft.com/en-us/azure/cognitive-services/speech/home) provides more information on the Bing Speech API.

12 changes: 6 additions & 6 deletions articles/conversation-designer/TOC.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@
## [Create a bot](conversation-designer-create-bot.md)
## [Save bot](conversation-designer-save-bot.md)
## [Test bot](conversation-designer-debug-bot.md)
## [Task triggers](conversation-designer-tasks.md)
### [Language Understanding](conversation-designer-luis.md)
### [Code recognizers](conversation-designer-code-recognizer.md)
## [Task actions](conversation-designer-actions.md)
## [Task dialogs](conversation-designer-dialogs.md)
## [Shared dialogs](conversation-designer-dialogs-shared.md)
## [Tasks](conversation-designer-tasks.md)
### [LUIS recognizer](conversation-designer-luis.md)
### [Code recognizer](conversation-designer-code-recognizer.md)
### [Reply action](conversation-designer-reply.md)
### [Script action](conversation-designer-script-function.md)
### [Dialogue action](conversation-designer-dialogues.md)
## [Response templates](conversation-designer-response-templates.md)
## [Adaptive cards](conversation-designer-adaptive-cards.md)
## [Connect to channels](conversation-designer-deploy.md)
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Adaptive cards | Microsoft Docs
title: Configure adaptive cards | Microsoft Docs
description: Learn how to configure adaptive cards.
author: vkannan
manager: rstand
Expand All @@ -21,9 +21,9 @@ Conversation Designer provides a deeply integrated authoring environment to auth

Adaptive cards can be defined in several different key places.

- A simple response to [action](conversation-designer-actions.md) for a task.
- In feedback state in a dialog.
- In prompt states in a dialog. Note that prompts can have separate cards: one for the response and another for re-prompting.
- A simple response to [action](conversation-designer-tasks.md) for a task.
- In feedback state in a dialogue.
- In prompt states in a dialogue. Note that prompts can have separate cards: one for the response and another for re-prompting.

To define an adaptive card, navigate to the relevant editor. Browse and choose from one of the existing Adaptive Card
Templates or build your own in the JSON code editor.
Expand All @@ -35,6 +35,36 @@ As you are building a card, a rich preview of the card is rendered in the author
> [!NOTE]
> Features of adaptive cards remain under ongoing development. All channels do not support all adaptive card features at this time. To see which features each channel supports, see the [Channel status](https://docs.microsoft.com/en-us/adaptive-cards/get-started/bots#channel-status) section.

## Input form

Adaptive cards can contain input forms. In Conversation Designer, forms are integrated with task entities. For example, if a field has an `id` of **myName** and the form `Submit` action is performed, a `taskEntity` with the name **myName** will be created and will contain the value of the field.

The code snippet below shows how the **myName** entity is defined in code:

``javascript
{
"type": "Input.Text",
"id": "myName",
"placeholder": "Last, First"
}
``

Additionally, if a field has an id of `@task` then the value of the field will be used as a task name. When this field is triggered (e.g.: a button click), then the named task will be executed.

Take this snippet code for example:

``javascript
{
'type': 'Action.Submit',
'title': 'Search',
'speak': '<s>Search</s>',
'data': {
'@task': 'Hotel Search'
}
}
``

When this button is clicked, a submit action is triggered and the `context.sticky` will be set to `Hotel Search`. This will result in the **Hotel Search** task to execute. To use this feature, make sure the `@task` matches a task name that you have defined in Conversation Designer.

## Use entities and language generation templates
Adaptive cards support full language generation resolution.
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Code recognizer | Microsoft Docs
title: Define code recognizer as task trigger | Microsoft Docs
description: Learn how to use a custom code recognizer as a task trigger.
author: vkannan
manager: rstand
Expand All @@ -9,14 +9,15 @@ ms.date: 07/04/2017
ROBOTS: NoIndex, NoFollow
---

# Code recognizer as task trigger
# Define code recognizer as task trigger
> [!IMPORTANT]
> Conversation Designer is not available to all customers yet. More details on
> availability of Conversation Designer will come later this year.

Code recognizers enable you to write custom scripts to help perform a task. Regex-based expression evaluation or calling into other services can be used to help determine the user's intent. The custom script will instruct the conversation runtime to trigger a task.

To use a script as a task trigger, choose "Script trigger" as the trigger type in the **Task** editor and then specify the name of the function that implements the custom script function. Click **Edit** to start editing the function.
## Create a script function
To use a script as a recognizer, in the task editor, choose "Script function" as the recognizer, specify the name of the function, and Click **Create/view function** to start editing a script. You can also click **Create/view function** without specifying a script name and an empty function will be created for you with the default name.

## Script trigger function parameter

Expand All @@ -43,4 +44,4 @@ module.exports.fnFindPhoneTrigger = function(context) {

## Next step
> [!div class="nextstepaction"]
> [Task actions](conversation-designer-actions.md)
> [Reply action](conversation-designer-reply.md)
Loading