[Pkg-javascript-commits] [backbone] 87/281: Navigate learns to change the route without adding a history entry
Jonas Smedegaard
js at moszumanska.debian.org
Sat May 3 17:01:59 UTC 2014
This is an automated email from the git hooks/post-receive script.
js pushed a commit to tag 0.9.0
in repository backbone.
commit df7c279dc27a1e09db0bf8566ac9315f8ca96d96
Author: Aidan Feldman and Tim Harper <aidan.feldman at gmail.com>
Date: Wed Nov 9 17:59:40 2011 -0700
Navigate learns to change the route without adding a history entry
Also, instead of accepting a single boolean for trigger, the navigate
method now accepts an options object, with the following options:
- replace
- trigger
If you pass true instead of an options object, it's interpreted as
{trigger: true}
* pushState support - Aidan Feldman
* hashtag support and IE7 support - Tim Harper
* Tests were a joint effort.
---
backbone.js | 49 ++++++--
docs/backbone.html | 347 ++++++++++++++++++++++++++++-----------------------
index.html | 13 +-
test/router.js | 20 +++
test/test.html | 1 +
test/test_helpers.js | 14 +++
6 files changed, 271 insertions(+), 173 deletions(-)
diff --git a/backbone.js b/backbone.js
index 69ce116..3c9bfb9 100644
--- a/backbone.js
+++ b/backbone.js
@@ -700,8 +700,8 @@
},
// Simple proxy to `Backbone.history` to save a fragment into the history.
- navigate : function(fragment, triggerRoute) {
- Backbone.history.navigate(fragment, triggerRoute);
+ navigate : function(fragment, options) {
+ Backbone.history.navigate(fragment, options);
},
// Bind all defined routes to `Backbone.history`. We have to reverse the
@@ -857,27 +857,54 @@
return matched;
},
- // Save a fragment into the hash history. You are responsible for properly
+ // Save a fragment into the hash history, or replace the URL state
+ // if the 'replace' option is passed. You are responsible for properly
// URL-encoding the fragment in advance. This does not trigger
// a `hashchange` event.
- navigate : function(fragment, triggerRoute) {
+ // parameters:
+ //
+ // * fragment: the URL fragment to navigate to (the portion after the '#')
+ // * options: An object with the following parameters:
+ // - trigger: call the route corresponding to the provided fragment
+ // - replace: Navigate such that the back button will
+ // not return to this current state.
+ //
+ // To comply with earlier API specifications, passing
+ // true/false for options will be interpretted as
+ // {options: trigger: true/false}
+ navigate : function(fragment, options) {
+ if (!options || typeof options === 'boolean') options = {trigger: options};
var frag = (fragment || '').replace(hashStrip, '');
if (this.fragment == frag || this.fragment == decodeURIComponent(frag)) return;
if (this._hasPushState) {
- var loc = window.location;
if (frag.indexOf(this.options.root) != 0) frag = this.options.root + frag;
this.fragment = frag;
- window.history.pushState({}, document.title, loc.protocol + '//' + loc.host + frag);
+ if (options.replace) {
+ window.history.replaceState({}, document.title, frag);
+ } else {
+ window.history.pushState({}, document.title, frag);
+ }
} else {
- window.location.hash = this.fragment = frag;
+ this.fragment = frag;
+ this._updateLocationHash(window.location, frag, options.replace);
if (this.iframe && (frag != this.getFragment(this.iframe.location.hash))) {
- this.iframe.document.open().close();
- this.iframe.location.hash = frag;
+ // Opening and closing the iframe tricks IE7 and earlier to push a history entry on hash-tag change.
+ // When replace is true, we don't want this.
+ if(!options.replace) this.iframe.document.open().close();
+ this._updateLocationHash(this.iframe.location, frag, options.replace);
}
}
- if (triggerRoute) this.loadUrl(fragment);
- }
+ if (options.trigger) this.loadUrl(fragment);
+ },
+ // Since you can't run `location.replace` on a hash fragment, this
+ // helper function provides an effective work-around.
+ _updateLocationHash: function(location, new_fragment, replace) {
+ if (replace)
+ location.replace(location.toString().replace(/#.*$/, "") + "#" + new_fragment);
+ else
+ location.hash = new_fragment;
+ }
});
// Backbone.View
diff --git a/docs/backbone.html b/docs/backbone.html
index 19a883a..4aafd87 100644
--- a/docs/backbone.html
+++ b/docs/backbone.html
@@ -3,23 +3,23 @@
Backbone may be freely distributed under the MIT license.
For all details and documentation:
http://documentcloud.github.com/backbone
-</code></pre> </td> <td class="code"> <div class="highlight"><pre><span class="p">(</span><span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>Initial Setup</h2> </td> [...]
+</code></pre> </td> <td class="code"> <div class="highlight"><pre><span class="p">(</span><span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>Initial Setup</h2> </td> [...]
be attached to this. Exported for both CommonJS and the browser.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">Backbone</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">exports</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">Backbone</span> <span class="o">=</span> <span class="nx">exports</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">Backbone</span> <span class="o">=</span> <span class="nx">root</span><span class="p">.</span><span class="nx">Backbone</span> <span class="o">=</span> <span class="p">{};</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>Current version of the library. Keep in sync with <code>package.json</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</s [...]
- <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">_</span> <span class="o">&&</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">require</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">))</span> <span class="nx">_</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="s1">'underscore'</span><span class="p">).</span [...]
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>Current version of the library. Keep in sync with <code>package.json</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</s [...]
+ <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">_</span> <span class="o">&&</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">require</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">))</span> <span class="nx">_</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="s1">'underscore'</span><span class="p">).</span [...]
to its previous owner. Returns a reference to this Backbone object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">noConflict</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">Backbone</span> <span class="o">=</span> <span class="nx">previousBackbone</span><span class="p">;</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>Turn on <code>emulateHTTP</code> to support legacy HTTP servers. Setting this option will
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>Turn on <code>emulateHTTP</code> to support legacy HTTP servers. Setting this option will
fake <code>"PUT"</code> and <code>"DELETE"</code> requests via the <code>_method</code> parameter and set a
-<code>X-Http-Method-Override</code> header.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">emulateHTTP</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a [...]
+<code>X-Http-Method-Override</code> header.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">emulateHTTP</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a [...]
<code>application/json</code> requests ... will encode the body as
<code>application/x-www-form-urlencoded</code> instead and will send the model in a
-form param named <code>model</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">emulateJSON</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class= [...]
+form param named <code>model</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">emulateJSON</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class= [...]
custom events. You may <code>bind</code> or <code>unbind</code> a callback function to an event;
<code>trigger</code>-ing an event fires all callbacks in succession.</p>
@@ -27,56 +27,48 @@ custom events. You may <code>bind</code> or <code>unbind</code> a callback funct
_.extend(object, Backbone.Events);
object.bind('expand', function(){ alert('expanded'); });
object.trigger('expand');
-</code></pre> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Events</span> <span class="o">=</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> [...]
+</code></pre> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Events</span> <span class="o">=</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> [...]
Passing <code>"all"</code> will bind the callback to all events fired.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">bind</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">ev</span><span class="p">,</span> <span class="nx">callback</span><span class="p">,</span> <span class="nx">context</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">calls</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_callbacks</span> <span class="o">||</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_callbacks</span> <span class="o">=</span> <span class="p">{});</span>
- <span class="kd">var</span> <span class="nx">list</span> <span class="o">=</span> <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]</span> <span class="o">||</span> <span class="p">(</span><span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]</span> <span class="o">=</span> <span class="p">[]);</span>
- <span class="nx">list</span><span class="p">.</span><span class="nx">push</span><span class="p">([</span><span class="nx">callback</span><span class="p">,</span> <span class="nx">context</span><span class="p">]);</span>
+ <span class="kd">var</span> <span class="nx">list</span> <span class="o">=</span> <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]</span> <span class="o">||</span> <span class="p">(</span><span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]</span> <span class="o">=</span> <span class="p">{});</span>
+ <span class="kd">var</span> <span class="nx">tail</span> <span class="o">=</span> <span class="nx">list</span><span class="p">.</span><span class="nx">tail</span> <span class="o">||</span> <span class="p">(</span><span class="nx">list</span><span class="p">.</span><span class="nx">tail</span> <span class="o">=</span> <span class="nx">list</span><span class="p">.</span><span class="nx">next</span> <span class="o">=</span> <span class="p">{});</span>
+ <span class="nx">tail</span><span class="p">.</span><span class="nx">callback</span> <span class="o">=</span> <span class="nx">callback</span><span class="p">;</span>
+ <span class="nx">tail</span><span class="p">.</span><span class="nx">context</span> <span class="o">=</span> <span class="nx">context</span><span class="p">;</span>
+ <span class="nx">list</span><span class="p">.</span><span class="nx">tail</span> <span class="o">=</span> <span class="nx">tail</span><span class="p">.</span><span class="nx">next</span> <span class="o">=</span> <span class="p">{};</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>Remove one or many callbacks. If <code>callback</code> is null, removes all
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>Remove one or many callbacks. If <code>callback</code> is null, removes all
callbacks for the event. If <code>ev</code> is null, removes all bound callbacks
for all events.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">unbind</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">ev</span><span class="p">,</span> <span class="nx">callback</span><span class="p">)</span> <span class="p">{</span>
- <span class="kd">var</span> <span class="nx">calls</span><span class="p">;</span>
+ <span class="kd">var</span> <span class="nx">calls</span><span class="p">,</span> <span class="nx">node</span><span class="p">,</span> <span class="nx">prev</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">ev</span><span class="p">)</span> <span class="p">{</span>
- <span class="k">this</span><span class="p">.</span><span class="nx">_callbacks</span> <span class="o">=</span> <span class="p">{};</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">_callbacks</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">calls</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_callbacks</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">callback</span><span class="p">)</span> <span class="p">{</span>
- <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]</span> <span class="o">=</span> <span class="p">[];</span>
- <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
- <span class="kd">var</span> <span class="nx">list</span> <span class="o">=</span> <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">];</span>
- <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">list</span><span class="p">)</span> <span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">l</span> <span class="o">=</span> <span class="nx">list</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">l</span><span class="p">;</span> <span class="nx">i</span><span class="o" [...]
- <span class="k">if</span> <span class="p">(</span><span class="nx">list</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">&&</span> <span class="nx">callback</span> <span class="o">===</span> <span class="nx">list</span><span class="p">[</span><span class="nx">i</span><span class="p">][</span><span class="mi">0</span><span class="p">])</span> <span class="p">{</span>
- <span class="nx">list</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
- <span class="k">break</span><span class="p">;</span>
- <span class="p">}</span>
+ <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]</span> <span class="o">=</span> <span class="p">{};</span>
+ <span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">node</span> <span class="o">=</span> <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">])</span> <span class="p">{</span>
+ <span class="k">while</span> <span class="p">((</span><span class="nx">prev</span> <span class="o">=</span> <span class="nx">node</span><span class="p">)</span> <span class="o">&&</span> <span class="p">(</span><span class="nx">node</span> <span class="o">=</span> <span class="nx">node</span><span class="p">.</span><span class="nx">next</span><span class="p">))</span> <span class="p">{</span>
+ <span class="k">if</span> <span class="p">(</span><span class="nx">node</span><span class="p">.</span><span class="nx">callback</span> <span class="o">!==</span> <span class="nx">callback</span><span class="p">)</span> <span class="k">continue</span><span class="p">;</span>
+ <span class="nx">prev</span><span class="p">.</span><span class="nx">next</span> <span class="o">=</span> <span class="nx">node</span><span class="p">.</span><span class="nx">next</span><span class="p">;</span>
+ <span class="nx">node</span><span class="p">.</span><span class="nx">context</span> <span class="o">=</span> <span class="nx">node</span><span class="p">.</span><span class="nx">callback</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
+ <span class="k">break</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>Trigger an event, firing all bound callbacks. Callbacks are passed the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>Trigger an event, firing all bound callbacks. Callbacks are passed the
same arguments as <code>trigger</code> is, apart from the event name.
Listening for <code>"all"</code> passes the true event name as the first argument.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">trigger</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">eventName</span><span class="p">)</span> <span class="p">{</span>
- <span class="kd">var</span> <span class="nx">list</span><span class="p">,</span> <span class="nx">calls</span><span class="p">,</span> <span class="nx">ev</span><span class="p">,</span> <span class="nx">callback</span><span class="p">,</span> <span class="nx">args</span><span class="p">;</span>
- <span class="kd">var</span> <span class="nx">both</span> <span class="o">=</span> <span class="mi">2</span><span class="p">;</span>
+ <span class="kd">var</span> <span class="nx">node</span><span class="p">,</span> <span class="nx">calls</span><span class="p">,</span> <span class="nx">callback</span><span class="p">,</span> <span class="nx">args</span><span class="p">,</span> <span class="nx">ev</span><span class="p">,</span> <span class="nx">events</span> <span class="o">=</span> <span class="p">[</span><span class="s1">'all'</span><span class="p">,</span> <span class="nx">eventName</span><span class="p" [...]
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">calls</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_callbacks</span><span class="p">))</span> <span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="k">while</span> <span class="p">(</span><span class="nx">both</span><span class="o">--</span><span class="p">)</span> <span class="p">{</span>
- <span class="nx">ev</span> <span class="o">=</span> <span class="nx">both</span> <span class="o">?</span> <span class="nx">eventName</span> <span class="o">:</span> <span class="s1">'all'</span><span class="p">;</span>
- <span class="k">if</span> <span class="p">(</span><span class="nx">list</span> <span class="o">=</span> <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">])</span> <span class="p">{</span>
- <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">l</span> <span class="o">=</span> <span class="nx">list</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">l</span><span class="p">;</span> <span class="nx">i</span><span class="o" [...]
- <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">callback</span> <span class="o">=</span> <span class="nx">list</span><span class="p">[</span><span class="nx">i</span><span class="p">]))</span> <span class="p">{</span>
- <span class="nx">list</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="nx">i</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span> <span class="nx">i</span><span class="o">--</span><span class="p">;</span> <span class="nx">l</span><span class="o">--</span><span class="p">;</span>
- <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
- <span class="nx">args</span> <span class="o">=</span> <span class="nx">both</span> <span class="o">?</span> <span class="nb">Array</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">slice</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="nx">arguments</span><span class="p">,</span> <span class="mi">1</span><span class="p">)</span> <span class="o">:</span> <span class="nx">argum [...]
- <span class="nx">callback</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">apply</span><span class="p">(</span><span class="nx">callback</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span> <span class="o">||</span> <span class="k">this</span><span class="p">,</span> <span class="nx">args</span><span class="p">);</span>
- <span class="p">}</span>
- <span class="p">}</span>
- <span class="p">}</span>
+ <span class="k">while</span> <span class="p">(</span><span class="nx">ev</span> <span class="o">=</span> <span class="nx">events</span><span class="p">.</span><span class="nx">pop</span><span class="p">())</span> <span class="p">{</span>
+ <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">node</span> <span class="o">=</span> <span class="nx">calls</span><span class="p">[</span><span class="nx">ev</span><span class="p">]))</span> <span class="k">continue</span><span class="p">;</span>
+ <span class="nx">args</span> <span class="o">=</span> <span class="nx">ev</span> <span class="o">==</span> <span class="s1">'all'</span> <span class="o">?</span> <span class="nx">arguments</span> <span class="o">:</span> <span class="nx">slice</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="nx">arguments</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
+ <span class="k">while</span> <span class="p">(</span><span class="nx">node</span> <span class="o">=</span> <span class="nx">node</span><span class="p">.</span><span class="nx">next</span><span class="p">)</span> <span class="k">if</span> <span class="p">(</span><span class="nx">callback</span> <span class="o">=</span> <span class="nx">node</span><span class="p">.</span><span class="nx">callback</span><span class="p">)</span> <span class="nx">callback</span><span class="p">.</span [...]
<span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
<span class="p">}</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <h2>Backbone.Model</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="se [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <h2>Backbone.Model</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="se [...]
is automatically generated and assigned for you.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attributes</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">defaults</span><span class="p">;</span>
<span class="nx">attributes</span> <span class="o">||</span> <span class="p">(</span><span class="nx">attributes</span> <span class="o">=</span> <span class="p">{});</span>
@@ -92,8 +84,7 @@ is automatically generated and assigned for you.</p> </td>
<span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">clone</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span> <span class="o">&&</span> <span class="nx">options</span><span class="p">.</span><span class="nx">collection</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">collection</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">collection</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">initialize</span><span class="p">(</span><span class="nx">attributes</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>Attach all inheritable methods to the Model prototype.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</spa [...]
-after the last <code>"change"</code> event was fired.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_previousAttributes</span> <span class="o">:</span> <span class="kc">null</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">& [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>Attach all inheritable methods to the Model prototype.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</spa [...]
CouchDB users may want to set this to <code>"_id"</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">idAttribute</span> <span class="o">:</span> <span class="s1">'id'</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2 [...]
initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> [...]
<span class="k">return</span> <span class="nx">_</span><span class="p">.</span><span class="nx">clone</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">);</span>
@@ -103,7 +94,7 @@ initialization logic.</p> </td> <td class="code">
<span class="kd">var</span> <span class="nx">html</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">html</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_escapedAttributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">])</span> <span class="k">return</span> <span class="nx">html</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span>
- <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_escapedAttributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">=</span> <span class="nx">escapeHTML</span><span class="p">(</span><span class="nx">val</span> <span class="o">==</span> <span class="kc">null</span> <span class="o">?</span> <span class="s1">''</span> <span class="o">:</span> <span class="s1">''</span> [...]
+ <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_escapedAttributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">escape</span><span class="p">(</span><span class="nx">val</span> <span class="o">==</span> <span class="kc">null</span> <span class="o">?</span> <span class="s1">''</span> <span class="o" [...]
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">¶</a> </div> <p>Returns <code>true</code> if the attribute contains a value that is not null
or undefined.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">has</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attr</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">!=</span> <span class="kc">null</span><span class="p">;</span>
@@ -120,8 +111,10 @@ choose to silence it.</p> </td> <td class="code">
<span class="k">this</span><span class="p">.</span><span class="nx">_changed</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change:'</span> <span class="o">+</span> <span class="nx">attr</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="nx">val [...]
<span class="p">}</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-34"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-34">¶</a> </div> <p>Fire the <code>"change"</code> event, if the model has been changed.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> [...]
- <span class="k">this</span><span class="p">.</span><span class="nx">_changing</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-34"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-34">¶</a> </div> <p>Fire the <code>"change"</code> event, if the model has been changed.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> [...]
+ <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">_changed</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">change</span><span class="p">(</span><span class="nx">options</span><span class="p">);</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">_changing</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+ <span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-35"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-35">¶</a> </div> <p>Remove an attribute from the model, firing <code>"change"</code> unless you choose
to silence it. <code>unset</code> is a noop if the attribute doesn't exist.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">unset</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attr</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
@@ -129,7 +122,7 @@ to silence it. <code>unset</code> is a noop if the attribute doesn't exist.</p>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-36"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-36">¶</a> [...]
<span class="nx">validObj</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">=</span> <span class="k">void</span> <span class="mi">0</span><span class="p">;</span>
- <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">validate</span> <span class="o">&&</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">_performValidation</span><span class="p">(</span><span class="nx">validObj</span>< [...]
+ <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">validate</span> <span class="o">&&</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">_performValidation</span><span class="p">(</span><span class="nx">validObj</span>< [...]
<span class="k">delete</span> <span class="k">this</span><span class="p">.</span><span class="nx">_escapedAttributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">attr</span> <span class="o">==</span> <span class="k">this</span><span class="p">.</span><span class="nx">idAttribute</span><span class="p">)</span> <span class="k">delete</span> <span class="k">this</span><span class="p">.</span><span class="nx">id</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_changed</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
@@ -138,11 +131,11 @@ to silence it. <code>unset</code> is a noop if the attribute doesn't exist.</p>
<span class="k">this</span><span class="p">.</span><span class="nx">change</span><span class="p">(</span><span class="nx">options</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-38"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-38">¶</a> </div> <p>Clear all attributes on the model, firing <code>"change"</code> unless you choose
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-39"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-39">¶</a> </div> <p>Clear all attributes on the model, firing <code>"change"</code> unless you choose
to silence it.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">clear</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
<span class="kd">var</span> <span class="nx">attr</span><span class="p">;</span>
- <span class="kd">var</span> <span class="nx">old</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-39"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-39">¶</a> </div> <p>Run validation.</p> [...]
+ <span class="kd">var</span> <span class="nx">old</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-40"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-40">¶</a> </div> <p>Run validation.</p> [...]
<span class="k">for</span> <span class="p">(</span><span class="nx">attr</span> <span class="k">in</span> <span class="nx">old</span><span class="p">)</span> <span class="nx">validObj</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">=</span> <span class="k">void</span> <span class="mi">0</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">validate</span> <span class="o">&&</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">_performValidation</span><span class="p">(</span><span class="nx">validObj</span>< [...]
@@ -156,7 +149,7 @@ to silence it.</p> </td> <td class="code">
<span class="k">this</span><span class="p">.</span><span class="nx">change</span><span class="p">(</span><span class="nx">options</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-40"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-40">¶</a> </div> <p>Fetch the model from the server. If the server's representation of the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-41"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-41">¶</a> </div> <p>Fetch the model from the server. If the server's representation of the
model differs from its current attributes, they will be overriden,
triggering a <code>"change"</code> event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">fetch</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
@@ -168,7 +161,7 @@ triggering a <code>"change"</code> event.</p> </td> <td
<span class="p">};</span>
<span class="nx">options</span><span class="p">.</span><span class="nx">error</span> <span class="o">=</span> <span class="nx">wrapError</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">error</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">||</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span><span class="p">).</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'read'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span [...]
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-41"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-41">¶</a> </div> <p>Set a hash of model attributes, and sync the model to the server.
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-42"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-42">¶</a> </div> <p>Set a hash of model attributes, and sync the model to the server.
If the server returns an attributes hash that differs, the model's
state will be <code>set</code> again.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">save</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attrs</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
@@ -182,7 +175,7 @@ state will be <code>set</code> again.</p> </td> <td clas
<span class="nx">options</span><span class="p">.</span><span class="nx">error</span> <span class="o">=</span> <span class="nx">wrapError</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">error</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">method</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">isNew</span><span class="p">()</span> <span class="o">?</span> <span class="s1">'create'</span> <span class="o">:</span> <span class="s1">'update'</span><span class="p">;</span>
<span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">||</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span><span class="p">).</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">method</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span [...]
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-42"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-42">¶</a> </div> <p>Destroy this model on the server if it was already persisted. Upon success, the model is removed
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-43"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-43">¶</a> </div> <p>Destroy this model on the server if it was already persisted. Upon success, the model is removed
from its collection, if it has one.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">destroy</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">isNew</span><span class="p">())</span> <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'destroy'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">collect [...]
@@ -194,50 +187,59 @@ from its collection, if it has one.</p> </td> <td class=
<span class="p">};</span>
<span class="nx">options</span><span class="p">.</span><span class="nx">error</span> <span class="o">=</span> <span class="nx">wrapError</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">error</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">||</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span><span class="p">).</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'delete'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</sp [...]
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-43"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-43">¶</a> </div> <p>Default URL for the model's representation on the server -- if you're
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-44"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-44">¶</a> </div> <p>Default URL for the model's representation on the server -- if you're
using Backbone's restful methods, override this to change the endpoint
that will be called.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">url</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">base</span> <span class="o">=</span> <span class="nx">getUrl</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">collection</span><span class="p">)</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">urlRoot</span> <span class="o">||</span> <span class="nx">urlError</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">isNew</span><span class="p">())</span> <span class="k">return</span> <span class="nx">base</span><span class="p">;</span>
<span class="k">return</span> <span class="nx">base</span> <span class="o">+</span> <span class="p">(</span><span class="nx">base</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">base</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mi">1</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'/'</span> <span class="o">?</span> <span class="s1">'' [...]
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-44"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-44">¶</a> </div> <p><strong>parse</strong> converts a response into the hash of attributes to be <code>set</code> on
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-45"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-45">¶</a> </div> <p><strong>parse</strong> converts a response into the hash of attributes to be <code>set</code> on
the model. The default implementation is just to pass the response along.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">parse</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">resp</span><span class="p">,</span> <span class="nx">xhr</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">resp</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-45"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-45">¶</a> </div> <p>Create a new model with identical attributes to this one.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">clone</span> <span clas [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-46"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-46">¶</a> </div> <p>Create a new model with identical attributes to this one.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">clone</span> <span clas [...]
<span class="k">return</span> <span class="k">new</span> <span class="k">this</span><span class="p">.</span><span class="nx">constructor</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-46"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-46">¶</a> </div> <p>A model is new if it has never been saved to the server, and lacks an id.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">isNew</ [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-47"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-47">¶</a> </div> <p>A model is new if it has never been saved to the server, and lacks an id.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">isNew</ [...]
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">id</span> <span class="o">==</span> <span class="kc">null</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-47"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-47">¶</a> </div> <p>Call this method to manually fire a <code>change</code> event for this model.
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-48"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-48">¶</a> </div> <p>Call this method to manually fire a <code>change</code> event for this model.
Calling this will cause all objects observing the model to update.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">change</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">clone</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">);</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">_unsetAttributes</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_changed</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-48"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-48">¶</a> </div> <p>Determine if the model has changed since the last <code>"change"</code> event.
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-49"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-49">¶</a> </div> <p>Determine if the model has changed since the last <code>"change"</code> event.
If you specify an attribute name, determine if that attribute has changed.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">hasChanged</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attr</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">attr</span><span class="p">)</span> <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">!=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_changed</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-49"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-49">¶</a> </div> <p>Return an object containing all the attributes that have changed, or false
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-50"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-50">¶</a> </div> <p>Return an object containing all the attributes that have changed, or false
if there are no changed attributes. Useful for determining what parts of a
view need to be updated and/or what attributes need to be persisted to
-the server.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">changedAttributes</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">now</span><span class="p">)</span> <span class="p">{</span>
+the server. Unset attributes will be set to undefined.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">changedAttributes</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">now</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">now</span> <span class="o">||</span> <span class="p">(</span><span class="nx">now</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">);</span>
- <span class="kd">var</span> <span class="nx">old</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span><span class="p">;</span>
+ <span class="kd">var</span> <span class="nx">old</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span><span class="p">,</span> <span class="nx">unset</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_unsetAttributes</span><span class="p">;</span>
+
<span class="kd">var</span> <span class="nx">changed</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">attr</span> <span class="k">in</span> <span class="nx">now</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">_</span><span class="p">.</span><span class="nx">isEqual</span><span class="p">(</span><span class="nx">old</span><span class="p">[</span><span class="nx">attr</span><span class="p">],</span> <span class="nx">now</span><span class="p">[</span><span class="nx">attr</span><span class="p">]))</span> <span class="p">{</span>
- <span class="nx">changed</span> <span class="o">=</span> <span class="nx">changed</span> <span class="o">||</span> <span class="p">{};</span>
+ <span class="nx">changed</span> <span class="o">||</span> <span class="p">(</span><span class="nx">changed</span> <span class="o">=</span> <span class="p">{});</span>
<span class="nx">changed</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">=</span> <span class="nx">now</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span>
<span class="p">}</span>
<span class="p">}</span>
+
+ <span class="k">if</span> <span class="p">(</span><span class="nx">unset</span><span class="p">)</span> <span class="p">{</span>
+ <span class="nx">changed</span> <span class="o">||</span> <span class="p">(</span><span class="nx">changed</span> <span class="o">=</span> <span class="p">{});</span>
+ <span class="kd">var</span> <span class="nx">len</span> <span class="o">=</span> <span class="nx">unset</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
+ <span class="k">while</span> <span class="p">(</span><span class="nx">len</span><span class="o">--</span><span class="p">)</span> <span class="nx">changed</span><span class="p">[</span><span class="nx">unset</span><span class="p">[</span><span class="nx">len</span><span class="p">]]</span> <span class="o">=</span> <span class="k">void</span> <span class="mi">0</span><span class="p">;</span>
+ <span class="p">}</span>
+
<span class="k">return</span> <span class="nx">changed</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-50"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-50">¶</a> </div> <p>Get the previous value of an attribute, recorded at the time the last
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-51"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-51">¶</a> </div> <p>Get the previous value of an attribute, recorded at the time the last
<code>"change"</code> event was fired.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">previous</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attr</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">attr</span> <span class="o">||</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span><span class="p">)</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-51"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-51">¶</a> </div> <p>Get all of the attributes of the model at the time of the previous
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-52"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-52">¶</a> </div> <p>Get all of the attributes of the model at the time of the previous
<code>"change"</code> event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">previousAttributes</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">_</span><span class="p">.</span><span class="nx">clone</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_previousAttributes</span><span class="p">);</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-52"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-52">¶</a> </div> <p>Run validation against a set of incoming attributes, returning <code>true</code>
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-53"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-53">¶</a> </div> <p>Run validation against a set of incoming attributes, returning <code>true</code>
if all is well. If a specific <code>error</code> callback has been passed,
call that instead of firing the general <code>"error"</code> event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_performValidation</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">attrs</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">error</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">validate</span><span class="p">(</span><span class="nx">attrs</span><span class="p">);</span>
@@ -252,7 +254,7 @@ call that instead of firing the general <code>"error"</code> event.</p>
<span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
<span class="p">}</span>
- <span class="p">});</span></pre></div> </td> </tr> <tr id="section-53"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-53">¶</a> </div> <h2>Backbone.Collection</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr [...]
+ <span class="p">});</span></pre></div> </td> </tr> <tr id="section-54"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-54">¶</a> </div> <h2>Backbone.Collection</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr [...]
or unordered. If a <code>comparator</code> is specified, the Collection will maintain
its models in sort order, as they're added and removed.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
@@ -261,12 +263,12 @@ its models in sort order, as they're added and removed.</p> </td>
<span class="k">this</span><span class="p">.</span><span class="nx">_reset</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">models</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
<span class="k">this</span><span class="p">.</span><span class="nx">initialize</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-55"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-55">¶</a> </div> <p>Define the Collection's inheritable methods.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span cl [...]
-This should be overridden in most cases.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">model</span> <span class="o">:</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-57"> <td class="docs"> <div class="pilwrap"> <a class= [...]
-initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-58"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-58">¶</a> </div> [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-56"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-56">¶</a> </div> <p>Define the Collection's inheritable methods.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span cl [...]
+This should be overridden in most cases.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">model</span> <span class="o">:</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-58"> <td class="docs"> <div class="pilwrap"> <a class= [...]
+initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-59"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-59">¶</a> </div> [...]
models' attributes.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">toJSON</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">){</span> <span class="k">return</span> <span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span> <span class="p">});</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-59"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-59">¶</a> </div> <p>Add a model, or list of models to the set. Pass <strong>silent</strong> to avoid
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-60"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-60">¶</a> </div> <p>Add a model, or list of models to the set. Pass <strong>silent</strong> to avoid
firing the <code>added</code> event for every new model.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">add</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">isArray</span><span class="p">(</span><span class="nx">models</span><span class="p">))</span> <span class="p">{</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">l</span> <span class="o">=</span> <span class="nx">models</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">l</span><span class="p">;</span> <span class="nx">i</span><span class="o" [...]
@@ -276,7 +278,7 @@ firing the <code>added</code> event for every new model.</p> </td>
<span class="k">this</span><span class="p">.</span><span class="nx">_add</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-60"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-60">¶</a> </div> <p>Remove a model, or a list of models from the set. Pass silent to avoid
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-61"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-61">¶</a> </div> <p>Remove a model, or a list of models from the set. Pass silent to avoid
firing the <code>removed</code> event for every model removed.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">remove</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">isArray</span><span class="p">(</span><span class="nx">models</span><span class="p">))</span> <span class="p">{</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">l</span> <span class="o">=</span> <span class="nx">models</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">l</span><span class="p">;</span> <span class="nx">i</span><span class="o" [...]
@@ -286,23 +288,23 @@ firing the <code>removed</code> event for every model removed.</p> <
<span class="k">this</span><span class="p">.</span><span class="nx">_remove</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-61"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-61">¶</a> </div> <p>Get a model from the set by id.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">get</span> <span class="o">:</span> <span class=" [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-62"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-62">¶</a> </div> <p>Get a model from the set by id.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">get</span> <span class="o">:</span> <span class=" [...]
<span class="k">if</span> <span class="p">(</span><span class="nx">id</span> <span class="o">==</span> <span class="kc">null</span><span class="p">)</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_byId</span><span class="p">[</span><span class="nx">id</span><span class="p">.</span><span class="nx">id</span> <span class="o">!=</span> <span class="kc">null</span> <span class="o">?</span> <span class="nx">id</span><span class="p">.</span><span class="nx">id</span> <span class="o">:</span> <span class="nx">id</span><span class="p">];</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-62"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-62">¶</a> </div> <p>Get a model from the set by client id.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getByCid</span> <span class="o">:</span> < [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-63"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-63">¶</a> </div> <p>Get a model from the set by client id.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getByCid</span> <span class="o">:</span> < [...]
<span class="k">return</span> <span class="nx">cid</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">_byCid</span><span class="p">[</span><span class="nx">cid</span><span class="p">.</span><span class="nx">cid</span> <span class="o">||</span> <span class="nx">cid</span><span class="p">];</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-63"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-63">¶</a> </div> <p>Get the model at the given index.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">at</span><span class="o">:</span> <span class=" [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-64"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-64">¶</a> </div> <p>Get the model at the given index.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">at</span> <span class="o">:</span> <span class= [...]
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">index</span><span class="p">];</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-64"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-64">¶</a> </div> <p>Force the collection to re-sort itself. You don't need to call this under normal
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-65"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-65">¶</a> </div> <p>Force the collection to re-sort itself. You don't need to call this under normal
circumstances, as the set will maintain sort order as each item is added.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">sort</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">comparator</span><span class="p">)</span> <span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s1">'Cannot sort a set without a comparator'</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">models</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">sortBy</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">comparator</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-65"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-65">¶</a> </div> <p>Pluck an attribute from each model in the collection.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">pluck</span> <span class="o [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-66"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-66">¶</a> </div> <p>Pluck an attribute from each model in the collection.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">pluck</span> <span class="o [...]
<span class="k">return</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">){</span> <span class="k">return</span> <span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span [...]
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-66"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-66">¶</a> </div> <p>When you have more items than you want to add or remove individually,
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-67"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-67">¶</a> </div> <p>When you have more items than you want to add or remove individually,
you can reset the entire set with a new list of models, without firing
any <code>added</code> or <code>removed</code> events. Fires <code>reset</code> when finished.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">reset</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">models</span> <span class="o">||</span> <span class="p">(</span><span class="nx">models</span> <span class="o">=</span> <span class="p">[]);</span>
@@ -312,7 +314,7 @@ any <code>added</code> or <code>removed</code> events. Fires <code>reset</code>
<span class="k">this</span><span class="p">.</span><span class="nx">add</span><span class="p">(</span><span class="nx">models</span><span class="p">,</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-67"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-67">¶</a> </div> <p>Fetch the default set of models for this collection, resetting the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-68"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-68">¶</a> </div> <p>Fetch the default set of models for this collection, resetting the
collection when they arrive. If <code>add: true</code> is passed, appends the
models to the collection instead of resetting.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">fetch</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
@@ -324,7 +326,7 @@ models to the collection instead of resetting.</p> </td>
<span class="p">};</span>
<span class="nx">options</span><span class="p">.</span><span class="nx">error</span> <span class="o">=</span> <span class="nx">wrapError</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">error</span><span class="p">,</span> <span class="nx">collection</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">||</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span><span class="p">).</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'read'</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span [...]
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-68"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-68">¶</a> </div> <p>Create a new instance of a model in this collection. After the model
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-69"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-69">¶</a> </div> <p>Create a new instance of a model in this collection. After the model
has been created on the server, it will be added to the collection.
Returns the model, or 'false' if validation on a new model fails.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">create</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">coll</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
@@ -338,28 +340,28 @@ Returns the model, or 'false' if validation on a new model fails.</p>
<span class="p">};</span>
<span class="nx">model</span><span class="p">.</span><span class="nx">save</span><span class="p">(</span><span class="kc">null</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">model</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-69"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-69">¶</a> </div> <p><strong>parse</strong> converts a response into a list of models to be added to the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-70"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-70">¶</a> </div> <p><strong>parse</strong> converts a response into a list of models to be added to the
collection. The default implementation is just to pass it through.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">parse</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">resp</span><span class="p">,</span> <span class="nx">xhr</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">resp</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-70"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-70">¶</a> </div> <p>Proxy to _'s chain. Can't be proxied the same way the rest of the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-71"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-71">¶</a> </div> <p>Proxy to _'s chain. Can't be proxied the same way the rest of the
underscore methods are proxied because it relies on the underscore
-constructor.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">chain</span><span class="o">:</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+constructor.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">chain</span> <span class="o">:</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">_</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">).</span><span class="nx">chain</span><span class="p">();</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-71"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-71">¶</a> </div> <p>Reset all internal state. Called when the collection is reset.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_reset</span> <spa [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-72"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-72">¶</a> </div> <p>Reset all internal state. Called when the collection is reset.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_reset</span> <spa [...]
<span class="k">this</span><span class="p">.</span><span class="nx">length</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">models</span> <span class="o">=</span> <span class="p">[];</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_byId</span> <span class="o">=</span> <span class="p">{};</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_byCid</span> <span class="o">=</span> <span class="p">{};</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-72"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-72">¶</a> </div> <p>Prepare a model to be added to this collection</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_prepareModel</span><span class="o [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-73"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-73">¶</a> </div> <p>Prepare a model to be added to this collection</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_prepareModel</span> <span class=" [...]
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">model</span> <span class="k">instanceof</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">))</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">attrs</span> <span class="o">=</span> <span class="nx">model</span><span class="p">;</span>
<span class="nx">model</span> <span class="o">=</span> <span class="k">new</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">(</span><span class="nx">attrs</span><span class="p">,</span> <span class="p">{</span><span class="nx">collection</span><span class="o">:</span> <span class="k">this</span><span class="p">});</span>
- <span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">validate</span> <span class="o">&&</span> <span class="o">!</span><span class="nx">model</span><span class="p">.</span><span class="nx">_performValidation</span><span class="p">(</span><span class="nx">attrs</span><span class="p">,</span> <span class="nx">options</span><span class="p">))</span> <span class="nx">model</span> <span class="o">=</span> <span [...]
+ <span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">validate</span> <span class="o">&&</span> <span class="o">!</span><span class="nx">model</span><span class="p">.</span><span class="nx">_performValidation</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">attributes</span><span class="p">,</span> <span class="nx">options</span><span class="p">))</span> <s [...]
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">model</span><span class="p">.</span><span class="nx">collection</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">model</span><span class="p">.</span><span class="nx">collection</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">model</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-73"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-73">¶</a> </div> <p>Internal implementation of adding a single model to the set, updating
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-74"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-74">¶</a> </div> <p>Internal implementation of adding a single model to the set, updating
hash indexes for <code>id</code> and <code>cid</code> lookups.
Returns the model, or 'false' if validation on a new model fails.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_add</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
@@ -375,26 +377,29 @@ Returns the model, or 'false' if validation on a new model fails.</p>
<span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="nx">index</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">model</span><span class="p">);</span>
<span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'all'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_onModelEvent</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">length</span><span class="o">++</span><span class="p">;</span>
+ <span class="nx">options</span><span class="p">.</span><span class="nx">index</span> <span class="o">=</span> <span class="nx">index</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span><span class="p">)</span> <span class="nx">model</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="nx">options</ [...]
<span class="k">return</span> <span class="nx">model</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-74"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-74">¶</a> </div> <p>Internal implementation of removing a single model from the set, updating
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-75"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-75">¶</a> </div> <p>Internal implementation of removing a single model from the set, updating
hash indexes for <code>id</code> and <code>cid</code> lookups.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_remove</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
<span class="nx">model</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getByCid</span><span class="p">(</span><span class="nx">model</span><span class="p">)</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">model</span><span class="p">)</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="k">delete</span> <span class="k">this</span><span class="p">.</span><span class="nx">_byId</span><span class="p">[</span><span class="nx">model</span><span class="p">.</span><span class="nx">id</span><span class="p">];</span>
<span class="k">delete</span> <span class="k">this</span><span class="p">.</span><span class="nx">_byCid</span><span class="p">[</span><span class="nx">model</span><span class="p">.</span><span class="nx">cid</span><span class="p">];</span>
- <span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="nx">model</span><span class="p">),</span> <span class="mi">1</span><span class="p">);</span>
+ <span class="kd">var</span> <span class="nx">index</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="nx">index</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">length</span><span class="o">--</span><span class="p">;</span>
+ <span class="nx">options</span><span class="p">.</span><span class="nx">index</span> <span class="o">=</span> <span class="nx">index</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span><span class="p">)</span> <span class="nx">model</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="k">this</span><span class="p">,</span> <span class="nx">option [...]
<span class="k">this</span><span class="p">.</span><span class="nx">_removeReference</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">model</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-75"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-75">¶</a> </div> <p>Internal method to remove a model's ties to a collection.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_removeReference</span> [...]
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-76"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-76">¶</a> </div> <p>Internal method to remove a model's ties to a collection.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_removeReference</span> [...]
<span class="k">if</span> <span class="p">(</span><span class="k">this</span> <span class="o">==</span> <span class="nx">model</span><span class="p">.</span><span class="nx">collection</span><span class="p">)</span> <span class="p">{</span>
<span class="k">delete</span> <span class="nx">model</span><span class="p">.</span><span class="nx">collection</span><span class="p">;</span>
<span class="p">}</span>
<span class="nx">model</span><span class="p">.</span><span class="nx">unbind</span><span class="p">(</span><span class="s1">'all'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_onModelEvent</span><span class="p">);</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-76"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-76">¶</a> </div> <p>Internal method called every time a model in the set fires an event.
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-77"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-77">¶</a> </div> <p>Internal method called every time a model in the set fires an event.
Sets need to update their indexes when models change ids. All other
events simply proxy through. "add" and "remove" events that originate
in other collections are ignored.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_onModelEvent</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">ev</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">collection</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
@@ -409,24 +414,24 @@ in other collections are ignored.</p> </td> <td class="c
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
<span class="p">}</span>
- <span class="p">});</span></pre></div> </td> </tr> <tr id="section-77"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-77">¶</a> </div> <p>Underscore methods that we want to implement on the Collection.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span cla [...]
+ <span class="p">});</span></pre></div> </td> </tr> <tr id="section-78"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-78">¶</a> </div> <p>Underscore methods that we want to implement on the Collection.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span cla [...]
<span class="s1">'filter'</span><span class="p">,</span> <span class="s1">'select'</span><span class="p">,</span> <span class="s1">'reject'</span><span class="p">,</span> <span class="s1">'every'</span><span class="p">,</span> <span class="s1">'all'</span><span class="p">,</span> <span class="s1">'some'</span><span class="p">,</span> <span class="s1">'any'</span><span class="p">,</span> <span class="s1">'include'</span>< [...]
<span class="s1">'contains'</span><span class="p">,</span> <span class="s1">'invoke'</span><span class="p">,</span> <span class="s1">'max'</span><span class="p">,</span> <span class="s1">'min'</span><span class="p">,</span> <span class="s1">'sortBy'</span><span class="p">,</span> <span class="s1">'sortedIndex'</span><span class="p">,</span> <span class="s1">'toArray'</span><span class="p">,</span> <span class="s1">'size' [...]
- <span class="s1">'first'</span><span class="p">,</span> <span class="s1">'rest'</span><span class="p">,</span> <span class="s1">'last'</span><span class="p">,</span> <span class="s1">'without'</span><span class="p">,</span> <span class="s1">'indexOf'</span><span class="p">,</span> <span class="s1">'lastIndexOf'</span><span class="p">,</span> <span class="s1">'isEmpty'</span><span class="p">,</span> <span class="s1">'groupBy& [...]
+ <span class="s1">'first'</span><span class="p">,</span> <span class="s1">'rest'</span><span class="p">,</span> <span class="s1">'last'</span><span class="p">,</span> <span class="s1">'without'</span><span class="p">,</span> <span class="s1">'indexOf'</span><span class="p">,</span> <span class="s1">'lastIndexOf'</span><span class="p">,</span> <span class="s1">'isEmpty'</span><span class="p">,</span> <span class="s1">'groupBy& [...]
<span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">prototype</span><span class="p">[</span><span class="nx">method</span><span class="p">]</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">_</span><span class="p">[</span><span class="nx">method</span><span class="p">].</span><span class="nx">apply</span><span class="p">(</span><span class="nx">_</span><span class="p">,</span> <span class="p">[</span><span class="k">this</span><span class="p">.</span><span class="nx">models</span><span class="p">].</span><span class="nx">concat</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx" [...]
<span class="p">};</span>
- <span class="p">});</span></pre></div> </td> </tr> <tr id="section-79"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-79">¶</a> </div> <h2>Backbone.Router</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id=" [...]
+ <span class="p">});</span></pre></div> </td> </tr> <tr id="section-80"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-80">¶</a> </div> <h2>Backbone.Router</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id=" [...]
matched. Creating a new one sets its <code>routes</code> hash, if not set statically.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Router</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">options</span> <span class="o">||</span> <span class="p">(</span><span class="nx">options</span> <span class="o">=</span> <span class="p">{});</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">routes</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">routes</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">routes</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_bindRoutes</span><span class="p">();</span>
<span class="k">this</span><span class="p">.</span><span class="nx">initialize</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-81"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-81">¶</a> </div> <p>Cached regular expressions for matching named param parts and splatted
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-82"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-82">¶</a> </div> <p>Cached regular expressions for matching named param parts and splatted
parts of route strings.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">namedParam</span> <span class="o">=</span> <span class="sr">/:([\w\d]+)/g</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">splatParam</span> <span class="o">=</span> <span class="sr">/\*([\w\d]+)/g</span><span class="p">;</span>
- <span class="kd">var</span> <span class="nx">escapeRegExp</span> <span class="o">=</span> <span class="sr">/[-[\]{}()+?.,\\^$|#\s]/g</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-82"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-82">¶</a> </div> <p>Set up all inheritable <strong>Backbone.Router</strong> pro [...]
-initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-84"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-84">¶</a> </div> [...]
+ <span class="kd">var</span> <span class="nx">escapeRegExp</span> <span class="o">=</span> <span class="sr">/[-[\]{}()+?.,\\^$|#\s]/g</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-83"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-83">¶</a> </div> <p>Set up all inheritable <strong>Backbone.Router</strong> pro [...]
+initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-85"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-85">¶</a> </div> [...]
<pre><code>this.route('search/:query/p:num', 'search', function(query, num) {
...
@@ -436,12 +441,12 @@ initialization logic.</p> </td> <td class="code">
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">_</span><span class="p">.</span><span class="nx">isRegExp</span><span class="p">(</span><span class="nx">route</span><span class="p">))</span> <span class="nx">route</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_routeToRegExp</span><span class="p">(</span><span class="nx">route</span><span class="p">);</span>
<span class="nx">Backbone</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">route</span><span class="p">(</span><span class="nx">route</span><span class="p">,</span> <span class="nx">_</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">fragment</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">args</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_extractParameters</span><span class="p">(</span><span class="nx">route</span><span class="p">,</span> <span class="nx">fragment</span><span class="p">);</span>
- <span class="nx">callback</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">args</span><span class="p">);</span>
+ <span class="nx">callback</span> <span class="o">&&</span> <span class="nx">callback</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">args</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="p">[</span><span class="s1">'route:'</span> <span class="o">+</span> <span class="nx">name</span><span class="p">].</span><span class="nx">concat</span><span class="p">(</span><span class="nx">args</span><span class="p">));</span>
<span class="p">},</span> <span class="k">this</span><span class="p">));</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-85"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-85">¶</a> </div> <p>Simple proxy to <code>Backbone.history</code> to save a fragment into the history.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx [...]
- <span class="nx">Backbone</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="nx">fragment</span><span class="p">,</span> <span class="nx">triggerRoute</span><span class="p">);</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-86"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-86">¶</a> </div> <p>Bind all defined routes to <code>Backbone.history</code>. We have to reverse the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-86"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-86">¶</a> </div> <p>Simple proxy to <code>Backbone.history</code> to save a fragment into the history.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx [...]
+ <span class="nx">Backbone</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="nx">fragment</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-87"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-87">¶</a> </div> <p>Bind all defined routes to <code>Backbone.history</code>. We have to reverse the
order of the routes here to support behavior where the most general
routes can be defined at the bottom of the route map.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_bindRoutes</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">routes</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span>
@@ -452,37 +457,38 @@ routes can be defined at the bottom of the route map.</p> </td>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">l</span> <span class="o">=</span> <span class="nx">routes</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">l</span><span class="p">;</span> <span class="nx">i</span><span class="o">+ [...]
<span class="k">this</span><span class="p">.</span><span class="nx">route</span><span class="p">(</span><span class="nx">routes</span><span class="p">[</span><span class="nx">i</span><span class="p">][</span><span class="mi">0</span><span class="p">],</span> <span class="nx">routes</span><span class="p">[</span><span class="nx">i</span><span class="p">][</span><span class="mi">1</span><span class="p">],</span> <span class="k">this</span><span class="p">[</span><span class="nx">ro [...]
<span class="p">}</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-87"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-87">¶</a> </div> <p>Convert a route string into a regular expression, suitable for matching
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-88"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-88">¶</a> </div> <p>Convert a route string into a regular expression, suitable for matching
against the current location hash.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_routeToRegExp</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">route</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">route</span> <span class="o">=</span> <span class="nx">route</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">escapeRegExp</span><span class="p">,</span> <span class="s2">"\\$&"</span><span class="p">)</span>
<span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">namedParam</span><span class="p">,</span> <span class="s2">"([^\/]*)"</span><span class="p">)</span>
<span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">splatParam</span><span class="p">,</span> <span class="s2">"(.*?)"</span><span class="p">);</span>
<span class="k">return</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s1">'^'</span> <span class="o">+</span> <span class="nx">route</span> <span class="o">+</span> <span class="s1">'$'</span><span class="p">);</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-88"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-88">¶</a> </div> <p>Given a route, and a URL fragment that it matches, return the array of
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-89"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-89">¶</a> </div> <p>Given a route, and a URL fragment that it matches, return the array of
extracted parameters.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_extractParameters</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">route</span><span class="p">,</span> <span class="nx">fragment</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">route</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">fragment</span><span class="p">).</span><span class="nx">slice</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
<span class="p">}</span>
- <span class="p">});</span></pre></div> </td> </tr> <tr id="section-89"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-89">¶</a> </div> <h2>Backbone.History</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id= [...]
+ <span class="p">});</span></pre></div> </td> </tr> <tr id="section-90"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-90">¶</a> </div> <h2>Backbone.History</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id= [...]
browser does not support <code>onhashchange</code>, falls back to polling.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">History</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">handlers</span> <span class="o">=</span> <span class="p">[];</span>
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'checkUrl'</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-91"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-91">¶</a> </div> <p>Cached regex for cleaning hashes.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">hashStrip</span> <span [...]
-twenty times a second.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">interval</span><span class="o">:</span> <span class="mi">50</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-96"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-96">¶</a> </div> [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-92"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-92">¶</a> </div> <p>Cached regex for cleaning hashes.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">hashStrip</span> <span [...]
+twenty times a second.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">interval</span><span class="o">:</span> <span class="mi">50</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-97"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-97">¶</a> </div> [...]
the hash, or the override.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getFragment</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fragment</span><span class="p">,</span> <span class="nx">forcePushState</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">fragment</span> <span class="o">==</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_hasPushState</span> <span class="o">||</span> <span class="nx">forcePushState</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">fragment</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">pathname</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">search</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">search</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">search</span><span class="p">)</span> <span class="nx">fragment</span> <span class="o">+=</span> <span class="nx">search</span><span class="p">;</span>
- <span class="k">if</span> <span class="p">(</span><span class="nx">fragment</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">root</span><span class="p">)</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="nx">fragment</span> <span class="o">=</span> <span class="nx">fragment</s [...]
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">fragment</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
- <span class="k">return</span> <span class="nb">decodeURIComponent</span><span class="p">(</span><span class="nx">fragment</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">hashStrip</span><span class="p">,</span> <span class="s1">''</span><span class="p">));</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-97"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-97">¶</a> </div> <p>Start the hash change handling, returning <code>true</code> if the current URL matches
-an existing route, and <code>false</code> otherwise.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">start</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-98"> <td class="docs"> <div cla [...]
+ <span class="nx">fragment</span> <span class="o">=</span> <span class="nb">decodeURIComponent</span><span class="p">(</span><span class="nx">fragment</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">hashStrip</span><span class="p">,</span> <span class="s1">''</span><span class="p">));</span>
+ <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">fragment</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">root</span><span class="p">))</span> <span class="nx">fragment</span> <span class="o">=</span> <span class="nx">fragment</span><span class="p">.</span><span class="nx">substr</sp [...]
+ <span class="k">return</span> <span class="nx">fragment</span><span class="p">;</span>
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-98"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-98">¶</a> </div> <p>Start the hash change handling, returning <code>true</code> if the current URL matches
+an existing route, and <code>false</code> otherwise.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">start</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-99"> <td class="docs"> <div cla [...]
Is pushState desired ... is it available?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">historyStarted</span><span class="p">)</span> <span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s2">"Backbone.history has already been started"</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">options</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({},</span> <span class="p">{</span><span class="nx">root</span><span class="o">:</span> <span class="s1">'/'</span><span class="p">},</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">,</span> <span class="nx"> [...]
<span class="k">this</span><span class="p">.</span><span class="nx">_wantsPushState</span> <span class="o">=</span> <span class="o">!!</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">pushState</span><span class="p">;</span>
@@ -493,21 +499,21 @@ Is pushState desired ... is it available?</p> </td> <td
<span class="k">if</span> <span class="p">(</span><span class="nx">oldIE</span><span class="p">)</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">iframe</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'<iframe src="javascript:0" tabindex="-1" />'</span><span class="p">).</span><span class="nx">hide</span><span class="p">().</span><span class="nx">appendTo</span><span class="p">(</span><span class="s1">'body'</span><span class="p">)[</span><span class="mi">0</span><s [...]
<span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="nx">fragment</span><span class="p">);</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-99"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-99">¶</a> </div> <p>Depending on whether we're using pushState or hashes, and whether
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-100"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-100">¶</a> </div> <p>Depending on whether we're using pushState or hashes, and whether
'onhashchange' is supported, determine how we check the URL state.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_hasPushState</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'popstate'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">checkUrl</span><span class="p">);</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="s1">'onhashchange'</span> <span class="k">in</span> <span class="nb">window</span> <span class="o">&&</span> <span class="o">!</span><span class="nx">oldIE</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'hashchange'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">checkUrl</span><span class="p">);</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">setInterval</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">checkUrl</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">interval</span><span class="p">);</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-100"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-100">¶</a> </div> <p>Determine if we need to change the base url, for a pushState link
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-101"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-101">¶</a> </div> <p>Determine if we need to change the base url, for a pushState link
opened by a non-pushState browser.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="nx">fragment</span><span class="p">;</span>
<span class="nx">historyStarted</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">loc</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">atRoot</span> <span class="o">=</span> <span class="nx">loc</span><span class="p">.</span><span class="nx">pathname</span> <span class="o">==</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">root</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_wantsPushState</span> <span class="o">&&</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">_hasPushState</span> <span class="o">&&</span> <span class="o">!</span><span class="nx">atRoot</span><span class="p">)</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFragment</span><span class="p">(</span><span class="kc">null</span><span class="p">,</span> <span class="kc">true</span><span class="p">);</span>
- <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">root</span> <span class="o">+</span> <span class="s1">'#'</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span><span class="p" [...]
+ <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">root</span> <span class="o">+</span> <span class="s1">'#'</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span><span class="p" [...]
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_wantsPushState</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">_hasPushState</span> <span class="o">&&</span> <span class="nx">atRoot</span> <span class="o">&&</span> <span class="nx">loc</span><span class="p">.</span><span class="nx">ha [...]
<span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="nx">loc</span><span class="p">.</span><span class="nx">hash</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">hashStrip</span><span class="p">,</span> <span class="s1">''</span><span class="p">);</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">replaceState</span><span class="p">({},</span> <span class="nb">document</span><span class="p">.</span><span class="nx">title</span><span class="p">,</span> <span class="nx">loc</span><span class="p">.</span><span class="nx">protocol</span> <span class="o">+</span> <span class="s1">'//'</span> <span class="o">+</span> <span class="nx">loc</span><sp [...]
@@ -516,17 +522,17 @@ opened by a non-pushState browser.</p> </td> <td class="
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">silent</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">loadUrl</span><span class="p">();</span>
<span class="p">}</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-102"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-102">¶</a> </div> <p>Add a route to be tested when the fragment changes. Routes added later may
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-103"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-103">¶</a> </div> <p>Add a route to be tested when the fragment changes. Routes added later may
override previous routes.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">route</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">route</span><span class="p">,</span> <span class="nx">callback</span><span class="p">)</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">handlers</span><span class="p">.</span><span class="nx">unshift</span><span class="p">({</span><span class="nx">route</span> <span class="o">:</span> <span class="nx">route</span><span class="p">,</span> <span class="nx">callback</span> <span class="o">:</span> <span class="nx">callback</span><span class="p">});</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-103"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-103">¶</a> </div> <p>Checks the current URL to see if it has changed, and if it has,
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-104"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-104">¶</a> </div> <p>Checks the current URL to see if it has changed, and if it has,
calls <code>loadUrl</code>, normalizing across the hidden iframe.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">checkUrl</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">current</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFragment</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">current</span> <span class="o">==</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">)</span> <span class="nx">current</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFragment</span><span class [...]
<span class="k">if</span> <span class="p">(</span><span class="nx">current</span> <span class="o">==</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">||</span> <span class="nx">current</span> <span class="o">==</span> <span class="nb">decodeURIComponent</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">fragment</span><span class="p">))</span> <span class="k">return</span> <span [...]
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="nx">current</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">loadUrl</span><span class="p">()</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">loadUrl</span><span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span><span class="p">);</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-104"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-104">¶</a> </div> <p>Attempt to load the current URL fragment. If a route succeeds with a
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-105"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-105">¶</a> </div> <p>Attempt to load the current URL fragment. If a route succeeds with a
match, returns <code>true</code>. If no defined routes matches the fragment,
returns <code>false</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">loadUrl</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fragmentOverride</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">fragment</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFragment</span><span class="p">(</span><span class="nx">fragmentOverride</span><span class="p">);</span>
@@ -537,47 +543,72 @@ returns <code>false</code>.</p> </td> <td class="code">
<span class="p">}</span>
<span class="p">});</span>
<span class="k">return</span> <span class="nx">matched</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-105"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-105">¶</a> </div> <p>Save a fragment into the hash history. You are responsible for properly
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-106"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-106">¶</a> </div> <p>Save a fragment into the hash history, or replace the URL state
+if the 'replace' option is passed. You are responsible for properly
URL-encoding the fragment in advance. This does not trigger
-a <code>hashchange</code> event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">navigate</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fragment</span><span class="p">,</span> <span class="nx">triggerRoute</span><span class="p">)</span> <span class="p">{</span>
+a <code>hashchange</code> event.
+parameters:</p>
+
+<ul>
+<li>fragment: the URL fragment to navigate to (the portion after the '#')</li>
+<li><p>options: An object with the following parameters:
+ - trigger: call the route corresponding to the provided fragment
+ - replace: Navigate such that the back button will
+ not return to this current state.</p>
+
+<pre><code> To comply with earlier API specifications, passing
+ true/false for options will be interpretted as
+ {options: trigger: true/false}
+</code></pre></li>
+</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">navigate</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fragment</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
+ <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">options</span> <span class="o">||</span> <span class="k">typeof</span> <span class="nx">options</span> <span class="o">===</span> <span class="s1">'boolean'</span><span class="p">)</span> <span class="nx">options</span> <span class="o">=</span> <span class="p">{</span><span class="nx">trigger</span><span class="o">:</span> <span class="nx">options</span><span class="p">};</span>
<span class="kd">var</span> <span class="nx">frag</span> <span class="o">=</span> <span class="p">(</span><span class="nx">fragment</span> <span class="o">||</span> <span class="s1">''</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="nx">hashStrip</span><span class="p">,</span> <span class="s1">''</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">==</span> <span class="nx">frag</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">==</span> <span class="nb">decodeURIComponent</span><span class="p">(</span><span class="nx">frag</span><span class="p">))</span> <span class="k">return</span><span class= [...]
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_hasPushState</span><span class="p">)</span> <span class="p">{</span>
- <span class="kd">var</span> <span class="nx">loc</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">frag</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">root</span><span class="p">)</span> <span class="o">!=</span> <span class="mi">0</span><span class="p">)</span> <span class="nx">frag</span> <span class="o">=</span> <span class="k">this</span><span class [...]
<span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="nx">frag</span><span class="p">;</span>
- <span class="nb">window</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">pushState</span><span class="p">({},</span> <span class="nb">document</span><span class="p">.</span><span class="nx">title</span><span class="p">,</span> <span class="nx">loc</span><span class="p">.</span><span class="nx">protocol</span> <span class="o">+</span> <span class="s1">'//'</span> <span class="o">+</span> <span class="nx">loc</span><span [...]
+ <span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">replace</span><span class="p">)</span> <span class="p">{</span>
+ <span class="nb">window</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">replaceState</span><span class="p">({},</span> <span class="nb">document</span><span class="p">.</span><span class="nx">title</span><span class="p">,</span> <span class="nx">frag</span><span class="p">);</span>
+ <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
+ <span class="nb">window</span><span class="p">.</span><span class="nx">history</span><span class="p">.</span><span class="nx">pushState</span><span class="p">({},</span> <span class="nb">document</span><span class="p">.</span><span class="nx">title</span><span class="p">,</span> <span class="nx">frag</span><span class="p">);</span>
+ <span class="p">}</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
- <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="nx">frag</span><span class="p">;</span>
- <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">iframe</span> <span class="o">&&</span> <span class="p">(</span><span class="nx">frag</span> <span class="o">!=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFragment</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">.</span><span class="nx">locatio [...]
- <span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">.</span><span class="nb">document</span><span class="p">.</span><span class="nx">open</span><span class="p">().</span><span class="nx">close</span><span class="p">();</span>
- <span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span> <span class="o">=</span> <span class="nx">frag</span><span class="p">;</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">fragment</span> <span class="o">=</span> <span class="nx">frag</span><span class="p">;</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">_updateLocationHash</span><span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">,</span> <span class="nx">frag</span><span class="p">,</span> <span class="nx">options</span><span class="p">.</span><span class="nx">replace</span><span class="p">);</span>
+ <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">iframe</span> <span class="o">&&</span> <span class="p">(</span><span class="nx">frag</span> <span class="o">!=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFragment</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">.</span><span class="nx">locatio [...]
+When replace is true, we don't want this.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span><span class="p">(</span><span class="o">!</span><span class="nx">options</span><span class="p">.</span><span class="nx">replace</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">.</span><span class="nb">document</span><span class="p">.</span>< [...]
+ <span class="k">this</span><span class="p">.</span><span class="nx">_updateLocationHash</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">iframe</span><span class="p">.</span><span class="nx">location</span><span class="p">,</span> <span class="nx">frag</span><span class="p">,</span> <span class="nx">options</span><span class="p">.</span><span class="nx">replace</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
- <span class="k">if</span> <span class="p">(</span><span class="nx">triggerRoute</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">loadUrl</span><span class="p">(</span><span class="nx">fragment</span><span class="p">);</span>
+ <span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">trigger</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">loadUrl</span><span class="p">(</span><span class="nx">fragment</span><span class="p">);</span>
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-108"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-108">¶</a> </div> <p>Since you can't run <code>location.replace</code> on a hash fragment, this
+helper function provides an effective work-around.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_updateLocationHash</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">location</span><span class="p">,</span> <span class="nx">new_fragment</span><span class="p">,</span> <span class="nx">replace</span><span class="p">)</span> <span class="p">{</span>
+ <span class="k">if</span> <span class="p">(</span><span class="nx">replace</span><span class="p">)</span>
+ <span class="nx">location</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">location</span><span class="p">.</span><span class="nx">toString</span><span class="p">().</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/#.*$/</span><span class="p">,</span> <span class="s2">""</span><span class="p">)</span> <span class="o">+</span> <span class="s2">"#"</span> <span class="o">+</span> [...]
+ <span class="k">else</span>
+ <span class="nx">location</span><span class="p">.</span><span class="nx">hash</span> <span class="o">=</span> <span class="nx">new_fragment</span><span class="p">;</span>
<span class="p">}</span>
-
- <span class="p">});</span></pre></div> </td> </tr> <tr id="section-106"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-106">¶</a> </div> <h2>Backbone.View</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id=" [...]
+ <span class="p">});</span></pre></div> </td> </tr> <tr id="section-109"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-109">¶</a> </div> <h2>Backbone.View</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id=" [...]
if an existing element is not provided...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">cid</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">uniqueId</span><span class="p">(</span><span class="s1">'view'</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_configure</span><span class="p">(</span><span class="nx">options</span> <span class="o">||</span> <span class="p">{});</span>
<span class="k">this</span><span class="p">.</span><span class="nx">_ensureElement</span><span class="p">();</span>
<span class="k">this</span><span class="p">.</span><span class="nx">delegateEvents</span><span class="p">();</span>
<span class="k">this</span><span class="p">.</span><span class="nx">initialize</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-108"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-108">¶</a> </div> <p>Element lookup, scoped to DOM elements within the current view.
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-111"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-111">¶</a> </div> <p>Element lookup, scoped to DOM elements within the current view.
This should be prefered to global lookups, if you're dealing with
a specific view.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">selectorDelegate</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">selector</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="nx">selector</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-109"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-109">¶</a> </div> <p>Cached regex to split keys for <code>delegate</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">e [...]
-initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-115"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-115">¶</a> </div> [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-112"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-112">¶</a> </div> <p>Cached regex to split keys for <code>delegate</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">e [...]
+initialization logic.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(){},</span></pre></div> </td> </tr> <tr id="section-118"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-118">¶</a> </div> [...]
to populate its element (<code>this.el</code>), with the appropriate HTML. The
convention is for <strong>render</strong> to always return <code>this</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">render</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-116"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-116">¶</a> </div> <p>Remove this view from the DOM. Note that the view isn't present in the
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-119"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-119">¶</a> </div> <p>Remove this view from the DOM. Note that the view isn't present in the
DOM by default, so calling this method may be a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">remove</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">remove</span><span class="p">();</span>
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-117"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-117">¶</a> </div> <p>For small amounts of DOM Elements, where a full-blown template isn't
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-120"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-120">¶</a> </div> <p>For small amounts of DOM Elements, where a full-blown template isn't
needed, use <strong>make</strong> to manufacture elements, one at a time.</p>
<pre><code>var el = this.make('li', {'class': 'row'}, this.model.escape('title'));
@@ -586,7 +617,7 @@ needed, use <strong>make</strong> to manufacture elements, one at a time.</p>
<span class="k">if</span> <span class="p">(</span><span class="nx">attributes</span><span class="p">)</span> <span class="nx">$</span><span class="p">(</span><span class="nx">el</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="nx">attributes</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">content</span><span class="p">)</span> <span class="nx">$</span><span class="p">(</span><span class="nx">el</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">content</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">el</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-118"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-118">¶</a> </div> <p>Set callbacks, where <code>this.callbacks</code> is a hash of</p>
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-121"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-121">¶</a> </div> <p>Set callbacks, where <code>this.events</code> is a hash of</p>
<p><em>{"event selector": "callback"}</em></p>
@@ -603,7 +634,7 @@ This only works for delegate-able events: not <code>focus</code>, <code>blur</co
not <code>change</code>, <code>submit</code>, and <code>reset</code> in Internet Explorer.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">delegateEvents</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">events</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">events</span> <span class="o">||</span> <span class="p">(</span><span class="nx">events</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">events</span><span class="p">)))</span> <span class="k">return</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">isFunction</span><span class="p">(</span><span class="nx">events</span><span class="p">))</span> <span class="nx">events</span> <span class="o">=</span> <span class="nx">events</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
- <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">unbind</span><span class="p">(</span><span class="s1">'.delegateEvents'</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">cid</span><span class="p">);</span>
+ <span class="k">this</span><span class="p">.</span><span class="nx">undelegateEvents</span><span class="p">();</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">key</span> <span class="k">in</span> <span class="nx">events</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">method</span> <span class="o">=</span> <span class="k">this</span><span class="p">[</span><span class="nx">events</span><span class="p">[</span><span class="nx">key</span><span class="p">]];</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">method</span><span class="p">)</span> <span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s1">'Event "'</span> <span class="o">+</span> <span class="nx">events</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">+</span> <span class="s1">'" does not exist [...]
@@ -617,7 +648,9 @@ not <code>change</code>, <code>submit</code>, and <code>reset</code> in Internet
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">delegate</span><span class="p">(</span><span class="nx">selector</span><span class="p">,</span> <span class="nx">eventName</span><span class="p">,</span> <span class="nx">method</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-119"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-119">¶</a> </div> <p>Performs the initial configuration of a View with a set of options.
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-122"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-122">¶</a> </div> <p>Clears all callbacks previously bound to the view with <code>delegateEvents</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class= [...]
+ <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">unbind</span><span class="p">(</span><span class="s1">'.delegateEvents'</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">cid</span><span class="p">);</span>
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-123"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-123">¶</a> </div> <p>Performs the initial configuration of a View with a set of options.
Keys with special meaning <em>(model, collection, id, className)</em>, are
attached directly to the view.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_configure</span> <span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">)</span> <span class="nx">options</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({},</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
@@ -626,10 +659,10 @@ attached directly to the view.</p> </td> <td class="code
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">[</span><span class="nx">attr</span><span class="p">])</span> <span class="k">this</span><span class="p">[</span><span class="nx">attr</span><span class="p">]</span> <span class="o">=</span> <span class="nx">options</span><span class="p">[</span><span class="nx">attr</span><span class="p">];</span>
<span class="p">}</span>
<span class="k">this</span><span class="p">.</span><span class="nx">options</span> <span class="o">=</span> <span class="nx">options</span><span class="p">;</span>
- <span class="p">},</span></pre></div> </td> </tr> <tr id="section-120"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-120">¶</a> </div> <p>Ensure that the View has a DOM element to render into.
+ <span class="p">},</span></pre></div> </td> </tr> <tr id="section-124"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-124">¶</a> </div> <p>Ensure that the View has a DOM element to render into.
If <code>this.el</code> is a string, pass it through <code>$()</code>, take the first
matching element, and re-assign it to <code>el</code>. Otherwise, create
-an element from the <code>id</code>, <code>className</code> and <code>tagName</code> proeprties.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_ensureElement</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+an element from the <code>id</code>, <code>className</code> and <code>tagName</code> properties.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_ensureElement</span> <span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">attrs</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span> <span class="o">||</span> <span class="p">{};</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">id</span><span class="p">)</span> <span class="nx">attrs</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">id</span><span class="p">;</span>
@@ -640,19 +673,19 @@ an element from the <code>id</code>, <code>className</code> and <code>tagName</c
<span class="p">}</span>
<span class="p">}</span>
- <span class="p">});</span></pre></div> </td> </tr> <tr id="section-121"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-121">¶</a> </div> <p>The self-propagating extend function that Backbone classes use.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span c [...]
+ <span class="p">});</span></pre></div> </td> </tr> <tr id="section-125"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-125">¶</a> </div> <p>The self-propagating extend function that Backbone classes use.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span c [...]
<span class="kd">var</span> <span class="nx">child</span> <span class="o">=</span> <span class="nx">inherits</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">protoProps</span><span class="p">,</span> <span class="nx">classProps</span><span class="p">);</span>
<span class="nx">child</span><span class="p">.</span><span class="nx">extend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">extend</span><span class="p">;</span>
<span class="k">return</span> <span class="nx">child</span><span class="p">;</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-122"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-122">¶</a> </div> <p>Set up inheritance for the model, collection, and view.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class= [...]
- <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Router</span><span class="p">.</span><span class="nx">extend</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span> <span class="o">=</span> <span class="nx">extend</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-123"> [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-126"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-126">¶</a> </div> <p>Set up inheritance for the model, collection, and view.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class= [...]
+ <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Router</span><span class="p">.</span><span class="nx">extend</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span> <span class="o">=</span> <span class="nx">extend</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-127"> [...]
<span class="s1">'create'</span><span class="o">:</span> <span class="s1">'POST'</span><span class="p">,</span>
<span class="s1">'update'</span><span class="o">:</span> <span class="s1">'PUT'</span><span class="p">,</span>
<span class="s1">'delete'</span><span class="o">:</span> <span class="s1">'DELETE'</span><span class="p">,</span>
<span class="s1">'read'</span> <span class="o">:</span> <span class="s1">'GET'</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-124"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-124">¶</a> </div> <h2>Backbone.sync</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="s [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-128"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-128">¶</a> </div> <h2>Backbone.sync</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="s [...]
models to the server. You will be passed the type of request, and the
-model in question. By default, uses makes a RESTful Ajax request
+model in question. By default, makes a RESTful Ajax request
to the model's <code>url()</code>. Some possible customizations could be:</p>
<ul>
@@ -667,18 +700,15 @@ as well as all requests with the body as <code>application/x-www-form-urlencoded
<code>application/json</code> with the model in a param named <code>model</code>.
Useful when interfacing with server-side languages like <strong>PHP</strong> that make
it difficult to read the body of <code>PUT</code> requests.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span [...]
- <span class="kd">var</span> <span class="nx">type</span> <span class="o">=</span> <span class="nx">methodMap</span><span class="p">[</span><span class="nx">method</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-126"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-126">¶</a> </div> <p>Default JSON-request opti [...]
- <span class="nx">type</span><span class="o">:</span> <span class="nx">type</span><span class="p">,</span>
- <span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
- <span class="p">},</span> <span class="nx">options</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-127"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-127">¶</a> </div> <p>Ensure that we have a URL.</p> </td> <td class="code"> <div class="highlight"><pre> <span class= [...]
+ <span class="kd">var</span> <span class="nx">type</span> <span class="o">=</span> <span class="nx">methodMap</span><span class="p">[</span><span class="nx">method</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-130"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-130">¶</a> </div> <p>Default JSON-request opti [...]
<span class="nx">params</span><span class="p">.</span><span class="nx">url</span> <span class="o">=</span> <span class="nx">getUrl</span><span class="p">(</span><span class="nx">model</span><span class="p">)</span> <span class="o">||</span> <span class="nx">urlError</span><span class="p">();</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-128"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-128">¶</a> </div> <p>Ensure that we have the appropriate request data.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</sp [...]
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-132"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-132">¶</a> </div> <p>Ensure that we have the appropriate request data.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</sp [...]
<span class="nx">params</span><span class="p">.</span><span class="nx">contentType</span> <span class="o">=</span> <span class="s1">'application/json'</span><span class="p">;</span>
<span class="nx">params</span><span class="p">.</span><span class="nx">data</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-129"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-129">¶</a> </div> <p>For older servers, emulate JSON by encoding the request into an HTML-form.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</sp [...]
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-133"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-133">¶</a> </div> <p>For older servers, emulate JSON by encoding the request into an HTML-form.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</sp [...]
<span class="nx">params</span><span class="p">.</span><span class="nx">contentType</span> <span class="o">=</span> <span class="s1">'application/x-www-form-urlencoded'</span><span class="p">;</span>
- <span class="nx">params</span><span class="p">.</span><span class="nx">data</span> <span class="o">=</span> <span class="nx">params</span><span class="p">.</span><span class="nx">data</span> <span class="o">?</span> <span class="p">{</span><span class="nx">model</span> <span class="o">:</span> <span class="nx">params</span><span class="p">.</span><span class="nx">data</span><span class="p">}</span> <span class="o">:</span> <span class="p">{};</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-130"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-130">¶</a> </div> <p>For older servers, emulate HTTP by mimicking the HTTP method with <code>_method</code>
+ <span class="nx">params</span><span class="p">.</span><span class="nx">data</span> <span class="o">=</span> <span class="nx">params</span><span class="p">.</span><span class="nx">data</span> <span class="o">?</span> <span class="p">{</span><span class="nx">model</span> <span class="o">:</span> <span class="nx">params</span><span class="p">.</span><span class="nx">data</span><span class="p">}</span> <span class="o">:</span> <span class="p">{};</span>
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-134"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-134">¶</a> </div> <p>For older servers, emulate HTTP by mimicking the HTTP method with <code>_method</code>
And an <code>X-HTTP-Method-Override</code> header.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">Backbone</span><span class="p">.</span><span class="nx">emulateHTTP</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">type</span> <span class="o">===</span> <span class="s1">'PUT'</span> <span class="o">||</span> <span class="nx">type</span> <span class="o">===</span> <span class="s1">'DELETE'</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">Backbone</span><span class="p">.</span><span class="nx">emulateJSON</span><span class="p">)</span> <span class="nx">params</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">_method</span> <span class="o">=</span> <span class="nx">type</span><span class="p">;</span>
@@ -687,40 +717,39 @@ And an <code>X-HTTP-Method-Override</code> header.</p> </td>
<span class="nx">xhr</span><span class="p">.</span><span class="nx">setRequestHeader</span><span class="p">(</span><span class="s1">'X-HTTP-Method-Override'</span><span class="p">,</span> <span class="nx">type</span><span class="p">);</span>
<span class="p">};</span>
<span class="p">}</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-131"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-131">¶</a> </div> <p>Don't process data on a non-GET request.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span [...]
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-135"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-135">¶</a> </div> <p>Don't process data on a non-GET request.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span [...]
<span class="nx">params</span><span class="p">.</span><span class="nx">processData</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-132"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-132">¶</a> </div> <p>Make the request.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">$</span><span class="p">.</span> [...]
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-133"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-133">¶</a> </div> <h2>Helpers</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section [...]
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-136"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-136">¶</a> </div> <p>Make the request, allowing the user to override any Ajax options.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> < [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-137"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-137">¶</a> </div> <h2>Helpers</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section [...]
Similar to <code>goog.inherits</code>, but uses a hash of prototype properties and
class properties to be extended.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">inherits</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">parent</span><span class="p">,</span> <span class="nx">protoProps</span><span class="p">,</span> <span class="nx">staticProps</span><span class="p">)</span> <span class="p">{</span>
- <span class="kd">var</span> <span class="nx">child</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-136"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-136">¶</a> </div> <p>The constructor function for the new subclass is either defined by you
+ <span class="kd">var</span> <span class="nx">child</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-140"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-140">¶</a> </div> <p>The constructor function for the new subclass is either defined by you
(the "constructor" property in your <code>extend</code> definition), or defaulted
by us to simply call <code>super()</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">protoProps</span> <span class="o">&&</span> <span class="nx">protoProps</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="s1">'constructor'</span><span class="p">))</span> <span class="p">{</span>
<span class="nx">child</span> <span class="o">=</span> <span class="nx">protoProps</span><span class="p">.</span><span class="nx">constructor</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">child</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span> <span class="k">return</span> <span class="nx">parent</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span> <span class="p">};</span>
- <span class="p">}</span></pre></div> </td> </tr> <tr id="section-137"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-137">¶</a> </div> <p>Inherit class (static) properties from parent.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span>< [...]
+ <span class="p">}</span></pre></div> </td> </tr> <tr id="section-141"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-141">¶</a> </div> <p>Inherit class (static) properties from parent.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span>< [...]
<code>parent</code>'s constructor function.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">ctor</span><span class="p">.</span><span class="nx">prototype</span> <span class="o">=</span> <span class="nx">parent</span><span class="p">.</span><span class="nx">prototype</span><span class="p">;</span>
- <span class="nx">child</span><span class="p">.</span><span class="nx">prototype</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">ctor</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-139"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-139">¶</a> </div> <p>Add prototype properties ( [...]
-if supplied.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">protoProps</span><span class="p">)</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">child</span><span class="p">.</span><span class="nx">prototype</span><span class="p">,</span> <span class="nx">protoProps</span><span class="p">);</span [...]
+ <span class="nx">child</span><span class="p">.</span><span class="nx">prototype</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">ctor</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-143"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-143">¶</a> </div> <p>Add prototype properties ( [...]
+if supplied.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">protoProps</span><span class="p">)</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">child</span><span class="p">.</span><span class="nx">prototype</span><span class="p">,</span> <span class="nx">protoProps</span><span class="p">);</span [...]
<span class="k">return</span> <span class="nx">child</span><span class="p">;</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-143"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-143">¶</a> </div> <p>Helper function to get a URL from a Model or Collection as a property
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-147"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-147">¶</a> </div> <p>Helper function to get a URL from a Model or Collection as a property
or as a function.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">getUrl</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">object</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">object</span> <span class="o">&&</span> <span class="nx">object</span><span class="p">.</span><span class="nx">url</span><span class="p">))</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="k">return</span> <span class="nx">_</span><span class="p">.</span><span class="nx">isFunction</span><span class="p">(</span><span class="nx">object</span><span class="p">.</span><span class="nx">url</span><span class="p">)</span> <span class="o">?</span> <span class="nx">object</span><span class="p">.</span><span class="nx">url</span><span class="p">()</span> <span class="o">:</span> <span class="nx">object</span><span class="p">.</span><span class="nx">url</span><span c [...]
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-144"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-144">¶</a> </div> <p>Throw an error when a URL is needed, and none is supplied.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class=" [...]
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-148"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-148">¶</a> </div> <p>Throw an error when a URL is needed, and none is supplied.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class=" [...]
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s1">'A "url" property or function must be specified'</span><span class="p">);</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-145"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-145">¶</a> </div> <p>Wrap an optional error callback with a fallback error event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class [...]
- <span class="k">return</span> <span class="kd">function</span><span class="p">(</span><span class="nx">resp</span><span class="p">)</span> <span class="p">{</span>
+ <span class="p">};</span></pre></div> </td> </tr> <tr id="section-149"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-149">¶</a> </div> <p>Wrap an optional error callback with a fallback error event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class [...]
+ <span class="k">return</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">resp</span><span class="p">)</span> <span class="p">{</span>
+ <span class="kd">var</span> <span class="nx">resp</span> <span class="o">=</span> <span class="nx">model</span> <span class="o">===</span> <span class="nx">originalModel</span> <span class="o">?</span> <span class="nx">resp</span> <span class="o">:</span> <span class="nx">model</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">onError</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">onError</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">resp</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
- <span class="nx">model</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'error'</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">resp</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
+ <span class="nx">originalModel</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'error'</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">resp</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">};</span>
- <span class="p">};</span></pre></div> </td> </tr> <tr id="section-146"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-146">¶</a> </div> <p>Helper function to escape a string for HTML rendering.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx"> [...]
- <span class="k">return</span> <span class="nx">string</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/&(?!\w+;|#\d+;|#x[\da-f]+;)/gi</span><span class="p">,</span> <span class="s1">'&'</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/</g</span><span class="p">,</span> <span class="s1">'<'</span><span class="p">).</span><span class="nx">re [...]
<span class="p">};</span>
<span class="p">}).</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
diff --git a/index.html b/index.html
index c697f47..7a0946d 100644
--- a/index.html
+++ b/index.html
@@ -1564,11 +1564,14 @@ initialize: function(options) {
</pre>
<p id="Router-navigate">
- <b class="header">navigate</b><code>router.navigate(fragment, [triggerRoute])</code>
+ <b class="header">navigate</b><code>router.navigate(fragment, [options])</code>
<br />
Whenever you reach a point in your application that you'd like to save
as a URL, call <b>navigate</b> in order to update the URL.
- If you wish to also call the route function, pass <b>triggerRoute</b>.
+ If you wish to also call the route function, set the <b>trigger</b>
+ option to <tt>true</tt>.
+ To update the URL without creating an entry in the browser's history,
+ set the <b>replace</b> option to <tt>true</tt>.
</p>
<pre>
@@ -1579,7 +1582,11 @@ openPage: function(pageNumber) {
# Or ...
-app.navigate("help/troubleshooting", true);
+app.navigate("help/troubleshooting", {trigger: true});
+
+# Or ...
+
+app.navigate("help/troubleshooting", {trigger: true, replace: true});
</pre>
<h2 id="History">Backbone.history</h2>
diff --git a/test/router.js b/test/router.js
index 4e84023..18b6432 100644
--- a/test/router.js
+++ b/test/router.js
@@ -75,11 +75,31 @@ $(document).ready(function() {
});
test("Router: routes via navigate", 2, function() {
+ Backbone.history.navigate('search/manhattan/p20', {trigger: true});
+ equals(router.query, 'manhattan');
+ equals(router.page, '20');
+ });
+
+ test("Router: routes via navigate for backwards-compatibility", 2, function() {
Backbone.history.navigate('search/manhattan/p20', true);
equals(router.query, 'manhattan');
equals(router.page, '20');
});
+ asyncTest("Router: routes via navigate with {replace: true}", function() {
+ var historyLength = window.history.length;
+ router.navigate('search/manhattan/start_here');
+ router.navigate('search/manhattan/then_here');
+ router.navigate('search/manhattan/finally_here', {replace: true});
+
+ equals(window.location.hash, "#search/manhattan/finally_here");
+ window.history.go(-1);
+ waitFor(function() { return(window.location.hash != "#search/manhattan/finally_here"); }, 2000).then(function() {
+ equals(window.location.hash, "#search/manhattan/start_here");
+ start();
+ });
+ });
+
asyncTest("Router: routes (splats)", function() {
window.location.hash = 'splat/long-list/of/splatted_99args/end';
setTimeout(function() {
diff --git a/test/test.html b/test/test.html
index d1aa8a2..d6e0ced 100644
--- a/test/test.html
+++ b/test/test.html
@@ -9,6 +9,7 @@
<script type="text/javascript" src="vendor/jslitmus.js"></script>
<script type="text/javascript" src="vendor/underscore-1.2.1.js"></script>
<script type="text/javascript" src="../backbone.js"></script>
+ <script type="text/javascript" src="test_helpers.js"></script>
<script type="text/javascript" src="noconflict.js"></script>
<script type="text/javascript" src="events.js"></script>
diff --git a/test/test_helpers.js b/test/test_helpers.js
new file mode 100644
index 0000000..f5cb89b
--- /dev/null
+++ b/test/test_helpers.js
@@ -0,0 +1,14 @@
+function waitFor(state_fn, duration) {
+ if(duration === undefined) duration = 1000;
+
+ var started_at = new Date;
+ var nextActions = [];
+
+ var interval_id = setInterval(function() {
+ if (((new Date) - started_at > duration) || (state_fn())) {
+ clearInterval(interval_id);
+ $(nextActions).each(function(_, fn) { fn(); });
+ }
+ }, 10);
+ return({then: function(fn) {nextActions.push(fn);}});
+}
--
Alioth's /usr/local/bin/git-commit-notice on /srv/git.debian.org/git/pkg-javascript/backbone.git
More information about the Pkg-javascript-commits
mailing list