<horn-chart>

A Web Component that displays the notes available on a trumpet or a trombone with optional highlighting of scales

Demo

Install the component using Bower:

$ bower install horn-chart --save

Import Web Components' polyfill:

<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>

Import Custom Element:

<link rel="import" href="bower_components/horn-chart/dist/horn-chart.html">

If either key or showScale attributes are present, then a scale will be shown on the position chart.

Attribute	Options	Default	Description
`key`	string	`C`	Selects a key whose scale tones should be rendered on the scale.
`showScale`	string	`major`	Selects a key whose scale tones should be rendered on the scale.
`instrument`	string	`trombone`	The type of horn to render. Options are `trombone` and `trumpet`. Notes are transposed for trumpet since it's a Bb instrument.
`scaleLabel`	string	`degrees`	When a scale is rendered on the chart, scaleLabel can be set to `notes` to display the notes of the scale, rather than the default degrees (I, IV etc).
`info`	string	`false`	Set to true to display a header with some info describing the scale. Mostly used for demo usage.

In order to run it locally you'll need to fetch some dependencies and a basic server setup.

Install Bower & Grunt:
```
$ [sudo] npm install -g bower grunt-cli
```
Install local dependencies:
```
$ bower install && npm install
```
To test your project, start the development server and open http://localhost:8000.
```
$ grunt server
```
To build the distribution files before releasing a new version.
```
$ grunt build
```
To provide a live demo, send everything to gh-pages branch.
```
$ grunt deploy
```

For detailed changelog, check Releases.