<commit_before># Angular Snap.js ![Build Status](https://api.travis-ci.org/jtrussell/angular-snap.js.png "Build Status")

> Angular directive for [Snap.js](https://github.com/jakiestfu/Snap.js). 

_(work in progress)_

## What is it?

A pretty thin wrapper around [snap.js](https://github.com/jakiestfu/Snap.js) plus some handy styles to make everything work out of the box.

## Directives Usage

This package provides a `snap` module which you'll need to add as a dependency
to your app, i.e.

```javascript
angular.module('myApp', ['snap']);
```

The snap module provides three directives: `snap-shelf`, `snap-shelves`, and
`snap-content`.

__NOTE__: Built files are not included in this repo but can be found [here](https://github.com/jtrussell/angular-snap.js-bower).

### `snap-shelf`

Tack this onto the element containing your navigation content:

```html
<div snap-shelf>
  <p>I'm a shelf! I maybe I've got some sweet navigation links.</p>
</div>
```

By default shelves show up on the left side of the page, use the class `right`
to get a right-aligned shelf:

```html
<div snap-shelf class="right">
  <p>Hi! I'm a right-aligned shelf!</p>
</div>
```

### `snap-shelves`

Multiple shelves must be wrapped in an element sporting the `snap-shelves`
directive:

```html
<div snap-shelves>
  <div snap-shelf>
    I'm a left shelf!
  </div>
  <div snap-shelf class="right">
    I'm a right shelf!
  </div>
</div>
```

Actually, all `snap-shelf` elements must be wrapped in a `snap-shelves` element.
This just happens automatically when you have a single shelf.

### `snap-content`

Your main content goes here, this is the stuff you slide left or right to make
your `snap-shelf`s visible.

```html
<div snap-shelf>...</div>

<div snap-content>
  <p>Hello! I'm your main content!</p>
</div>
```

You can pass initialization parameters to the `Snap` constructor using the
`snap-options` attribute on the same element with the `snap-contents` directive.

In your controller:

```javascript
$scope.opts = {
  disable: 'right'
};
```

In your view:

```html
<div snap-contents snap-options="opts">...</div>
```

## Live Examples

_(more coming soon)_

For now, check out our gh-pages. The source is not minified.

## License

Copyright 2013 <NAME>

Licensed under the MIT License<commit_msg>test: Read 'KARMA_BROWSER' proc var in grunt karma task<commit_after># Angular Snap.js ![Build Status](https://api.travis-ci.org/jtrussell/angular-snap.js.png "Build Status")

> Angular directive for [Snap.js](https://github.com/jakiestfu/Snap.js). 

_(work in progress)_

## What is it?

A pretty thin wrapper around [snap.js](https://github.com/jakiestfu/Snap.js) plus some handy styles to make everything work out of the box.

## Directives Usage

This package provides a `snap` module which you'll need to add as a dependency
to your app, i.e.

```javascript
angular.module('myApp', ['snap']);
```

The snap module provides three directives: `snap-shelf`, `snap-shelves`, and
`snap-content`.

__NOTE__: Built files are not included in this repo but can be found [here](https://github.com/jtrussell/angular-snap.js-bower).

### `snap-shelf`

Tack this onto the element containing your navigation content:

```html
<div snap-shelf>
  <p>I'm a shelf! I maybe I've got some sweet navigation links.</p>
</div>
```

By default shelves show up on the left side of the page, use the class `right`
to get a right-aligned shelf:

```html
<div snap-shelf class="right">
  <p>Hi! I'm a right-aligned shelf!</p>
</div>
```

### `snap-shelves`

Multiple shelves must be wrapped in an element sporting the `snap-shelves`
directive:

```html
<div snap-shelves>
  <div snap-shelf>
    I'm a left shelf!
  </div>
  <div snap-shelf class="right">
    I'm a right shelf!
  </div>
</div>
```

Actually, all `snap-shelf` elements must be wrapped in a `snap-shelves` element.
This just happens automatically when you have a single shelf.

### `snap-content`

Your main content goes here, this is the stuff you slide left or right to make
your `snap-shelf`s visible.

```html
<div snap-shelf>...</div>

<div snap-content>
  <p>Hello! I'm your main content!</p>
</div>
```

You can pass initialization parameters to the `Snap` constructor using the
`snap-options` attribute on the same element with the `snap-contents` directive.

In your controller:

```javascript
$scope.opts = {
  disable: 'right'
};
```

In your view:

```html
<div snap-contents snap-options="opts">...</div>
```

The `snap-contents` directive will watch your `snap-options` object for runtime
changes and update itself as you make them.

## Live Examples

_(more coming soon)_

For now, check out our gh-pages. The source is not minified.

## License

Copyright 2013 <NAME>

Licensed under the MIT License
{'fraction_non_alphanumeric': 0.1335580366547293, 'fraction_numerical': 0.0016852749104697704, 'mean_word_length': 4.14409534127844, 'pattern_counts': {'":': 0, '<': 49, '<?xml version=': 0, '>': 51, 'https://': 8, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1904672', 'n_tokens_mistral': 1628, 'n_tokens_neox': 1535, 'n_words': 589}