Permalink
Browse files

Regenerate book, update readme

  • Loading branch information...
1 parent 5449d16 commit 9ba563083f8d61bb94bbee6a07d83f1ce2a3835d @mixu committed Oct 30, 2012
@@ -108,9 +108,9 @@ <h1 class="chapter">7. Implementing a data source</h1>
},
</pre>
-<h2>Can loading items by search query</h2>
+<h2>Can load items by search query</h2>
-<p>The data source should support retrieving items by conditions other than id's. Since the details depend on the backend used, we'll just allow the user to add search terms via a object. The parameter are passed to the backend, which can then implement whatever is the appropriate thing (e.g. SQL query by name) to return the result JSON.</p>
+<p>The data source should support retrieving items by conditions other than IDs. Since the details depend on the backend used, we'll just allow the user to add search terms via an object. The parameters are passed to the backend, which can then implement whatever is appropriate (e.g. SQL query by name) to return the result JSON.</p>
<pre class="prettyprint">
'can load items by search query': function(done) {
@@ -195,14 +195,14 @@ <h1 class="chapter">8. Implementing a model</h1>
<h2>Change events</h2>
-<p>Model accessors (get/set) exist because we want to be able to intercept changes to the model data, and emit <code>change</code> events. Other parts of the app - mainly views - can then listen for those events and get an idea of what changed and what the previous value was. For example, we can respond to these:</p>
+<p>Model accessors (get/set) exist because we want to be able to intercept changes to the model data, and emit <code>change</code> events. Other parts of the app -- mainly views -- can then listen for those events and get an idea of what changed and what the previous value was. For example, we can respond to these:</p>
<ul>
<li>a set() for a value that is used elsewhere (to notify others of an update / to mark model as changed)</li>
<li>a remove() for a value that is used elsewhere</li>
</ul>
-<p>We will want to allow people to write <code>model.on('change', function() { .. })</code> to add listeners that are called to notify about changes. We'll use a EventEmitter for that.</p>
+<p>We will want to allow people to write <code>model.on('change', function() { .. })</code> to add listeners that are called to notify about changes. We'll use an EventEmitter for that.</p>
<p>If you're not familiar with EventEmitters, they are just a standard interface for emitting (triggering) and binding callbacks to events (I've written more about them <a href="http://book.mixu.net/ch9.html">in my other book</a>.)</p>
@@ -294,7 +294,7 @@ <h1 class="chapter">8. Implementing a model</h1>
}
</pre>
-<p>Since the constructor is just a ES3 regular constructor, the model code doesn't depend on any particular framework. You could use it in any other code without having to worry about compatibility. For example, I am planning on reusing the model code when I do a rewrite of my window manager.</p>
+<p>Since the constructor is just a normal ES3 constructor, the model code doesn't depend on any particular framework. You could use it in any other code without having to worry about compatibility. For example, I am planning on reusing the model code when I do a rewrite of my window manager.</p>
<h2>Differences with Backbone.js</h2>
@@ -303,7 +303,7 @@ <h1 class="chapter">8. Implementing a model</h1>
<ul>
<li>Each instance has a unique cid (client id) assigned to it.</li>
<li>You can choose to silence change events by passing an additional parameter.</li>
- <li>Changed values are accessible as the <code>changed</code> property of the model, in addition to being accessible as events; there are also many other convinient methods such as changedAttributes and previousAttributes.</li>
+ <li>Changed values are accessible as the <code>changed</code> property of the model, in addition to being accessible as events; there are also many other convenient methods such as changedAttributes and previousAttributes.</li>
<li>There is support for HTML-escaping values and for a validate() function.</li>
<li>.reset() is called .clear() and .remove() is .unset()</li>
<li>Data source and data store methods (Model.save() and Model.destroy()) are implemented on the model, whereas I implement them in separate objects (first and last chapter of this section).</li>
@@ -72,10 +72,10 @@ <h1 class="chapter">9. Collections</h1>
<ul>
<li>contains items (or models)</li>
<li>emits events when items are added/removed</li>
- <li>is ordered; can be accessed by index via <code>at()</code> and by model id via <code>get()</code></li>
+ <li>is ordered; can be accessed by index via <code>at()</code> and by model ID via <code>get()</code></li>
</ul>
-<p>In this chapter, we'll write a observable array, and then add some additional niceties on top of it to make it a collection (e.g. something that is specific to storing models).</p>
+<p>In this chapter, we'll write an observable array, and then add some additional niceties on top of it to make it a collection (e.g. something that is specific to storing models).</p>
<h2>Storing Models and emitting events</h2>
@@ -91,7 +91,7 @@ <h1 class="chapter">9. Collections</h1>
<p>To support passing a set of initial models, we call this.add() in the constructor.</p>
-<p><b>Resetting the collection</b>. Self-explanatory, really. We will use an array to store the models, because collections are ordered rather than indexed; and we will maintain a length property directly for convinience.</p>
+<p><b>Resetting the collection</b>. Self-explanatory, really. We will use an array to store the models, because collections are ordered rather than indexed; and we will maintain a length property directly for convenience.</p>
<pre class="prettyprint">
Collection.prototype.reset = function() {
@@ -101,7 +101,7 @@ <h1 class="chapter">9. Collections</h1>
};
</pre>
-<p><b>Adding items</b>. We should be able to call <code>add(model)</code> and receive a "add" event when the model is added.</p>
+<p><b>Adding items</b>. We should be able to call <code>add(model)</code> and emit/listen for an "add" event when the model is added.</p>
<pre class="prettyprint">
Collection.prototype.add = function(model, at) {
@@ -118,7 +118,7 @@ <h1 class="chapter">9. Collections</h1>
<p>To support calling <code>add([model1, model2])</code>, we'll check if the first parameter is an array and make multiple calls in that case.</p>
-<p>Other than that, we just use Array.splice to insert the model. The optional <code>at</code> param allows us to specify a particular index to add at. Finally, after each add, we emit the "add" event.s</p>
+<p>Other than that, we just use Array.splice to insert the model. The optional <code>at</code> param allows us to specify a particular index to add at. Finally, after each add, we emit the "add" event.</p>
<p><b>Removing items</b>. We should be able to call <code>remove(model)</code> to remove a model, and receive events when the item is removed. Again, the code is rather trivial.</p>
@@ -227,7 +227,7 @@ <h1 class="chapter">9. Collections</h1>
};
</pre>
-<p>And we need to unbind when the model is removed, or the collection is reset:</p>
+<p>And we need to unbind when a model is removed, or the collection is reset:</p>
<pre class="prettyprint">
Collection.prototype.remove = function(model){
@@ -108,7 +108,7 @@ <h1 class="chapter">10. Implementing a data cache</h1>
<p>When the model doesn't have a id, we will use the "create" endpoint, and when the model does have id, we'll use the "update"/"delete" endpoint. If you set Model.prototype.urlRoot to "http://localhost/user", then you'll get the urls above, or if your URLs are different, you can replace Model.prototype.url with your own function.</p>
-<p><b>Connecting Model.save() with the DataStore</b>. Reading is done via the data source, but create, update and delete are done via the data store. For the sake of convinience, let's redirect <code>Model.save()</code> to the DataStore:</p>
+<p><b>Connecting Model.save() with the DataStore</b>. Reading is done via the data source, but create, update and delete are done via the data store. For the sake of convenience, let's redirect <code>Model.save()</code> to the DataStore:</p>
<pre class="prettyprint">
Model.prototype.save = function(callback) {
@@ -169,7 +169,7 @@ <h1 class="chapter">10. Implementing a data cache</h1>
<p><b>Data changes</b>. When the model ID changes, the cache should be updated to reflect this.</p>
-<p><b>Reference counting</b>. If you want to accurate count the number of models, you'll need to hook into Collection events (e.g. add / remove / reset). I'm not going to do that, because a simpler mechanism - for example, limiting model instances by age or by number - achieves the essential benefits without the overhead of counting. When ES6 WeakMaps are more common, it'll be much easier to do something like this.</p>
+<p><b>Reference counting</b>. If you want an accurate count of the number of models, you must hook into Collection events (e.g. add / remove / reset). I'm not going to do that, because a simpler mechanism -- for example, limiting model instances by age or by number -- achieves the essential benefits without the overhead of counting. When ES6 WeakMaps are more common, it'll be much easier to do something like this.</p>
<h2>Implementing the data store / cache</h2>
Oops, something went wrong.

0 comments on commit 9ba5630

Please sign in to comment.