[Pkg-javascript-commits] [backbone] 92/101: Documenting constructor options.

Jonas Smedegaard js at moszumanska.debian.org
Sat May 3 16:58:32 UTC 2014


This is an automated email from the git hooks/post-receive script.

js pushed a commit to tag 0.1.0
in repository backbone.

commit 53ac621fd43a76e79f0690f1375459625a264848
Author: Jeremy Ashkenas <jashkenas at gmail.com>
Date:   Wed Oct 13 10:55:08 2010 -0400

    Documenting constructor options.
---
 backbone.js        |  1 +
 docs/backbone.html |  1 +
 index.html         | 85 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 87 insertions(+)

diff --git a/backbone.js b/backbone.js
index 39afebf..0c6c632 100644
--- a/backbone.js
+++ b/backbone.js
@@ -586,6 +586,7 @@
       if (options.collection) this.collection = options.collection;
       if (options.id)         this.id         = options.id;
       if (options.className)  this.className  = options.className;
+      if (options.tagName)    this.tagName    = options.tagName;
       this.options = options;
     }
 
diff --git a/docs/backbone.html b/docs/backbone.html
index df89d0f..a65b144 100644
--- a/docs/backbone.html
+++ b/docs/backbone.html
@@ -382,6 +382,7 @@ attatched directly to the view.</p>             </td>             <td class="cod
       <span class="k">if</span> <span class="p">(</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">if</span> <span class="p">(</span><span class="nx">options</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">id</span>         <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">id</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">className</span><span class="p">)</span>  <span class="k">this</span><span class="p">.</span><span class="nx">className</span>  <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">className</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">tagName</span><span class="p">)</span>    <span class="k">this</span><span class="p">.</span><span class="nx">tagName</span>    <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">tagName</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>
 
diff --git a/index.html b/index.html
index d612484..6374c63 100644
--- a/index.html
+++ b/index.html
@@ -147,6 +147,7 @@
     </a>
     <ul class="toc_section">
       <li>– <a href="#Model-extend">extend</a></li>
+      <li>– <a href="#Model-constructor">constructor</a></li>
       <li>– <a href="#Model-get">get</a></li>
       <li>– <a href="#Model-set">set</a></li>
       <li>– <a href="#Model-unset">unset</a></li>
@@ -172,6 +173,7 @@
     </a>
     <ul class="toc_section">
       <li>– <a href="#Collection-extend">extend</a></li>
+      <li>– <a href="#Collection-constructor">constructor</a></li>
       <li>– <a href="#Collection-models">models</a></li>
       <li>– <a href="#Collection-Underscore-Methods"><b>Underscore Methods (24)</b></a></li>
       <li>– <a href="#Collection-add">add</a></li>
@@ -199,6 +201,8 @@
       View
     </a>
     <ul class="toc_section">
+      <li>– <a href="#View-extend">extend</a></li>
+      <li>– <a href="#View-constructor">constructor</a></li>
       <li>– <a href="#View-el">el</a></li>
       <li>– <a href="#View-jQuery">$ (jQuery)</a></li>
       <li>– <a href="#View-render">render</a></li>
@@ -443,6 +447,21 @@ var Note = Backbone.Model.extend({
 });
 </pre>
 
+    <p id="Model-constructor">
+      <b class="header">constructor</b><code>new Model([attributes])</code>
+      <br />
+      When creating an instance of a model, you can pass in the initial values
+      of the <b>attributes</b>, which will be <a href="#Model-set">set</a> on the
+      model.
+    </p>
+    
+<pre>
+new Book({
+  title: "One Thousand and One Nights",
+  author: "Scheherazade"
+});
+</pre>
+
     <p id="Model-get">
       <b class="header">get</b><code>model.get(attribute)</code>
       <br />
@@ -719,6 +738,18 @@ bill.set({name : "Bill Jones"});
       directly to the collection's constructor function.
     </p>
     
+    <p id="Collection-constructor">
+      <b class="header">constructor</b><code>new Collection([models], [options])</code>
+      <br />
+      When creating a Collection, you may choose to pass in the initial array of <b>models</b>.
+      The collection's <a href="#Collection-comparator">comparator</a> function
+      may be included as an option.
+    </p>
+    
+<pre>
+window.Tabs = new TabSet([tab1, tab2, tab3]);
+</pre>
+    
     <p id="Collection-models">
       <b class="header">models</b><code>collection.models</code>
       <br />
@@ -1064,6 +1095,55 @@ end
       <tt>model.bind('change', view.render)</tt> — and now everywhere that
       model data is displayed in the UI, it is always immediately up to date.
     </p>
+    
+    <p id="View-extend">
+      <b class="header">extend</b><code>Backbone.View.extend(properties, [classProperties])</code>
+      <br />
+      Get started with views by creating a custom view class. You'll want to
+      override the <a href="#View-render">render</a> function, specify your
+      declarative <a href="#View-handleEvents">events</a>, and perhaps the
+      <tt>tagName</tt>, <tt>className</tt>, or <tt>id</tt> of the View's root 
+      element.
+    </p>
+    
+<pre>
+var DocumentRow = Backbone.View.extend({
+  
+  tagName: "li",
+  
+  className: "document-row",
+  
+  events: {
+    "click .icon":          "open",
+    "click .button.edit":   "openEditDialog",
+    "click .button.delete": "destroy"
+  },
+  
+  render: function() {
+    ...
+  }
+  
+});
+</pre>
+    
+    <p id="View-constructor">
+      <b class="header">constructor</b><code>new View([options])</code>
+      <br />
+      When creating a new View, the options you pass are attached to the view 
+      as <tt>this.options</tt>, for future reference. There are several special
+      options that, if passed, will be attached directly to the view: 
+      <tt>model</tt>, <tt>collection</tt>,
+      <tt>el</tt>, <tt>id</tt>, <tt>className</tt>, and <tt>tagName</tt>.
+    </p>
+    
+<pre>
+var doc = Documents.first();
+
+new DocumentRow({
+  model: doc,
+  id: "document-row-" + doc.id
+});
+</pre>
 
     <p id="View-el">
       <b class="header">el</b><code>view.el</code>
@@ -1074,6 +1154,11 @@ end
       at once, in order to get high-performance UI rendering with as few
       reflows and repaints as possible.
     </p>
+    
+    <p>
+      <tt>this.el</tt> is created from the view's <tt>tagName</tt>, <tt>className</tt>,
+      and <tt>id</tt> properties, if specified. If not, <b>el</b> is an empty <tt>div</tt>.
+    </p>
 
     <p id="View-jQuery">
       <b class="header">$ (jQuery)</b><code>view.$(selector)</code>

-- 
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