Skip to content

Commit f1c1228

Browse files
committed
Lots of documentation improvements.
Added DSLocalStorageAdapter.
1 parent 87a9652 commit f1c1228

File tree

18 files changed

+715
-73
lines changed

18 files changed

+715
-73
lines changed

dist/angular-data.js

Lines changed: 216 additions & 35 deletions
Large diffs are not rendered by default.

dist/angular-data.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

guide/angular-data-mocks/overview.doc

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@
33
@name Overview
44
@description
55

6-
Angular-data is a fake angular-data implementation suitable for unit testing angular applications that use the `angular-data.DS` module.
6+
Angular-data-mocks is a fake angular-data implementation suitable for unit testing angular applications that use the `angular-data.DS` module.
77

8-
__Version:__ 0.3.0
8+
__Version:__ 0.3.2
99

1010
__angular-data-mocks requires [sinon](http://sinonjs.org/) to be loaded in order to work.__
1111

guide/angular-data-mocks/setup.doc

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,37 @@
33
@name Setting Up
44
@description
55

6-
TODO: Explain how to set up angular tests to use angular-data-mocks.
6+
Angular-data-mocks works just like [angular-mocks](https://docs.angularjs.org/api/ngMock). Angular-data-mocks simply needs
7+
to be loaded after angular, angular-mocks, and angular-data in your tests. After you declare your test module, and before
8+
you create the injector, activate angular-data-mocks by calling `module('angular-data.mocks')`.
9+
10+
## Example (Mocha)
11+
`karma.start.js`
12+
13+
```js
14+
var DS, DSHttpAdapter;
15+
16+
angular.module('myApp', ['angular-data.DS']);
17+
18+
beforeEach(function () {
19+
angular.mocks.module('myApp');
20+
});
21+
22+
beforeEach(function () {
23+
angular.mocks.module('angular-data.mocks');
24+
});
25+
26+
beforeEach(function (done) {
27+
inject(function (_DS_, _DSHttpAdapter_) {
28+
DS = _DS_;
29+
DSHttpAdapter = _DSHttpAdapter_;
30+
31+
done();
32+
});
33+
});
34+
```
35+
36+
If you're using [KarmaJS](http://karma-runner.github.io/0.12/index.html) to test your app, look through the tests in the
37+
[angular-data-mocks repo](https://github.com/jmdobry/angular-data-mocks) for an example Karma setup.
738

839
Refer to the [angular-data-mocks API](/documentation/api/angular-data-mocks/angular-data-mocks) for more detailed information.

guide/angular-data-mocks/testing.doc

Lines changed: 56 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,61 @@
33
@name Testing
44
@description
55

6-
TODO: Explain how to use angular-data-mocks in angular tests.
6+
Once you're setup to test using angular-data-mocks you can use it much like `$httpBackend`. For the asynchronous methods
7+
you declare expectations and then flush pending requests.
8+
9+
## Example:
10+
`app.js`:
11+
12+
```js
13+
angular.module('testApp', ['angular-data.DS'])
14+
.controller('MyCtrl', function ($scope, DS) {
15+
'use strict';
16+
DS.find('post', 45);
17+
18+
$scope.update = function (attrs) {
19+
return DS.update('post', 45, attrs);
20+
}
21+
});
22+
```
23+
24+
`test.js`:
25+
26+
```js
27+
describe('test', function () {
28+
var MyCtrl, $scope;
29+
30+
beforeEach(function (done) {
31+
$scope = $rootScope.$new();
32+
33+
DS.expectFind('post', 45).respond({
34+
author: 'John Anderson',
35+
id: 5
36+
});
37+
38+
inject(function ($controller) {
39+
MyCtrl = $controller('MyCtrl', {
40+
$scope: $scope,
41+
DS: DS
42+
});
43+
44+
DS.flush();
45+
46+
done();
47+
});
48+
});
49+
50+
it('should update the post', function () {
51+
DS.expectUpdate('post', 45, { author: 'Sally' })
52+
.respond({ id: 5, author: 'Sally' });
53+
54+
$scope.update().then(function (post) {
55+
assert.deepEqual(post, { id: 5, author: 'Sally' });
56+
});
57+
58+
DS.flush();
59+
});
60+
});
61+
```
762

863
Refer to the [angular-data-mocks API](/documentation/api/angular-data-mocks/angular-data-mocks) for more detailed information.

guide/angular-data/adapters/adapters.doc

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,37 @@
1111
@id overview
1212
@name Overview of adapters
1313
@description
14+
15+
Angular-data ships with a `DSHttpAdapter` and a `DSLocalStorageAdapter`. This is default adapter
16+
used for `DS.findAll`, `DS.update`, etc.
17+
18+
Register a custom adapter:
19+
```js
20+
DS.adapters.myCustomAdapter = { ... };
21+
```
22+
23+
Other available adapters:
24+
25+
- [DSLocalStorageAdapter](https://github.com/jmdobry/angular-data/blob/master/src/adapters/localStorage.js)
26+
- [DSLocalForageAdapter](https://github.com/jmdobry/angular-data-localForage)
27+
28+
The default adapter can be set globally:
29+
30+
```js
31+
DSProvider.defaults.defaultAdapter = 'DSHttpAdapter';
32+
```
33+
34+
per resource:
35+
36+
```js
37+
DS.defineResource({
38+
name: 'user',
39+
defaultAdapter: 'DSLocalForageAdapter'
40+
});
41+
``
42+
43+
per method
44+
45+
```js
46+
DS.update('post', 45, { author: 'Sally' }, { adapter: 'DSLocalForageAdapter' });
47+
```

guide/angular-data/asynchronous.doc

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,10 @@ The asynchronous methods return Promises produced by Angular's `$q` service.
1111
Example:
1212

1313
```js
14+
// synchronous
1415
DS.get('document', 45); // undefined
1516

17+
// asynchronous
1618
DS.find('document', 45).then(function (document) {
1719
document; // { title: 'How to Cook', id: 45 }
1820

@@ -40,4 +42,4 @@ DS.save('document', 45).then(function (document) {
4042
DS.get('document', 45); // { title: 'How to Cook', id: 45 }
4143
```
4244

43-
See the [API](/documentation/api/api/index) for more information.
45+
See the [DS API](/documentation/api/angular-data/DS) for more information.

guide/angular-data/how.doc

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,50 @@
11
@doc overview
22
@id how
3-
@name How do I...?
3+
@name How do I?
44
@description
55

66
#### How do I serialize data before it's saved?
7+
Before the data store sends date to an adapter, you may need to transform it to a custom request object of yours.
8+
9+
Define a global serialization method:
710
```js
8-
DSHttpAdapter.defaults.serialize = function (data) {
11+
DSProvider.defaults.serialize = function (resourceName, data) {
912
// custom payload format
1013
return {
1114
payload: data
1215
};
1316
};
1417
```
1518

19+
Define a serialization method for a specific resource:
20+
```js
21+
DS.defineResource({
22+
name: 'user',
23+
serialize: function (resourceName, user) {
24+
return {
25+
payload: user
26+
};
27+
}
28+
});
29+
```
30+
1631
#### How do I deserialize data?
32+
When an adapter returns data to the data store from the server, for example, you may need to extract data from a custom response object of yours.
33+
34+
Define a global deserialization method:
1735
```js
18-
DSHttpAdapter.defaults.deserialize = function (data) {
36+
DSProvider.defaults.deserialize = function (resourceName, data) {
1937
// extract data from custom payload format
2038
return data ? data.payload : data;
2139
};
2240
```
41+
42+
Define a deserialization method for a specific resource:
43+
```js
44+
DS.defineResource({
45+
name: 'user',
46+
deserialize: function (resourceName, data) {
47+
return data.data.embedded;
48+
}
49+
});
50+
```

guide/angular-data/overview.doc

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@
44
@description
55

66
Angular-data is an in-browser data store for [Angular.js](http://angularjs.org).
7-
[Synchronous methods](/documentation/guide/synchronous/index) work only with data already in the data store, and
8-
[asynchronous methods](/documentation/guide/asynchronous/index) work with a persistence layer.
7+
[Synchronous methods](/documentation/guide/angular-data/synchronous) work only with data already in the data store, and
8+
[Asynchronous methods](/documentation/guide/angular-data/asynchronous) work with a persistence layer.
99

1010
<p>
1111
<img src="/resources/img/chart.png" width="940">
@@ -15,7 +15,7 @@ Angular-data is an in-browser data store for [Angular.js](http://angularjs.org).
1515
```js
1616
angular.module('myApp', ['angular-data.DS'])
1717
.config(function (DSProvider) {
18-
DSProvider.defaults.baseUrl = 'https://example.com/api';
18+
DSProvider.defaults.baseUrl = '/api';
1919
})
2020
.run(function (DS) {
2121
DS.defineResource({
@@ -25,16 +25,21 @@ angular.module('myApp', ['angular-data.DS'])
2525
});
2626
})
2727
.controller('PostCtrl', function ($scope, DS) {
28-
var query = {
29-
query: {
30-
where: {
31-
author: 'John Anderson'
32-
}
33-
}
34-
};
28+
var params = {
29+
query: {
30+
where: {
31+
author: {
32+
'==': 'John Anderson'
33+
}
34+
}
35+
}
36+
};
3537

36-
DS.findAll('post', query);
38+
DS.findAll('post', params);
3739

40+
DS.bindAll($scope', 'posts', 'post', params);
41+
42+
// Verbose way of doing the bindAll() above, but gives more control
3843
$scope.$watch(function () {
3944
return DS.lastModified('post');
4045
}, function () {
@@ -54,7 +59,7 @@ $scope.posts; // [{ id: 1, author: 'John Anderson', title: 'How to cook' },
5459

5560
You define _resources_ and register them with the data store. A _resource definition_ tells angular-data
5661
about a particular resource, like what its root endpoint is and which attribute refers to the primary key of the
57-
resource. A _resource definition_ can also specify validation functions to be executed during model lifecycle operations.
62+
resource. A _resource definition_ can also specify functions to be executed during model lifecycle operations.
5863

5964
```js
6065
DS.defineResource({
@@ -71,7 +76,7 @@ DS.defineResource({
7176
});
7277
```
7378

74-
`validate` will be executed at the beginning of the lifecycle initiated by a call to `DS.create` or `DS.save`.
79+
`validate` will be executed at the beginning of the lifecycle initiated by a calls to `DS.create`, `DS.save`, etc.
7580
```js
7681
DS.create('post', { author: 'Sally', title: 'Angular gotchas' })
7782
.then(function (post) {

guide/angular-data/synchronous.doc

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ $scope.$watch(function () {
2121
// Here we are watching the "lastModified" timestamp maintained by the data store for this particular document
2222

2323
return DS.lastModified('document', 45);
24-
}, function (lastModifiedTimestamp) {
24+
}, function () {
2525
// When this callback is executed, it means that the data store thinks the item changed
2626

2727
// Retrieve the updated item from the data store's cache
@@ -35,7 +35,7 @@ To make things simpler, angular-data has some bind methods to help with this:
3535
DS.bindOne($scope, 'myDoc', 'document', 45');
3636
```
3737

38-
The above example shows how to bind an item in the data store to the stop. Whenever that item changes it will be updated
38+
The above example shows how to bind an item in the data store to the $scope. Whenever that item changes it will be updated
3939
on the $scope.
4040

4141
When the app starts up, the calls to `lastModified()` and `get()` will both returned undefined, because the item isn't in
@@ -66,6 +66,6 @@ DS.eject('document', 45); // synchronously eject document from the store
6666
```
6767

6868
User #2 doesn't need to destroy document 45, because it's already been deleted on the server by user #1. User #2 just
69-
needs to kick document 45 out of the data store and be done with it.
69+
needs to kick document #45 out of the data store and be done with it.
7070

71-
See the [API](/documentation/api/api/index) for more information.
71+
See the [DS API](/documentation/api/angular-data/DS) for more information.

0 commit comments

Comments
 (0)