# angularjs-shoe

> Use shoe with angularjs

Latest version **0.0.1** (published 2013-06-20) · BSD license · 0 weekly downloads

## Install

```sh
npm install angularjs-shoe
pnpm add angularjs-shoe
yarn add angularjs-shoe
bun add angularjs-shoe
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2013-06-20 |
| First published | 2013-06-20 |
| Weekly downloads | 0 |
| License | BSD |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 8 |
| Author | Eugene Ware |
| Maintainers | eugeneware |
| Keywords | shoe, sock, socksjs, websocket, socket.io, angularjs, angular, sockets |

## Links

- npm: https://www.npmjs.com/package/angularjs-shoe
- Repository: https://github.com/eugeneware/angularjs-shoe
- npm.io page: https://npm.io/package/angularjs-shoe

## Dependencies (2)

- [shoe](https://npm.io/package/shoe.md) 0.0.11
- [reconnect](https://npm.io/package/reconnect.md) ~1.4.2

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 0.0.1 (latest) — 2013-06-20

## README

# angularjs-shoe

An [angularjs](http://angularjs.org) module that enables you to use
[shoe](https://github.com/substack/shoe) websocket streaming in the browser
with angularjs.

This module wraps the ```shoe``` library so that any ```$scope``` mutations are
correctly wrapped with ```$rootScope.$apply``` calls so model changes are
instantly reflected in the view.

# Installation

## npm

If you're using [browserify](https://github.com/substack/node-browserify) then
install via npm:

```
$ npm install angularjs-shoe
```

and require ```angularjs-shoe``` in your ```browserify``` code:

``` js
require('angularjs-shoe');
```

## bower

If you're using [bower](http://bower.io) then install using the bower command
line:

```
$ bower install angularjs-shoe
```

## Old school

If you just want to use the client library without a package manager then
simply include the ```build/angularjs-bower.js``` or
```build/angularjs-bower.min.js``` file into your HTML:

``` html
<!DOCTYPE html>
<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    <!-- AngularJS needs to be included before -->
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>

    <!-- Then you can include the angularjs-shoe module from your project -->
    <script type="text/javascript" src="/scripts/angularjs-bower.min.js"></script>

    <!-- Then your regular angular code -->
    <script type="text/javascript" src="/scripts/client.js"></script>
  </body>
</html>
```

# Using angularjs-shoe from your AngularJS controllers

To use shoe from your controllers you simply define ```eugeneware.shoe```
as a module dependency for your app and then you can use dependency injection
to refer to the ```shoe``` or ```reconnect``` variables:

``` js
// client.js
var app = angular.module('MyApp', ['eugeneware.shoe']);

app.controller('MyCtrl', function ($scope, shoe) {
  $scope.items = [];

  var stream = shoe('/invert');
  stream.on('data', function (msg) {
    // you can mutate your $scope here and it will automatically be wrapped in
    // a $rootScope.$apply:
    $scope.items.push(msg);
  });
});
```

If you want to use ```shoe``` and have it automatically reconnect to the
```websocket``` server when there is a network disconnection then use the
```reconnect``` function:

``` js
// client.js
var app = angular.module('MyApp', ['eugeneware.shoe']);

app.controller('MyCtrl', function ($scope, reconnect) {
  $scope.items = [];

  reconnect(function (stream) {
    stream.on('data', function (msg) {
      // you can mutate your $scope here and it will automatically be wrapped in
      // a $rootScope.$apply:
      $scope.items.push(msg);
    });
  })
  .connect('/invert');
});
```

## Notes

The browser files ```build/angularjs-shoe.js``` and ```build/angularjs-shoe.min.js```
already have ```shoe``` and ```reconnect``` bundled with them so you don't need
to include them yourself.

---
_Source: https://npm.io/package/angularjs-shoe · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._