Presentation wrapper for deploying chatbots including TTS, voice and 3D avatars
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
src Various fixes Aug 20, 2018
LICENSE Updated license Oct 3, 2018 Update Oct 3, 2018
webpack.config.js Corrections Jun 22, 2018

Botanic/SEED Hadron

Standalone Web Chat Client for chatbots using Botanic/SEED Token Network services.


These files are made available to you on an as-is and restricted basis, and may only be redistributed or sold to any third party as expressly indicated in the Terms of Use for Seed Vault. Seed Vault Code (c) Botanic Technologies, Inc. Used under license.

What is Hadron

Hadron is a presentation wrapper for deploying chatbots in a container that can be included in a variety of website frameworks. It includes voice recognition, text to speech and 3D avatar capabilities.

Live Demo of Hadron (SEED Bot)

Hadron has been implemented as a FAQ Bot on the Seed Token website


Part of the SEED token project. This is a sneak preview - there is more to come. See the Wiki for more information.

About the SEED Token Project

SEED democratizes AI by offering an open and independent alternative to the monopolies of a few large corporations that currently control conversational user interfaces (CUIs) and AI technologies. SEED's licensed, monetized open-source platform for bots on blockchain supports collaboration and creative compensation that will exceed the proprietary deployments from industry giants. We are also giving users back control of their personal data. Find out more about the SEED Token project at See the Connect section at the end for contact info.

How to contribute - how to get involved

Go to our Developers Garden to see all featured projects, pick one and fill out the Developer Interest Form. If you rather like to discuss ideas before rolling up your sleeves, please come visit our Discord channels for developers


  • Basic text
  • Inline HTML formatting
  • Remote CSS inclusion to enhance styles
  • Buttons
  • Buttons that open links in a separate tab
  • Embedded video
  • Does not require or need Bot Framework or Skype support
  • Frame/frameless options
  • Chat button that expands to chat window
  • Support different orientations and sizes
  • Embedded audio
  • Basic card support
  • Hadron cards
  • Support for mobile devices
  • Video recording
  • 3D Avatar support
  • Accessibility
  • Allow the client to say what is on the screen and say the name of a button that was clicked
  • Image alt tag support for accessibility
  • Make text input optional, some bots may be UI driven



Default = 150

Animation duration in milliseconds. Used for some CSS animations like bubbles appearing/disappearing.


Default = 10

Typing delay, a multiple of the animation speed. Real delay (ms) = data-bot-type-speed x data-bot-animation-speed.


Default = "Ask me anything..."

The text displayed in the text input when there is no user text present.


default = "Say Hi or Hello to start chatting"

A prompt to the user when the control opens.


Default = ""

Sends a flow ID to the server to specify a flow created by MVP


Default = "false"

Presents a frameless, chromeless chat window. e.g., no outer frame, no title bar, no avatar. A basic chat window.


Default ""

Used to deliver JSON data from the control to bot server.


Default false

If set to true, the bot will send a message to the user without the user having initiated a conversation.


Default "false"

If true, the user state is cleared and conversations start from the beginning whenever a user returns to the site.


Default "false"

Enables text to speech for bot responses.


Default "true"

Shows the TTS button in the input bar if set to true and supported by the device.


Default "true"

Shows the voice recognition button when set to true and supported by the device.


Default "false"

When true, voice recognition is on and receiving input from a user.


Default "false"

When true, recognition is on until speech has finished. The text is sent to the bot and when the bot has replied, recognition is enabled again.


Default "false"

If true, the input bar is removed and all UI interactions must be made with buttons.


Default "false"

If true, loads the 3D system up front to make the presentation more responsive.


No default

The API key used to access the chat server.


Default 32

Widens chat bubbles to accommodate for oddities in fonts, etc.


Default 6

Padding for chat bubbles


Default 0

Set to a number that represents the number of past conversations that are stored. Has not been tested.


Default "botanic-green"

A predefined CSS class for user chat bubbles. The default is botanic-green however it can also be any of the materializecss color strings.


Default "botanic-silver"

A predefined CSS class for user chat bubbles. The default is botanic-silver however it can also be any of the materializecss color strings.


Default false

If enabled, some debug info is sent to the javascript console for test purposes.


Default ""

An icon to show in the top right of chat control.


Default "false"

When true, the user sentiment is displayed beside user input.


Default "true"

Shows a refresh button in the top bar, resets the user state when clicked.


Default "false"

When true, the browser does text to speech.


Default "standard"

Sets the size of the chat window. Possible values are standard, fullscreen, fullestscreen and tall.


Defaut "true"

When true, the launcher icon pulses to draw attention.


Default "chat_bubble_outline"

An icon for the launcher.


Default ""

Defines the title for the chat window.


Default ""

Defines the subtitle for the chat window. If subtitle is empty, the top bar changes to display just the title line.


Default ""

The icon class for the close button.


Default ""

Defines an external CSS file that can override styles in Hadron. The CSS file must be served from a secure domain!


Default ""

Applies a stylesheet to Hadron. Must be served from HTTPS.


Default ""

Applies a stylesheet to the Hadron launcher. Must be served from HTTPS.


Default ""

Loads a font from Google into Hadron.

More complete example

<span class="hadron-button"
data-bot-placeholder="I'm listening..."
data-bot-welcome="Say Hello or Hi to start chatting"  
<script src="./dist/launcher.js"></script>

Building Hadron

npm install webpack --save-dev
npm install style-loader --save
npm install css-loader --save
npm install file-loader --save
npm install copy-webpack-plugin --save-dev
npm install exports-loader --save  
npm install imports-loader --save

npx webpack