From bf875d9e360209503932e0ecbe5804b44961b34d Mon Sep 17 00:00:00 2001
From: Mark Otto <markotto@twitter.com>
Date: Mon, 11 Jun 2012 22:19:25 -0700
Subject: cleanup options display in all sections, rearrange typeahead section

---
 docs/javascript.html | 36 +++++++++++++++++++++++++++---------
 1 file changed, 27 insertions(+), 9 deletions(-)

(limited to 'docs/javascript.html')

diff --git a/docs/javascript.html b/docs/javascript.html
index e362985ab..e424cf1aa 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -261,6 +261,7 @@
   <pre class="prettyprint linenums">$('#myModal').modal(options)</pre>
 
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-backdrop=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -477,6 +478,9 @@ $('#myModal').on('hidden', function () {
   <p>Call the dropdowns via javascript:</p>
   <pre class="prettyprint linenums">$('.dropdown-toggle').dropdown()</pre>
 
+  <h3>Options</h3>
+  <p><em>None</em></p>
+
   <h3>Methods</h3>
   <h4>$().dropdown()</h4>
   <p>A programatic api for activating menus for a given navbar or tabbed navigation.</p>
@@ -560,6 +564,7 @@ $('[data-spy="scroll"]').each(function () {
 </pre>
 
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-offset=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -745,6 +750,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
   <pre class="prettyprint linenums">$('#example').tooltip(options)</pre>
 
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-animation=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -856,6 +862,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
   <pre class="prettyprint linenums">$('#example').popover(options)</pre>
 
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-animation=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -927,6 +934,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
 
   <h3>Markup</h3>
   <p>For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.</p>
+
   <h3>Methods</h3>
   <h4>$().popover(options)</h4>
   <p>Initializes popovers for an element collection.</p>
@@ -992,6 +1000,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
   <p>Closes an alert.</p>
   <pre class="prettyprint linenums">$(".alert").alert('close')</pre>
 
+
   <h3>Events</h3>
   <p>Bootstrap's alert class exposes a few events for hooking into alert functionality.</p>
   <table class="table table-bordered table-striped">
@@ -1092,6 +1101,9 @@ $('#my-alert').bind('closed', function () {
 &lt;/div&gt;
 </pre>
 
+  <h3>Options</h3>
+  <p><em>None</em></p>
+
   <h3>Methods</h3>
   <h4>$().button('toggle')</h4>
   <p>Toggles push state. Gives the button the appearance that it has been activated.</p>
@@ -1184,6 +1196,7 @@ $('#my-alert').bind('closed', function () {
   <pre class="prettyprint linenums">$(".collapse").collapse()</pre>
 
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-parent=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -1328,7 +1341,9 @@ $('#myCollapsible').on('hidden', function () {
   <h2>Usage</h2>
   <p>Call via javascript:</p>
   <pre class="prettyprint linenums">$('.carousel').carousel()</pre>
+
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-interval=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -1420,23 +1435,31 @@ $('.carousel').carousel({
     <h1>Typeahead <small>bootstrap-typeahead.js</small></h1>
   </div>
 
-  <h3>About</h3>
-  <p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p>
 
   <h2>Example</h2>
-  <p>Start typing in the field below to show the typeahead results.</p>
+  <p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p>
   <div class="bs-docs-example" style="background-color: #f5f5f5;">
     <input type="text" class="span3" style="margin: 0 auto;" data-provide="typeahead" data-items="4" data-source='["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]'>
   </div>
+<pre class="prettyprint linenums">
+&lt;input type="text" data-provide="typeahead"&gt;
+</pre>
 
 
   <hr class="bs-docs-separator">
 
 
   <h2>Usage</h2>
-  <p>Call the typeahead via javascript:</p>
+
+  <h3>Via data attributes</h3>
+  <p>Add data attributes to register an element with typeahead functionality as shown in the example above.</p>
+
+  <h3>Via javascript</h3>
+  <p>Call the typeahead manually with:</p>
   <pre class="prettyprint linenums">$('.typeahead').typeahead()</pre>
+
   <h3>Options</h3>
+  <p>Options can be passed via data attributes or javascript. For data attributes, append the option name to <code>data-</code>, as in <code>data-source=""</code>.</p>
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
@@ -1480,11 +1503,6 @@ $('.carousel').carousel({
     </tbody>
   </table>
 
-  <h3>Markup</h3>
-  <p>Add data attributes to register an element with typeahead functionality.</p>
-<pre class="prettyprint linenums">
-&lt;input type="text" data-provide="typeahead"&gt;
-</pre>
   <h3>Methods</h3>
   <h4>.typeahead(options)</h4>
   <p>Initializes an input with a typeahead.</p>
-- 
cgit v1.2.3