aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2012-07-23 23:01:38 -0700
committerMark Otto <[email protected]>2012-07-23 23:01:38 -0700
commitf085dbadd18208386649717f4f1bcba62d6119de (patch)
treee8aa445377a1877816ea4636f015117c06096404 /js
parent0dda2c4659c6e0407b5b9fda6618ab5c8c12a897 (diff)
parent614d52bd7f86591a0b0ab09e1c16ee888610d8a3 (diff)
downloadbootstrap-f085dbadd18208386649717f4f1bcba62d6119de.tar.xz
bootstrap-f085dbadd18208386649717f4f1bcba62d6119de.zip
Merge branch '2.1.0-wip' of github.com:twitter/bootstrap into 2.1.0-wip
Conflicts: docs/assets/css/docs.css docs/base-css.html docs/components.html docs/customize.html docs/getting-started.html docs/javascript.html docs/scaffolding.html docs/templates/pages/base-css.mustache docs/templates/pages/components.mustache docs/templates/pages/customize.mustache docs/templates/pages/getting-started.mustache docs/templates/pages/javascript.mustache docs/templates/pages/scaffolding.mustache
Diffstat (limited to 'js')
-rw-r--r--js/.jshintrc1
-rw-r--r--js/README.md112
-rw-r--r--js/bootstrap-affix.js102
-rw-r--r--js/bootstrap-modal.js4
-rw-r--r--js/bootstrap-popover.js4
-rw-r--r--js/bootstrap-scrollspy.js12
-rw-r--r--js/bootstrap-tab.js2
-rw-r--r--js/bootstrap-tooltip.js8
-rw-r--r--js/bootstrap-transition.js2
-rw-r--r--js/bootstrap-typeahead.js5
-rw-r--r--js/tests/index.html2
-rw-r--r--js/tests/unit/bootstrap-affix.js19
-rw-r--r--js/tests/unit/bootstrap-popover.js8
-rw-r--r--js/tests/unit/bootstrap-tooltip.js8
-rw-r--r--js/tests/unit/bootstrap-typeahead.js20
15 files changed, 176 insertions, 133 deletions
diff --git a/js/.jshintrc b/js/.jshintrc
index 0f064a0b4..e0722690b 100644
--- a/js/.jshintrc
+++ b/js/.jshintrc
@@ -3,6 +3,7 @@
"laxcomma" : true,
"laxbreak" : true,
"browser" : true,
+ "eqnull" : true,
"debug" : true,
"devel" : true,
"boss" : true,
diff --git a/js/README.md b/js/README.md
deleted file mode 100644
index b7927ba6b..000000000
--- a/js/README.md
+++ /dev/null
@@ -1,112 +0,0 @@
-## 2.0 BOOTSTRAP JS PHILOSOPHY
-These are the high-level design rules which guide the development of Bootstrap's plugin apis.
-
----
-
-### DATA-ATTRIBUTE API
-
-We believe you should be able to use all plugins provided by Bootstrap purely through the markup API without writing a single line of JavaScript. This is Bootstrap's first class API.
-
-We acknowledge that this isn't always the most performant and it may sometimes be desirable to turn this functionality off altogether. Therefore, as of 2.0 we provide the ability to disable the data attribute API by unbinding all events on the body namespaced with `'data-api'`. This looks like this:
-
- $('body').off('.data-api')
-
-To target a specific plugin, just include the plugins name as a namespace along with the data-api namespace like this:
-
- $('body').off('.alert.data-api')
-
----
-
-### PROGRAMATIC API
-
-We also believe you should be able to use all plugins provided by Bootstrap purely through the JavaScript API.
-
-All public APIs should be single, chainable methods, and return the collection acted upon.
-
- $(".btn.danger").button("toggle").addClass("fat")
-
-All methods should accept an optional options object, a string which targets a particular method, or null which initiates the default behavior:
-
- $("#myModal").modal() // initialized with defaults
- $("#myModal").modal({ keyboard: false }) // initialized with no keyboard
- $("#myModal").modal('show') // initializes and invokes show immediately
-
----
-
-### OPTIONS
-
-Options should be sparse and add universal value. We should pick the right defaults.
-
-All plugins should have a default object which can be modified to affect all instances' default options. The defaults object should be available via `$.fn.plugin.defaults`.
-
- $.fn.modal.defaults = { … }
-
-An options definition should take the following form:
-
- *noun*: *adjective* - describes or modifies a quality of an instance
-
-Examples:
-
- backdrop: true
- keyboard: false
- placement: 'top'
-
----
-
-### EVENTS
-
-All events should have an infinitive and past participle form. The infinitive is fired just before an action takes place, the past participle on completion of the action.
-
- show | shown
- hide | hidden
-
-All infinitive events should provide preventDefault functionality. This provides the abililty to stop the execution of an action.
-
- $('#myModal').on('show', function (e) {
- if (!data) return e.preventDefault() // stops modal from being shown
- })
-
----
-
-### CONSTRUCTORS
-
-Each plugin should expose its raw constructor on a `Constructor` property -- accessed in the following way:
-
-
- $.fn.popover.Constructor
-
----
-
-### DATA ACCESSOR
-
-Each plugin stores a copy of the invoked class on an object. This class instance can be accessed directly through jQuery's data API like this:
-
- $('[rel=popover]').data('popover') instanceof $.fn.popover.Constructor
-
----
-
-### DATA ATTRIBUTES
-
-Data attributes should take the following form:
-
-- data-{{verb}}={{plugin}} - defines main interaction
-- data-target || href^=# - defined on "control" element (if element controls an element other than self)
-- data-{{noun}} - defines class instance options
-
-Examples:
-
- // control other targets
- data-toggle="modal" data-target="#foo"
- data-toggle="collapse" data-target="#foo" data-parent="#bar"
-
- // defined on element they control
- data-spy="scroll"
-
- data-dismiss="modal"
- data-dismiss="alert"
-
- data-toggle="dropdown"
-
- data-toggle="button"
- data-toggle="buttons-checkbox"
- data-toggle="buttons-radio" \ No newline at end of file
diff --git a/js/bootstrap-affix.js b/js/bootstrap-affix.js
new file mode 100644
index 000000000..7563029b1
--- /dev/null
+++ b/js/bootstrap-affix.js
@@ -0,0 +1,102 @@
+/* ==========================================================
+ * bootstrap-affix.js v2.1.0
+ * http://twitter.github.com/bootstrap/javascript.html#affix
+ * ==========================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
+
+!function ($) {
+
+ "use strict"; // jshint ;_;
+
+
+ /* AFFIX CLASS DEFINITION
+ * ====================== */
+
+ var Affix = function (element, options) {
+ this.options = $.extend({}, $.fn.affix.defaults, options)
+ this.$window = $(window)
+ .on('scroll.affix.data-api', $.proxy(this.checkPosition, this))
+ .on('resize.affix.data-api', $.proxy(this.refresh, this))
+ this.$element = $(element)
+ this.refresh()
+ }
+
+ Affix.prototype.refresh = function () {
+ this.position = this.$element.offset()
+ }
+
+ Affix.prototype.checkPosition = function () {
+ if (!this.$element.is(':visible')) return
+
+ var scrollLeft = this.$window.scrollLeft()
+ , scrollTop = this.$window.scrollTop()
+ , position = this.position
+ , offset = this.options.offset
+ , affix
+
+ if (typeof offset != 'object') offset = { x: offset, y: offset }
+
+ affix = (offset.x == null || (position.left - scrollLeft <= offset.x))
+ && (offset.y == null || (position.top - scrollTop <= offset.y))
+
+ if (affix == this.affixed) return
+
+ this.affixed = affix
+
+ this.$element[affix ? 'addClass' : 'removeClass']('affix')
+ }
+
+
+ /* AFFIX PLUGIN DEFINITION
+ * ======================= */
+
+ $.fn.affix = function (option) {
+ return this.each(function () {
+ var $this = $(this)
+ , data = $this.data('affix')
+ , options = typeof option == 'object' && option
+ if (!data) $this.data('affix', (data = new Affix(this, options)))
+ if (typeof option == 'string') data[option]()
+ })
+ }
+
+ $.fn.affix.Constructor = Affix
+
+ $.fn.affix.defaults = {
+ offset: 0
+ }
+
+
+ /* AFFIX DATA-API
+ * ============== */
+
+ $(function () {
+ $('[data-spy="affix"]').each(function () {
+ var $spy = $(this)
+ , data = $spy.data()
+
+ data.offset = data.offset || {}
+
+ data.offsetX && (data.offset.x = data.offsetX)
+ data.offsetY && (data.offset.y = data.offsetY)
+
+ $spy.affix(data)
+ })
+ })
+
+
+}(window.jQuery); \ No newline at end of file
diff --git a/js/bootstrap-modal.js b/js/bootstrap-modal.js
index 966339908..530b53e07 100644
--- a/js/bootstrap-modal.js
+++ b/js/bootstrap-modal.js
@@ -26,9 +26,9 @@
/* MODAL CLASS DEFINITION
* ====================== */
- var Modal = function (content, options) {
+ var Modal = function (element, options) {
this.options = options
- this.$element = $(content)
+ this.$element = $(element)
.delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
this.options.remote && this.$element.find('.modal-body').load(this.options.remote)
}
diff --git a/js/bootstrap-popover.js b/js/bootstrap-popover.js
index fe22ecb47..b7883c5d2 100644
--- a/js/bootstrap-popover.js
+++ b/js/bootstrap-popover.js
@@ -26,7 +26,7 @@
/* POPOVER PUBLIC CLASS DEFINITION
* =============================== */
- var Popover = function ( element, options ) {
+ var Popover = function (element, options) {
this.init('popover', element, options)
}
@@ -72,7 +72,7 @@
}
, destroy: function () {
- this.$element.off().removeData('popover')
+ this.hide().$element.off('.' + this.type).removeData(this.type)
}
})
diff --git a/js/bootstrap-scrollspy.js b/js/bootstrap-scrollspy.js
index 4416d2168..e90cdccb9 100644
--- a/js/bootstrap-scrollspy.js
+++ b/js/bootstrap-scrollspy.js
@@ -23,15 +23,15 @@
"use strict"; // jshint ;_;
- /* SCROLLSPY CLASS DEFINITION
- * ========================== */
+ /* SCROLLSPY CLASS DEFINITION
+ * ========================== */
- function ScrollSpy( element, options) {
+ function ScrollSpy(element, options) {
var process = $.proxy(this.process, this)
, $element = $(element).is('body') ? $(window) : $(element)
, href
this.options = $.extend({}, $.fn.scrollspy.defaults, options)
- this.$scrollElement = $element.on('scroll.scroll.data-api', process)
+ this.$scrollElement = $element.on('scroll.scroll-spy.data-api', process)
this.selector = (this.options.target
|| ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
|| '') + ' .nav li > a'
@@ -121,7 +121,7 @@
/* SCROLLSPY PLUGIN DEFINITION
* =========================== */
- $.fn.scrollspy = function ( option ) {
+ $.fn.scrollspy = function (option) {
return this.each(function () {
var $this = $(this)
, data = $this.data('scrollspy')
@@ -141,7 +141,7 @@
/* SCROLLSPY DATA-API
* ================== */
- $(function () {
+ $(window).on('load', function () {
$('[data-spy="scroll"]').each(function () {
var $spy = $(this)
$spy.scrollspy($spy.data())
diff --git a/js/bootstrap-tab.js b/js/bootstrap-tab.js
index d87f35099..dfcc84412 100644
--- a/js/bootstrap-tab.js
+++ b/js/bootstrap-tab.js
@@ -26,7 +26,7 @@
/* TAB CLASS DEFINITION
* ==================== */
- var Tab = function ( element ) {
+ var Tab = function (element) {
this.element = $(element)
}
diff --git a/js/bootstrap-tooltip.js b/js/bootstrap-tooltip.js
index f280e3696..1e681627a 100644
--- a/js/bootstrap-tooltip.js
+++ b/js/bootstrap-tooltip.js
@@ -47,8 +47,8 @@
if (this.options.trigger != 'manual') {
eventIn = this.options.trigger == 'hover' ? 'mouseenter' : 'focus'
eventOut = this.options.trigger == 'hover' ? 'mouseleave' : 'blur'
- this.$element.on(eventIn, this.options.selector, $.proxy(this.enter, this))
- this.$element.on(eventOut, this.options.selector, $.proxy(this.leave, this))
+ this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
+ this.$element.on(eventOut + '.' + this.type, this.options.selector, $.proxy(this.leave, this))
}
this.options.selector ?
@@ -176,6 +176,8 @@
$.support.transition && this.$tip.hasClass('fade') ?
removeWithAnimation() :
$tip.remove()
+
+ return this
}
, fixTitle: function () {
@@ -236,7 +238,7 @@
}
, destroy: function () {
- this.$element.off().removeData('tooltip')
+ this.hide().$element.off('.' + this.type).removeData(this.type)
}
}
diff --git a/js/bootstrap-transition.js b/js/bootstrap-transition.js
index 2f15dd009..0c37ebb18 100644
--- a/js/bootstrap-transition.js
+++ b/js/bootstrap-transition.js
@@ -36,7 +36,7 @@
, transEndEventNames = {
'WebkitTransition' : 'webkitTransitionEnd'
, 'MozTransition' : 'transitionend'
- , 'OTransition' : 'otransitionend'
+ , 'OTransition' : 'oTransitionEnd otransitionend'
, 'msTransition' : 'MSTransitionEnd'
, 'transition' : 'transitionend'
}
diff --git a/js/bootstrap-typeahead.js b/js/bootstrap-typeahead.js
index 6e896bb98..65b1ddab1 100644
--- a/js/bootstrap-typeahead.js
+++ b/js/bootstrap-typeahead.js
@@ -81,7 +81,7 @@
this.query = this.$element.val()
- if (!this.query) {
+ if (!this.query || this.query.length < this.options.minLength) {
return this.shown ? this.hide() : this
}
@@ -279,12 +279,13 @@
, items: 8
, menu: '<ul class="typeahead dropdown-menu"></ul>'
, item: '<li><a href="#"></a></li>'
+ , minLength: 1
}
$.fn.typeahead.Constructor = Typeahead
- /* TYPEAHEAD DATA-API
+ /* TYPEAHEAD DATA-API
* ================== */
$(function () {
diff --git a/js/tests/index.html b/js/tests/index.html
index 2f8f71b12..976ca1687 100644
--- a/js/tests/index.html
+++ b/js/tests/index.html
@@ -27,6 +27,7 @@
<script src="../../js/bootstrap-tooltip.js"></script>
<script src="../../js/bootstrap-popover.js"></script>
<script src="../../js/bootstrap-typeahead.js"></script>
+ <script src="../../js/bootstrap-affix.js"></script>
<!-- unit tests -->
<script src="unit/bootstrap-transition.js"></script>
@@ -41,6 +42,7 @@
<script src="unit/bootstrap-tooltip.js"></script>
<script src="unit/bootstrap-popover.js"></script>
<script src="unit/bootstrap-typeahead.js"></script>
+ <script src="unit/bootstrap-affix.js"></script>
</head>
<body>
<div>
diff --git a/js/tests/unit/bootstrap-affix.js b/js/tests/unit/bootstrap-affix.js
new file mode 100644
index 000000000..bc25df991
--- /dev/null
+++ b/js/tests/unit/bootstrap-affix.js
@@ -0,0 +1,19 @@
+$(function () {
+
+ module("bootstrap-affix")
+
+ test("should be defined on jquery object", function () {
+ ok($(document.body).affix, 'affix method is defined')
+ })
+
+ test("should return element", function () {
+ ok($(document.body).affix()[0] == document.body, 'document.body returned')
+ })
+
+ test("should exit early if element is not visible", function () {
+ var $affix = $('<div style="display: none"></div>').affix()
+ $affix.data('affix').checkPosition()
+ ok(!$affix.hasClass('affix'), 'affix class was not added')
+ })
+
+}) \ No newline at end of file
diff --git a/js/tests/unit/bootstrap-popover.js b/js/tests/unit/bootstrap-popover.js
index 6d5d9f7a1..daffe215c 100644
--- a/js/tests/unit/bootstrap-popover.js
+++ b/js/tests/unit/bootstrap-popover.js
@@ -92,12 +92,16 @@ $(function () {
})
test("should destroy popover", function () {
- var popover = $('<div/>').popover()
+ var popover = $('<div/>').popover().on('click.foo', function(){})
ok(popover.data('popover'), 'popover has data')
ok(popover.data('events').mouseover && popover.data('events').mouseout, 'popover has hover event')
+ ok(popover.data('events').click[0].namespace == 'foo', 'popover has extra click.foo event')
+ popover.popover('show')
popover.popover('destroy')
+ ok(!popover.hasClass('in'), 'popover is hidden')
ok(!popover.data('popover'), 'popover does not have data')
- ok(!popover.data('events'), 'popover does not have any events')
+ ok(popover.data('events').click[0].namespace == 'foo', 'popover still has click.foo')
+ ok(!popover.data('events').mouseover && !popover.data('events').mouseout, 'popover does not have any events')
})
}) \ No newline at end of file
diff --git a/js/tests/unit/bootstrap-tooltip.js b/js/tests/unit/bootstrap-tooltip.js
index 7852305c1..2eb8c8f7c 100644
--- a/js/tests/unit/bootstrap-tooltip.js
+++ b/js/tests/unit/bootstrap-tooltip.js
@@ -129,12 +129,16 @@ $(function () {
})
test("should destroy tooltip", function () {
- var tooltip = $('<div/>').tooltip()
+ var tooltip = $('<div/>').tooltip().on('click.foo', function(){})
ok(tooltip.data('tooltip'), 'tooltip has data')
ok(tooltip.data('events').mouseover && tooltip.data('events').mouseout, 'tooltip has hover event')
+ ok(tooltip.data('events').click[0].namespace == 'foo', 'tooltip has extra click.foo event')
+ tooltip.tooltip('show')
tooltip.tooltip('destroy')
+ ok(!tooltip.hasClass('in'), 'tooltip is hidden')
ok(!tooltip.data('tooltip'), 'tooltip does not have data')
- ok(!tooltip.data('events'), 'tooltip does not have any events')
+ ok(tooltip.data('events').click[0].namespace == 'foo', 'tooltip still has click.foo')
+ ok(!tooltip.data('events').mouseover && !tooltip.data('events').mouseout, 'tooltip does not have any events')
})
})
diff --git a/js/tests/unit/bootstrap-typeahead.js b/js/tests/unit/bootstrap-typeahead.js
index 25d4cafd8..eb447aaa6 100644
--- a/js/tests/unit/bootstrap-typeahead.js
+++ b/js/tests/unit/bootstrap-typeahead.js
@@ -181,4 +181,24 @@ $(function () {
typeahead.$menu.remove()
})
+
+ test("should start querying when minLength is met", function () {
+ var $input = $('<input />').typeahead({
+ source: ['aaaa', 'aaab', 'aaac'],
+ minLength: 3
+ })
+ , typeahead = $input.data('typeahead')
+
+ $input.val('aa')
+ typeahead.lookup()
+
+ equals(typeahead.$menu.find('li').length, 0, 'has 0 items in menu')
+
+ $input.val('aaa')
+ typeahead.lookup()
+
+ equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
+
+ typeahead.$menu.remove()
+ })
})