Merge branch '2.0-wip' of github.com:twitter/bootstrap into 2.0-wip
This commit is contained in:
Mark Otto
commit
1d44f37fc9
|
|
@ -1978,7 +1978,7 @@ table .span12 {
|
|||
.navbar-search .search-query :-moz-placeholder {
|
||||
color: #eeeeee;
|
||||
}
|
||||
.navbar-search .search-query ::-webkit-input-placeholder {
|
||||
.navbar-search .search-query::-webkit-input-placeholder {
|
||||
color: #eeeeee;
|
||||
}
|
||||
.navbar-search .search-query:hover {
|
||||
|
|
|
|||
|
|
@ -106,7 +106,14 @@ $(function () {
|
|||
$('.tooltip-demo.well').tooltip({
|
||||
selector: "a[rel=tooltip]"
|
||||
})
|
||||
$('.tooltip-test').tooltip()
|
||||
|
||||
$('.tooltip-test').tooltip({
|
||||
'z-index': 3000
|
||||
})
|
||||
|
||||
$('.popover-test').popover({
|
||||
'z-index': 3000
|
||||
})
|
||||
|
||||
// popover demo
|
||||
$("a[rel=popover]")
|
||||
|
|
|
|||
|
|
@ -221,7 +221,7 @@
|
|||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p>
|
||||
|
||||
<h4>Popover in a modal</h4>
|
||||
<p>This <a href="#" class="btn" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.</p>
|
||||
<p>This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.</p>
|
||||
|
||||
<h4>Tooltips in a modal</h4>
|
||||
<p><a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.</p>
|
||||
|
|
@ -740,6 +740,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<p>Object structure is: <code>delay: { show: 500, hide: 100 }</code></p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>z-index</td>
|
||||
<td>number</td>
|
||||
<td>1020</td>
|
||||
<td>The tooltips z-index value</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p><span class="label notice">Notice</span> Individual tooltip instance options can alternatively be specified through the use of data attributes.</p>
|
||||
|
|
@ -754,6 +760,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<h4>.tooltip('hide')</h4>
|
||||
<p>Hides an elements tooltip.</p>
|
||||
<pre class="prettyprint linenums">$('#element').tooltip('hide')</pre>
|
||||
<h4>.tooltip('toggle')</h4>
|
||||
<p>Toggles an elements tooltip.</p>
|
||||
<pre class="prettyprint linenums">$('#element').tooltip('toggle')</pre>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -840,6 +849,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<p>Object structure is: <code>delay: { show: 500, hide: 100 }</code></p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>z-index</td>
|
||||
<td>number</td>
|
||||
<td>1010</td>
|
||||
<td>The popovers z-index value</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p><span class="label notice">Notice</span> Individual popover instance options can alternatively be specified through the use of data attributes.</p>
|
||||
|
|
@ -856,6 +871,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<h4>.popover('hide')</h4>
|
||||
<p>Hides an elements popover.</p>
|
||||
<pre class="prettyprint linenums">$('#element').popover('hide')</pre>
|
||||
<h4>.popover('toggle')</h4>
|
||||
<p>Toggles an elements popover.</p>
|
||||
<pre class="prettyprint linenums">$('#element').popover('toggle')</pre>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1335,7 +1353,7 @@ $('.myCarousel').carousel({
|
|||
<tr>
|
||||
<th style="width: 100px;">Name</th>
|
||||
<th style="width: 50px;">type</th>
|
||||
<th style="width: 50px;">default</th>
|
||||
<th style="width: 90px;">default</th>
|
||||
<th>description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
|
@ -1352,6 +1370,18 @@ $('.myCarousel').carousel({
|
|||
<td>8</td>
|
||||
<td>The max number of items to display in the dropdown.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>matcher</td>
|
||||
<td>function</td>
|
||||
<td>case sensitive</td>
|
||||
<td>The method used to determine if a query matches an item. Accepts a single argument, the <code>item</code> against which to test the query. Access the current query with <code>this.query</code>. Return a boolean <code>true</code> if query is a match.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>sorter</td>
|
||||
<td>function</td>
|
||||
<td>no sort</td>
|
||||
<td>Method used to sort autocomplete results. Accepts a single argument <code>items</code> and has the scope of the typeahead instance. Reference the current query with <code>this.query</code>.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
|
@ -1360,6 +1390,9 @@ $('.myCarousel').carousel({
|
|||
<pre class="prettyprint linenums">
|
||||
<input type="text" data-provide="typeahead">
|
||||
</pre>
|
||||
<h3>Methods</h3>
|
||||
<h4>.typeahead(options)</h4>
|
||||
<p>Initializes an input with a typahead.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -156,7 +156,7 @@
|
|||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p>
|
||||
|
||||
<h4>{{_i}}Popover in a modal{{/i}}</h4>
|
||||
<p>{{_i}}This <a href="#" class="btn" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.{{/i}}</p>
|
||||
<p>{{_i}}This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.{{/i}}</p>
|
||||
|
||||
<h4>{{_i}}Tooltips in a modal{{/i}}</h4>
|
||||
<p>{{_i}}<a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.{{/i}}</p>
|
||||
|
|
@ -675,6 +675,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{_i}}z-index{{/i}}</td>
|
||||
<td>{{_i}}number{{/i}}</td>
|
||||
<td>1020</td>
|
||||
<td>The tooltips z-index value</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>{{_i}}<span class="label notice">Notice</span> Individual tooltip instance options can alternatively be specified through the use of data attributes.{{/i}}</p>
|
||||
|
|
@ -689,6 +695,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<h4>.tooltip('hide')</h4>
|
||||
<p>{{_i}}Hides an elements tooltip.{{/i}}</p>
|
||||
<pre class="prettyprint linenums">$('#element').tooltip('hide')</pre>
|
||||
<h4>.tooltip('toggle')</h4>
|
||||
<p>{{_i}}Toggles an elements tooltip.{{/i}}</p>
|
||||
<pre class="prettyprint linenums">$('#element').tooltip('toggle')</pre>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -775,6 +784,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{_i}}z-index{{/i}}</td>
|
||||
<td>{{_i}}number{{/i}}</td>
|
||||
<td>1010</td>
|
||||
<td>The popovers z-index value</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>{{_i}}<span class="label notice">Notice</span> Individual popover instance options can alternatively be specified through the use of data attributes.{{/i}}</p>
|
||||
|
|
@ -791,6 +806,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
|
|||
<h4>.popover('hide')</h4>
|
||||
<p>{{_i}}Hides an elements popover.{{/i}}</p>
|
||||
<pre class="prettyprint linenums">$('#element').popover('hide')</pre>
|
||||
<h4>.popover('toggle')</h4>
|
||||
<p>{{_i}}Toggles an elements popover.{{/i}}</p>
|
||||
<pre class="prettyprint linenums">$('#element').popover('toggle')</pre>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1270,7 +1288,7 @@ $('.myCarousel').carousel({
|
|||
<tr>
|
||||
<th style="width: 100px;">{{_i}}Name{{/i}}</th>
|
||||
<th style="width: 50px;">{{_i}}type{{/i}}</th>
|
||||
<th style="width: 50px;">{{_i}}default{{/i}}</th>
|
||||
<th style="width: 90px;">{{_i}}default{{/i}}</th>
|
||||
<th>{{_i}}description{{/i}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
|
@ -1287,6 +1305,18 @@ $('.myCarousel').carousel({
|
|||
<td>8</td>
|
||||
<td>{{_i}}The max number of items to display in the dropdown.{{/i}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{_i}}matcher{{/i}}</td>
|
||||
<td>{{_i}}function{{/i}}</td>
|
||||
<td>case sensitive</td>
|
||||
<td>{{_i}}The method used to determine if a query matches an item. Accepts a single argument, the <code>item</code> against which to test the query. Access the current query with <code>this.query</code>. Return a boolean <code>true</code> if query is a match.{{/i}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{_i}}sorter{{/i}}</td>
|
||||
<td>{{_i}}function{{/i}}</td>
|
||||
<td>no sort</td>
|
||||
<td>{{_i}}Method used to sort autocomplete results. Accepts a single argument <code>items</code> and has the scope of the typeahead instance. Reference the current query with <code>this.query</code>.{{/i}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
|
@ -1295,6 +1325,9 @@ $('.myCarousel').carousel({
|
|||
<pre class="prettyprint linenums">
|
||||
<input type="text" data-provide="typeahead">
|
||||
</pre>
|
||||
<h3>{{_i}}Methods{{/i}}</h3>
|
||||
<h4>.typeahead({{_i}}options{{/i}})</h4>
|
||||
<p>{{_i}}Initializes an input with a typahead.{{/i}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -145,6 +145,9 @@
|
|||
break
|
||||
}
|
||||
|
||||
debugger
|
||||
if (this.options['z-index']) tp['z-index'] = this.options['z-index']
|
||||
|
||||
$tip
|
||||
.css(tp)
|
||||
.addClass(placement)
|
||||
|
|
@ -265,6 +268,7 @@
|
|||
, trigger: 'hover'
|
||||
, title: ''
|
||||
, template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
|
||||
, 'z-index': false
|
||||
}
|
||||
|
||||
}( window.jQuery )
|
||||
|
|
|
|||
|
|
@ -24,6 +24,8 @@
|
|||
var Typeahead = function ( element, options ) {
|
||||
this.$element = $(element)
|
||||
this.options = $.extend({}, $.fn.typeahead.defaults, options)
|
||||
this.matcher = this.options.matcher
|
||||
this.sorter = this.options.sorter
|
||||
this.$menu = $(this.options.menu).appendTo('body')
|
||||
this.source = this.options.source
|
||||
this.shown = false
|
||||
|
|
@ -34,11 +36,6 @@
|
|||
|
||||
constructor: Typeahead
|
||||
|
||||
, matcher: function (item, query) {
|
||||
// ;_; http://jsperf.com/asdfdfasdfa
|
||||
return ~item.toLowerCase().indexOf(query)
|
||||
}
|
||||
|
||||
, select: function () {
|
||||
var val = this.$menu.find('.active').attr('data-value')
|
||||
this.$element.val(val)
|
||||
|
|
@ -77,12 +74,12 @@
|
|||
return this.shown ? this.hide() : this
|
||||
}
|
||||
|
||||
q = this.query.toLowerCase()
|
||||
|
||||
items = jQuery.grep(this.source, function (item) {
|
||||
if (that.matcher(item, q)) return item
|
||||
items = $.grep(this.source, function (item) {
|
||||
if (that.matcher(item)) return item
|
||||
})
|
||||
|
||||
items = this.sorter(items)
|
||||
|
||||
if (!items.length) {
|
||||
return this.shown ? this.hide() : this
|
||||
}
|
||||
|
|
@ -233,6 +230,12 @@
|
|||
, items: 8
|
||||
, menu: '<ul class="typeahead dropdown-menu"></ul>'
|
||||
, item: '<li><a href="#"></a></li>'
|
||||
, matcher: function (item) {
|
||||
return ~item.indexOf(this.query)
|
||||
}
|
||||
, sorter: function (items) {
|
||||
return items
|
||||
}
|
||||
}
|
||||
|
||||
$.fn.typeahead.Constructor = Typeahead
|
||||
|
|
|
|||
Loading…
Reference in New Issue