# Getting Started

First, create an account at [engaugeab.com](https://engaugeab.com) and get an API key.

## Installation
Install the Engauge tracking snippet

With NPM:   
`npm install engauge --save`   

## Setup
Here is a simple example for setting up an experiment with jQuery:   

###Create a new Engauge object, passing in your Api key   
	
	var apiKey = 'yourAccountApiKey';
	var engauge = new Engauge(apiKey);

###Define the variations

	var experiment = engauge.experiment({
		name: 'signup-button',
		variants: {
			'#ff5722': {
				activate: function() {
					console.info('you\'re about to see version A of \"Try it Free\" button, color #ff5722 ...');
					$('#signup-col').html('<button id="signup-button" class="btn btn-raised btn-lg btn-warning">Try it Free</button>');
				}
			},
			'#9c27b0': {
				activate: function() {
					console.info('You\'re about to see version B of \"Try it Free\" button, color #9c27b0 ...');
					$('#signup-col').html('<button id="signup-button" class="btn btn-raised btn-lg btn-warning-b">Try it Free</button>');
				}
			}
		}
	});

* You can assign any function to the `activate` method for each variation.
* Protip: if you name your goal any valid css color, the chart in the dashboard will be colored accordingly.
* Experiment names must be unique.

###Define a goal

	var button_clicked_goal = engauge.goal('button clicked');
	$('#signup-button').on('click', function() {
		button_clicked_goal.complete();
	});
* The chosen variant will be tied to the goal automatically.

###Plug the goal into the experiment
	
	button_clicked_goal.add_experiment(experiment);

###Full Example
	function initEngauge() {
		var apiKey = 'test';
		var engauge = new Engauge(apiKey);
		var experiment = engauge.experiment({
			name: 'signup-button',
			variants: {
				'#ff5722': {
					activate: function() {
						console.info('you\'re about to see version A of \"Try it Free\" button, color #ff5722 ...');
						$('#signup-col').html('<button id="signup-button" class="btn btn-raised btn-lg btn-warning">Try it Free</button>');
					}
				},
				'#9c27b0': {
					activate: function() {
						console.info('You\'re about to see version B of \"Try it Free\" button, color #9c27b0 ...');
						$('#signup-col').html('<button id="signup-button" class="btn btn-raised btn-lg btn-warning-b">Try it Free</button>');
					}
				}
			}
		});
		var button_clicked_goal = engauge.goal('button clicked');
		$('#signup-button').on('click', function() {
			button_clicked_goal.complete();
		});
		
		button_clicked_goal.add_experiment(experiment);
	}
	initEngauge();