voice-elements - Vaadin Add-on Directory
:speaker: Web Component wrapper to the Web Speech API, that allows you to do voice recognition and speech synthesis using Polymer
**[ This description is mirrored from README.md at [github.com/zenorocha/voice-elements](https://github.com//zenorocha/voice-elements/blob/v1.1.0/README.md) on 2019-05-10 ]**
# <voice-elements>
> Web Component wrapper to the [Web Speech API](https://dvcs.w3.org/hg/speech-api/raw-file/tip/speechapi.html), that allows you to do voice recognition (speech to text) and speech synthesis (text to speech) using [Polymer](http://www.polymer-project.org/).
## Demo
[Check it live!](http://zenorocha.github.io/voice-elements)
## Install
Install the component using [Bower](http://bower.io/):
```sh
$ bower install voice-elements --save
```
Or [download as ZIP](https://github.com/zenorocha/voice-elements/archive/gh-pages.zip).
## Usage
1. Import Web Components' polyfill:
```html
```
2. Import Custom Element:
```html
```
3. Start using it!
```html
```
## <voice-player>
Provides you a simple DOM API to do speech synthesis (text to speech).
### Options
Attribute | Options | Default | Description
--- | --- | --- | ---
`autoplay` | *boolean* | `false` | Specifies if the audio should play when page loads.
`accent` | `en-US`, `en-GB`, `es-ES`, `fr-FR`, `it-IT`, `de-DE`, `ja-JP`, `ko-KR`, `zh-CN` | `en-US` | Specifies the language to be synthesized and spoken.
`text` | *string* | `You are awesome` | Specifies the text to be synthesized and spoken.
### Methods
Method | Parameters | Returns | Description
--- | --- | --- | ---
`speak()` | None. | Nothing. | Triggers the voice audio to be played.
`cancel()` | None. | Nothing. | Triggers the voice audio to be canceled.
`pause()` | None. | Nothing. | Triggers the voice audio to be paused.
`resume()` | None. | Nothing. | Triggers the voice audio to be resumed.
### Events
Event | Description
--- | ---
`onstart` | Triggers when the voice begun to be spoken.
`onend` | Triggers when the voice completed to be spoken.
`onerror` | Triggers when the voice player detects an error.
`onpause` | Triggers when the voice player is resumed.
`onresume` | Triggers when the voice player is resumed.
## <voice-recognition>
Provides you a simple DOM API to do voice recognition (speech to text).
### Options
Attribute | Options | Default | Description
--- | --- | --- | ---
`continuous` | *boolean* | `true` | Specifies if the recognition should continue when the user pauses while speaking.
`text` | *string* | | Returns the recognized text.
### Methods
Method | Parameters | Returns | Description
--- | --- | --- | ---
`start()` | None. | Nothing. | Starts the voice recognition.
`stop()` | None. | Nothing. | Requests to recognition service to stop listening to more audio.
`abort()` | None. | Nothing. | Requests to immediately stop listening and stop recognizing.
### Events
Event | Description
--- | ---
`onstart` | Triggers when the recognition begins.
`onerror` | Triggers when there's a recognition error.
`onend` | Triggers when the recognition ends.
`onresult` | Triggers when there's a recognition result.
## Browser Support
Unfortunately, the [Web Speech API](https://dvcs.w3.org/hg/speech-api/raw-file/tip/speechapi.html) still have a poor support. Check [Can I Use](http://caniuse.com/#feat=web-speech) for more information.
![IE](https://cloud.githubusercontent.com/assets/398893/3528325/20373e76-078e-11e4-8e3a-1cb86cf506f0.png) | ![Chrome](https://cloud.githubusercontent.com/assets/398893/3528328/23bc7bc4-078e-11e4-8752-ba2809bf5cce.png) | ![Firefox](https://cloud.githubusercontent.com/assets/398893/3528329/26283ab0-078e-11e4-84d4-db2cf1009953.png) | ![Opera](https://cloud.githubusercontent.com/assets/398893/3528330/27ec9fa8-078e-11e4-95cb-709fd11dac16.png) | ![Safari](https://cloud.githubusercontent.com/assets/398893/3528331/29df8618-078e-11e4-8e3e-ed8ac738693f.png)
--- | --- | --- | --- | --- |
None ✘ | Latest ✔ | None ✘ | None ✘ | Latest (<voice-player> only) ✔ |
## Development
In order to run it locally you'll need to fetch some dependencies and a basic server setup.
1. Install [Bower](http://bower.io/) & [Grunt](http://gruntjs.com/):
```sh
$ [sudo] npm install -g bower grunt-cli
```
2. Install local dependencies:
```sh
$ bower install && npm install
```
3. To test your project, start the development server and open `http://localhost:8000`.
```sh
$ grunt server
```
4. To build the distribution files before releasing a new version.
```sh
$ grunt build
```
5. To provide a live demo, send everything to `gh-pages` branch.
```sh
$ grunt deploy
```
## Contributing
1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D
## History
For detailed changelog, check [Releases](https://github.com/zenorocha/voice-elements/releases).
## License
[MIT License](http://zenorocha.mit-license.org/) © Zeno Rocha
View on GitHubGitHub Homepage
Issue tracker
voice-elements version 0.1.0
### Dependencies
* platform#Polymer/platform#~0.2.0
* polymer#Polymer/polymer#~0.2.0
voice-elements version 0.1.1
### Dependencies
* platform#Polymer/platform#~0.2.3
* polymer#Polymer/polymer#~0.2.3
voice-elements version 0.1.2
### Dependencies
* platform#Polymer/platform#~0.2.3
* polymer#Polymer/polymer#~0.2.3
voice-elements version 0.1.3
### Dependencies
* platform#Polymer/platform#~0.3.1
* polymer#Polymer/polymer#~0.3.1
voice-elements version 0.2.0
### Dependencies
* polymer#Polymer/polymer#^0.5.1
voice-elements version 1.0.0
### Dependencies
* polymer#Polymer/polymer#^1.0.0
voice-elements version 1.1.0
### Dependencies
* polymer#Polymer/polymer#^1.0.0