From 222067b360ecf4c6c082d3d364d464a26ef13ae9 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Tue, 24 Jan 2012 12:11:05 -0800 Subject: [PATCH] javascript pages markedup with {{_i}} --- docs/javascript.html | 12 +- docs/templates/pages/javascript.mustache | 454 +++++++++++------------ 2 files changed, 233 insertions(+), 233 deletions(-) diff --git a/docs/javascript.html b/docs/javascript.html index cc641ed492..a35c299136 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -914,7 +914,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {

Closes an alert.

$(".alert-message").alert('close')

Events

-

Bootstrap's alert class exposes a few events for hooking into alert functionality.

+

Bootstrap's alert class exposes a few events for hooking into alert functionality.

@@ -935,7 +935,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
 $('#my-alert').bind('closed', function () {
-  // do something ...
+  // do something…
 })
@@ -1024,7 +1024,7 @@ $('#my-alert').bind('closed', function () {

$().button('toggle')

Toggles push state. Gives btn the look that it's been activated.

Notice You can enable auto toggling of a button by using the data-toggle attribute.

-
<button class="btn" data-toggle="button" >...</button>
+
<button class="btn" data-toggle="button" >…</button>

$().button('loading')

Sets button state to loading - disables button and swaps text to loading text. Loading text should be defined on the button element using the data attribute data-loading-text.

@@ -1166,7 +1166,7 @@ $('#myCollapsible').collapse({ - show + show/td> This event fires immediately when the show instance method is called. @@ -1188,7 +1188,7 @@ $('#myCollapsible').collapse({
 $('#myCollapsible').on('hidden', function () {
-  // do something ...
+  // do something…
 })
@@ -1293,7 +1293,7 @@ $('.myCarousel').carousel({

.carousel('next')

Cycles to the next item.

Events

-

Bootstrap's modal class exposes a few events for hooking into modal functionality.

+

Bootstrap's modal class exposes a few events for hooking into modal functionality.

diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache index 1170c21ccf..c85b9d2a2e 100644 --- a/docs/templates/pages/javascript.mustache +++ b/docs/templates/pages/javascript.mustache @@ -658,52 +658,52 @@ $('a[data-toggle="tab"]').on('shown', function (e) { - - + + - + - - + + - + - - + + - + - - + + - + - - + +
{{_i}}apply a css fade transition to the tooltip{{/i}}
placementstring{{_i}}placement{{/i}}{{_i}}string{{/i}} 'top'how to position the tooltip - top | bottom | left | right{{_i}}how to position the tooltip{{/i}} - top | bottom | left | right
selectorstring{{_i}}selector{{/i}}{{_i}}string{{/i}} falseIf a selector is provided, tooltip objects will be delegated to the specified targets.{{_i}}If a selector is provided, tooltip objects will be delegated to the specified targets.{{/i}}
titlestring | function{{_i}}title{{/i}}{{_i}}string | function{{/i}} ''default title value if `title` tag isn't present{{_i}}default title value if `title` tag isn't present{{/i}}
triggerstring{{_i}}trigger{{/i}}{{_i}}string{{/i}} 'hover'how tooltip is triggered - hover | focus | manual{{_i}}how tooltip is triggered{{/i}} - hover | focus | manual
delaynumber | object{{_i}}delay{{/i}}{{_i}}number | object{{/i}} 0 -

delay showing/hiding the tooltip (ms)

-

If a number is supplied, delay is applied to both hide/show

-

Object structure is: delay: { show: 500, hide: 100 }

+

{{_i}}delay showing/hiding the tooltip (ms){{/i}}

+

{{_i}}If a number is supplied, delay is applied to both hide/show{{/i}}

+

{{_i}}Object structure is: delay: { show: 500, hide: 100 }{{/i}}

-

Notice Individual tooltip instance options can alternatively be specified through the use of data attributes.

-

Markup

-

For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.

-

Methods

-

$().tooltip(options)

-

Attaches a tooltip handler to an element collection.

+

{{_i}}Notice Individual tooltip instance options can alternatively be specified through the use of data attributes.{{/i}}

+

{{_i}}Markup{{/i}}

+

{{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.{{/i}}

+

{{_i}}Methods{{/i}}

+

$().tooltip({{_i}}options{{/i}})

+

{{_i}}Attaches a tooltip handler to an element collection.{{/i}}

.tooltip('show')

-

Reveals an elements tooltip.

+

{{_i}}Reveals an elements tooltip.{{/i}}

$('#element').tooltip('show')

.tooltip('hide')

-

Hides an elements tooltip.

+

{{_i}}Hides an elements tooltip.{{/i}}

$('#element').tooltip('hide')
@@ -715,97 +715,97 @@ $('a[data-toggle="tab"]').on('shown', function (e) { ================================================== -->
-

About popovers

-

Add small overlays of content, like those on the iPad, to any element for housing secondary information.

-

* Requires Tooltip to be included

- Download file +

{{_i}}About popovers{{/i}}

+

{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}

+

* {{_i}}Requires Tooltip to be included{{/i}}

+ {{_i}}Download file{{/i}}
-

Example hover popover

-

Hover over the button to trigger the popover.

+

{{_i}}Example hover popover{{/i}}

+

{{_i}}Hover over the button to trigger the popover.{{/i}}


-

Using bootstrap-popover.js

-

Enable popovers via javascript:

-
$('#example').popover(options)
-

Options

+

{{_i}}Using bootstrap-popover.js{{/i}}

+

{{_i}}Enable popovers via javascript:{{/i}}

+
$('#example').popover({{_i}}options{{/i}})
+

{{_i}}Options{{/i}}

- - - - + + + + - - + + - + - - + + - + - - + + - + - - + + - + - - + + - + - - + + - + - - + +
Nametypedefaultdescription{{_i}}Name{{/i}}{{_i}}type{{/i}}{{_i}}default{{/i}}{{_i}}description{{/i}}
animationboolean{{_i}}animation{{/i}}{{_i}}boolean{{/i}} trueapply a css fade transition to the tooltip{{_i}}apply a css fade transition to the tooltip{{/i}}
placementstring{{_i}}placement{{/i}}{{_i}}string{{/i}} 'right'how to position the popover - top | bottom | left | right{{_i}}how to position the popover{{/i}} - top | bottom | left | right
selectorstring{{_i}}selector{{/i}}{{_i}}string{{/i}} falseif a selector is provided, tooltip objects will be delegated to the specified targets{{_i}}if a selector is provided, tooltip objects will be delegated to the specified targets{{/i}}
triggerstring{{_i}}trigger{{/i}}{{_i}}string{{/i}} 'hover'how tooltip is triggered - hover | focus | manual{{_i}}how tooltip is triggered{{/i}} - hover | focus | manual
titlestring | function{{_i}}title{{/i}}{{_i}}string | function{{/i}} ''default title value if `title` attribute isn't present{{_i}}default title value if `title` attribute isn't present{{/i}}
contentstring | function{{_i}}content{{/i}}{{_i}}string | function{{/i}} ''default content value if `data-content` attribute isn't present{{_i}}default content value if `data-content` attribute isn't present{{/i}}
delaynumber | object{{_i}}delay{{/i}}{{_i}}number | object{{/i}} 0 -

delay showing/hiding the popover (ms)

-

If a number is supplied, delay is applied to both hide/show

-

Object structure is: delay: { show: 500, hide: 100 }

+

{{_i}}delay showing/hiding the popover (ms){{/i}}

+

{{_i}}If a number is supplied, delay is applied to both hide/show{{/i}}

+

{{_i}}Object structure is: delay: { show: 500, hide: 100 }{{/i}}

-

Notice Individual popover instance options can alternatively be specified through the use of data attributes.

-

Markup

+

{{_i}}Notice Individual popover instance options can alternatively be specified through the use of data attributes.{{/i}}

+

{{_i}}Markup{{/i}}

- For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a the selector option. + {{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a the selector option.{{/i}}

-

Methods

-

$().popover(options)

-

Initializes popovers for an element collection.

+

{{_i}}Methods{{/i}}

+

$().popover({{_i}}options{{/i}})

+

{{_i}}Initializes popovers for an element collection.{{/i}}

.popover('show')

-

Reveals an elements popover.

+

{{_i}}Reveals an elements popover.{{/i}}

$('#element').popover('show')

.popover('hide')

-

Hides an elements popover.

+

{{_i}}Hides an elements popover.{{/i}}

$('#element').popover('hide')
@@ -817,65 +817,65 @@ $('a[data-toggle="tab"]').on('shown', function (e) { ================================================== -->
-

About alerts

-

The alert plugin is a tiny class for adding close functionality to alerts.

- Download +

{{_i}}About alerts{{/i}}

+

{{_i}}The alert plugin is a tiny class for adding close functionality to alerts.{{/i}}

+ {{_i}}Download{{/i}}
-

Example alerts

-

The alerts plugin works on regular alert messages, and block messages.

+

{{_i}}Example alerts{{/i}}

+

{{_i}}The alerts plugin works on regular alert messages, and block messages.{{/i}}

× - Holy guacamole! Best check yo self, you’re not looking too good. + {{_i}}Holy guacamole!{{/i}} {{_i}}Best check yo self, you’re not looking too good.{{/i}}
× -

Oh snap! You got an error!

-

Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.

+

{{_i}}Oh snap! You got an error!{{/i}}

+

{{_i}}Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.{{/i}}

- Take this action Or do this + {{_i}}Take this action{{/i}} {{_i}}Or do this{{/i}}


-

Using bootstrap-alerts.js

-

Enable dismissal of an alert via javascript:

+

{{_i}}Using bootstrap-alerts.js{{/i}}

+

{{_i}}Enable dismissal of an alert via javascript:{{/i}}

$(".alert-message").alert()
-

Markup

-

Just add data-dismiss="alert" to your close button to automatically give an alert close functionality.

+

{{_i}}Markup{{/i}}

+

{{_i}}Just add data-dismiss="alert" to your close button to automatically give an alert close functionality.{{/i}}

<a class="close" data-dismiss="alert" href="#">&times;</a>
-

Methods

+

{{_i}}Methods{{/i}}

$().alert()

-

Wraps all alerts with close functionality. To have your alerts animate out when closed, make sure they have the .fade and .in class already applied to them.

+

{{_i}}Wraps all alerts with close functionality. To have your alerts animate out when closed, make sure they have the .fade and .in class already applied to them.{{/i}}

.alert('close')

-

Closes an alert.

+

{{_i}}Closes an alert.{{/i}}

$(".alert-message").alert('close')
-

Events

-

Bootstrap's alert class exposes a few events for hooking into alert functionality.

+

{{_i}}Events{{/i}}

+

{{_i}}Bootstrap's alert class exposes a few events for hooking into alert functionality.{{/i}}

- - + + - - + + - - + +
EventDescription{{_i}}Event{{/i}}{{_i}}Description{{/i}}
closeThis event fires immediately when the close instance method is called.{{_i}}close{{/i}}{{_i}}This event fires immediately when the close instance method is called.{{/i}}
closedThis event is fired when the alert has been closed (will wait for css transitions to complete).{{_i}}closed{{/i}}{{_i}}This event is fired when the alert has been closed (will wait for css transitions to complete).{{/i}}
 $('#my-alert').bind('closed', function () {
-  // do something ...
+  // {{_i}}do something…{{/i}}
 })
@@ -887,61 +887,61 @@ $('#my-alert').bind('closed', function () { ================================================== -->
-

About

-

Do more with buttons. Control button states or create groups of buttons for more components like toolbars.

- Download file +

{{_i}}About{{/i}}

+

{{_i}}Do more with buttons. Control button states or create groups of buttons for more components like toolbars.{{/i}}

+ {{_i}}Download file{{/i}}
-

Example uses

-

Use the buttons plugin for states and toggles.

+

{{_i}}Example uses{{/i}}

+

{{_i}}Use the buttons plugin for states and toggles.{{/i}}

- + - + - + - +
Stateful{{_i}}Stateful{{/i}}
Single toggle{{_i}}Single toggle{{/i}} - +
Checkbox{{_i}}Checkbox{{/i}}
- - - + + +
Radio{{_i}}Radio{{/i}}
- - - + + +

-

Using bootstrap-button.js

-

Enable buttons via javascript:

+

{{_i}}Using bootstrap-button.js{{/i}}

+

{{_i}}Enable buttons via javascript:{{/i}}

$('.tabs').button()
-

Markup

-

Data attributes are integral to the button plugin. Check out the example code below for the various markup types.

+

{{_i}}Markup{{/i}}

+

{{_i}}Data attributes are integral to the button plugin. Check out the example code below for the various markup types.{{/i}}

 <!-- Add data-toggle="button" to activate toggling on a single button -->
 <button class="btn" data-toggle="button">Single Toggle</button>
@@ -960,22 +960,22 @@ $('#my-alert').bind('closed', function () {
   <button class="btn">Right</button>
 </div>
 
-

Methods

+

{{_i}}Methods{{/i}}

$().button('toggle')

-

Toggles push state. Gives btn the look that it's been activated.

-

Notice You can enable auto toggling of a button by using the data-toggle attribute.

-
<button class="btn" data-toggle="button" >...</button>
+

{{_i}}Toggles push state. Gives btn the look that it's been activated.{{/i}}

+

{{_i}}Notice You can enable auto toggling of a button by using the data-toggle attribute.{{/i}}

+
<button class="btn" data-toggle="button" >…</button>

$().button('loading')

-

Sets button state to loading - disables button and swaps text to loading text. Loading text should be defined on the button element using the data attribute data-loading-text. +

{{_i}}Sets button state to loading - disables button and swaps text to loading text. Loading text should be defined on the button element using the data attribute data-loading-text.{{/i}}

<button class="btn" data-loading-text="loading stuff..." >...</button>

- Notice Firefox persists the disabled state across page loads. A workaround for this is to use: autocomplete="off". More info can be found here. + {{_i}}Notice Firefox persists the disabled state across page loads. A workaround for this is to use: autocomplete="off". More info can be found here.{{/i}}

$().button('reset')

-

Resets button state - swaps text to original text.

+

{{_i}}Resets button state - swaps text to original text.{{/i}}

$().button(string)

-

Resets button state - swaps text to any data defined text state.

+

{{_i}}Resets button state - swaps text to any data defined text state.{{/i}}

<button class="btn" data-complete-text="finished!" >...</button>
 <script>
   $('.btn').button('complete')
@@ -990,23 +990,23 @@ $('#my-alert').bind('closed', function () {
     ================================================== -->
     
-

About

-

Get base styles and flexible support for collapsible components like accordions and navigation.

- Download file +

{{_i}}About{{/i}}

+

{{_i}}Get base styles and flexible support for collapsible components like accordions and navigation.{{/i}}

+ {{_i}}Download file{{/i}}
-

Example accordion

-

Using the collapse plugin, we built a simple accordion style widget:

+

{{_i}}Example accordion{{/i}}

+

{{_i}}Using the collapse plugin, we built a simple accordion style widget:{{/i}}

@@ -1018,7 +1018,7 @@ $('#my-alert').bind('closed', function () {
@@ -1030,7 +1030,7 @@ $('#my-alert').bind('closed', function () {
@@ -1043,92 +1043,92 @@ $('#my-alert').bind('closed', function () {
-

Using bootstrap-collapse.js

+

{{_i}}Using bootstrap-collapse.js{{/i}}

Enable via javascript:

$(".collapse").collapse()
-

Options

+

{{_i}}Options{{/i}}

- - - - + + + + - - + + - + - - + + - +
Nametypedefaultdescription{{_i}}Name{{/i}}{{_i}}type{{/i}}{{_i}}default{{/i}}{{_i}}description{{/i}}
parentselector{{_i}}parent{{/i}}{{_i}}selector{{/i}} falseIf selector then all collapsible elements under the specified parent will be closed when this collasabile item is shown. (similar to traditional accordion behavior){{_i}}If selector then all collapsible elements under the specified parent will be closed when this collasabile item is shown. (similar to traditional accordion behavior){{/i}}
toggleboolean{{_i}}toggle{{/i}}{{_i}}boolean{{/i}} trueToggles the collapsible element on invocation{{_i}}Toggles the collapsible element on invocation{{/i}}
-

Markup

-

Just add data-toggle="collapse" and a data-target to element to automatically assign control of a collapsible element. The data-target attribute accepts a css selector to apply the collapse to. Be sure to add the class collapse to the collapsible element. If you'd like it to default open, add the additional class in.

+

{{_i}}Markup{{/i}}

+

{{_i}}Just add data-toggle="collapse" and a data-target to element to automatically assign control of a collapsible element. The data-target attribute accepts a css selector to apply the collapse to. Be sure to add the class collapse to the collapsible element. If you'd like it to default open, add the additional class in.{{/i}}

 <button class="btn danger" data-toggle="collapse" data-target="#demo">
-  simple collapsible
+  {{_i}}simple collapsible{{/i}}
 </button>
 
 <div id="demo" class="collapse in"> … </div>
-

Notice To add accordion like group management to a collapsible control just add the additional data attribute data-parent="#selector". Refer to the demo below to see this in action.

-

Methods

-

.collapse(options)

-

Activates your content as a collapsible element. Accepts an optional options object. +

{{_i}}Notice To add accordion like group management to a collapsible control just add the additional data attribute data-parent="#selector". Refer to the demo below to see this in action.{{/i}}

+

{{_i}}Methods{{/i}}

+

.collapse({{_i}}options{{/i}})

+

{{_i}}Activates your content as a collapsible element. Accepts an optional options object.{{/i}}

 $('#myCollapsible').collapse({
   toggle: false
 })

.collapse('toggle')

-

Toggles a collapsible element to shown or hidden.

+

{{_i}}Toggles a collapsible element to shown or hidden.{{/i}}

.collapse('show')

-

Shows a collapsible element.

+

{{_i}}Shows a collapsible element.{{/i}}

.collapse('hide')

-

Hides a collapsible element.

-

Events

+

{{_i}}Hides a collapsible element.{{/i}}

+

{{_i}}Events{{/i}}

- Bootstrap's collapse class exposes a few events for hooking into collapse functionality. + {{_i}}Bootstrap's collapse class exposes a few events for hooking into collapse functionality.{{/i}}

- - + + - - + - - + + - + - - + +
EventDescription{{_i}}Event{{/i}}{{_i}}Description{{/i}}
showThis event fires immediately when the show instance method is called.{{_i}}show{{/i}}/td> + {{_i}}This event fires immediately when the show instance method is called.{{/i}}
shownThis event is fired when a collapse element has been made visible to the user (will wait for css transitions to complete).{{_i}}shown{{/i}}{{_i}}This event is fired when a collapse element has been made visible to the user (will wait for css transitions to complete).{{/i}}
hide{{_i}}hide{{/i}} - This event is fired immediately when the hide method has been called. + {{_i}}This event is fired immediately when the hide method has been called.{{/i}}
hiddenThis event is fired when a collapse element has been hidden from the user (will wait for css transitions to complete).{{_i}}hidden{{/i}}{{_i}}This event is fired when a collapse element has been hidden from the user (will wait for css transitions to complete).{{/i}}
 $('#myCollapsible').on('hidden', function () {
-  // do something ...
+  // {{_i}}do something…{{/i}}
 })
@@ -1140,37 +1140,37 @@ $('#myCollapsible').on('hidden', function () { ================================================== -->