Merge remote-tracking branch 'upstream/2.1.0-wip' into 2.1.0-wip

1 files changed, 45 insertions, 74 deletions

diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache
index 30872b1e1..d90184c7b 100644
--- a/docs/templates/pages/javascript.mustache
+++ b/docs/templates/pages/javascript.mustache
@@ -3,73 +3,55 @@
 <header class="jumbotron subhead" id="overview">
   <h1>{{_i}}Javascript for Bootstrap{{/i}}</h1>
   <p class="lead">{{_i}}Bring Bootstrap's components to life&mdash;now with 12 custom <a href="http://jquery.com/" target="_blank">jQuery</a> plugins.{{/i}}
+  <div class="subnav">
+    <ul class="nav nav-pills">
+      <li><a href="#modals">{{_i}}Modal{{/i}}</a></li>
+      <li><a href="#dropdowns">{{_i}}Dropdown{{/i}}</a></li>
+      <li><a href="#scrollspy">{{_i}}Scrollspy{{/i}}</a></li>
+      <li><a href="#tabs">{{_i}}Tab{{/i}}</a></li>
+      <li><a href="#tooltips">{{_i}}Tooltip{{/i}}</a></li>
+      <li><a href="#popovers">{{_i}}Popover{{/i}}</a></li>
+      <li><a href="#alerts">{{_i}}Alert{{/i}}</a></li>
+      <li><a href="#buttons">{{_i}}Button{{/i}}</a></li>
+      <li><a href="#collapse">{{_i}}Collapse{{/i}}</a></li>
+      <li><a href="#carousel">{{_i}}Carousel{{/i}}</a></li>
+      <li><a href="#typeahead">{{_i}}Typeahead{{/i}}</a></li>
+    </ul>
+  </div>
 </header>
 
 
 
-  <!-- Using Javascript w/ Bootstrap
-  ================================================== -->
-  <section id="javascript">
-    <div class="page-header">
-      <h1>{{_i}}jQuery plugins{{/i}} <small>{{_i}}A dozen Bootstrap plugins to get you started{{/i}}</small></h1>
-    </div>
-  <div class="row">
-    <div class="span4">
-      <h3><a href="./javascript.html#modals">{{_i}}Modals{{/i}}</a></h3>
-      <p>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#dropdowns">{{_i}}Dropdowns{{/i}}</a></h3>
-      <p>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#scrollspy">{{_i}}Scrollspy{{/i}}</a></h3>
-      <p>{{_i}}Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#tabs">{{_i}}Togglable tabs{{/i}}</a></h3>
-      <p>{{_i}}Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.{{/i}}</p>
-    </div>
-  </div> <!-- /row -->
-  <div class="row">
-    <div class="span4">
-      <h3><a href="./javascript.html#tooltips">{{_i}}Tooltips{{/i}}</a></h3>
-      <p>{{_i}}A new take on the jQuery Tipsy plugin, Tooltips don't rely on images&mdash;they use CSS3 for animations and data-attributes for local title storage.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#popovers">{{_i}}Popovers{{/i}}</a> <small class="muted">*</small></h3>
-      <p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}</p>
-      <p class="muted"><strong>*</strong> {{_i}}Requires <a href="#tooltips">Tooltips</a> to be included{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#alerts">{{_i}}Alert messages{{/i}}</a></h3>
-      <p>{{_i}}The alert plugin is a tiny class for adding close functionality to alerts.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#buttons">{{_i}}Buttons{{/i}}</a></h3>
-      <p>{{_i}}Do more with buttons. Control button states or create groups of buttons for more components like toolbars.{{/i}}</p>
-    </div>
-  </div> <!-- /row -->
-  <div class="row" style="margin-bottom: 9px;">
-    <div class="span4">
-      <h3><a href="./javascript.html#collapse">{{_i}}Collapse{{/i}}</a></h3>
-      <p>{{_i}}Get base styles and flexible support for collapsible components like accordions and navigation.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#carousel">{{_i}}Carousel{{/i}}</a></h3>
-      <p>{{_i}}Create a merry-go-round of any content you wish to provide an interactive slideshow of content.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3><a href="./javascript.html#typeahead">Typeahead</a></h3>
-      <p>{{_i}}A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.{{/i}}</p>
-    </div>
-    <div class="span4">
-      <h3>{{_i}}Transitions{{/i}} <small class="muted">*</small></h3>
-      <p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p>
-      <p class="muted"><strong>*</strong> {{_i}}Required for animation in plugins{{/i}}</p>
-    </div>
-  </div> <!-- /row -->
-  <div class="alert alert-info"><strong>{{_i}}Heads up!{{/i}}</strong> {{_i}} If you have downloaded the latest version of Bootstrap, both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all of these plugins.{{/i}}</div>
+
+<!-- Overview
+================================================== -->
+<section id="overview">
+  <div class="page-header">
+    <h1>{{_i}}Javascript in Bootstrap{{/i}}</h1>
+  </div>
+  <h3>{{_i}}Individual or compiled{{/i}}</h3>
+  <p>{{_i}}If you have downloaded the latest version of Bootstrap, both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all of these plugins.{{/i}}</p>
+  <h3>{{_i}}Data attributea{{/i}}</h3>
+  <p>{{_i}}...{{/i}}</p>
+  <h3>{{_i}}Programmatic API{{/i}}</h3>
+  <p>{{_i}}...{{/i}}</p>
+
+
+  {{! Thought: consider porting much of the JS readme here? }}
+
+</section>
+
+
+
+<!-- Transitions
+================================================== -->
+<section id="modals">
+  <div class="page-header">
+    <h1>{{_i}}Transitions{{/i}} <small>bootstrap-transition.js</small></h1>
+  </div>
+  <h3>{{_i}}About transitions{{/i}}</h3>
+  <p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p>
+  <p class="muted"><strong>*</strong> {{_i}}Required for animation in plugins{{/i}}</p>
 </section>
 
 
@@ -83,7 +65,6 @@
 
   <h3>{{_i}}About modals{{/i}}</h3>
   <p>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</p>
-  <a href="assets/js/bootstrap-modal.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Static example{{/i}}</h2>
   <p>{{_i}}Below is a statically rendered modal.{{/i}}</p>
@@ -273,7 +254,6 @@ $('#myModal').on('hidden', function () {
 
   <h3>{{_i}}About dropdowns{{/i}}</h3>
   <p>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</p>
-  <a href="assets/js/bootstrap-dropdown.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Examples{{/i}}</h2>
   <p>{{_i}}Click on the dropdown nav links in the navbar and pills below to test dropdowns.{{/i}}</p>
@@ -416,7 +396,6 @@ $('#myModal').on('hidden', function () {
   </div>
 
   <p>{{_i}}The ScrollSpy plugin is for automatically updating nav targets based on scroll position.{{/i}}</p>
-  <a href="assets/js/bootstrap-scrollspy.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example navbar with scrollspy{{/i}}</h2>
   <p>{{_i}}Scroll the area below and watch the navigation update. The dropdown sub items will be highlighted as well. Try it!{{/i}}</p>
@@ -532,7 +511,6 @@ $('[data-spy="scroll"]').each(function () {
   </div>
 
   <p>{{_i}}This plugin adds quick, dynamic tab and pill functionality for transitioning through local content.{{/i}}</p>
-  <a href="assets/js/bootstrap-tab.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example tabs{{/i}}</h2>
   <p>{{_i}}Click the tabs below to toggle between hidden panes, even via dropdown menus.{{/i}}</p>
@@ -648,7 +626,6 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
 
   <h3>{{_i}}About Tooltips{{/i}}</h3>
   <p>{{_i}}Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use css3 for animations, and data-attributes for local title storage.{{/i}}</p>
-  <a href="assets/js/bootstrap-tooltip.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example use of Tooltips{{/i}}</h2>
   <p>{{_i}}Hover over the links below to see tooltips:{{/i}}</p>
@@ -755,7 +732,6 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
   <h3>{{_i}}About popovers{{/i}}</h3>
   <p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}</p>
   <p class="muted"><strong>*</strong> {{_i}}Requires <a href="#tooltips">Tooltip</a> to be included{{/i}}</p>
-  <a href="assets/js/bootstrap-popover.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example hover popover{{/i}}</h2>
   <p>{{_i}}Hover over the button to trigger the popover.{{/i}}</p>
@@ -864,7 +840,6 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
 
   <h3>{{_i}}About alerts{{/i}}</h3>
   <p>{{_i}}The alert plugin is a tiny class for adding close functionality to alerts.{{/i}}</p>
-  <a href="assets/js/bootstrap-alert.js" target="_blank" class="btn">{{_i}}Download{{/i}}</a>
 
   <h2>{{_i}}Example alerts{{/i}}</h2>
   <p>{{_i}}The alerts plugin works on regular alert messages, and block messages.{{/i}}</p>
@@ -935,7 +910,6 @@ $('#my-alert').bind('closed', function () {
 
   <h3>{{_i}}About{{/i}}</h3>
   <p>{{_i}}Do more with buttons. Control button states or create groups of buttons for more components like toolbars.{{/i}}</p>
-  <a href="assets/js/bootstrap-button.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example uses{{/i}}</h2>
   <p>{{_i}}Use the buttons plugin for states and toggles.{{/i}}</p>
@@ -1030,7 +1004,6 @@ $('#my-alert').bind('closed', function () {
 
   <h3>{{_i}}About{{/i}}</h3>
   <p>{{_i}}Get base styles and flexible support for collapsible components like accordions and navigation.{{/i}}</p>
-  <a href="assets/js/bootstrap-collapse.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
   <p class="muted"><strong>*</strong> {{_i}}Requires the Transitions plugin to be included.{{/i}}</p>
 
   <h2>{{_i}}Example accordion{{/i}}</h2>
@@ -1179,7 +1152,6 @@ $('#myCollapsible').on('hidden', function () {
 
   <h3>{{_i}}About{{/i}}</h3>
   <p>{{_i}}A generic plugin for cycling through elements. A merry-go-round.{{/i}}</p>
-  <a href="assets/js/bootstrap-carousel.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example carousel{{/i}}</h2>
   <p>{{_i}}Watch the slideshow below.{{/i}}</p>
@@ -1313,7 +1285,6 @@ $('.carousel').carousel({
 
   <h3>{{_i}}About{{/i}}</h3>
   <p>{{_i}}A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.{{/i}}</p>
-  <a href="assets/js/bootstrap-typeahead.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
 
   <h2>{{_i}}Example{{/i}}</h2>
   <p>{{_i}}Start typing in the field below to show the typeahead results.{{/i}}</p>