Merge branch '3.0.0-wip' of github.com:twitter/bootstrap into 3.0.0-wip

dist/js/bootstrap.js

@@ -390,7 +390,7 @@
       $next[0].offsetWidth // force reflow
       $active.addClass(direction)
       $next.addClass(direction)
-      this.$element.find('.item')
+      $active
         .one($.support.transition.end, function () {
           $next.removeClass([type, direction].join(' ')).addClass('active')
           $active.removeClass(['active', direction].join(' '))
@@ -1027,11 +1027,11 @@
       .one('hide', function () {
         $this.is(':visible') && $this.focus()
       })
-    })
+  })
 
-    var $body = $(document.body)
-      .on('shown.bs.modal',  '.modal', function () { $body.addClass('modal-open') })
-      .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
+  var $body = $(document.body)
+    .on('shown.bs.modal',  '.modal', function () { $body.addClass('modal-open') })
+    .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
 
 }(window.jQuery);
 /* ========================================================================
@@ -1138,10 +1138,10 @@
     var self = obj instanceof this.constructor ?
       obj : $(obj.currentTarget)[this.type](options).data('bs.' + this.type)
 
-    if (!self.options.delay || !self.options.delay.show) return self.show()
-
     clearTimeout(self.timeout)
 
+    if (!self.options.delay || !self.options.delay.show) return self.show()
+
     self.hoverState = 'in'
     self.timeout    = setTimeout(function () {
       if (self.hoverState == 'in') self.show()
@@ -1191,7 +1191,6 @@
 
       this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
 
-      var tp
       var pos          = this.getPosition()
       var actualWidth  = $tip[0].offsetWidth
       var actualHeight = $tip[0].offsetHeight
@@ -1216,20 +1215,10 @@
           .addClass(placement)
       }
 
-      switch (placement) {
-        case 'bottom':
-          tp = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}
-          break
-        case 'top':
-          tp = {top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}
-          break
-        case 'left':
-          tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}
-          break
-        case 'right':
-          tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width}
-          break
-      }
+      var tp = placement == 'bottom' ? { top: pos.top + pos.height,   left: pos.left + pos.width / 2 - actualWidth / 2  } :
+               placement == 'top'    ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2  } :
+               placement == 'left'   ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
+            /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width   }
 
       this.applyPlacement(tp, placement)
       this.$element.trigger('shown.bs.' + this.type)
@@ -1242,6 +1231,10 @@
     var width  = $tip[0].offsetWidth
     var height = $tip[0].offsetHeight
 
+    // manually read margins because getBoundingClientRect includes difference
+    offset.top  = offset.top  + parseInt($tip.css('margin-top'), 10)
+    offset.left = offset.left + parseInt($tip.css('margin-left'), 10)
+
     $tip
       .offset(offset)
       .addClass('in')

javascript.html

@@ -29,14 +29,14 @@ lead: "Bring Bootstrap's components to life with over a dozen custom jQuery plug
     <h3 id="js-data-attrs">Data attributes</h3>
     <p>You can use all Bootstrap plugins purely through the markup API without writing a single line of JavaScript. This is Bootstrap's first class API and should be your first consideration when using a plugin.</p>
 
-    <p>That said, in some situations it may be desirable to turn this functionality off. Therefore, we also provide the ability to disable the data attribute API by unbinding all events on the body namespaced with <code>data-api</code>. This looks like this:
+    <p>That said, in some situations it may be desirable to turn this functionality off. Therefore, we also provide the ability to disable the data attribute API by unbinding all events on the document namespaced with <code>data-api</code>. This looks like this:
 {% highlight js %}
-$('body').off('.data-api')
+$(document).off('.data-api')
 {% endhighlight %}
 
     <p>Alternatively, to target a specific plugin, just include the plugin's name as a namespace along with the data-api namespace like this:</p>
 {% highlight js %}
-$('body').off('.alert.data-api')
+$(document).off('.alert.data-api')
 {% endhighlight %}
 
     <h3 id="js-programmatic-api">Programmatic API</h3>

js/carousel.js

@@ -130,7 +130,7 @@
       $next[0].offsetWidth // force reflow
       $active.addClass(direction)
       $next.addClass(direction)
-      this.$element.find('.item')
+      $active
         .one($.support.transition.end, function () {
           $next.removeClass([type, direction].join(' ')).addClass('active')
           $active.removeClass(['active', direction].join(' '))

js/modal.js

@@ -232,10 +232,10 @@
       .one('hide', function () {
         $this.is(':visible') && $this.focus()
       })
-    })
+  })
 
-    var $body = $(document.body)
-      .on('shown.bs.modal',  '.modal', function () { $body.addClass('modal-open') })
-      .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
+  var $body = $(document.body)
+    .on('shown.bs.modal',  '.modal', function () { $body.addClass('modal-open') })
+    .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
 
 }(window.jQuery);

js/tests/unit/tooltip.js

@@ -181,6 +181,51 @@ $(function () {
         }, 100)
       })
 
+      test("should wait 200 ms before hiding the tooltip", 3, function () {
+        var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
+          .appendTo('#qunit-fixture')
+          .tooltip({ delay: { show: 0, hide: 200} })
+
+        stop()
+
+        tooltip.trigger('mouseenter')
+
+        setTimeout(function () {
+          ok($(".tooltip").is('.fade.in'), 'tooltip is faded in')
+          tooltip.trigger('mouseout')
+          setTimeout(function () {
+            ok($(".tooltip").is('.fade.in'), '100ms:tooltip is still faded in')
+            setTimeout(function () {
+              ok(!$(".tooltip").is('.in'), 'tooltip removed')
+              start()
+            }, 150)
+          }, 100)
+        }, 1)
+      })
+
+      test("should not hide tooltip if leave event occurs, then tooltip is show immediately again", function () {
+        var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
+          .appendTo('#qunit-fixture')
+          .tooltip({ delay: { show: 0, hide: 200} })
+
+        stop()
+
+        tooltip.trigger('mouseenter')
+
+        setTimeout(function () {
+          ok($(".tooltip").is('.fade.in'), 'tooltip is faded in')
+          tooltip.trigger('mouseout')
+          setTimeout(function () {
+            ok($(".tooltip").is('.fade.in'), '100ms:tooltip is still faded in')
+            tooltip.trigger('mouseenter')
+            setTimeout(function () {
+              ok($(".tooltip").is('.in'), 'tooltip removed')
+              start()
+            }, 150)
+          }, 100)
+        }, 1)
+      })
+
       test("should not show tooltip if leave event occurs before delay expires", function () {
         var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
           .appendTo('#qunit-fixture')

js/tooltip.js

@@ -102,10 +102,10 @@
     var self = obj instanceof this.constructor ?
       obj : $(obj.currentTarget)[this.type](options).data('bs.' + this.type)
 
-    if (!self.options.delay || !self.options.delay.show) return self.show()
-
     clearTimeout(self.timeout)
 
+    if (!self.options.delay || !self.options.delay.show) return self.show()
+
     self.hoverState = 'in'
     self.timeout    = setTimeout(function () {
       if (self.hoverState == 'in') self.show()
@@ -155,7 +155,6 @@
 
       this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
 
-      var tp
       var pos          = this.getPosition()
       var actualWidth  = $tip[0].offsetWidth
       var actualHeight = $tip[0].offsetHeight
@@ -180,20 +179,10 @@
           .addClass(placement)
       }
 
-      switch (placement) {
-        case 'bottom':
-          tp = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}
-          break
-        case 'top':
-          tp = {top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}
-          break
-        case 'left':
-          tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}
-          break
-        case 'right':
-          tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width}
-          break
-      }
+      var tp = placement == 'bottom' ? { top: pos.top + pos.height,   left: pos.left + pos.width / 2 - actualWidth / 2  } :
+               placement == 'top'    ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2  } :
+               placement == 'left'   ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
+            /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width   }
 
       this.applyPlacement(tp, placement)
       this.$element.trigger('shown.bs.' + this.type)
@@ -206,6 +195,10 @@
     var width  = $tip[0].offsetWidth
     var height = $tip[0].offsetHeight
 
+    // manually read margins because getBoundingClientRect includes difference
+    offset.top  = offset.top  + parseInt($tip.css('margin-top'), 10)
+    offset.left = offset.left + parseInt($tip.css('margin-left'), 10)
+
     $tip
       .offset(offset)
       .addClass('in')