Desktop application wrapper for the Bot Framework WebChat control built using Electron.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
Images
app
src
.gitignore
LICENSE
README.md
icon.ico
tsconfig.json

README.md

Desktop Chatbot

Hosting Bot Framework's web chat control inside an Electron app to enable chatbot distribution independent from operating system & web browser.

This project was built in cooperation with a real customer. Read the whole story on my blog.

How to build it

This app is built using Electron and TypeScript. To be able to edit and build it, you need to install:

You also need to have a Bot Framework chatbot registered at the portal with DirectLine channel enabled.

Configuration

Copy your DirectLine secret from the portal and paste it to /app/botConfig.ts - value directLineSecret. Also change the rest of the configuration to suit your needs.

export const BotConfig = 
{
    header: {
        backgroundColor: "lightblue",
        textColor: "white",
        visible: false
    },

    bot: {
        directLineSecret: "Mfy7FwAXCAAACSCSAAAd.cwA.8zI.AAAANNSKKSSDJa-rQxsBxZJSsaAO0r5mqYape4",
        userId: "user",
        userName: "User",
        botId: "bot",
        botName: "Bot"
    },

    uploadButton: false,
    devMode: false
}

Then you can build and start the app:

  1. Download this repo or clone it with Git: git clone https://github.com/msimecek/Desktop-Chatbot.git
  2. cd Desktop-Chatbot/src
  3. npm install
  4. tsc -p ../
  5. npm start

Installer

To build an installer, simply run /src/js/installer.js with Node.js:

cd Desktop-Chatbot/src/js
node installer.js

It takes a few seconds, so be patient.

You will find output in the /out folder.

Remarks

Icon used by this project was made by Gregor Cresnar from https://www.flaticon.com/