From ee12ce83057233d271f42162ef3dd2d42d315176 Mon Sep 17 00:00:00 2001 From: Max Kramer Date: Thu, 22 May 2014 18:13:41 -0400 Subject: Add aria-haspopup and aria-expanded attributes to dropdown plugin 1. Add aria-haspopup="true" and aria-expanded="false" to dropdown docs 2. Toggle aria-expanded between "true" and "false" when opening and closing dropdown Satisfy item 1 from https://github.com/paypal/bootstrap-accessibility-plugin#dropdown. See #13553. --- js/dropdown.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/dropdown.js b/js/dropdown.js index bc671fef0..1924f70ae 100644 --- a/js/dropdown.js +++ b/js/dropdown.js @@ -42,7 +42,9 @@ if (e.isDefaultPrevented()) return - $this.trigger('focus') + $this + .trigger('focus') + .attr('aria-expanded', 'true') $parent .toggleClass('open') @@ -88,11 +90,13 @@ if (e && e.which === 3) return $(backdrop).remove() $(toggle).each(function () { - var $parent = getParent($(this)) + var $this = $(this) + var $parent = getParent($this) var relatedTarget = { relatedTarget: this } if (!$parent.hasClass('open')) return $parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget)) if (e.isDefaultPrevented()) return + $this.attr('aria-expanded', 'false') $parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget) }) } -- cgit v1.2.3 From 231744d628f4857d631e9e9e8554d0a29a1b9556 Mon Sep 17 00:00:00 2001 From: Heinrich Fenkart Date: Mon, 7 Jul 2014 13:03:56 +0200 Subject: Expose transition durations on plugin constructors; closes #13656 --- js/alert.js | 4 +++- js/carousel.js | 4 +++- js/collapse.js | 6 ++++-- js/modal.js | 11 +++++++---- js/tab.js | 4 +++- js/tooltip.js | 6 ++++-- 6 files changed, 24 insertions(+), 11 deletions(-) (limited to 'js') diff --git a/js/alert.js b/js/alert.js index 0efd92cba..5389c32e9 100644 --- a/js/alert.js +++ b/js/alert.js @@ -20,6 +20,8 @@ Alert.VERSION = '3.2.0' + Alert.TRANSITION_DURATION = 150 + Alert.prototype.close = function (e) { var $this = $(this) var selector = $this.attr('data-target') @@ -51,7 +53,7 @@ $.support.transition && $parent.hasClass('fade') ? $parent .one('bsTransitionEnd', removeElement) - .emulateTransitionEnd(150) : + .emulateTransitionEnd(Alert.TRANSITION_DURATION) : removeElement() } diff --git a/js/carousel.js b/js/carousel.js index b7da1ba53..75e5dbedb 100644 --- a/js/carousel.js +++ b/js/carousel.js @@ -30,6 +30,8 @@ Carousel.VERSION = '3.2.0' + Carousel.TRANSITION_DURATION = 600 + Carousel.DEFAULTS = { interval: 5000, pause: 'hover', @@ -146,7 +148,7 @@ that.$element.trigger(slidEvent) }, 0) }) - .emulateTransitionEnd($active.css('transition-duration').slice(0, -1) * 1000) + .emulateTransitionEnd(Carousel.TRANSITION_DURATION) } else { $active.removeClass('active') $next.addClass('active') diff --git a/js/collapse.js b/js/collapse.js index 5a524241d..a265344f4 100644 --- a/js/collapse.js +++ b/js/collapse.js @@ -24,6 +24,8 @@ Collapse.VERSION = '3.2.0' + Collapse.TRANSITION_DURATION = 350 + Collapse.DEFAULTS = { toggle: true } @@ -72,7 +74,7 @@ this.$element .one('bsTransitionEnd', $.proxy(complete, this)) - .emulateTransitionEnd(350)[dimension](this.$element[0][scrollSize]) + .emulateTransitionEnd(Collapse.TRANSITION_DURATION)[dimension](this.$element[0][scrollSize]) } Collapse.prototype.hide = function () { @@ -105,7 +107,7 @@ this.$element [dimension](0) .one('bsTransitionEnd', $.proxy(complete, this)) - .emulateTransitionEnd(350) + .emulateTransitionEnd(Collapse.TRANSITION_DURATION) } Collapse.prototype.toggle = function () { diff --git a/js/modal.js b/js/modal.js index fdefdd2c5..f8d53e251 100644 --- a/js/modal.js +++ b/js/modal.js @@ -32,6 +32,9 @@ Modal.VERSION = '3.2.0' + Modal.TRANSITION_DURATION = 300 + Modal.BACKDROP_TRANSITION_DURATION = 150 + Modal.DEFAULTS = { backdrop: true, keyboard: true, @@ -88,7 +91,7 @@ .one('bsTransitionEnd', function () { that.$element.trigger('focus').trigger(e) }) - .emulateTransitionEnd(300) : + .emulateTransitionEnd(Modal.TRANSITION_DURATION) : that.$element.trigger('focus').trigger(e) }) } @@ -119,7 +122,7 @@ $.support.transition && this.$element.hasClass('fade') ? this.$element .one('bsTransitionEnd', $.proxy(this.hideModal, this)) - .emulateTransitionEnd(300) : + .emulateTransitionEnd(Modal.TRANSITION_DURATION) : this.hideModal() } @@ -182,7 +185,7 @@ doAnimate ? this.$backdrop .one('bsTransitionEnd', callback) - .emulateTransitionEnd(150) : + .emulateTransitionEnd(Modal.BACKDROP_TRANSITION_DURATION) : callback() } else if (!this.isShown && this.$backdrop) { @@ -195,7 +198,7 @@ $.support.transition && this.$element.hasClass('fade') ? this.$backdrop .one('bsTransitionEnd', callbackRemove) - .emulateTransitionEnd(150) : + .emulateTransitionEnd(Modal.BACKDROP_TRANSITION_DURATION) : callbackRemove() } else if (callback) { diff --git a/js/tab.js b/js/tab.js index 573b369a7..d7023c817 100644 --- a/js/tab.js +++ b/js/tab.js @@ -19,6 +19,8 @@ Tab.VERSION = '3.2.0' + Tab.TRANSITION_DURATION = 150 + Tab.prototype.show = function () { var $this = this.element var $ul = $this.closest('ul:not(.dropdown-menu)') @@ -82,7 +84,7 @@ $active.length && transition ? $active .one('bsTransitionEnd', next) - .emulateTransitionEnd(150) : + .emulateTransitionEnd(Tab.TRANSITION_DURATION) : next() $active.removeClass('in') diff --git a/js/tooltip.js b/js/tooltip.js index b305bc5ab..5892c67fa 100644 --- a/js/tooltip.js +++ b/js/tooltip.js @@ -27,6 +27,8 @@ Tooltip.VERSION = '3.2.0' + Tooltip.TRANSITION_DURATION = 150 + Tooltip.DEFAULTS = { animation: true, placement: 'top', @@ -207,7 +209,7 @@ $.support.transition && this.$tip.hasClass('fade') ? $tip .one('bsTransitionEnd', complete) - .emulateTransitionEnd(150) : + .emulateTransitionEnd(Tooltip.TRANSITION_DURATION) : complete() } } @@ -295,7 +297,7 @@ $.support.transition && this.$tip.hasClass('fade') ? $tip .one('bsTransitionEnd', complete) - .emulateTransitionEnd(150) : + .emulateTransitionEnd(Tooltip.TRANSITION_DURATION) : complete() this.hoverState = null -- cgit v1.2.3 From cc7fab893d2e3c24fdc0e26fd47478cc0006200b Mon Sep 17 00:00:00 2001 From: Heinrich Fenkart Date: Wed, 16 Jul 2014 08:44:56 +0200 Subject: Follow-up to #13907: simplify JS logic for focus shim --- js/button.js | 16 ++-------------- 1 file changed, 2 insertions(+), 14 deletions(-) (limited to 'js') diff --git a/js/button.js b/js/button.js index 7e2a6e4e8..b3e944c59 100644 --- a/js/button.js +++ b/js/button.js @@ -97,15 +97,6 @@ } - // FOCUS SHIM (FOR BUTTON GROUPS) - // ============================== - - function getBtnTarget(target) { - var $target = $(target) - return $target.hasClass('btn') ? $target : $target.parent('.btn') - } - - // BUTTON DATA-API // =============== @@ -116,11 +107,8 @@ Plugin.call($btn, 'toggle') e.preventDefault() }) - .on('focus.bs.button.data-api', '[data-toggle^="button"]', function (e) { - getBtnTarget(e.target).addClass('focus') - }) - .on('blur.bs.button.data-api', '[data-toggle^="button"]', function (e) { - getBtnTarget(e.target).removeClass('focus') + .on('focus.bs.button.data-api blur.bs.button.data-api', '[data-toggle^="button"]', function (e) { + $(e.target).closest('.btn').toggleClass('focus', e.type == 'focus') }) }(jQuery); -- cgit v1.2.3 From 9b90b8709956ed87543ec3679a81b7448c0bf20e Mon Sep 17 00:00:00 2001 From: fat Date: Sun, 6 Jul 2014 22:12:26 -0700 Subject: speed up js tests a bit --- js/tests/unit/tooltip.js | 406 +++++++++++++++++++++++------------------------ 1 file changed, 203 insertions(+), 203 deletions(-) (limited to 'js') diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js index 6871f538e..fb1940b2d 100644 --- a/js/tests/unit/tooltip.js +++ b/js/tests/unit/tooltip.js @@ -202,134 +202,6 @@ $(function () { .bootstrapTooltip('show') }) - test('should not show tooltip if leave event occurs before delay expires', function () { - stop() - - var $tooltip = $('') - .appendTo('#qunit-fixture') - .bootstrapTooltip({ delay: 200 }) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '100ms: tooltip not faded in') - $tooltip.trigger('mouseout') - }, 100) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '300ms: tooltip not faded in') - start() - }, 300) - - $tooltip.trigger('mouseenter') - }) - - test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function () { - stop() - - var $tooltip = $('') - .appendTo('#qunit-fixture') - .bootstrapTooltip({ delay: { show: 200, hide: 0 }}) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '100ms: tooltip not faded in') - $tooltip.trigger('mouseout') - }, 100) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '300ms: tooltip not faded in') - start() - }, 300) - - $tooltip.trigger('mouseenter') - }) - - test('should wait 200 ms before hiding the tooltip', function () { - stop() - - var $tooltip = $('') - .appendTo('#qunit-fixture') - .bootstrapTooltip({ delay: { show: 0, hide: 200 }}) - - setTimeout(function () { - ok($('.tooltip').is('.fade.in'), '1ms: tooltip faded in') - $tooltip.trigger('mouseout') - }, 1) - - setTimeout(function () { - ok($('.tooltip').is('.fade.in'), '100ms: tooltip still faded in') - }, 100) - - setTimeout(function () { - ok(!$('.tooltip').is('.in'), '250ms: tooltip removed') - start() - }, 250) - - $tooltip.trigger('mouseenter') - }) - - test('should not hide tooltip if leave event occurs and enter event occurs within the hide delay', function () { - stop() - - var $tooltip = $('') - .appendTo('#qunit-fixture') - .bootstrapTooltip({ delay: { show: 0, hide: 200 }}) - - setTimeout(function () { - ok($('.tooltip').is('.fade.in'), '1ms: tooltip faded in') - $tooltip.trigger('mouseout') - }, 1) - - setTimeout(function () { - ok($('.tooltip').is('.fade.in'), '100ms: tooltip still faded in') - $tooltip.trigger('mouseenter') - }, 100) - - setTimeout(function () { - ok($('.tooltip').is('.fade.in'), '250ms: tooltip still faded in') - start() - }, 250) - - $tooltip.trigger('mouseenter') - }) - - test('should not show tooltip if leave event occurs before delay expires', function () { - stop() - - var $tooltip = $('') - .appendTo('#qunit-fixture') - .bootstrapTooltip({ delay: 100 }) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '50ms: tooltip not faded in') - $tooltip.trigger('mouseout') - }, 50) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '100ms: tooltip not faded in') - start() - }, 100) - - $tooltip.trigger('mouseenter') - }) - - test('should show tooltip if leave event hasn\'t occured before delay expires', function () { - stop() - - var $tooltip = $('') - .appendTo('#qunit-fixture') - .bootstrapTooltip({ delay: 150 }) - - setTimeout(function () { - ok(!$('.tooltip').is('.fade.in'), '100ms: tooltip is not faded in') - }, 100) - - setTimeout(function () { - ok($('.tooltip').is('.fade.in'), '200ms: tooltip is faded in') - start() - }, 200) - - $tooltip.trigger('mouseenter') - }) - test('should destroy tooltip', function () { var $tooltip = $('
') .bootstrapTooltip() @@ -395,76 +267,6 @@ $(function () { equal($('body > .tooltip').length, 0, 'tooltip was removed from dom') }) - test('should place tooltip inside viewport', function () { - stop() - - var $container = $('
') - .css({ - position: 'absolute', - width: 200, - height: 200, - bottom: 0, - left: 0 - }) - .appendTo(document.body) - - $('Hover me') - .css({ - position: 'absolute', - top: 0, - left: 0 - }) - .appendTo($container) - .bootstrapTooltip({ - placement: 'top', - animate: false - }) - .bootstrapTooltip('show') - - setTimeout(function () { - ok($('.tooltip').offset().left >= 0) - $container.remove() - start() - }, 100) - }) - - test('should place tooltip on top of element', function () { - stop() - - var containerHTML = '
' - + '

' - + 'Hover me' - + '

' - + '
' - var $container = $(containerHTML) - .css({ - position: 'absolute', - bottom: 0, - left: 0, - textAlign: 'right', - width: 300, - height: 300 - }) - .appendTo(document.body) - - var $trigger = $container - .find('a') - .css('margin-top', 200) - .bootstrapTooltip({ - placement: 'top', - animate: false - }) - .bootstrapTooltip('show') - - var $tooltip = $container.find('.tooltip') - - setTimeout(function () { - ok(Math.round($tooltip.offset().top + $tooltip.outerHeight()) <= Math.round($trigger.offset().top)) - $container.remove() - start() - }, 100) - }) - test('should add position class before positioning so that position-specific styles are taken into account', function () { var styles = '' var $styles = $(styles).appendTo('head') - var $container = $('
').appendTo(document.body) + var $container = $('
').appendTo('#qunit-fixture') var $target = $('') .appendTo($container) .bootstrapTooltip({ @@ -587,7 +389,7 @@ $(function () { + '' var $styles = $(styles).appendTo('head') - var $container = $('
').appendTo(document.body) + var $container = $('
').appendTo('#qunit-fixture') var $target = $('') .appendTo($container) .bootstrapTooltip({ @@ -604,7 +406,6 @@ $(function () { $target.bootstrapTooltip('hide') equal($('.tooltip').length, 0, 'tooltip removed from dom') - $container.remove() $styles.remove() }) @@ -615,7 +416,7 @@ $(function () { + '' var $styles = $(styles).appendTo('head') - var $container = $('
').appendTo(document.body) + var $container = $('
').appendTo('#qunit-fixture') var $target = $('') .appendTo($container) .bootstrapTooltip({ @@ -644,7 +445,7 @@ $(function () { + '' var $styles = $(styles).appendTo('head') - var $container = $('
').appendTo(document.body) + var $container = $('
').appendTo('#qunit-fixture') var $target = $('') .appendTo($container) .bootstrapTooltip({ @@ -739,4 +540,203 @@ $(function () { ok(passed, '.tooltip(\'show\') should not throw an error if element no longer is in dom') }) + + test('should place tooltip on top of element', function () { + stop() + + var containerHTML = '' + + var $container = $(containerHTML) + .css({ + position: 'absolute', + bottom: 0, + left: 0, + textAlign: 'right', + width: 300, + height: 300 + }) + .appendTo('#qunit-fixture') + + var $trigger = $container + .find('a') + .css('margin-top', 200) + .bootstrapTooltip({ + placement: 'top', + animate: false + }) + .bootstrapTooltip('show') + + var $tooltip = $container.find('.tooltip') + + setTimeout(function () { + ok(Math.round($tooltip.offset().top + $tooltip.outerHeight()) <= Math.round($trigger.offset().top)) + start() + }, 0) + }) + + test('should place tooltip inside viewport', function () { + stop() + + var $container = $('
') + .css({ + position: 'absolute', + width: 200, + height: 200, + bottom: 0, + left: 0 + }) + .appendTo('#qunit-fixture') + + $('Hover me') + .css({ + position: 'absolute', + top: 0, + left: 0 + }) + .appendTo($container) + .bootstrapTooltip({ + placement: 'top' + }) + .bootstrapTooltip('show') + + setTimeout(function () { + ok($('.tooltip').offset().left >= 0) + start() + }, 0) + }) + + test('should show tooltip if leave event hasn\'t occured before delay expires', function () { + stop() + + var $tooltip = $('') + .appendTo('#qunit-fixture') + .bootstrapTooltip({ delay: 15 }) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '10ms: tooltip is not faded in') + }, 10) + + setTimeout(function () { + ok($('.tooltip').is('.fade.in'), '20ms: tooltip is faded in') + start() + }, 20) + + $tooltip.trigger('mouseenter') + }) + + test('should not show tooltip if leave event occurs before delay expires', function () { + stop() + + var $tooltip = $('') + .appendTo('#qunit-fixture') + .bootstrapTooltip({ delay: 15 }) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '10ms: tooltip not faded in') + $tooltip.trigger('mouseout') + }, 10) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '20ms: tooltip not faded in') + start() + }, 20) + + $tooltip.trigger('mouseenter') + }) + + test('should not hide tooltip if leave event occurs and enter event occurs within the hide delay', function () { + stop() + + var $tooltip = $('') + .appendTo('#qunit-fixture') + .bootstrapTooltip({ delay: { show: 0, hide: 15 }}) + + setTimeout(function () { + ok($('.tooltip').is('.fade.in'), '1ms: tooltip faded in') + $tooltip.trigger('mouseout') + + setTimeout(function () { + ok($('.tooltip').is('.fade.in'), '10ms: tooltip still faded in') + $tooltip.trigger('mouseenter') + }, 10) + + setTimeout(function () { + ok($('.tooltip').is('.fade.in'), '20ms: tooltip still faded in') + start() + }, 20) + }, 0) + + $tooltip.trigger('mouseenter') + }) + + test('should not show tooltip if leave event occurs before delay expires', function () { + stop() + + var $tooltip = $('') + .appendTo('#qunit-fixture') + .bootstrapTooltip({ delay: 15 }) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '10ms: tooltip not faded in') + $tooltip.trigger('mouseout') + }, 10) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '20ms: tooltip not faded in') + start() + }, 20) + + $tooltip.trigger('mouseenter') + }) + + test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function () { + stop() + + var $tooltip = $('') + .appendTo('#qunit-fixture') + .bootstrapTooltip({ delay: { show: 15, hide: 0 }}) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '10ms: tooltip not faded in') + $tooltip.trigger('mouseout') + }, 10) + + setTimeout(function () { + ok(!$('.tooltip').is('.fade.in'), '25ms: tooltip not faded in') + start() + }, 25) + + $tooltip.trigger('mouseenter') + }) + + test('should wait 20ms before hiding the tooltip', function () { + stop() + + var $tooltip = $('') + .appendTo('#qunit-fixture') + .bootstrapTooltip({ delay: { show: 0, hide: 15 }}) + + setTimeout(function () { + ok($tooltip.data('bs.tooltip').$tip.is('.fade.in'), '1ms: tooltip faded in') + + $tooltip.trigger('mouseout') + + setTimeout(function () { + ok($tooltip.data('bs.tooltip').$tip.is('.fade.in'), '10ms: tooltip still faded in') + }, 10) + + setTimeout(function () { + ok(!$tooltip.data('bs.tooltip').$tip.is('.in'), '20ms: tooltip removed') + start() + }, 20) + + }, 0) + + $tooltip.trigger('mouseenter') + }) + }) -- cgit v1.2.3 From d3dea01a11436921dac54032c83479ed1e41f6c7 Mon Sep 17 00:00:00 2001 From: Charles B Johnson Date: Wed, 2 Jul 2014 16:53:00 -0400 Subject: Add a bottom affixed element to affix visual tests. --- js/tests/visual/affix.html | 68 ++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 63 insertions(+), 5 deletions(-) (limited to 'js') diff --git a/js/tests/visual/affix.html b/js/tests/visual/affix.html index 5e677eb57..40a55ab51 100644 --- a/js/tests/visual/affix.html +++ b/js/tests/visual/affix.html @@ -6,12 +6,36 @@ @@ -23,7 +47,7 @@
-
    +
    • Cras justo odio
    • Dapibus ac facilisis in
    • Morbi leo risus
      • @@ -43,7 +67,7 @@
-
+

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.

@@ -199,6 +223,27 @@
+
+
    +
  • Sit necessitatibus aspernatur.
    • +
  • Adipisicing alias dolor!
    • +
  • Ipsum molestiae impedit.
    • +
  • Amet quis iste?
    • +
  • Ipsum quaerat porro.
    • +
  • Elit lorem libero.
    • +
  • Ipsum dolore facilis.
    • +
  • Elit ad atque.
    • +
  • Dolor amet sequi!
    • +
  • Consectetur voluptatum facilis!
    • +
  • Sit neque eligendi?
    • +
  • Amet fuga consectetur!
    • +
  • Amet molestias repellat!
    • +
  • Consectetur minima repellendus.
    • +
  • Grow content
    • +
  • Shrink content
    • +
+
+
@@ -222,7 +267,7 @@ -- cgit v1.2.3 From 8c0eb9b00e28dada2b4aaa3792e89099743c675f Mon Sep 17 00:00:00 2001 From: Charles B Johnson Date: Thu, 24 Apr 2014 23:15:38 -0400 Subject: Refactor determining affix state into a separate expanded method in order to handle multiple edge cases, specifically when the document height is dynamic. Always reposition an affix that is affixed to the bottom. --- js/affix.js | 63 +++++++++++++++++++++++++++++++++++++++++++------------------ 1 file changed, 45 insertions(+), 18 deletions(-) (limited to 'js') diff --git a/js/affix.js b/js/affix.js index 26b09db56..daebbffdd 100644 --- a/js/affix.js +++ b/js/affix.js @@ -37,6 +37,35 @@ target: window } + Affix.prototype.getState = function (scrollHeight, height, offsetTop, offsetBottom) { + var scrollTop = this.$target.scrollTop() + var position = this.$element.offset() + var targetHeight = this.$target.height() + + if (offsetTop != null && this.affixed == 'top') return scrollTop >= offsetTop ? false : 'top' + if (this.affixed == 'bottom') { + // Can be affixed to the top, use the unpin value + if (offsetTop != null) { + return (scrollTop + this.unpin <= position.top) ? false : 'bottom' + // Can only ever be pinned or affixed to the bottom, ignore unpin value + } else { + return (scrollTop + targetHeight <= scrollHeight - offsetBottom) ? false : 'bottom' + } + } else { + var initializing = this.affixed == null + var colliderTop = initializing ? scrollTop : position.top + var colliderHeight = initializing ? targetHeight : height + + if (offsetTop != null && colliderTop <= offsetTop) { + return 'top' + } else if (offsetBottom != null && (colliderTop + colliderHeight >= scrollHeight - offsetBottom)) { + return 'bottom' + } else { + return false + } + } + } + Affix.prototype.getPinnedOffset = function () { if (this.pinnedOffset) return this.pinnedOffset this.$element.removeClass(Affix.RESET).addClass('affix') @@ -53,8 +82,7 @@ if (!this.$element.is(':visible')) return var scrollHeight = $(document).height() - var scrollTop = this.$target.scrollTop() - var position = this.$element.offset() + var height = this.$element.height() var offset = this.options.offset var offsetTop = offset.top var offsetBottom = offset.bottom @@ -63,31 +91,30 @@ if (typeof offsetTop == 'function') offsetTop = offset.top(this.$element) if (typeof offsetBottom == 'function') offsetBottom = offset.bottom(this.$element) - var affix = this.unpin != null && (scrollTop + this.unpin <= position.top) ? false : - offsetBottom != null && (position.top + this.$element.height() >= scrollHeight - offsetBottom) ? 'bottom' : - offsetTop != null && (scrollTop <= offsetTop) ? 'top' : false + var affix = this.getState(scrollHeight, height, offsetTop, offsetBottom) - if (this.affixed === affix) return - if (this.unpin != null) this.$element.css('top', '') + if (this.affixed != affix) { + if (this.unpin != null) this.$element.css('top', '') - var affixType = 'affix' + (affix ? '-' + affix : '') - var e = $.Event(affixType + '.bs.affix') + var affixType = 'affix' + (affix ? '-' + affix : '') + var e = $.Event(affixType + '.bs.affix') - this.$element.trigger(e) + this.$element.trigger(e) - if (e.isDefaultPrevented()) return + if (e.isDefaultPrevented()) return - this.affixed = affix - this.unpin = affix == 'bottom' ? this.getPinnedOffset() : null + this.affixed = affix + this.unpin = affix == 'bottom' ? this.getPinnedOffset() : null - this.$element - .removeClass(Affix.RESET) - .addClass(affixType) - .trigger(affixType.replace('affix', 'affixed') + '.bs.affix') + this.$element + .removeClass(Affix.RESET) + .addClass(affixType) + .trigger(affixType.replace('affix', 'affixed') + '.bs.affix') + } if (affix == 'bottom') { this.$element.offset({ - top: scrollHeight - this.$element.height() - offsetBottom + top: scrollHeight - height - offsetBottom }) } } -- cgit v1.2.3 From 724c4f526cd56a28bb305fe6f1f31f3091bf2cd6 Mon Sep 17 00:00:00 2001 From: Charles B Johnson Date: Fri, 18 Jul 2014 10:46:42 -0400 Subject: Fix issue where bottom affixed element floats over the footer when the document height is smaller than the viewport height. --- js/affix.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js') diff --git a/js/affix.js b/js/affix.js index daebbffdd..7f80041d5 100644 --- a/js/affix.js +++ b/js/affix.js @@ -81,7 +81,7 @@ Affix.prototype.checkPosition = function () { if (!this.$element.is(':visible')) return - var scrollHeight = $(document).height() + var scrollHeight = $('body').height() var height = this.$element.height() var offset = this.options.offset var offsetTop = offset.top -- cgit v1.2.3 From eff9b063da87c940d627745fe218a6c5435b69c1 Mon Sep 17 00:00:00 2001 From: fat Date: Mon, 21 Jul 2014 22:31:56 -0700 Subject: cleanup style --- js/affix.js | 41 +++++++++++++++++------------------------ 1 file changed, 17 insertions(+), 24 deletions(-) (limited to 'js') diff --git a/js/affix.js b/js/affix.js index 7f80041d5..bd48fc2ca 100644 --- a/js/affix.js +++ b/js/affix.js @@ -38,32 +38,25 @@ } Affix.prototype.getState = function (scrollHeight, height, offsetTop, offsetBottom) { - var scrollTop = this.$target.scrollTop() - var position = this.$element.offset() - var targetHeight = this.$target.height() + var scrollTop = this.$target.scrollTop() + var position = this.$element.offset() + var targetHeight = this.$target.height() + + if (offsetTop != null && this.affixed == 'top') return scrollTop < offsetTop ? 'top' : false - if (offsetTop != null && this.affixed == 'top') return scrollTop >= offsetTop ? false : 'top' if (this.affixed == 'bottom') { - // Can be affixed to the top, use the unpin value - if (offsetTop != null) { - return (scrollTop + this.unpin <= position.top) ? false : 'bottom' - // Can only ever be pinned or affixed to the bottom, ignore unpin value - } else { - return (scrollTop + targetHeight <= scrollHeight - offsetBottom) ? false : 'bottom' - } - } else { - var initializing = this.affixed == null - var colliderTop = initializing ? scrollTop : position.top - var colliderHeight = initializing ? targetHeight : height - - if (offsetTop != null && colliderTop <= offsetTop) { - return 'top' - } else if (offsetBottom != null && (colliderTop + colliderHeight >= scrollHeight - offsetBottom)) { - return 'bottom' - } else { - return false - } + if (offsetTop != null) return (scrollTop + this.unpin <= position.top) ? false : 'bottom' + return (scrollTop + targetHeight <= scrollHeight - offsetBottom) ? false : 'bottom' } + + var initializing = this.affixed == null + var colliderTop = initializing ? scrollTop : position.top + var colliderHeight = initializing ? targetHeight : height + + if (offsetTop != null && colliderTop <= offsetTop) return 'top' + if (offsetBottom != null && (colliderTop + colliderHeight >= scrollHeight - offsetBottom)) return 'bottom' + + return false } Affix.prototype.getPinnedOffset = function () { @@ -81,11 +74,11 @@ Affix.prototype.checkPosition = function () { if (!this.$element.is(':visible')) return - var scrollHeight = $('body').height() var height = this.$element.height() var offset = this.options.offset var offsetTop = offset.top var offsetBottom = offset.bottom + var scrollHeight = $('body').height() if (typeof offset != 'object') offsetBottom = offsetTop = offset if (typeof offsetTop == 'function') offsetTop = offset.top(this.$element) -- cgit v1.2.3 From 098242afd8cf24087ff76ecef53e945666ca9edf Mon Sep 17 00:00:00 2001 From: Artem Belov Date: Fri, 25 Jul 2014 15:03:07 +0400 Subject: Delete duplicate JSCS properties --- js/.jscsrc | 1 - 1 file changed, 1 deletion(-) (limited to 'js') diff --git a/js/.jscsrc b/js/.jscsrc index 619690a68..bffabb0b5 100644 --- a/js/.jscsrc +++ b/js/.jscsrc @@ -5,7 +5,6 @@ "disallowMultipleLineStrings": true, "disallowMultipleVarDecl": true, "disallowQuotedKeysInObjects": "allButReserved", - "disallowSpaceAfterPrefixUnaryOperators": ["!"], "disallowSpaceBeforeBinaryOperators": [","], "disallowSpaceAfterPrefixUnaryOperators": ["++", "--", "+", "-", "~", "!"], "disallowSpaceBeforePostfixUnaryOperators": ["++", "--"], -- cgit v1.2.3 From c2f4e5fef1e9f11fa532cb98ccf088e8890e25fc Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Fri, 25 Jul 2014 11:02:30 -0700 Subject: re-alphabetize .jscsrc --- js/.jscsrc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js') diff --git a/js/.jscsrc b/js/.jscsrc index bffabb0b5..9612c1683 100644 --- a/js/.jscsrc +++ b/js/.jscsrc @@ -5,8 +5,8 @@ "disallowMultipleLineStrings": true, "disallowMultipleVarDecl": true, "disallowQuotedKeysInObjects": "allButReserved", - "disallowSpaceBeforeBinaryOperators": [","], "disallowSpaceAfterPrefixUnaryOperators": ["++", "--", "+", "-", "~", "!"], + "disallowSpaceBeforeBinaryOperators": [","], "disallowSpaceBeforePostfixUnaryOperators": ["++", "--"], "disallowSpacesInNamedFunctionExpression": { "beforeOpeningRoundBrace": true }, "disallowSpacesInsideArrayBrackets": true, -- cgit v1.2.3 From cbba8e53df2cfea3273072d94408fd2981dce460 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Mon, 7 Jul 2014 19:05:48 -0700 Subject: Fix #13818 by using more robust "find next carousel item" logic Also adds another test for #9461: carousel next/prev should ignore non-items --- js/carousel.js | 11 +++++++++-- js/tests/unit/carousel.js | 27 ++++++++++++++++++++++++++- 2 files changed, 35 insertions(+), 3 deletions(-) (limited to 'js') diff --git a/js/carousel.js b/js/carousel.js index b7da1ba53..86383edae 100644 --- a/js/carousel.js +++ b/js/carousel.js @@ -63,6 +63,13 @@ return this.$items.index(item || this.$active) } + Carousel.prototype.getItemForDirection = function (direction, active) { + var delta = direction == 'prev' ? -1 : 1 + var activeIndex = this.getItemIndex(active) + var itemIndex = (activeIndex + delta) % this.$items.length + return this.$items.eq(itemIndex) + } + Carousel.prototype.to = function (pos) { var that = this var activeIndex = this.getItemIndex(this.$active = this.$element.find('.item.active')) @@ -72,7 +79,7 @@ if (this.sliding) return this.$element.one('slid.bs.carousel', function () { that.to(pos) }) // yes, "slid" if (activeIndex == pos) return this.pause().cycle() - return this.slide(pos > activeIndex ? 'next' : 'prev', $(this.$items[pos])) + return this.slide(pos > activeIndex ? 'next' : 'prev', this.$items.eq(pos)) } Carousel.prototype.pause = function (e) { @@ -100,7 +107,7 @@ Carousel.prototype.slide = function (type, next) { var $active = this.$element.find('.item.active') - var $next = next || $active[type]() + var $next = next || this.getItemForDirection(type, $active) var isCycling = this.interval var direction = type == 'next' ? 'left' : 'right' var fallback = type == 'next' ? 'first' : 'last' diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js index 51872c57b..3f9e61a34 100644 --- a/js/tests/unit/carousel.js +++ b/js/tests/unit/carousel.js @@ -349,7 +349,7 @@ $(function () { $carousel.remove() }) - test('should skip over non-items', function () { + test('should skip over non-items when using item indices', function () { var templateHTML = '