remove closureness from plugins

Gruntfile.js

@@ -108,81 +108,39 @@ module.exports = function (grunt) {
       },
       bootstrap: {
         src: [
-          'js/util.js',
+          'js/transition.js',
           'js/alert.js',
           'js/button.js',
           'js/carousel.js',
           'js/collapse.js',
           'js/dropdown.js',
           'js/modal.js',
-          'js/scrollspy.js',
           'js/tooltip.js',
           'js/popover.js',
-          'js/tab.js'
+          'js/scrollspy.js',
+          'js/tab.js',
+          'js/affix.js'
         ],
         dest: 'dist/js/<%= pkg.name %>.js'
       }
     },
 
-    closureCompiler:  {
-
-      options: {
-        compilerFile: require('superstartup-closure-compiler').getPath(),
-        checkModified: false,
-
-        compilerOpts: {
-           // jscs:disable requireCamelCaseOrUpperCaseIdentifiers
-           // jscomp_warning: 'reportUnknownTypes', someday - maybe we will get to 100% typed, this helps track those down
-           compilation_level: 'ADVANCED_OPTIMIZATIONS',
-           warning_level: 'verbose',
-           summary_detail_level: 3,
-           output_wrapper:
-                '"<%= banner %><%= jqueryCheck %><%= jqueryVersionCheck %>'
-             + '(function($){%output%})(jQuery);"',
-           externs: 'js/externs/*.js'
-           // jscs:enable requireCamelCaseOrUpperCaseIdentifiers
-        },
-
-        execOpts: {
-           maxBuffer: 999999 * 1024
-        },
-
-        // [OPTIONAL] Java VM optimization options
-        // see https://code.google.com/p/closure-compiler/wiki/FAQ#What_are_the_recommended_Java_VM_command-line_options?
-        // Setting one of these to 'true' is strongly recommended,
-        // and can reduce compile times by 50-80% depending on compilation size
-        // and hardware.
-        // On server-class hardware, such as with Github's Travis hook,
-        // TieredCompilation should be used; on standard developer hardware,
-        // d32 may be better. Set as appropriate for your environment.
-        // Default for both is 'false'; do not set both to 'true'.
-        d32: false, // will use 'java -client -d32 -jar compiler.jar'
-        TieredCompilation: false // will use 'java -server -XX:+TieredCompilation -jar compiler.jar'
-      },
-
-      targetName: {
-        src: [
-          'js/util.js',
-          'js/alert.js',
-          'js/button.js',
-          'js/carousel.js',
-          'js/collapse.js',
-          'js/dropdown.js',
-          'js/modal.js',
-          'js/scrollspy.js',
-          'js/tooltip.js',
-          'js/popover.js',
-          'js/tab.js'
-        ],
-        dest: 'dist/js/<%= pkg.name %>.min.js'
-      }
-
-    },
-
     uglify: {
       options: {
+        compress: {
+          warnings: false
+        },
+        mangle: true,
         preserveComments: 'some'
       },
+      core: {
+        src: '<%= concat.bootstrap.dest %>',
+        dest: 'dist/js/<%= pkg.name %>.min.js'
+      },
+      customize: {
+        src: configBridge.paths.customizerJs,
+        dest: 'docs/assets/js/customize.min.js'
+      },
       docsJs: {
         src: configBridge.paths.docsJs,
         dest: 'docs/assets/js/docs.min.js'
@@ -443,7 +401,7 @@ module.exports = function (grunt) {
   grunt.registerTask('test-js', ['jshint:core', 'jshint:test', 'jshint:grunt', 'jscs:core', 'jscs:test', 'jscs:grunt', 'qunit']);
 
   // JS distribution task.
-  grunt.registerTask('dist-js', ['concat', 'closureCompiler', 'commonjs']);
+  grunt.registerTask('dist-js', ['concat', 'uglify:core', 'commonjs']);
 
   grunt.registerTask('test-scss', ['scsslint:scss']);
 

dist/js/npm.js

@@ -1,12 +1,13 @@
 // This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.
-require('../../js/util.js')
+require('../../js/transition.js')
 require('../../js/alert.js')
 require('../../js/button.js')
 require('../../js/carousel.js')
 require('../../js/collapse.js')
 require('../../js/dropdown.js')
 require('../../js/modal.js')
-require('../../js/scrollspy.js')
 require('../../js/tooltip.js')
 require('../../js/popover.js')
+require('../../js/scrollspy.js')
 require('../../js/tab.js')
+require('../../js/affix.js')

grunt/bs-commonjs-generator.js

@@ -1,4 +1,5 @@
 'use strict';
+
 var fs = require('fs');
 var path = require('path');
 

js/.jscsrc

@@ -17,8 +17,11 @@
   "requireCamelCaseOrUpperCaseIdentifiers": true,
   "requireCapitalizedConstructors": true,
   "requireCommaBeforeLineBreak": true,
+  "requireDollarBeforejQueryAssignment": true,
   "requireDotNotation": true,
   "requireLineFeedAtFileEnd": true,
+  "requirePaddingNewLinesAfterUseStrict": true,
+  "requirePaddingNewLinesBeforeExport": true,
   "requireSpaceAfterBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!==", ">", "<", ">=", "<="],
   "requireSpaceAfterKeywords": ["if", "else", "for", "while", "do", "switch", "return", "try", "catch"],
   "requireSpaceAfterLineComment": true,
@@ -31,7 +34,9 @@
   "requireSpacesInFunctionExpression": { "beforeOpeningCurlyBrace": true },
   "requireSpacesInNamedFunctionExpression": { "beforeOpeningCurlyBrace": true },
   "requireSpacesInsideObjectBrackets": "allButNested",
+  "validateAlignedFunctionParameters": true,
   "validateIndentation": 2,
   "validateLineBreaks": "LF",
+  "validateNewlineAfterArrayElements": true,
   "validateQuoteMarks": "'"
 }

js/affix.js

@@ -0,0 +1,162 @@
+/* ========================================================================
+ * Bootstrap: affix.js v3.3.4
+ * http://getbootstrap.com/javascript/#affix
+ * ========================================================================
+ * Copyright 2011-2015 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ * ======================================================================== */
+
+
++function ($) {
+  'use strict';
+
+  // AFFIX CLASS DEFINITION
+  // ======================
+
+  var Affix = function (element, options) {
+    this.options = $.extend({}, Affix.DEFAULTS, options)
+
+    this.$target = $(this.options.target)
+      .on('scroll.bs.affix.data-api', $.proxy(this.checkPosition, this))
+      .on('click.bs.affix.data-api',  $.proxy(this.checkPositionWithEventLoop, this))
+
+    this.$element     = $(element)
+    this.affixed      = null
+    this.unpin        = null
+    this.pinnedOffset = null
+
+    this.checkPosition()
+  }
+
+  Affix.VERSION  = '3.3.4'
+
+  Affix.RESET    = 'affix affix-top affix-bottom'
+
+  Affix.DEFAULTS = {
+    offset: 0,
+    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 ? 'top' : false
+
+    if (this.affixed == 'bottom') {
+      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 && scrollTop <= offsetTop) return 'top'
+    if (offsetBottom != null && (colliderTop + colliderHeight >= scrollHeight - offsetBottom)) return 'bottom'
+
+    return false
+  }
+
+  Affix.prototype.getPinnedOffset = function () {
+    if (this.pinnedOffset) return this.pinnedOffset
+    this.$element.removeClass(Affix.RESET).addClass('affix')
+    var scrollTop = this.$target.scrollTop()
+    var position  = this.$element.offset()
+    return (this.pinnedOffset = position.top - scrollTop)
+  }
+
+  Affix.prototype.checkPositionWithEventLoop = function () {
+    setTimeout($.proxy(this.checkPosition, this), 1)
+  }
+
+  Affix.prototype.checkPosition = function () {
+    if (!this.$element.is(':visible')) return
+
+    var height       = this.$element.height()
+    var offset       = this.options.offset
+    var offsetTop    = offset.top
+    var offsetBottom = offset.bottom
+    var scrollHeight = Math.max($(document).height(), $(document.body).height())
+
+    if (typeof offset != 'object')         offsetBottom = offsetTop = offset
+    if (typeof offsetTop == 'function')    offsetTop    = offset.top(this.$element)
+    if (typeof offsetBottom == 'function') offsetBottom = offset.bottom(this.$element)
+
+    var affix = this.getState(scrollHeight, height, offsetTop, offsetBottom)
+
+    if (this.affixed != affix) {
+      if (this.unpin != null) this.$element.css('top', '')
+
+      var affixType = 'affix' + (affix ? '-' + affix : '')
+      var e         = $.Event(affixType + '.bs.affix')
+
+      this.$element.trigger(e)
+
+      if (e.isDefaultPrevented()) return
+
+      this.affixed = affix
+      this.unpin = affix == 'bottom' ? this.getPinnedOffset() : null
+
+      this.$element
+        .removeClass(Affix.RESET)
+        .addClass(affixType)
+        .trigger(affixType.replace('affix', 'affixed') + '.bs.affix')
+    }
+
+    if (affix == 'bottom') {
+      this.$element.offset({
+        top: scrollHeight - height - offsetBottom
+      })
+    }
+  }
+
+
+  // AFFIX PLUGIN DEFINITION
+  // =======================
+
+  function Plugin(option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.affix')
+      var options = typeof option == 'object' && option
+
+      if (!data) $this.data('bs.affix', (data = new Affix(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  var old = $.fn.affix
+
+  $.fn.affix             = Plugin
+  $.fn.affix.Constructor = Affix
+
+
+  // AFFIX NO CONFLICT
+  // =================
+
+  $.fn.affix.noConflict = function () {
+    $.fn.affix = old
+    return this
+  }
+
+
+  // AFFIX DATA-API
+  // ==============
+
+  $(window).on('load', function () {
+    $('[data-spy="affix"]').each(function () {
+      var $spy = $(this)
+      var data = $spy.data()
+
+      data.offset = data.offset || {}
+
+      if (data.offsetBottom != null) data.offset.bottom = data.offsetBottom
+      if (data.offsetTop    != null) data.offset.top    = data.offsetTop
+
+      Plugin.call($spy, data)
+    })
+  })
+
+}(jQuery);

js/alert.js

@@ -1,260 +1,94 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: alert.js v4.0.0
+ * Bootstrap: alert.js v3.3.4
  * http://getbootstrap.com/javascript/#alerts
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's generic alert component. Add dismiss
- * functionality to all alert messages with this plugin.
- *
- * Public Methods & Properties:
- *
- *   + $.alert
- *   + $.alert.noConflict
- *   + $.alert.Constructor
- *   + $.alert.Constructor.VERSION
- *   + $.alert.Constructor.prototype.close
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // ALERT CLASS DEFINITION
+  // ======================
 
-/**
+  var dismiss = '[data-dismiss="alert"]'
- * Our Alert class.
+  var Alert   = function (el) {
- * @param {Element=} opt_element
+    $(el).on('click', dismiss, this.close)
- * @constructor
- */
-var Alert = function (opt_element) {
-  if (opt_element) {
-    $(opt_element).on('click', Alert._DISMISS_SELECTOR, Alert._handleDismiss(this))
   }
+
+  Alert.VERSION = '3.3.4'
+
+  Alert.TRANSITION_DURATION = 150
+
+  Alert.prototype.close = function (e) {
+    var $this    = $(this)
+    var selector = $this.attr('data-target')
+
+    if (!selector) {
+      selector = $this.attr('href')
+      selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
+    }
+
+    var $parent = $(selector)
+
+    if (e) e.preventDefault()
+
+    if (!$parent.length) {
+      $parent = $this.closest('.alert')
+    }
+
+    $parent.trigger(e = $.Event('close.bs.alert'))
+
+    if (e.isDefaultPrevented()) return
+
+    $parent.removeClass('in')
+
+    function removeElement() {
+      // detach from parent, fire event then clean up data
+      $parent.detach().trigger('closed.bs.alert').remove()
+    }
+
+    $.support.transition && $parent.hasClass('fade') ?
+      $parent
+        .one('bsTransitionEnd', removeElement)
+        .emulateTransitionEnd(Alert.TRANSITION_DURATION) :
+      removeElement()
   }
 
 
-/**
+  // ALERT PLUGIN DEFINITION
- * @const
+  // =======================
- * @type {string}
- */
-Alert['VERSION'] = '4.0.0'
 
-
+  function Plugin(option) {
-/**
- * @const
- * @type {string}
- * @private
- */
-Alert._NAME = 'alert'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Alert._DATA_KEY = 'bs.alert'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Alert._DISMISS_SELECTOR = '[data-dismiss="alert"]'
-
-
-/**
- * @const
- * @type {number}
- * @private
- */
-Alert._TRANSITION_DURATION = 150
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Alert._JQUERY_NO_CONFLICT = $.fn[Alert._NAME]
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Alert._Event = {
-  CLOSE  : 'close.bs.alert',
-  CLOSED : 'closed.bs.alert'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Alert._ClassName = {
-  ALERT : 'alert',
-  FADE  : 'fade',
-  IN    : 'in'
-}
-
-
-/**
- * Provides the jQuery Interface for the alert component.
- * @param {string=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Alert._jQueryInterface = function (opt_config) {
     return this.each(function () {
       var $this = $(this)
-    var data  = $this.data(Alert._DATA_KEY)
+      var data  = $this.data('bs.alert')
 
-    if (!data) {
+      if (!data) $this.data('bs.alert', (data = new Alert(this)))
-      data = new Alert(this)
+      if (typeof option == 'string') data[option].call($this)
-      $this.data(Alert._DATA_KEY, data)
-    }
-
-    if (opt_config === 'close') {
-      data[opt_config](this)
-    }
     })
   }
 
+  var old = $.fn.alert
 
-/**
+  $.fn.alert             = Plugin
- * Close the alert component
+  $.fn.alert.Constructor = Alert
- * @param {Alert} alertInstance
- * @return {Function}
- * @private
- */
-Alert._handleDismiss = function (alertInstance) {
-  return function (event) {
-    if (event) {
-      event.preventDefault()
-    }
 
-    alertInstance['close'](this)
+
-  }
+  // ALERT NO CONFLICT
+  // =================
+
+  $.fn.alert.noConflict = function () {
+    $.fn.alert = old
+    return this
   }
 
 
-/**
+  // ALERT DATA-API
- * Close the alert component
+  // ==============
- * @param {Element} element
- */
-Alert.prototype['close'] = function (element) {
-  var rootElement = this._getRootElement(element)
-  var customEvent = this._triggerCloseEvent(rootElement)
 
-  if (customEvent.isDefaultPrevented()) return
+  $(document).on('click.bs.alert.data-api', dismiss, Alert.prototype.close)
 
-  this._removeElement(rootElement)
+}(jQuery);
-}
-
-
-/**
- * Tries to get the alert's root element
- * @return {Element}
- * @private
- */
-Alert.prototype._getRootElement = function (element) {
-  var parent   = false
-  var selector = Bootstrap.getSelectorFromElement(element)
-
-  if (selector) {
-    parent = $(selector)[0]
-  }
-
-  if (!parent) {
-    parent = $(element).closest('.' + Alert._ClassName.ALERT)[0]
-  }
-
-  return parent
-}
-
-
-/**
- * Trigger close event on element
- * @return {$.Event}
- * @private
- */
-Alert.prototype._triggerCloseEvent = function (element) {
-  var closeEvent = $.Event(Alert._Event.CLOSE)
-  $(element).trigger(closeEvent)
-  return closeEvent
-}
-
-
-/**
- * Trigger closed event and remove element from dom
- * @private
- */
-Alert.prototype._removeElement = function (element) {
-  $(element).removeClass(Alert._ClassName.IN)
-
-  if (!Bootstrap.transition || !$(element).hasClass(Alert._ClassName.FADE)) {
-    this._destroyElement(element)
-    return
-  }
-
-  $(element)
-    .one(Bootstrap.TRANSITION_END, this._destroyElement.bind(this, element))
-    .emulateTransitionEnd(Alert._TRANSITION_DURATION)
-}
-
-
-/**
- * clean up any lingering jquery data and kill element
- * @private
- */
-Alert.prototype._destroyElement = function (element) {
-  $(element)
-    .detach()
-    .trigger(Alert._Event.CLOSED)
-    .remove()
-}
-
-
-/**
- * ------------------------------------------------------------------------
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Alert._NAME] = Alert._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Alert._NAME]['Constructor'] = Alert
-
-
-/**
- * @return {Function}
- */
-$.fn[Alert._NAME]['noConflict'] = function () {
-  $.fn[Alert._NAME] = Alert._JQUERY_NO_CONFLICT
-  return Alert._jQueryInterface
-}
-
-
-/**
- * ------------------------------------------------------------------------
- * Data Api implementation
- * ------------------------------------------------------------------------
- */
-
-$(document).on('click.bs.alert.data-api', Alert._DISMISS_SELECTOR, Alert._handleDismiss(new Alert))

js/button.js

@@ -1,207 +1,120 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: button.js v4.0.0
+ * Bootstrap: button.js v3.3.4
  * http://getbootstrap.com/javascript/#buttons
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's generic button component.
- *
- * Note (@fat): Deprecated "setState" – imo, better solutions for managing a
- * buttons state should exist outside this plugin.
- *
- * Public Methods & Properties:
- *
- *   + $.button
- *   + $.button.noConflict
- *   + $.button.Constructor
- *   + $.button.Constructor.VERSION
- *   + $.button.Constructor.prototype.toggle
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // BUTTON PUBLIC CLASS DEFINITION
+  // ==============================
 
-/**
+  var Button = function (element, options) {
- * Our Button class.
+    this.$element  = $(element)
- * @param {Element!} element
+    this.options   = $.extend({}, Button.DEFAULTS, options)
- * @constructor
+    this.isLoading = false
- */
+  }
-var Button = function (element) {
 
-  /** @private {Element} */
+  Button.VERSION  = '3.3.4'
-  this._element = element
 
+  Button.DEFAULTS = {
+    loadingText: 'loading...'
+  }
+
+  Button.prototype.setState = function (state) {
+    var d    = 'disabled'
+    var $el  = this.$element
+    var val  = $el.is('input') ? 'val' : 'html'
+    var data = $el.data()
+
+    state += 'Text'
+
+    if (data.resetText == null) $el.data('resetText', $el[val]())
+
+    // push to event loop to allow forms to submit
+    setTimeout($.proxy(function () {
+      $el[val](data[state] == null ? this.options[state] : data[state])
+
+      if (state == 'loadingText') {
+        this.isLoading = true
+        $el.addClass(d).attr(d, d)
+      } else if (this.isLoading) {
+        this.isLoading = false
+        $el.removeClass(d).removeAttr(d)
+      }
+    }, this), 0)
+  }
+
+  Button.prototype.toggle = function () {
+    var changed = true
+    var $parent = this.$element.closest('[data-toggle="buttons"]')
+
+    if ($parent.length) {
+      var $input = this.$element.find('input')
+      if ($input.prop('type') == 'radio') {
+        if ($input.prop('checked')) changed = false
+        $parent.find('.active').removeClass('active')
+        this.$element.addClass('active')
+      } else if ($input.prop('type') == 'checkbox') {
+        if (($input.prop('checked')) !== this.$element.hasClass('active')) changed = false
+        this.$element.toggleClass('active')
+      }
+      $input.prop('checked', this.$element.hasClass('active'))
+      if (changed) $input.trigger('change')
+    } else {
+      this.$element.attr('aria-pressed', !this.$element.hasClass('active'))
+      this.$element.toggleClass('active')
+    }
   }
 
 
-/**
+  // BUTTON PLUGIN DEFINITION
- * @const
+  // ========================
- * @type {string}
- */
-Button['VERSION']  = '4.0.0'
 
-
+  function Plugin(option) {
-/**
- * @const
- * @type {string}
- * @private
- */
-Button._NAME  = 'button'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Button._DATA_KEY = 'bs.button'
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Button._JQUERY_NO_CONFLICT = $.fn[Button._NAME]
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Button._ClassName = {
-  ACTIVE : 'active',
-  BUTTON : 'btn',
-  FOCUS  : 'focus'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Button._Selector = {
-  DATA_TOGGLE_CARROT : '[data-toggle^="button"]',
-  DATA_TOGGLE        : '[data-toggle="buttons"]',
-  INPUT              : 'input',
-  ACTIVE             : '.active',
-  BUTTON             : '.btn'
-}
-
-
-/**
- * Provides the jQuery Interface for the Button component.
- * @param {string=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Button._jQueryInterface = function (opt_config) {
     return this.each(function () {
-    var data  = $(this).data(Button._DATA_KEY)
+      var $this   = $(this)
+      var data    = $this.data('bs.button')
+      var options = typeof option == 'object' && option
 
-    if (!data) {
+      if (!data) $this.data('bs.button', (data = new Button(this, options)))
-      data = new Button(this)
-      $(this).data(Button._DATA_KEY, data)
-    }
 
-    if (opt_config === 'toggle') {
+      if (option == 'toggle') data.toggle()
-      data[opt_config]()
+      else if (option) data.setState(option)
-    }
     })
   }
 
+  var old = $.fn.button
 
-/**
+  $.fn.button             = Plugin
- * Toggle's the button active state
+  $.fn.button.Constructor = Button
- */
-Button.prototype['toggle'] = function () {
-  var triggerChangeEvent = true
-  var rootElement = $(this._element).closest(Button._Selector.DATA_TOGGLE)[0]
-
-  if (rootElement) {
-    var input = $(this._element).find(Button._Selector.INPUT)[0]
-    if (input) {
-      if (input.type == 'radio') {
-        if (input.checked && $(this._element).hasClass(Button._ClassName.ACTIVE)) {
-          triggerChangeEvent = false
-        } else {
-          var activeElement = $(rootElement).find(Button._Selector.ACTIVE)[0]
-          if (activeElement) {
-            $(activeElement).removeClass(Button._ClassName.ACTIVE)
-          }
-        }
-      }
-
-      if (triggerChangeEvent) {
-        input.checked = !$(this._element).hasClass(Button._ClassName.ACTIVE)
-        $(this._element).trigger('change')
-      }
-    }
-  } else {
-    this._element.setAttribute('aria-pressed', !$(this._element).hasClass(Button._ClassName.ACTIVE))
-  }
-
-  if (triggerChangeEvent) {
-    $(this._element).toggleClass(Button._ClassName.ACTIVE)
-  }
-}
 
 
-/**
+  // BUTTON NO CONFLICT
- * ------------------------------------------------------------------------
+  // ==================
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
 
-/**
+  $.fn.button.noConflict = function () {
- * @const
+    $.fn.button = old
- * @type {Function}
- */
-$.fn[Button._NAME] = Button._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Button._NAME]['Constructor'] = Button
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Button._NAME]['noConflict'] = function () {
-  $.fn[Button._NAME] = Button._JQUERY_NO_CONFLICT
     return this
   }
 
 
-/**
+  // BUTTON DATA-API
- * ------------------------------------------------------------------------
+  // ===============
- * Data Api implementation
- * ------------------------------------------------------------------------
- */
 
   $(document)
-  .on('click.bs.button.data-api', Button._Selector.DATA_TOGGLE_CARROT, function (event) {
+    .on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) {
-    event.preventDefault()
+      var $btn = $(e.target)
-
+      if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
-    var button = event.target
+      Plugin.call($btn, 'toggle')
-
+      if (!($(e.target).is('input[type="radio"]') || $(e.target).is('input[type="checkbox"]'))) e.preventDefault()
-    if (!$(button).hasClass(Button._ClassName.BUTTON)) {
-      button = $(button).closest(Button._Selector.BUTTON)
-    }
-
-    Button._jQueryInterface.call($(button), 'toggle')
     })
-  .on('focus.bs.button.data-api blur.bs.button.data-api', Button._Selector.DATA_TOGGLE_CARROT, function (event) {
+    .on('focus.bs.button.data-api blur.bs.button.data-api', '[data-toggle^="button"]', function (e) {
-    var button = $(event.target).closest(Button._Selector.BUTTON)[0]
+      $(e.target).closest('.btn').toggleClass('focus', /^focus(in)?$/.test(e.type))
-    $(button).toggleClass(Button._ClassName.FOCUS, /^focus(in)?$/.test(event.type))
     })
+
+}(jQuery);

js/carousel.js

@@ -1,576 +1,237 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: carousel.js v4.0.0
+ * Bootstrap: carousel.js v3.3.4
  * http://getbootstrap.com/javascript/#carousel
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's carousel. A slideshow component for cycling
- * through elements, like a carousel. Nested carousels are not supported.
- *
- * Public Methods & Properties:
- *
- *   + $.carousel
- *   + $.carousel.noConflict
- *   + $.carousel.Constructor
- *   + $.carousel.Constructor.VERSION
- *   + $.carousel.Constructor.Defaults
- *   + $.carousel.Constructor.Defaults.interval
- *   + $.carousel.Constructor.Defaults.pause
- *   + $.carousel.Constructor.Defaults.wrap
- *   + $.carousel.Constructor.Defaults.keyboard
- *   + $.carousel.Constructor.Defaults.slide
- *   + $.carousel.Constructor.prototype.next
- *   + $.carousel.Constructor.prototype.prev
- *   + $.carousel.Constructor.prototype.pause
- *   + $.carousel.Constructor.prototype.cycle
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // CAROUSEL CLASS DEFINITION
+  // =========================
 
-/**
+  var Carousel = function (element, options) {
- * Our carousel class.
+    this.$element    = $(element)
- * @param {Element!} element
+    this.$indicators = this.$element.find('.carousel-indicators')
- * @param {Object=} opt_config
+    this.options     = options
- * @constructor
+    this.paused      = null
- */
+    this.sliding     = null
-var Carousel = function (element, opt_config) {
+    this.interval    = null
+    this.$active     = null
+    this.$items      = null
 
-  /** @private {Element} */
+    this.options.keyboard && this.$element.on('keydown.bs.carousel', $.proxy(this.keydown, this))
-  this._element = $(element)[0]
-
-  /** @private {Element} */
-  this._indicatorsElement = $(this._element).find(Carousel._Selector.INDICATORS)[0]
-
-  /** @private {?Object} */
-  this._config = opt_config || null
-
-  /** @private {boolean} */
-  this._isPaused = false
-
-  /** @private {boolean} */
-  this._isSliding = false
-
-  /** @private {?number} */
-  this._interval = null
-
-  /** @private {?Element} */
-  this._activeElement = null
-
-  /** @private {?Array} */
-  this._items = null
-
-  this._addEventListeners()
 
+    this.options.pause == 'hover' && !('ontouchstart' in document.documentElement) && this.$element
+      .on('mouseenter.bs.carousel', $.proxy(this.pause, this))
+      .on('mouseleave.bs.carousel', $.proxy(this.cycle, this))
   }
 
+  Carousel.VERSION  = '3.3.4'
 
-/**
+  Carousel.TRANSITION_DURATION = 600
- * @const
- * @type {string}
- */
-Carousel['VERSION'] = '4.0.0'
 
-
+  Carousel.DEFAULTS = {
-/**
+    interval: 5000,
- * @const
+    pause: 'hover',
- * @type {Object}
+    wrap: true,
- */
+    keyboard: true
-Carousel['Defaults'] = {
-  'interval' : 5000,
-  'pause'    : 'hover',
-  'wrap'     : true,
-  'keyboard' : true,
-  'slide'    : false
   }
 
-
+  Carousel.prototype.keydown = function (e) {
-/**
+    if (/input|textarea/i.test(e.target.tagName)) return
- * @const
+    switch (e.which) {
- * @type {string}
+      case 37: this.prev(); break
- * @private
+      case 39: this.next(); break
- */
-Carousel._NAME  = 'carousel'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Carousel._DATA_KEY = 'bs.carousel'
-
-
-/**
- * @const
- * @type {number}
- * @private
- */
-Carousel._TRANSITION_DURATION = 600
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Carousel._Direction = {
-  NEXT     : 'next',
-  PREVIOUS : 'prev'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Carousel._Event = {
-  SLIDE : 'slide.bs.carousel',
-  SLID  : 'slid.bs.carousel'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Carousel._ClassName = {
-  CAROUSEL : 'carousel',
-  ACTIVE   : 'active',
-  SLIDE    : 'slide',
-  RIGHT    : 'right',
-  LEFT     : 'left',
-  ITEM     : 'carousel-item'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Carousel._Selector = {
-  ACTIVE      : '.active',
-  ACTIVE_ITEM : '.active.carousel-item',
-  ITEM        : '.carousel-item',
-  NEXT_PREV   : '.next, .prev',
-  INDICATORS  : '.carousel-indicators'
-}
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Carousel._JQUERY_NO_CONFLICT = $.fn[Carousel._NAME]
-
-
-/**
- * @param {Object=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Carousel._jQueryInterface = function (opt_config) {
-  return this.each(function () {
-    var data   = $(this).data(Carousel._DATA_KEY)
-    var config = $.extend({}, Carousel['Defaults'], $(this).data(), typeof opt_config == 'object' && opt_config)
-    var action = typeof opt_config == 'string' ? opt_config : config.slide
-
-    if (!data) {
-      data = new Carousel(this, config)
-      $(this).data(Carousel._DATA_KEY, data)
-    }
-
-    if (typeof opt_config == 'number') {
-      data.to(opt_config)
-
-    } else if (action) {
-      data[action]()
-
-    } else if (config.interval) {
-      data['pause']()
-      data['cycle']()
-    }
-  })
-}
-
-
-/**
- * Click handler for data api
- * @param {Event} event
- * @this {Element}
- * @private
- */
-Carousel._dataApiClickHandler = function (event) {
-  var selector = Bootstrap.getSelectorFromElement(this)
-
-  if (!selector) {
-    return
-  }
-
-  var target = $(selector)[0]
-
-  if (!target || !$(target).hasClass(Carousel._ClassName.CAROUSEL)) {
-    return
-  }
-
-  var config = $.extend({}, $(target).data(), $(this).data())
-
-  var slideIndex = this.getAttribute('data-slide-to')
-  if (slideIndex) {
-    config.interval = false
-  }
-
-  Carousel._jQueryInterface.call($(target), config)
-
-  if (slideIndex) {
-    $(target).data(Carousel._DATA_KEY).to(slideIndex)
-  }
-
-  event.preventDefault()
-}
-
-
-/**
- * Advance the carousel to the next slide
- */
-Carousel.prototype['next'] = function () {
-  if (!this._isSliding) {
-    this._slide(Carousel._Direction.NEXT)
-  }
-}
-
-
-/**
- * Return the carousel to the previous slide
- */
-Carousel.prototype['prev'] = function () {
-  if (!this._isSliding) {
-    this._slide(Carousel._Direction.PREVIOUS)
-  }
-}
-
-
-/**
- * Pause the carousel cycle
- * @param {Event=} opt_event
- */
-Carousel.prototype['pause'] = function (opt_event) {
-  if (!opt_event) {
-    this._isPaused = true
-  }
-
-  if ($(this._element).find(Carousel._Selector.NEXT_PREV)[0] && Bootstrap.transition) {
-    $(this._element).trigger(Bootstrap.transition.end)
-    this['cycle'](true)
-  }
-
-  clearInterval(this._interval)
-  this._interval = null
-}
-
-
-/**
- * Cycle to the next carousel item
- * @param {Event|boolean=} opt_event
- */
-Carousel.prototype['cycle'] = function (opt_event) {
-  if (!opt_event) {
-    this._isPaused = false
-  }
-
-  if (this._interval) {
-    clearInterval(this._interval)
-    this._interval = null
-  }
-
-  if (this._config['interval'] && !this._isPaused) {
-    this._interval = setInterval(this['next'].bind(this), this._config['interval'])
-  }
-}
-
-
-/**
- * @return {Object}
- */
-Carousel.prototype['getConfig'] = function () {
-  return this._config
-}
-
-
-/**
- * Move active carousel item to specified index
- * @param {number} index
- */
-Carousel.prototype.to = function (index) {
-  this._activeElement = $(this._element).find(Carousel._Selector.ACTIVE_ITEM)[0]
-
-  var activeIndex = this._getItemIndex(this._activeElement)
-
-  if (index > (this._items.length - 1) || index < 0) {
-    return
-  }
-
-  if (this._isSliding) {
-    $(this._element).one(Carousel._Event.SLID, function () { this.to(index) }.bind(this))
-    return
-  }
-
-  if (activeIndex == index) {
-    this['pause']()
-    this['cycle']()
-    return
-  }
-
-  var direction = index > activeIndex ?
-    Carousel._Direction.NEXT :
-    Carousel._Direction.PREVIOUS
-
-  this._slide(direction, this._items[index])
-}
-
-
-/**
- * Add event listeners to root element
- * @private
- */
-Carousel.prototype._addEventListeners = function () {
-  if (this._config['keyboard']) {
-    $(this._element).on('keydown.bs.carousel', this._keydown.bind(this))
-  }
-
-  if (this._config['pause'] == 'hover' && !('ontouchstart' in document.documentElement)) {
-    $(this._element)
-      .on('mouseenter.bs.carousel', this['pause'].bind(this))
-      .on('mouseleave.bs.carousel', this['cycle'].bind(this))
-  }
-}
-
-
-/**
- * Keydown handler
- * @param {Event} event
- * @private
- */
-Carousel.prototype._keydown = function (event) {
-  event.preventDefault()
-
-  if (/input|textarea/i.test(event.target.tagName)) return
-
-  switch (event.which) {
-    case 37: this['prev'](); break
-    case 39: this['next'](); break
       default: return
     }
+
+    e.preventDefault()
   }
 
+  Carousel.prototype.cycle = function (e) {
+    e || (this.paused = false)
 
-/**
+    this.interval && clearInterval(this.interval)
- * Get item index
- * @param {Element} element
- * @return {number}
- * @private
- */
-Carousel.prototype._getItemIndex = function (element) {
-  this._items = $.makeArray($(element).parent().find(Carousel._Selector.ITEM))
 
-  return this._items.indexOf(element)
+    this.options.interval
+      && !this.paused
+      && (this.interval = setInterval($.proxy(this.next, this), this.options.interval))
+
+    return this
   }
 
-
+  Carousel.prototype.getItemIndex = function (item) {
-/**
+    this.$items = item.parent().children('.item')
- * Get next displayed item based on direction
+    return this.$items.index(item || this.$active)
- * @param {Carousel._Direction} direction
- * @param {Element} activeElement
- * @return {Element}
- * @private
- */
-Carousel.prototype._getItemByDirection = function (direction, activeElement) {
-  var activeIndex   = this._getItemIndex(activeElement)
-  var isGoingToWrap = (direction === Carousel._Direction.PREVIOUS && activeIndex === 0) ||
-                      (direction === Carousel._Direction.NEXT && activeIndex == (this._items.length - 1))
-
-  if (isGoingToWrap && !this._config['wrap']) {
-    return activeElement
   }
 
-  var delta     = direction == Carousel._Direction.PREVIOUS ? -1 : 1
+  Carousel.prototype.getItemForDirection = function (direction, active) {
-  var itemIndex = (activeIndex + delta) % this._items.length
+    var activeIndex = this.getItemIndex(active)
-
+    var willWrap = (direction == 'prev' && activeIndex === 0)
-  return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex]
+                || (direction == 'next' && activeIndex == (this.$items.length - 1))
+    if (willWrap && !this.options.wrap) return active
+    var delta = direction == 'prev' ? -1 : 1
+    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'))
 
-/**
+    if (pos > (this.$items.length - 1) || pos < 0) return
- * Trigger slide event on element
+
- * @param {Element} relatedTarget
+    if (this.sliding)       return this.$element.one('slid.bs.carousel', function () { that.to(pos) }) // yes, "slid"
- * @param {Carousel._ClassName} directionalClassname
+    if (activeIndex == pos) return this.pause().cycle()
- * @return {$.Event}
+
- * @private
+    return this.slide(pos > activeIndex ? 'next' : 'prev', this.$items.eq(pos))
- */
+  }
-Carousel.prototype._triggerSlideEvent = function (relatedTarget, directionalClassname) {
+
-  var slideEvent = $.Event(Carousel._Event.SLIDE, {
+  Carousel.prototype.pause = function (e) {
+    e || (this.paused = true)
+
+    if (this.$element.find('.next, .prev').length && $.support.transition) {
+      this.$element.trigger($.support.transition.end)
+      this.cycle(true)
+    }
+
+    this.interval = clearInterval(this.interval)
+
+    return this
+  }
+
+  Carousel.prototype.next = function () {
+    if (this.sliding) return
+    return this.slide('next')
+  }
+
+  Carousel.prototype.prev = function () {
+    if (this.sliding) return
+    return this.slide('prev')
+  }
+
+  Carousel.prototype.slide = function (type, next) {
+    var $active   = this.$element.find('.item.active')
+    var $next     = next || this.getItemForDirection(type, $active)
+    var isCycling = this.interval
+    var direction = type == 'next' ? 'left' : 'right'
+    var that      = this
+
+    if ($next.hasClass('active')) return (this.sliding = false)
+
+    var relatedTarget = $next[0]
+    var slideEvent = $.Event('slide.bs.carousel', {
       relatedTarget: relatedTarget,
-    direction: directionalClassname
+      direction: direction
     })
+    this.$element.trigger(slideEvent)
+    if (slideEvent.isDefaultPrevented()) return
 
-  $(this._element).trigger(slideEvent)
+    this.sliding = true
 
-  return slideEvent
+    isCycling && this.pause()
+
+    if (this.$indicators.length) {
+      this.$indicators.find('.active').removeClass('active')
+      var $nextIndicator = $(this.$indicators.children()[this.getItemIndex($next)])
+      $nextIndicator && $nextIndicator.addClass('active')
     }
 
-
+    var slidEvent = $.Event('slid.bs.carousel', { relatedTarget: relatedTarget, direction: direction }) // yes, "slid"
-/**
+    if ($.support.transition && this.$element.hasClass('slide')) {
- * Set the active indicator if available
+      $next.addClass(type)
- * @param {Element} element
+      $next[0].offsetWidth // force reflow
- * @private
+      $active.addClass(direction)
- */
+      $next.addClass(direction)
-Carousel.prototype._setActiveIndicatorElement = function (element) {
+      $active
-  if (this._indicatorsElement) {
+        .one('bsTransitionEnd', function () {
-    $(this._indicatorsElement)
+          $next.removeClass([type, direction].join(' ')).addClass('active')
-      .find(Carousel._Selector.ACTIVE)
+          $active.removeClass(['active', direction].join(' '))
-      .removeClass(Carousel._ClassName.ACTIVE)
+          that.sliding = false
-
-    var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)]
-    if (nextIndicator) {
-      $(nextIndicator).addClass(Carousel._ClassName.ACTIVE)
-    }
-  }
-}
-
-
-/**
- * Slide the carousel element in a direction
- * @param {Carousel._Direction} direction
- * @param {Element=} opt_nextElement
- */
-Carousel.prototype._slide = function (direction, opt_nextElement) {
-  var activeElement = $(this._element).find(Carousel._Selector.ACTIVE_ITEM)[0]
-  var nextElement   = opt_nextElement || activeElement && this._getItemByDirection(direction, activeElement)
-
-  var isCycling = !!this._interval
-
-  var directionalClassName = direction == Carousel._Direction.NEXT ?
-    Carousel._ClassName.LEFT :
-    Carousel._ClassName.RIGHT
-
-  if (nextElement && $(nextElement).hasClass(Carousel._ClassName.ACTIVE)) {
-    this._isSliding = false
-    return
-  }
-
-  var slideEvent = this._triggerSlideEvent(nextElement, directionalClassName)
-  if (slideEvent.isDefaultPrevented()) {
-    return
-  }
-
-  if (!activeElement || !nextElement) {
-    // some weirdness is happening, so we bail (maybe throw exception here alerting user that they're dom is off
-    return
-  }
-
-  this._isSliding = true
-
-  if (isCycling) {
-    this['pause']()
-  }
-
-  this._setActiveIndicatorElement(nextElement)
-
-  var slidEvent = $.Event(Carousel._Event.SLID, { relatedTarget: nextElement, direction: directionalClassName })
-
-  if (Bootstrap.transition && $(this._element).hasClass(Carousel._ClassName.SLIDE)) {
-    $(nextElement).addClass(direction)
-
-    Bootstrap.reflow(nextElement)
-
-    $(activeElement).addClass(directionalClassName)
-    $(nextElement).addClass(directionalClassName)
-
-    $(activeElement)
-      .one(Bootstrap.TRANSITION_END, function () {
-        $(nextElement)
-          .removeClass(directionalClassName)
-          .removeClass(direction)
-
-        $(nextElement).addClass(Carousel._ClassName.ACTIVE)
-
-        $(activeElement)
-          .removeClass(Carousel._ClassName.ACTIVE)
-          .removeClass(direction)
-          .removeClass(directionalClassName)
-
-        this._isSliding = false
-
           setTimeout(function () {
-          $(this._element).trigger(slidEvent)
+            that.$element.trigger(slidEvent)
-        }.bind(this), 0)
+          }, 0)
-      }.bind(this))
+        })
-      .emulateTransitionEnd(Carousel._TRANSITION_DURATION)
+        .emulateTransitionEnd(Carousel.TRANSITION_DURATION)
-
     } else {
-    $(activeElement).removeClass(Carousel._ClassName.ACTIVE)
+      $active.removeClass('active')
-    $(nextElement).addClass(Carousel._ClassName.ACTIVE)
+      $next.addClass('active')
-
+      this.sliding = false
-    this._isSliding = false
+      this.$element.trigger(slidEvent)
-    $(this._element).trigger(slidEvent)
     }
 
-  if (isCycling) {
+    isCycling && this.cycle()
-    this['cycle']()
-  }
-}
 
-
-/**
- * ------------------------------------------------------------------------
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Carousel._NAME] = Carousel._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Carousel._NAME]['Constructor'] = Carousel
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Carousel._NAME]['noConflict'] = function () {
-  $.fn[Carousel._NAME] = Carousel._JQUERY_NO_CONFLICT
     return this
   }
 
 
-/**
+  // CAROUSEL PLUGIN DEFINITION
- * ------------------------------------------------------------------------
+  // ==========================
- * Data Api implementation
+
- * ------------------------------------------------------------------------
+  function Plugin(option) {
- */
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.carousel')
+      var options = $.extend({}, Carousel.DEFAULTS, $this.data(), typeof option == 'object' && option)
+      var action  = typeof option == 'string' ? option : options.slide
+
+      if (!data) $this.data('bs.carousel', (data = new Carousel(this, options)))
+      if (typeof option == 'number') data.to(option)
+      else if (action) data[action]()
+      else if (options.interval) data.pause().cycle()
+    })
+  }
+
+  var old = $.fn.carousel
+
+  $.fn.carousel             = Plugin
+  $.fn.carousel.Constructor = Carousel
+
+
+  // CAROUSEL NO CONFLICT
+  // ====================
+
+  $.fn.carousel.noConflict = function () {
+    $.fn.carousel = old
+    return this
+  }
+
+
+  // CAROUSEL DATA-API
+  // =================
+
+  var clickHandler = function (e) {
+    var href
+    var $this   = $(this)
+    var $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) // strip for ie7
+    if (!$target.hasClass('carousel')) return
+    var options = $.extend({}, $target.data(), $this.data())
+    var slideIndex = $this.attr('data-slide-to')
+    if (slideIndex) options.interval = false
+
+    Plugin.call($target, options)
+
+    if (slideIndex) {
+      $target.data('bs.carousel').to(slideIndex)
+    }
+
+    e.preventDefault()
+  }
 
   $(document)
-  .on('click.bs.carousel.data-api', '[data-slide], [data-slide-to]', Carousel._dataApiClickHandler)
+    .on('click.bs.carousel.data-api', '[data-slide]', clickHandler)
+    .on('click.bs.carousel.data-api', '[data-slide-to]', clickHandler)
 
   $(window).on('load', function () {
     $('[data-ride="carousel"]').each(function () {
       var $carousel = $(this)
-    Carousel._jQueryInterface.call($carousel, /** @type {Object} */ ($carousel.data()))
+      Plugin.call($carousel, $carousel.data())
     })
   })
+
+}(jQuery);

js/collapse.js

@@ -1,455 +1,211 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: collapse.js v4.0.0
+ * Bootstrap: collapse.js v3.3.4
  * http://getbootstrap.com/javascript/#collapse
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's collapse plugin. Flexible support for
- * collapsible components like accordions and navigation.
- *
- * Public Methods & Properties:
- *
- *   + $.carousel
- *   + $.carousel.noConflict
- *   + $.carousel.Constructor
- *   + $.carousel.Constructor.VERSION
- *   + $.carousel.Constructor.Defaults
- *   + $.carousel.Constructor.Defaults.toggle
- *   + $.carousel.Constructor.Defaults.trigger
- *   + $.carousel.Constructor.Defaults.parent
- *   + $.carousel.Constructor.prototype.toggle
- *   + $.carousel.Constructor.prototype.show
- *   + $.carousel.Constructor.prototype.hide
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // COLLAPSE PUBLIC CLASS DEFINITION
+  // ================================
 
-/**
+  var Collapse = function (element, options) {
- * Our collapse class.
+    this.$element      = $(element)
- * @param {Element!} element
+    this.options       = $.extend({}, Collapse.DEFAULTS, options)
- * @param {Object=} opt_config
+    this.$trigger      = $('[data-toggle="collapse"][href="#' + element.id + '"],' +
- * @constructor
+                           '[data-toggle="collapse"][data-target="#' + element.id + '"]')
- */
+    this.transitioning = null
-var Collapse = function (element, opt_config) {
 
-  /** @private {Element} */
+    if (this.options.parent) {
-  this._element  = element
+      this.$parent = this.getParent()
-
+    } else {
-  /** @private {Object} */
+      this.addAriaAndCollapsedClass(this.$element, this.$trigger)
-  this._config = $.extend({}, Collapse['Defaults'], opt_config)
-
-  /** @private {Element} */
-  this._trigger = typeof this._config['trigger'] == 'string' ?
-    $(this._config['trigger'])[0] : this._config['trigger']
-
-  /** @private {boolean} */
-  this._isTransitioning = false
-
-  /** @private {?Element} */
-  this._parent = this._config['parent'] ? this._getParent() : null
-
-  if (!this._config['parent']) {
-    this._addAriaAndCollapsedClass(this._element, this._trigger)
     }
 
-  if (this._config['toggle']) {
+    if (this.options.toggle) this.toggle()
-    this['toggle']()
   }
 
+  Collapse.VERSION  = '3.3.4'
+
+  Collapse.TRANSITION_DURATION = 350
+
+  Collapse.DEFAULTS = {
+    toggle: true
+  }
+
+  Collapse.prototype.dimension = function () {
+    var hasWidth = this.$element.hasClass('width')
+    return hasWidth ? 'width' : 'height'
+  }
+
+  Collapse.prototype.show = function () {
+    if (this.transitioning || this.$element.hasClass('in')) return
+
+    var activesData
+    var actives = this.$parent && this.$parent.children('.panel').children('.in, .collapsing')
+
+    if (actives && actives.length) {
+      activesData = actives.data('bs.collapse')
+      if (activesData && activesData.transitioning) return
+    }
+
+    var startEvent = $.Event('show.bs.collapse')
+    this.$element.trigger(startEvent)
+    if (startEvent.isDefaultPrevented()) return
+
+    if (actives && actives.length) {
+      Plugin.call(actives, 'hide')
+      activesData || actives.data('bs.collapse', null)
+    }
+
+    var dimension = this.dimension()
+
+    this.$element
+      .removeClass('collapse')
+      .addClass('collapsing')[dimension](0)
+      .attr('aria-expanded', true)
+
+    this.$trigger
+      .removeClass('collapsed')
+      .attr('aria-expanded', true)
+
+    this.transitioning = 1
+
+    var complete = function () {
+      this.$element
+        .removeClass('collapsing')
+        .addClass('collapse in')[dimension]('')
+      this.transitioning = 0
+      this.$element
+        .trigger('shown.bs.collapse')
+    }
+
+    if (!$.support.transition) return complete.call(this)
+
+    var scrollSize = $.camelCase(['scroll', dimension].join('-'))
+
+    this.$element
+      .one('bsTransitionEnd', $.proxy(complete, this))
+      .emulateTransitionEnd(Collapse.TRANSITION_DURATION)[dimension](this.$element[0][scrollSize])
+  }
+
+  Collapse.prototype.hide = function () {
+    if (this.transitioning || !this.$element.hasClass('in')) return
+
+    var startEvent = $.Event('hide.bs.collapse')
+    this.$element.trigger(startEvent)
+    if (startEvent.isDefaultPrevented()) return
+
+    var dimension = this.dimension()
+
+    this.$element[dimension](this.$element[dimension]())[0].offsetHeight
+
+    this.$element
+      .addClass('collapsing')
+      .removeClass('collapse in')
+      .attr('aria-expanded', false)
+
+    this.$trigger
+      .addClass('collapsed')
+      .attr('aria-expanded', false)
+
+    this.transitioning = 1
+
+    var complete = function () {
+      this.transitioning = 0
+      this.$element
+        .removeClass('collapsing')
+        .addClass('collapse')
+        .trigger('hidden.bs.collapse')
+    }
+
+    if (!$.support.transition) return complete.call(this)
+
+    this.$element
+      [dimension](0)
+      .one('bsTransitionEnd', $.proxy(complete, this))
+      .emulateTransitionEnd(Collapse.TRANSITION_DURATION)
+  }
+
+  Collapse.prototype.toggle = function () {
+    this[this.$element.hasClass('in') ? 'hide' : 'show']()
+  }
+
+  Collapse.prototype.getParent = function () {
+    return $(this.options.parent)
+      .find('[data-toggle="collapse"][data-parent="' + this.options.parent + '"]')
+      .each($.proxy(function (i, element) {
+        var $element = $(element)
+        this.addAriaAndCollapsedClass(getTargetFromTrigger($element), $element)
+      }, this))
+      .end()
+  }
+
+  Collapse.prototype.addAriaAndCollapsedClass = function ($element, $trigger) {
+    var isOpen = $element.hasClass('in')
+
+    $element.attr('aria-expanded', isOpen)
+    $trigger
+      .toggleClass('collapsed', !isOpen)
+      .attr('aria-expanded', isOpen)
+  }
+
+  function getTargetFromTrigger($trigger) {
+    var href
+    var target = $trigger.attr('data-target')
+      || (href = $trigger.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') // strip for ie7
+
+    return $(target)
   }
 
 
-/**
+  // COLLAPSE PLUGIN DEFINITION
- * @const
+  // ==========================
- * @type {string}
- */
-Collapse['VERSION'] = '4.0.0'
 
-
+  function Plugin(option) {
-/**
- * @const
- * @type {Object}
- */
-Collapse['Defaults'] = {
-  'toggle'  : true,
-  'trigger' : '[data-toggle="collapse"]',
-  'parent'  : null
-}
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Collapse._NAME = 'collapse'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Collapse._DATA_KEY = 'bs.collapse'
-
-
-/**
- * @const
- * @type {number}
- * @private
- */
-Collapse._TRANSITION_DURATION = 600
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Collapse._JQUERY_NO_CONFLICT = $.fn[Collapse._NAME]
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Collapse._Event = {
-  SHOW   : 'show.bs.collapse',
-  SHOWN  : 'shown.bs.collapse',
-  HIDE   : 'hide.bs.collapse',
-  HIDDEN : 'hidden.bs.collapse'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Collapse._ClassName = {
-  IN         : 'in',
-  COLLAPSE   : 'collapse',
-  COLLAPSING : 'collapsing',
-  COLLAPSED  : 'collapsed'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Collapse._Dimension = {
-  WIDTH  : 'width',
-  HEIGHT : 'height'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Collapse._Selector = {
-  ACTIVES : '.panel > .in, .panel > .collapsing'
-}
-
-
-/**
- * Provides the jQuery Interface for the alert component.
- * @param {Object|string=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Collapse._jQueryInterface = function (opt_config) {
     return this.each(function () {
       var $this   = $(this)
-    var data    = $this.data(Collapse._DATA_KEY)
+      var data    = $this.data('bs.collapse')
-    var config = $.extend({}, Collapse['Defaults'], $this.data(), typeof opt_config == 'object' && opt_config)
+      var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
 
-    if (!data && config['toggle'] && opt_config == 'show') {
+      if (!data && options.toggle && /show|hide/.test(option)) options.toggle = false
-      config['toggle'] = false
+      if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
-    }
+      if (typeof option == 'string') data[option]()
-
-    if (!data) {
-      data = new Collapse(this, config)
-      $this.data(Collapse._DATA_KEY, data)
-    }
-
-    if (typeof opt_config == 'string') {
-      data[opt_config]()
-    }
     })
   }
 
+  var old = $.fn.collapse
 
-/**
+  $.fn.collapse             = Plugin
- * Function for getting target element from element
+  $.fn.collapse.Constructor = Collapse
- * @return {Element}
- * @private
- */
-Collapse._getTargetFromElement = function (element) {
-  var selector = Bootstrap.getSelectorFromElement(element)
-
-  return selector ? $(selector)[0] : null
-}
 
 
-/**
+  // COLLAPSE NO CONFLICT
- * Toggles the collapse element based on the presence of the 'in' class
+  // ====================
- */
-Collapse.prototype['toggle'] = function () {
-  if ($(this._element).hasClass(Collapse._ClassName.IN)) {
-    this['hide']()
-  } else {
-    this['show']()
-  }
-}
 
-
+  $.fn.collapse.noConflict = function () {
-/**
+    $.fn.collapse = old
- * Show's the collapsing element
- */
-Collapse.prototype['show'] = function () {
-  if (this._isTransitioning || $(this._element).hasClass(Collapse._ClassName.IN)) {
-    return
-  }
-
-  var activesData, actives
-
-  if (this._parent) {
-    actives = $.makeArray($(Collapse._Selector.ACTIVES))
-    if (!actives.length) {
-      actives = null
-    }
-  }
-
-  if (actives) {
-    activesData = $(actives).data(Collapse._DATA_KEY)
-    if (activesData && activesData._isTransitioning) {
-      return
-    }
-  }
-
-  var startEvent = $.Event(Collapse._Event.SHOW)
-  $(this._element).trigger(startEvent)
-  if (startEvent.isDefaultPrevented()) {
-    return
-  }
-
-  if (actives) {
-    Collapse._jQueryInterface.call($(actives), 'hide')
-    if (!activesData) {
-      $(actives).data(Collapse._DATA_KEY, null)
-    }
-  }
-
-  var dimension = this._getDimension()
-
-  $(this._element)
-    .removeClass(Collapse._ClassName.COLLAPSE)
-    .addClass(Collapse._ClassName.COLLAPSING)
-
-  this._element.style[dimension] = 0
-  this._element.setAttribute('aria-expanded', true)
-
-  if (this._trigger) {
-    $(this._trigger).removeClass(Collapse._ClassName.COLLAPSED)
-    this._trigger.setAttribute('aria-expanded', true)
-  }
-
-  this['setTransitioning'](true)
-
-  var complete = function () {
-    $(this._element)
-      .removeClass(Collapse._ClassName.COLLAPSING)
-      .addClass(Collapse._ClassName.COLLAPSE)
-      .addClass(Collapse._ClassName.IN)
-
-    this._element.style[dimension] = ''
-
-    this['setTransitioning'](false)
-
-    $(this._element).trigger(Collapse._Event.SHOWN)
-  }.bind(this)
-
-  if (!Bootstrap.transition) {
-    complete()
-    return
-  }
-
-  var scrollSize = 'scroll' + (dimension[0].toUpperCase() + dimension.slice(1))
-
-  $(this._element)
-    .one(Bootstrap.TRANSITION_END, complete)
-    .emulateTransitionEnd(Collapse._TRANSITION_DURATION)
-
-  this._element.style[dimension] = this._element[scrollSize] + 'px'
-}
-
-
-/**
- * Hides's the collapsing element
- */
-Collapse.prototype['hide'] = function () {
-  if (this._isTransitioning || !$(this._element).hasClass(Collapse._ClassName.IN)) {
-    return
-  }
-
-  var startEvent = $.Event(Collapse._Event.HIDE)
-  $(this._element).trigger(startEvent)
-  if (startEvent.isDefaultPrevented()) return
-
-  var dimension = this._getDimension()
-  var offsetDimension = dimension === Collapse._Dimension.WIDTH ?
-    'offsetWidth' : 'offsetHeight'
-
-  this._element.style[dimension] = this._element[offsetDimension] + 'px'
-
-  Bootstrap.reflow(this._element)
-
-  $(this._element)
-    .addClass(Collapse._ClassName.COLLAPSING)
-    .removeClass(Collapse._ClassName.COLLAPSE)
-    .removeClass(Collapse._ClassName.IN)
-
-  this._element.setAttribute('aria-expanded', false)
-
-  if (this._trigger) {
-    $(this._trigger).addClass(Collapse._ClassName.COLLAPSED)
-    this._trigger.setAttribute('aria-expanded', false)
-  }
-
-  this['setTransitioning'](true)
-
-  var complete = function () {
-    this['setTransitioning'](false)
-    $(this._element)
-      .removeClass(Collapse._ClassName.COLLAPSING)
-      .addClass(Collapse._ClassName.COLLAPSE)
-      .trigger(Collapse._Event.HIDDEN)
-
-  }.bind(this)
-
-  this._element.style[dimension] = 0
-
-  if (!Bootstrap.transition) {
-    return complete()
-  }
-
-  $(this._element)
-    .one(Bootstrap.TRANSITION_END, complete)
-    .emulateTransitionEnd(Collapse._TRANSITION_DURATION)
-}
-
-
-
-/**
- * @param {boolean} isTransitioning
- */
-Collapse.prototype['setTransitioning'] = function (isTransitioning) {
-  this._isTransitioning = isTransitioning
-}
-
-
-/**
- * Returns the collapsing dimension
- * @return {string}
- * @private
- */
-Collapse.prototype._getDimension = function () {
-  var hasWidth = $(this._element).hasClass(Collapse._Dimension.WIDTH)
-  return hasWidth ? Collapse._Dimension.WIDTH : Collapse._Dimension.HEIGHT
-}
-
-
-/**
- * Returns the parent element
- * @return {Element}
- * @private
- */
-Collapse.prototype._getParent = function () {
-  var selector = '[data-toggle="collapse"][data-parent="' + this._config['parent'] + '"]'
-  var parent = $(this._config['parent'])[0]
-  var elements = /** @type {Array.<Element>} */ ($.makeArray($(parent).find(selector)))
-
-  for (var i = 0; i < elements.length; i++) {
-    this._addAriaAndCollapsedClass(Collapse._getTargetFromElement(elements[i]), elements[i])
-  }
-
-  return parent
-}
-
-
-/**
- * Returns the parent element
- * @param {Element} element
- * @param {Element} trigger
- * @private
- */
-Collapse.prototype._addAriaAndCollapsedClass = function (element, trigger) {
-  if (element) {
-    var isOpen = $(element).hasClass(Collapse._ClassName.IN)
-    element.setAttribute('aria-expanded', isOpen)
-
-    if (trigger) {
-      trigger.setAttribute('aria-expanded', isOpen)
-      $(trigger).toggleClass(Collapse._ClassName.COLLAPSED, !isOpen)
-    }
-  }
-}
-
-
-
-/**
- * ------------------------------------------------------------------------
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Collapse._NAME] = Collapse._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Collapse._NAME]['Constructor'] = Collapse
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Collapse._NAME]['noConflict'] = function () {
-  $.fn[Collapse._NAME] = Collapse._JQUERY_NO_CONFLICT
     return this
   }
 
 
-/**
+  // COLLAPSE DATA-API
- * ------------------------------------------------------------------------
+  // =================
- * Data Api implementation
- * ------------------------------------------------------------------------
- */
 
-$(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (event) {
+  $(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (e) {
-  event.preventDefault()
+    var $this   = $(this)
 
-  var target = Collapse._getTargetFromElement(this)
+    if (!$this.attr('data-target')) e.preventDefault()
 
-  var data = $(target).data(Collapse._DATA_KEY)
+    var $target = getTargetFromTrigger($this)
-  var config = data ? 'toggle' : $.extend({}, $(this).data(), { trigger: this })
+    var data    = $target.data('bs.collapse')
+    var option  = data ? 'toggle' : $this.data()
 
-  Collapse._jQueryInterface.call($(target), config)
+    Plugin.call($target, option)
   })
+
+}(jQuery);

js/dropdown.js

@@ -1,322 +1,165 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: dropdown.js v4.0.0
+ * Bootstrap: dropdown.js v3.3.4
- * http://getbootstrap.com/javascript/#dropdown
+ * http://getbootstrap.com/javascript/#dropdowns
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Add dropdown menus to nearly anything with this simple
- * plugin, including the navbar, tabs, and pills.
- *
- * Public Methods & Properties:
- *
- *   + $.dropdown
- *   + $.dropdown.noConflict
- *   + $.dropdown.Constructor
- *   + $.dropdown.Constructor.VERSION
- *   + $.dropdown.Constructor.prototype.toggle
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // DROPDOWN CLASS DEFINITION
+  // =========================
 
-/**
+  var backdrop = '.dropdown-backdrop'
- * Our dropdown class.
+  var toggle   = '[data-toggle="dropdown"]'
- * @param {Element!} element
- * @constructor
- */
   var Dropdown = function (element) {
-  $(element).on('click.bs.dropdown', this['toggle'])
+    $(element).on('click.bs.dropdown', this.toggle)
   }
 
+  Dropdown.VERSION = '3.3.4'
 
-/**
+  function getParent($this) {
- * @const
+    var selector = $this.attr('data-target')
- * @type {string}
- */
-Dropdown['VERSION'] = '4.0.0'
 
-
+    if (!selector) {
-/**
+      selector = $this.attr('href')
- * @const
+      selector = selector && /#[A-Za-z]/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
- * @type {string}
- * @private
- */
-Dropdown._NAME = 'dropdown'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Dropdown._DATA_KEY = 'bs.dropdown'
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Dropdown._JQUERY_NO_CONFLICT = $.fn[Dropdown._NAME]
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Dropdown._Event = {
-  HIDE   : 'hide.bs.dropdown',
-  HIDDEN : 'hidden.bs.dropdown',
-  SHOW   : 'show.bs.dropdown',
-  SHOWN  : 'shown.bs.dropdown'
     }
 
+    var $parent = selector && $(selector)
 
-/**
+    return $parent && $parent.length ? $parent : $this.parent()
- * @const
- * @enum {string}
- * @private
- */
-Dropdown._ClassName = {
-  BACKDROP : 'dropdown-backdrop',
-  DISABLED : 'disabled',
-  OPEN     : 'open'
   }
 
+  function clearMenus(e) {
+    if (e && e.which === 3) return
+    $(backdrop).remove()
+    $(toggle).each(function () {
+      var $this         = $(this)
+      var $parent       = getParent($this)
+      var relatedTarget = { relatedTarget: this }
 
-/**
+      if (!$parent.hasClass('open')) return
- * @const
- * @enum {string}
- * @private
- */
-Dropdown._Selector = {
-  BACKDROP      : '.dropdown-backdrop',
-  DATA_TOGGLE   : '[data-toggle="dropdown"]',
-  FORM_CHILD    : '.dropdown form',
-  ROLE_MENU     : '[role="menu"]',
-  ROLE_LISTBOX  : '[role="listbox"]',
-  NAVBAR_NAV    : '.navbar-nav',
-  VISIBLE_ITEMS : '[role="menu"] li:not(.divider) a, [role="listbox"] li:not(.divider) a'
-}
 
+      if (e && e.type == 'click' && /input|textarea/i.test(e.target.tagName) && $.contains($parent[0], e.target)) return
 
-/**
+      $parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
- * Provides the jQuery Interface for the alert component.
- * @param {string=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Dropdown._jQueryInterface = function (opt_config) {
-  return this.each(function () {
-    var data  = $(this).data(Dropdown._DATA_KEY)
 
-    if (!data) {
+      if (e.isDefaultPrevented()) return
-      $(this).data(Dropdown._DATA_KEY, (data = new Dropdown(this)))
-    }
 
-    if (typeof opt_config === 'string') {
+      $this.attr('aria-expanded', 'false')
-      data[opt_config].call(this)
+      $parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget)
-    }
     })
   }
 
+  Dropdown.prototype.toggle = function (e) {
+    var $this = $(this)
 
-/**
+    if ($this.is('.disabled, :disabled')) return
- * @param {Event=} opt_event
+
- * @private
+    var $parent  = getParent($this)
- */
+    var isActive = $parent.hasClass('open')
-Dropdown._clearMenus = function (opt_event) {
+
-  if (opt_event && opt_event.which == 3) {
+    clearMenus()
-    return
+
+    if (!isActive) {
+      if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
+        // if mobile we use a backdrop because click events don't delegate
+        $(document.createElement('div'))
+          .addClass('dropdown-backdrop')
+          .insertAfter($(this))
+          .on('click', clearMenus)
       }
 
-  var backdrop = $(Dropdown._Selector.BACKDROP)[0]
+      var relatedTarget = { relatedTarget: this }
-  if (backdrop) {
+      $parent.trigger(e = $.Event('show.bs.dropdown', relatedTarget))
-    backdrop.parentNode.removeChild(backdrop)
+
+      if (e.isDefaultPrevented()) return
+
+      $this
+        .trigger('focus')
+        .attr('aria-expanded', 'true')
+
+      $parent
+        .toggleClass('open')
+        .trigger('shown.bs.dropdown', relatedTarget)
     }
 
-  var toggles = /** @type {Array.<Element>} */ ($.makeArray($(Dropdown._Selector.DATA_TOGGLE)))
+    return false
-
-  for (var i = 0; i < toggles.length; i++) {
-    var parent = Dropdown._getParentFromElement(toggles[i])
-    var relatedTarget = { 'relatedTarget': toggles[i] }
-
-    if (!$(parent).hasClass(Dropdown._ClassName.OPEN)) {
-      continue
   }
 
-    var hideEvent = $.Event(Dropdown._Event.HIDE, relatedTarget)
+  Dropdown.prototype.keydown = function (e) {
-    $(parent).trigger(hideEvent)
+    if (!/(38|40|27|32)/.test(e.which) || /input|textarea/i.test(e.target.tagName)) return
-    if (hideEvent.isDefaultPrevented()) {
+
-      continue
+    var $this = $(this)
+
+    e.preventDefault()
+    e.stopPropagation()
+
+    if ($this.is('.disabled, :disabled')) return
+
+    var $parent  = getParent($this)
+    var isActive = $parent.hasClass('open')
+
+    if (!isActive && e.which != 27 || isActive && e.which == 27) {
+      if (e.which == 27) $parent.find(toggle).trigger('focus')
+      return $this.trigger('click')
     }
 
-    toggles[i].setAttribute('aria-expanded', 'false')
+    var desc = ' li:not(.disabled):visible a'
+    var $items = $parent.find('[role="menu"]' + desc + ', [role="listbox"]' + desc)
 
-    $(parent)
+    if (!$items.length) return
-      .removeClass(Dropdown._ClassName.OPEN)
-      .trigger(Dropdown._Event.HIDDEN, relatedTarget)
-  }
-}
 
+    var index = $items.index(e.target)
 
-/**
+    if (e.which == 38 && index > 0)                 index--         // up
- * @param {Element} element
+    if (e.which == 40 && index < $items.length - 1) index++         // down
- * @return {Element}
- * @private
- */
-Dropdown._getParentFromElement = function (element) {
-  var selector = Bootstrap.getSelectorFromElement(element)
-
-  if (selector) {
-    var parent = $(selector)[0]
-  }
-
-  return /** @type {Element} */ (parent || element.parentNode)
-}
-
-
-/**
- * @param {Event} event
- * @this {Element}
- * @private
- */
-Dropdown._dataApiKeydownHandler = function (event) {
-  if (!/(38|40|27|32)/.test(event.which) || /input|textarea/i.test(event.target.tagName)) {
-    return
-  }
-
-  event.preventDefault()
-  event.stopPropagation()
-
-  if (this.disabled || $(this).hasClass(Dropdown._ClassName.DISABLED)) {
-    return
-  }
-
-  var parent  = Dropdown._getParentFromElement(this)
-  var isActive = $(parent).hasClass(Dropdown._ClassName.OPEN)
-
-  if ((!isActive && event.which != 27) || (isActive && event.which == 27)) {
-    if (event.which == 27) {
-      var toggle = $(parent).find(Dropdown._Selector.DATA_TOGGLE)[0]
-      $(toggle).trigger('focus')
-    }
-    $(this).trigger('click')
-    return
-  }
-
-  var items = $.makeArray($(Dropdown._Selector.VISIBLE_ITEMS))
-
-  items = items.filter(function (item) {
-    return item.offsetWidth || item.offsetHeight
-  })
-
-  if (!items.length) {
-    return
-  }
-
-  var index = items.indexOf(event.target)
-
-  if (event.which == 38 && index > 0)                index--                        // up
-  if (event.which == 40 && index < items.length - 1) index++                        // down
     if (!~index)                                    index = 0
 
-  items[index].focus()
+    $items.eq(index).trigger('focus')
   }
 
 
-/**
+  // DROPDOWN PLUGIN DEFINITION
- * Toggles the dropdown
+  // ==========================
- * @this {Element}
+
- * @return {boolean|undefined}
+  function Plugin(option) {
- */
+    return this.each(function () {
-Dropdown.prototype['toggle'] = function () {
+      var $this = $(this)
-  if (this.disabled || $(this).hasClass(Dropdown._ClassName.DISABLED)) {
+      var data  = $this.data('bs.dropdown')
-    return
+
+      if (!data) $this.data('bs.dropdown', (data = new Dropdown(this)))
+      if (typeof option == 'string') data[option].call($this)
+    })
   }
 
-  var parent   = Dropdown._getParentFromElement(this)
+  var old = $.fn.dropdown
-  var isActive = $(parent).hasClass(Dropdown._ClassName.OPEN)
 
-  Dropdown._clearMenus()
+  $.fn.dropdown             = Plugin
-
+  $.fn.dropdown.Constructor = Dropdown
-  if (isActive) {
-    return false
-  }
-
-  if ('ontouchstart' in document.documentElement && !$(parent).closest(Dropdown._Selector.NAVBAR_NAV).length) {
-    // if mobile we use a backdrop because click events don't delegate
-    var dropdown       = document.createElement('div')
-    dropdown.className = Dropdown._ClassName.BACKDROP
-    this.parentNode.insertBefore(this, dropdown)
-    $(dropdown).on('click', Dropdown._clearMenus)
-  }
-
-  var relatedTarget = { 'relatedTarget': this }
-  var showEvent     = $.Event(Dropdown._Event.SHOW, relatedTarget)
-
-  $(parent).trigger(showEvent)
-
-  if (showEvent.isDefaultPrevented()) {
-    return
-  }
-
-  this.focus()
-  this.setAttribute('aria-expanded', 'true')
-
-  $(parent).toggleClass(Dropdown._ClassName.OPEN)
-
-  $(parent).trigger(Dropdown._Event.SHOWN, relatedTarget)
-
-  return false
-}
 
 
-/**
+  // DROPDOWN NO CONFLICT
- * ------------------------------------------------------------------------
+  // ====================
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
 
-/**
+  $.fn.dropdown.noConflict = function () {
- * @const
+    $.fn.dropdown = old
- * @type {Function}
- */
-$.fn[Dropdown._NAME] = Dropdown._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Dropdown._NAME]['Constructor'] = Dropdown
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Dropdown._NAME]['noConflict'] = function () {
-  $.fn[Dropdown._NAME] = Dropdown._JQUERY_NO_CONFLICT
     return this
   }
 
 
-/**
+  // APPLY TO STANDARD DROPDOWN ELEMENTS
- * ------------------------------------------------------------------------
+  // ===================================
- * Data Api implementation
- * ------------------------------------------------------------------------
- */
 
   $(document)
-  .on('click.bs.dropdown.data-api',   Dropdown._clearMenus)
+    .on('click.bs.dropdown.data-api', clearMenus)
-  .on('click.bs.dropdown.data-api',   Dropdown._Selector.FORM_CHILD,   function (e) { e.stopPropagation() })
+    .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
-  .on('click.bs.dropdown.data-api',   Dropdown._Selector.DATA_TOGGLE,  Dropdown.prototype['toggle'])
+    .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
-  .on('keydown.bs.dropdown.data-api', Dropdown._Selector.DATA_TOGGLE,  Dropdown._dataApiKeydownHandler)
+    .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
-  .on('keydown.bs.dropdown.data-api', Dropdown._Selector.ROLE_MENU,    Dropdown._dataApiKeydownHandler)
+    .on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown)
-  .on('keydown.bs.dropdown.data-api', Dropdown._Selector.ROLE_LISTBOX, Dropdown._dataApiKeydownHandler)
+
+}(jQuery);

js/externs/bootstrap.js

@@ -1,6 +0,0 @@
-jQuery.event.prototype.handleObj = function () {}
-jQuery.event.prototype.handleObj.handler = function () {}
-$.event.special = function () {}
-$.event.trueHover = true
-$.offset = {}
-$.offset.setOffset = function (a,b,c) {}

js/modal.js

@@ -1,598 +1,337 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: modal.js v4.0.0
+ * Bootstrap: modal.js v3.3.4
- * http://getbootstrap.com/javascript/#modal
+ * http://getbootstrap.com/javascript/#modals
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's modal plugin. Modals are streamlined, but
- * flexible, dialog prompts with the minimum required functionality and
- * smart defaults.
- *
- * Public Methods & Properties:
- *
- *   + $.modal
- *   + $.modal.noConflict
- *   + $.modal.Constructor
- *   + $.modal.Constructor.VERSION
- *   + $.modal.Constructor.Defaults
- *   + $.modal.Constructor.Defaults.backdrop
- *   + $.modal.Constructor.Defaults.keyboard
- *   + $.modal.Constructor.Defaults.show
- *   + $.modal.Constructor.prototype.toggle
- *   + $.modal.Constructor.prototype.show
- *   + $.modal.Constructor.prototype.hide
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // MODAL CLASS DEFINITION
+  // ======================
 
-/**
+  var Modal = function (element, options) {
- * Our modal class.
+    this.options             = options
- * @param {Element} element
+    this.$body               = $(document.body)
- * @param {Object} config
+    this.$element            = $(element)
- * @constructor
+    this.$dialog             = this.$element.find('.modal-dialog')
- */
+    this.$backdrop           = null
-var Modal = function (element, config) {
+    this.isShown             = null
-
+    this.originalBodyPad     = null
-  /** @private {Object} */
+    this.scrollbarWidth      = 0
-  this._config = config
+    this.ignoreBackdropClick = false
-
-  /** @private {Element} */
-  this._element = element
-
-  /** @private {Element} */
-  this._backdrop = null
-
-  /** @private {boolean} */
-  this._isShown = false
-
-  /** @private {boolean} */
-  this._isBodyOverflowing = false
-
-  /** @private {number} */
-  this._scrollbarWidth = 0
 
+    if (this.options.remote) {
+      this.$element
+        .find('.modal-content')
+        .load(this.options.remote, $.proxy(function () {
+          this.$element.trigger('loaded.bs.modal')
+        }, this))
+    }
   }
 
+  Modal.VERSION  = '3.3.4'
 
-/**
+  Modal.TRANSITION_DURATION = 300
- * @const
+  Modal.BACKDROP_TRANSITION_DURATION = 150
- * @type {string}
- */
-Modal['VERSION']  = '4.0.0'
 
-
+  Modal.DEFAULTS = {
-/**
+    backdrop: true,
- * @const
+    keyboard: true,
- * @type {Object}
+    show: true
- */
-Modal['Defaults'] = {
-  'backdrop' : true,
-  'keyboard' : true,
-  'show'     : true
   }
 
-
+  Modal.prototype.toggle = function (_relatedTarget) {
-/**
+    return this.isShown ? this.hide() : this.show(_relatedTarget)
- * @const
- * @type {string}
- * @private
- */
-Modal._NAME = 'modal'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Modal._DATA_KEY = 'bs.modal'
-
-
-/**
- * @const
- * @type {number}
- * @private
- */
-Modal._TRANSITION_DURATION = 300
-
-
-/**
- * @const
- * @type {number}
- * @private
- */
-Modal._BACKDROP_TRANSITION_DURATION = 150
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Modal._JQUERY_NO_CONFLICT = $.fn[Modal._NAME]
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Modal._Event = {
-  HIDE   : 'hide.bs.modal',
-  HIDDEN : 'hidden.bs.modal',
-  SHOW   : 'show.bs.modal',
-  SHOWN  : 'shown.bs.modal'
   }
 
+  Modal.prototype.show = function (_relatedTarget) {
+    var that = this
+    var e    = $.Event('show.bs.modal', { relatedTarget: _relatedTarget })
 
-/**
+    this.$element.trigger(e)
- * @const
+
- * @enum {string}
+    if (this.isShown || e.isDefaultPrevented()) return
- * @private
+
- */
+    this.isShown = true
-Modal._ClassName = {
+
-  BACKDROP : 'modal-backdrop',
+    this.checkScrollbar()
-  OPEN     : 'modal-open',
+    this.setScrollbar()
-  FADE     : 'fade',
+    this.$body.addClass('modal-open')
-  IN       : 'in'
+
+    this.escape()
+    this.resize()
+
+    this.$element.on('click.dismiss.bs.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
+
+    this.$dialog.on('mousedown.dismiss.bs.modal', function () {
+      that.$element.one('mouseup.dismiss.bs.modal', function (e) {
+        if ($(e.target).is(that.$element)) that.ignoreBackdropClick = true
+      })
+    })
+
+    this.backdrop(function () {
+      var transition = $.support.transition && that.$element.hasClass('fade')
+
+      if (!that.$element.parent().length) {
+        that.$element.appendTo(that.$body) // don't move modals dom position
       }
 
+      that.$element
+        .show()
+        .scrollTop(0)
 
-/**
+      that.adjustDialog()
- * @const
+
- * @enum {string}
+      if (transition) {
- * @private
+        that.$element[0].offsetWidth // force reflow
- */
-Modal._Selector = {
-  DIALOG             : '.modal-dialog',
-  DATA_TOGGLE        : '[data-toggle="modal"]',
-  DATA_DISMISS       : '[data-dismiss="modal"]',
-  SCROLLBAR_MEASURER : 'modal-scrollbar-measure'
       }
 
+      that.$element.addClass('in')
 
+      that.enforceFocus()
 
-/**
+      var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
- * Provides the jQuery Interface for the alert component.
- * @param {Object|string=} opt_config
- * @param {Element=} opt_relatedTarget
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Modal._jQueryInterface = function Plugin(opt_config, opt_relatedTarget) {
-  return this.each(function () {
-    var data   = $(this).data(Modal._DATA_KEY)
-    var config = $.extend({}, Modal['Defaults'], $(this).data(), typeof opt_config == 'object' && opt_config)
 
-    if (!data) {
+      transition ?
-      data = new Modal(this, config)
+        that.$dialog // wait for modal to slide in
-      $(this).data(Modal._DATA_KEY, data)
+          .one('bsTransitionEnd', function () {
-    }
+            that.$element.trigger('focus').trigger(e)
-
+          })
-    if (typeof opt_config == 'string') {
+          .emulateTransitionEnd(Modal.TRANSITION_DURATION) :
-      data[opt_config](opt_relatedTarget)
+        that.$element.trigger('focus').trigger(e)
-
-    } else if (config['show']) {
-      data['show'](opt_relatedTarget)
-    }
     })
   }
 
+  Modal.prototype.hide = function (e) {
+    if (e) e.preventDefault()
 
-/**
+    e = $.Event('hide.bs.modal')
- * @param {Element} relatedTarget
- */
-Modal.prototype['toggle'] = function (relatedTarget) {
-  return this._isShown ? this['hide']() : this['show'](relatedTarget)
-}
 
+    this.$element.trigger(e)
 
-/**
+    if (!this.isShown || e.isDefaultPrevented()) return
- * @param {Element} relatedTarget
- */
-Modal.prototype['show'] = function (relatedTarget) {
-  var showEvent = $.Event(Modal._Event.SHOW, { relatedTarget: relatedTarget })
 
-  $(this._element).trigger(showEvent)
+    this.isShown = false
 
-  if (this._isShown || showEvent.isDefaultPrevented()) {
+    this.escape()
-    return
+    this.resize()
-  }
-
-  this._isShown = true
-
-  this._checkScrollbar()
-  this._setScrollbar()
-
-  $(document.body).addClass(Modal._ClassName.OPEN)
-
-  this._escape()
-  this._resize()
-
-  $(this._element).on('click.dismiss.bs.modal', Modal._Selector.DATA_DISMISS, this['hide'].bind(this))
-
-  this._showBackdrop(this._showElement.bind(this, relatedTarget))
-}
-
-
-/**
- * @param {Event} event
- */
-Modal.prototype['hide'] = function (event) {
-  if (event) {
-    event.preventDefault()
-  }
-
-  var hideEvent = $.Event(Modal._Event.HIDE)
-
-  $(this._element).trigger(hideEvent)
-
-  if (!this._isShown || hideEvent.isDefaultPrevented()) {
-    return
-  }
-
-  this._isShown = false
-
-  this._escape()
-  this._resize()
 
     $(document).off('focusin.bs.modal')
 
-  $(this._element).removeClass(Modal._ClassName.IN)
+    this.$element
-  this._element.setAttribute('aria-hidden', true)
+      .removeClass('in')
+      .off('click.dismiss.bs.modal')
+      .off('mouseup.dismiss.bs.modal')
 
-  $(this._element).off('click.dismiss.bs.modal')
+    this.$dialog.off('mousedown.dismiss.bs.modal')
 
-  if (Bootstrap.transition && $(this._element).hasClass(Modal._ClassName.FADE)) {
+    $.support.transition && this.$element.hasClass('fade') ?
-    $(this._element)
+      this.$element
-      .one(Bootstrap.TRANSITION_END, this._hideModal.bind(this))
+        .one('bsTransitionEnd', $.proxy(this.hideModal, this))
-      .emulateTransitionEnd(Modal._TRANSITION_DURATION)
+        .emulateTransitionEnd(Modal.TRANSITION_DURATION) :
-  } else {
+      this.hideModal()
-    this._hideModal()
-  }
   }
 
-
+  Modal.prototype.enforceFocus = function () {
-/**
- * @param {Element} relatedTarget
- * @private
- */
-Modal.prototype._showElement = function (relatedTarget) {
-  var transition = Bootstrap.transition && $(this._element).hasClass(Modal._ClassName.FADE)
-
-  if (!this._element.parentNode || this._element.parentNode.nodeType != Node.ELEMENT_NODE) {
-    document.body.appendChild(this._element) // don't move modals dom position
-  }
-
-  this._element.style.display = 'block'
-  this._element.scrollTop = 0
-
-  if (this._config['backdrop']) {
-    this._adjustBackdrop()
-  }
-
-  if (transition) {
-    Bootstrap.reflow(this._element)
-  }
-
-  $(this._element).addClass(Modal._ClassName.IN)
-  this._element.setAttribute('aria-hidden', false)
-
-  this._enforceFocus()
-
-  var shownEvent = $.Event(Modal._Event.SHOWN, { relatedTarget: relatedTarget })
-
-  var transitionComplete = function () {
-    this._element.focus()
-    $(this._element).trigger(shownEvent)
-  }.bind(this)
-
-  if (transition) {
-    var dialog = $(this._element).find(Modal._Selector.DIALOG)[0]
-    $(dialog)
-      .one(Bootstrap.TRANSITION_END, transitionComplete)
-      .emulateTransitionEnd(Modal._TRANSITION_DURATION)
-  } else {
-    transitionComplete()
-  }
-}
-
-
-
-/**
- * @private
- */
-Modal.prototype._enforceFocus = function () {
     $(document)
       .off('focusin.bs.modal') // guard against infinite focus loop
-    .on('focusin.bs.modal', function (e) {
+      .on('focusin.bs.modal', $.proxy(function (e) {
-      if (this._element !== e.target && !$(this._element).has(e.target).length) {
+        if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {
-        this._element.focus()
+          this.$element.trigger('focus')
         }
-    }.bind(this))
+      }, this))
   }
 
-
+  Modal.prototype.escape = function () {
-/**
+    if (this.isShown && this.options.keyboard) {
- * @private
+      this.$element.on('keydown.dismiss.bs.modal', $.proxy(function (e) {
- */
+        e.which == 27 && this.hide()
-Modal.prototype._escape = function () {
+      }, this))
-  if (this._isShown && this._config['keyboard']) {
+    } else if (!this.isShown) {
-    $(this._element).on('keydown.dismiss.bs.modal', function (event) {
+      this.$element.off('keydown.dismiss.bs.modal')
-      if (event.which === 27) {
-        this['hide']()
-      }
-    }.bind(this))
-
-  } else if (!this._isShown) {
-    $(this._element).off('keydown.dismiss.bs.modal')
     }
   }
 
-
+  Modal.prototype.resize = function () {
-/**
+    if (this.isShown) {
- * @private
+      $(window).on('resize.bs.modal', $.proxy(this.handleUpdate, this))
- */
-Modal.prototype._resize = function () {
-  if (this._isShown) {
-    $(window).on('resize.bs.modal', this._handleUpdate.bind(this))
     } else {
       $(window).off('resize.bs.modal')
     }
   }
 
-
+  Modal.prototype.hideModal = function () {
-/**
+    var that = this
- * @private
+    this.$element.hide()
- */
+    this.backdrop(function () {
-Modal.prototype._hideModal = function () {
+      that.$body.removeClass('modal-open')
-  this._element.style.display = 'none'
+      that.resetAdjustments()
-  this._showBackdrop(function () {
+      that.resetScrollbar()
-    $(document.body).removeClass(Modal._ClassName.OPEN)
+      that.$element.trigger('hidden.bs.modal')
-    this._resetAdjustments()
+    })
-    this._resetScrollbar()
-    $(this._element).trigger(Modal._Event.HIDDEN)
-  }.bind(this))
   }
 
-
+  Modal.prototype.removeBackdrop = function () {
-/**
+    this.$backdrop && this.$backdrop.remove()
- * @private
+    this.$backdrop = null
- */
-Modal.prototype._removeBackdrop = function () {
-  if (this._backdrop) {
-    this._backdrop.parentNode.removeChild(this._backdrop)
-    this._backdrop = null
-  }
   }
 
+  Modal.prototype.backdrop = function (callback) {
+    var that = this
+    var animate = this.$element.hasClass('fade') ? 'fade' : ''
 
-/**
+    if (this.isShown && this.options.backdrop) {
- * @param {Function} callback
+      var doAnimate = $.support.transition && animate
- * @private
- */
-Modal.prototype._showBackdrop = function (callback) {
-  var animate = $(this._element).hasClass(Modal._ClassName.FADE) ? Modal._ClassName.FADE : ''
 
-  if (this._isShown && this._config['backdrop']) {
+      this.$backdrop = $(document.createElement('div'))
-    var doAnimate = Bootstrap.transition && animate
+        .addClass('modal-backdrop ' + animate)
+        .appendTo(this.$body)
 
-    this._backdrop = document.createElement('div')
+      this.$element.on('click.dismiss.bs.modal', $.proxy(function (e) {
-    this._backdrop.className = Modal._ClassName.BACKDROP
+        if (this.ignoreBackdropClick) {
-
+          this.ignoreBackdropClick = false
-    if (animate) {
-      $(this._backdrop).addClass(animate)
-    }
-
-    $(this._element).prepend(this._backdrop)
-
-    $(this._backdrop).on('click.dismiss.bs.modal', function (event) {
-      if (event.target !== event.currentTarget) return
-      this._config['backdrop'] === 'static'
-        ? this._element.focus()
-        : this['hide']()
-    }.bind(this))
-
-    if (doAnimate) {
-      Bootstrap.reflow(this._backdrop)
-    }
-
-    $(this._backdrop).addClass(Modal._ClassName.IN)
-
-    if (!callback) {
           return
         }
+        if (e.target !== e.currentTarget) return
+        this.options.backdrop == 'static'
+          ? this.$element[0].focus()
+          : this.hide()
+      }, this))
 
-    if (!doAnimate) {
+      if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
+
+      this.$backdrop.addClass('in')
+
+      if (!callback) return
+
+      doAnimate ?
+        this.$backdrop
+          .one('bsTransitionEnd', callback)
+          .emulateTransitionEnd(Modal.BACKDROP_TRANSITION_DURATION) :
         callback()
-      return
-    }
 
-    $(this._backdrop)
+    } else if (!this.isShown && this.$backdrop) {
-      .one(Bootstrap.TRANSITION_END, callback)
+      this.$backdrop.removeClass('in')
-      .emulateTransitionEnd(Modal._BACKDROP_TRANSITION_DURATION)
-
-  } else if (!this._isShown && this._backdrop) {
-    $(this._backdrop).removeClass(Modal._ClassName.IN)
 
       var callbackRemove = function () {
-      this._removeBackdrop()
+        that.removeBackdrop()
-      if (callback) {
+        callback && callback()
-        callback()
       }
-    }.bind(this)
+      $.support.transition && this.$element.hasClass('fade') ?
-
+        this.$backdrop
-    if (Bootstrap.transition && $(this._element).hasClass(Modal._ClassName.FADE)) {
+          .one('bsTransitionEnd', callbackRemove)
-      $(this._backdrop)
+          .emulateTransitionEnd(Modal.BACKDROP_TRANSITION_DURATION) :
-        .one(Bootstrap.TRANSITION_END, callbackRemove)
-        .emulateTransitionEnd(Modal._BACKDROP_TRANSITION_DURATION)
-    } else {
         callbackRemove()
-    }
 
     } else if (callback) {
       callback()
     }
   }
 
+  // these following methods are used to handle overflowing modals
 
-/**
+  Modal.prototype.handleUpdate = function () {
- * ------------------------------------------------------------------------
+    this.adjustDialog()
- * the following methods are used to handle overflowing modals
- * todo (fat): these should probably be refactored into a
- * ------------------------------------------------------------------------
- */
-
-
-/**
- * @private
- */
-Modal.prototype._handleUpdate = function () {
-  if (this._config['backdrop']) this._adjustBackdrop()
-  this._adjustDialog()
   }
 
-/**
+  Modal.prototype.adjustDialog = function () {
- * @private
+    var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeight
- */
+
-Modal.prototype._adjustBackdrop = function () {
+    this.$element.css({
-  this._backdrop.style.height = 0 // todo (fat): no clue why we do this
+      paddingLeft:  !this.bodyIsOverflowing && modalIsOverflowing ? this.scrollbarWidth : '',
-  this._backdrop.style.height = this._element.scrollHeight + 'px'
+      paddingRight: this.bodyIsOverflowing && !modalIsOverflowing ? this.scrollbarWidth : ''
+    })
   }
 
-
+  Modal.prototype.resetAdjustments = function () {
-/**
+    this.$element.css({
- * @private
+      paddingLeft: '',
- */
+      paddingRight: ''
-Modal.prototype._adjustDialog = function () {
+    })
-  var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight
-
-  if (!this._isBodyOverflowing && isModalOverflowing) {
-    this._element.style.paddingLeft = this._scrollbarWidth + 'px'
   }
 
-  if (this._isBodyOverflowing && !isModalOverflowing) {
+  Modal.prototype.checkScrollbar = function () {
-    this._element.style.paddingRight = this._scrollbarWidth + 'px'
+    var fullWindowWidth = window.innerWidth
+    if (!fullWindowWidth) { // workaround for missing window.innerWidth in IE8
+      var documentElementRect = document.documentElement.getBoundingClientRect()
+      fullWindowWidth = documentElementRect.right - Math.abs(documentElementRect.left)
     }
+    this.bodyIsOverflowing = document.body.clientWidth < fullWindowWidth
+    this.scrollbarWidth = this.measureScrollbar()
   }
 
-
+  Modal.prototype.setScrollbar = function () {
-/**
+    var bodyPad = parseInt((this.$body.css('padding-right') || 0), 10)
- * @private
+    this.originalBodyPad = document.body.style.paddingRight || ''
- */
+    if (this.bodyIsOverflowing) this.$body.css('padding-right', bodyPad + this.scrollbarWidth)
-Modal.prototype._resetAdjustments = function () {
-  this._element.style.paddingLeft = ''
-  this._element.style.paddingRight = ''
   }
 
-
+  Modal.prototype.resetScrollbar = function () {
-/**
+    this.$body.css('padding-right', this.originalBodyPad)
- * @private
- */
-Modal.prototype._checkScrollbar = function () {
-  this._isBodyOverflowing = document.body.scrollHeight > document.documentElement.clientHeight
-  this._scrollbarWidth = this._getScrollbarWidth()
   }
 
-
+  Modal.prototype.measureScrollbar = function () { // thx walsh
-/**
- * @private
- */
-Modal.prototype._setScrollbar = function () {
-  var bodyPadding = parseInt(($(document.body).css('padding-right') || 0), 10)
-
-  if (this._isBodyOverflowing) {
-    document.body.style.paddingRight = bodyPadding + this._scrollbarWidth + 'px'
-  }
-}
-
-
-/**
- * @private
- */
-Modal.prototype._resetScrollbar = function () {
-  document.body.style.paddingRight = ''
-}
-
-
-/**
- * @private
- */
-Modal.prototype._getScrollbarWidth = function () { // thx walsh
     var scrollDiv = document.createElement('div')
-  scrollDiv.className = Modal._Selector.SCROLLBAR_MEASURER
+    scrollDiv.className = 'modal-scrollbar-measure'
-  document.body.appendChild(scrollDiv)
+    this.$body.append(scrollDiv)
     var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth
-  document.body.removeChild(scrollDiv)
+    this.$body[0].removeChild(scrollDiv)
     return scrollbarWidth
   }
 
 
-/**
+  // MODAL PLUGIN DEFINITION
- * ------------------------------------------------------------------------
+  // =======================
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
 
-/**
+  function Plugin(option, _relatedTarget) {
- * @const
+    return this.each(function () {
- * @type {Function}
+      var $this   = $(this)
- */
+      var data    = $this.data('bs.modal')
-$.fn[Modal._NAME] = Modal._jQueryInterface
+      var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)
+
+      if (!data) $this.data('bs.modal', (data = new Modal(this, options)))
+      if (typeof option == 'string') data[option](_relatedTarget)
+      else if (options.show) data.show(_relatedTarget)
+    })
+  }
+
+  var old = $.fn.modal
+
+  $.fn.modal             = Plugin
+  $.fn.modal.Constructor = Modal
 
 
-/**
+  // MODAL NO CONFLICT
- * @const
+  // =================
- * @type {Function}
- */
-$.fn[Modal._NAME]['Constructor'] = Modal
 
-
+  $.fn.modal.noConflict = function () {
-/**
+    $.fn.modal = old
- * @const
- * @type {Function}
- */
-$.fn[Modal._NAME]['noConflict'] = function () {
-  $.fn[Modal._NAME] = Modal._JQUERY_NO_CONFLICT
     return this
   }
 
 
-/**
+  // MODAL DATA-API
- * ------------------------------------------------------------------------
+  // ==============
- * Data Api implementation
- * ------------------------------------------------------------------------
- */
 
-$(document).on('click.bs.modal.data-api', Modal._Selector.DATA_TOGGLE, function (event) {
+  $(document).on('click.bs.modal.data-api', '[data-toggle="modal"]', function (e) {
-  var selector = Bootstrap.getSelectorFromElement(this)
+    var $this   = $(this)
+    var href    = $this.attr('href')
+    var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) // strip for ie7
+    var option  = $target.data('bs.modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
 
-  if (selector) {
+    if ($this.is('a')) e.preventDefault()
-    var target = $(selector)[0]
-  }
 
-  var config = $(target).data(Modal._DATA_KEY) ? 'toggle' : $.extend({}, $(target).data(), $(this).data())
+    $target.one('show.bs.modal', function (showEvent) {
-
+      if (showEvent.isDefaultPrevented()) return // only register focus restorer if modal will actually get shown
-  if (this.tagName == 'A') {
+      $target.one('hidden.bs.modal', function () {
-    event.preventDefault()
+        $this.is(':visible') && $this.trigger('focus')
-  }
-
-  var $target = $(target).one(Modal._Event.SHOW, function (showEvent) {
-    if (showEvent.isDefaultPrevented()) {
-      return // only register focus restorer if modal will actually get shown
-    }
-
-    $target.one(Modal._Event.HIDDEN, function () {
-      if ($(this).is(':visible')) {
-        this.focus()
-      }
-    }.bind(this))
-  }.bind(this))
-
-  Modal._jQueryInterface.call($(target), config, this)
       })
+    })
+    Plugin.call($target, option, this)
+  })
+
+}(jQuery);

js/popover.js

@@ -1,283 +1,108 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: popover.js v4.0.0
+ * Bootstrap: popover.js v3.3.4
  * http://getbootstrap.com/javascript/#popovers
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's popover plugin - extends tooltip.
- *
- * Public Methods & Properties:
- *
- *   + $.popover
- *   + $.popover.noConflict
- *   + $.popover.Constructor
- *   + $.popover.Constructor.VERSION
- *   + $.popover.Constructor.Defaults
- *   + $.popover.Constructor.Defaults.container
- *   + $.popover.Constructor.Defaults.animation
- *   + $.popover.Constructor.Defaults.placement
- *   + $.popover.Constructor.Defaults.selector
- *   + $.popover.Constructor.Defaults.template
- *   + $.popover.Constructor.Defaults.trigger
- *   + $.popover.Constructor.Defaults.title
- *   + $.popover.Constructor.Defaults.content
- *   + $.popover.Constructor.Defaults.delay
- *   + $.popover.Constructor.Defaults.html
- *   + $.popover.Constructor.Defaults.viewport
- *   + $.popover.Constructor.Defaults.viewport.selector
- *   + $.popover.Constructor.Defaults.viewport.padding
- *   + $.popover.Constructor.prototype.enable
- *   + $.popover.Constructor.prototype.disable
- *   + $.popover.Constructor.prototype.destroy
- *   + $.popover.Constructor.prototype.toggleEnabled
- *   + $.popover.Constructor.prototype.toggle
- *   + $.popover.Constructor.prototype.show
- *   + $.popover.Constructor.prototype.hide
- *
- * ========================================================================
- */
 
 
++function ($) {
   'use strict';
 
+  // POPOVER PUBLIC CLASS DEFINITION
+  // ===============================
 
-if (!Tooltip) throw new Error('Popover requires tooltip.js')
+  var Popover = function (element, options) {
-
+    this.init('popover', element, options)
-
-/**
- * Our tooltip class.
- * @param {Element!} element
- * @param {Object=} opt_config
- * @constructor
- * @extends {Tooltip}
- */
-var Popover = function (element, opt_config) {
-  Tooltip.apply(this, arguments)
   }
-Bootstrap.inherits(Popover, Tooltip)
 
+  if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')
 
-/**
+  Popover.VERSION  = '3.3.4'
- * @const
- * @type {string}
- */
-Popover['VERSION'] = '4.0.0'
 
-
+  Popover.DEFAULTS = $.extend({}, $.fn.tooltip.Constructor.DEFAULTS, {
-/**
+    placement: 'right',
- * @const
+    trigger: 'click',
- * @type {Object}
+    content: '',
- */
+    template: '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
-Popover['Defaults'] = $.extend({}, $.fn['tooltip']['Constructor']['Defaults'], {
-  'placement': 'right',
-  'trigger': 'click',
-  'content': '',
-  'template': '<div class="popover" role="tooltip"><div class="popover-arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
   })
 
 
-/**
+  // NOTE: POPOVER EXTENDS tooltip.js
- * @const
+  // ================================
- * @type {string}
- * @private
- */
-Popover._NAME = 'popover'
 
+  Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype)
 
-/**
+  Popover.prototype.constructor = Popover
- * @const
- * @type {string}
- * @private
- */
-Popover._DATA_KEY = 'bs.popover'
 
-
+  Popover.prototype.getDefaults = function () {
-/**
+    return Popover.DEFAULTS
- * @const
- * @enum {string}
- * @private
- */
-Popover._Event = {
-  HIDE   : 'hide.bs.popover',
-  HIDDEN : 'hidden.bs.popover',
-  SHOW   : 'show.bs.popover',
-  SHOWN  : 'shown.bs.popover'
   }
 
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Popover._ClassName = {
-  FADE : 'fade',
-  IN  : 'in'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Popover._Selector = {
-  TITLE   : '.popover-title',
-  CONTENT : '.popover-content',
-  ARROW   : '.popover-arrow'
-}
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-Popover._JQUERY_NO_CONFLICT = $.fn[Popover._NAME]
-
-
-/**
- * @param {Object|string=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Popover._jQueryInterface = function (opt_config) {
-  return this.each(function () {
-    var data   = $(this).data(Popover._DATA_KEY)
-    var config = typeof opt_config === 'object' ? opt_config : null
-
-    if (!data && opt_config === 'destroy') {
-      return
-    }
-
-    if (!data) {
-      data = new Popover(this, config)
-      $(this).data(Popover._DATA_KEY, data)
-    }
-
-    if (typeof opt_config === 'string') {
-      data[opt_config]()
-    }
-  })
-}
-
-
-/**
- * @return {string}
- * @protected
- */
-Popover.prototype.getName = function () {
-  return Popover._NAME
-}
-
-
-/**
- * @override
- */
-Popover.prototype.getDataKey = function () {
-  return Popover._DATA_KEY
-}
-
-
-/**
- * @override
- */
-Popover.prototype.getEventObject = function () {
-  return Popover._Event
-}
-
-
-/**
- * @override
- */
-Popover.prototype.getArrowElement = function () {
-  return (this.arrow = this.arrow || $(this.getTipElement()).find(Popover._Selector.ARROW)[0])
-}
-
-
-/**
- * @override
- */
   Popover.prototype.setContent = function () {
-  var tip          = this.getTipElement()
+    var $tip    = this.tip()
     var title   = this.getTitle()
-  var content      = this._getContent()
+    var content = this.getContent()
-  var titleElement = $(tip).find(Popover._Selector.TITLE)[0]
 
-  if (titleElement) {
+    $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
-    titleElement[this.config['html'] ? 'innerHTML' : 'innerText'] = title
+    $tip.find('.popover-content').children().detach().end()[ // we use append for html objects to maintain js events
-  }
+      this.options.html ? (typeof content == 'string' ? 'html' : 'append') : 'text'
-
-  // we use append for html objects to maintain js events
-  $(tip).find(Popover._Selector.CONTENT).children().detach().end()[
-    this.config['html'] ? (typeof content == 'string' ? 'html' : 'append') : 'text'
     ](content)
 
-  $(tip)
+    $tip.removeClass('fade top bottom left right in')
-    .removeClass(Popover._ClassName.FADE)
-    .removeClass(Popover._ClassName.IN)
 
-  for (var direction in Tooltip.Direction) {
+    // IE8 doesn't accept hiding via the `:empty` pseudo selector, we have to do
-    $(tip).removeClass(Popover._NAME + '-' + Tooltip.Direction[direction])
+    // this manually by checking the contents.
+    if (!$tip.find('.popover-title').html()) $tip.find('.popover-title').hide()
   }
+
+  Popover.prototype.hasContent = function () {
+    return this.getTitle() || this.getContent()
+  }
+
+  Popover.prototype.getContent = function () {
+    var $e = this.$element
+    var o  = this.options
+
+    return $e.attr('data-content')
+      || (typeof o.content == 'function' ?
+            o.content.call($e[0]) :
+            o.content)
+  }
+
+  Popover.prototype.arrow = function () {
+    return (this.$arrow = this.$arrow || this.tip().find('.arrow'))
   }
 
 
-/**
+  // POPOVER PLUGIN DEFINITION
- * @override
+  // =========================
- */
+
-Popover.prototype.isWithContent = function () {
+  function Plugin(option) {
-  return this.getTitle() || this._getContent()
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.popover')
+      var options = typeof option == 'object' && option
+
+      if (!data && /destroy|hide/.test(option)) return
+      if (!data) $this.data('bs.popover', (data = new Popover(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
   }
 
+  var old = $.fn.popover
 
-/**
+  $.fn.popover             = Plugin
- * @override
+  $.fn.popover.Constructor = Popover
- */
-Popover.prototype.getTipElement = function () {
-  return (this.tip = this.tip || $(this.config['template'])[0])
-}
 
 
-/**
+  // POPOVER NO CONFLICT
- * @private
+  // ===================
- */
-Popover.prototype._getContent = function () {
-  return this.element.getAttribute('data-content')
-    || (typeof this.config['content'] == 'function' ?
-          this.config['content'].call(this.element) :
-          this.config['content'])
-}
 
-
+  $.fn.popover.noConflict = function () {
-
+    $.fn.popover = old
-/**
- * ------------------------------------------------------------------------
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Popover._NAME] = Popover._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Popover._NAME]['Constructor'] = Popover
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Popover._NAME]['noConflict'] = function () {
-  $.fn[Popover._NAME] = Popover._JQUERY_NO_CONFLICT
     return this
   }
+
+}(jQuery);

js/scrollspy.js

@@ -1,346 +1,172 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: scrollspy.js v4.0.0
+ * Bootstrap: scrollspy.js v3.3.4
  * http://getbootstrap.com/javascript/#scrollspy
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's scrollspy plugin.
- *
- * Public Methods & Properties:
- *
- *   + $.scrollspy
- *   + $.scrollspy.noConflict
- *   + $.scrollspy.Constructor
- *   + $.scrollspy.Constructor.VERSION
- *   + $.scrollspy.Constructor.Defaults
- *   + $.scrollspy.Constructor.Defaults.offset
- *   + $.scrollspy.Constructor.prototype.refresh
- *
- * ========================================================================
- */
 
+
++function ($) {
   'use strict';
 
+  // SCROLLSPY CLASS DEFINITION
+  // ==========================
 
-/**
+  function ScrollSpy(element, options) {
- * Our scrollspy class.
+    this.$body          = $(document.body)
- * @param {Element!} element
+    this.$scrollElement = $(element).is(document.body) ? $(window) : $(element)
- * @param {Object=} opt_config
+    this.options        = $.extend({}, ScrollSpy.DEFAULTS, options)
- * @constructor
+    this.selector       = (this.options.target || '') + ' .nav li > a'
- */
+    this.offsets        = []
-function ScrollSpy(element, opt_config) {
+    this.targets        = []
+    this.activeTarget   = null
+    this.scrollHeight   = 0
 
-  /** @private {Element|Window} */
+    this.$scrollElement.on('scroll.bs.scrollspy', $.proxy(this.process, this))
-  this._scrollElement = element.tagName == 'BODY' ? window : element
+    this.refresh()
-
+    this.process()
-  /** @private {Object} */
-  this._config = $.extend({}, ScrollSpy['Defaults'], opt_config)
-
-  /** @private {string} */
-  this._selector = (this._config.target || '') + ' .nav li > a'
-
-  /** @private {Array} */
-  this._offsets = []
-
-  /** @private {Array} */
-  this._targets = []
-
-  /** @private {Element} */
-  this._activeTarget = null
-
-  /** @private {number} */
-  this._scrollHeight = 0
-
-  $(this._scrollElement).on('scroll.bs.scrollspy', this._process.bind(this))
-
-  this['refresh']()
-
-  this._process()
   }
 
+  ScrollSpy.VERSION  = '3.3.4'
 
-/**
+  ScrollSpy.DEFAULTS = {
- * @const
+    offset: 10
- * @type {string}
- */
-ScrollSpy['VERSION'] = '4.0.0'
-
-
-/**
- * @const
- * @type {Object}
- */
-ScrollSpy['Defaults'] = {
-  'offset': 10
   }
 
-
+  ScrollSpy.prototype.getScrollHeight = function () {
-/**
+    return this.$scrollElement[0].scrollHeight || Math.max(this.$body[0].scrollHeight, document.documentElement.scrollHeight)
- * @const
- * @type {string}
- * @private
- */
-ScrollSpy._NAME = 'scrollspy'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-ScrollSpy._DATA_KEY = 'bs.scrollspy'
-
-
-/**
- * @const
- * @type {Function}
- * @private
- */
-ScrollSpy._JQUERY_NO_CONFLICT = $.fn[ScrollSpy._NAME]
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-ScrollSpy._Event = {
-  ACTIVATE: 'activate.bs.scrollspy'
   }
 
-
+  ScrollSpy.prototype.refresh = function () {
-/**
+    var that          = this
- * @const
- * @enum {string}
- * @private
- */
-ScrollSpy._ClassName = {
-  DROPDOWN_MENU : 'dropdown-menu',
-  ACTIVE        : 'active'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-ScrollSpy._Selector = {
-  DATA_SPY    : '[data-spy="scroll"]',
-  ACTIVE      : '.active',
-  LI_DROPDOWN : 'li.dropdown',
-  LI          : 'li'
-}
-
-
-/**
- * @param {Object=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-ScrollSpy._jQueryInterface = function (opt_config) {
-  return this.each(function () {
-    var data   = $(this).data(ScrollSpy._DATA_KEY)
-    var config = typeof opt_config === 'object' && opt_config || null
-
-    if (!data) {
-      data = new ScrollSpy(this, config)
-      $(this).data(ScrollSpy._DATA_KEY, data)
-    }
-
-    if (typeof opt_config === 'string') {
-      data[opt_config]()
-    }
-  })
-}
-
-
-/**
- * Refresh the scrollspy target cache
- */
-ScrollSpy.prototype['refresh'] = function () {
     var offsetMethod  = 'offset'
     var offsetBase    = 0
 
-  if (this._scrollElement !== this._scrollElement.window) {
+    this.offsets      = []
+    this.targets      = []
+    this.scrollHeight = this.getScrollHeight()
+
+    if (!$.isWindow(this.$scrollElement[0])) {
       offsetMethod = 'position'
-    offsetBase   = this._getScrollTop()
+      offsetBase   = this.$scrollElement.scrollTop()
     }
 
-  this._offsets = []
+    this.$body
-  this._targets = []
+      .find(this.selector)
+      .map(function () {
+        var $el   = $(this)
+        var href  = $el.data('target') || $el.attr('href')
+        var $href = /^#./.test(href) && $(href)
 
-  this._scrollHeight = this._getScrollHeight()
+        return ($href
-
+          && $href.length
-  var targets = /** @type {Array.<Element>} */ ($.makeArray($(this._selector)))
+          && $href.is(':visible')
-
+          && [[$href[offsetMethod]().top + offsetBase, href]]) || null
-  targets
-    .map(function (element, index) {
-      var target
-      var targetSelector = Bootstrap.getSelectorFromElement(element)
-
-      if (targetSelector) {
-        target = $(targetSelector)[0]
-      }
-
-      if (target && (target.offsetWidth || target.offsetHeight)) {
-        // todo (fat): remove sketch reliance on jQuery position/offset
-        return [$(target)[offsetMethod]().top + offsetBase, targetSelector]
-      }
       })
-    .filter(function (item) { return item })
       .sort(function (a, b) { return a[0] - b[0] })
-    .forEach(function (item, index) {
+      .each(function () {
-      this._offsets.push(item[0])
+        that.offsets.push(this[0])
-      this._targets.push(item[1])
+        that.targets.push(this[1])
-    }.bind(this))
+      })
   }
 
+  ScrollSpy.prototype.process = function () {
+    var scrollTop    = this.$scrollElement.scrollTop() + this.options.offset
+    var scrollHeight = this.getScrollHeight()
+    var maxScroll    = this.options.offset + scrollHeight - this.$scrollElement.height()
+    var offsets      = this.offsets
+    var targets      = this.targets
+    var activeTarget = this.activeTarget
+    var i
 
-/**
+    if (this.scrollHeight != scrollHeight) {
- * @private
+      this.refresh()
- */
-ScrollSpy.prototype._getScrollTop = function () {
-  return this._scrollElement === window ?
-      this._scrollElement.scrollY : this._scrollElement.scrollTop
-}
-
-
-/**
- * @private
- */
-ScrollSpy.prototype._getScrollHeight = function () {
-  return this._scrollElement.scrollHeight
-      || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight)
-}
-
-
-/**
- * @private
- */
-ScrollSpy.prototype._process = function () {
-  var scrollTop    = this._getScrollTop() + this._config.offset
-  var scrollHeight = this._getScrollHeight()
-  var maxScroll    = this._config.offset + scrollHeight - this._scrollElement.offsetHeight
-
-  if (this._scrollHeight != scrollHeight) {
-    this['refresh']()
     }
 
     if (scrollTop >= maxScroll) {
-    var target = this._targets[this._targets.length - 1]
+      return activeTarget != (i = targets[targets.length - 1]) && this.activate(i)
+    }
 
-    if (this._activeTarget != target) {
+    if (activeTarget && scrollTop < offsets[0]) {
-      this._activate(target)
+      this.activeTarget = null
+      return this.clear()
+    }
+
+    for (i = offsets.length; i--;) {
+      activeTarget != targets[i]
+        && scrollTop >= offsets[i]
+        && (offsets[i + 1] === undefined || scrollTop < offsets[i + 1])
+        && this.activate(targets[i])
     }
   }
 
-  if (this._activeTarget && scrollTop < this._offsets[0]) {
+  ScrollSpy.prototype.activate = function (target) {
-    this._activeTarget = null
+    this.activeTarget = target
-    this._clear()
+
-    return
+    this.clear()
+
+    var selector = this.selector +
+      '[data-target="' + target + '"],' +
+      this.selector + '[href="' + target + '"]'
+
+    var active = $(selector)
+      .parents('li')
+      .addClass('active')
+
+    if (active.parent('.dropdown-menu').length) {
+      active = active
+        .closest('li.dropdown')
+        .addClass('active')
     }
 
-  for (var i = this._offsets.length; i--;) {
+    active.trigger('activate.bs.scrollspy')
-    var isActiveTarget = this._activeTarget != this._targets[i]
+  }
-        && scrollTop >= this._offsets[i]
-        && (!this._offsets[i + 1] || scrollTop < this._offsets[i + 1])
 
-    if (isActiveTarget) {
+  ScrollSpy.prototype.clear = function () {
-      this._activate(this._targets[i])
+    $(this.selector)
-    }
+      .parentsUntil(this.options.target, '.active')
-  }
+      .removeClass('active')
   }
 
 
-/**
+  // SCROLLSPY PLUGIN DEFINITION
- * @param {Element} target
+  // ===========================
- * @private
- */
-ScrollSpy.prototype._activate = function (target) {
-  this._activeTarget = target
 
-  this._clear()
+  function Plugin(option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.scrollspy')
+      var options = typeof option == 'object' && option
 
-  var selector = this._selector
+      if (!data) $this.data('bs.scrollspy', (data = new ScrollSpy(this, options)))
-      + '[data-target="' + target + '"],'
+      if (typeof option == 'string') data[option]()
-      + this._selector + '[href="' + target + '"]'
-
-  // todo (fat): this seems horribly wrong… getting all raw li elements up the tree ,_,
-  var parentListItems = $(selector).parents(ScrollSpy._Selector.LI)
-
-  for (var i = parentListItems.length; i--;) {
-    $(parentListItems[i]).addClass(ScrollSpy._ClassName.ACTIVE)
-
-    var itemParent = parentListItems[i].parentNode
-
-    if (itemParent && $(itemParent).hasClass(ScrollSpy._ClassName.DROPDOWN_MENU)) {
-      var closestDropdown = $(itemParent).closest(ScrollSpy._Selector.LI_DROPDOWN)[0]
-      $(closestDropdown).addClass(ScrollSpy._ClassName.ACTIVE)
-    }
-  }
-
-  $(this._scrollElement).trigger(ScrollSpy._Event.ACTIVATE, {
-    relatedTarget: target
     })
   }
 
+  var old = $.fn.scrollspy
 
-/**
+  $.fn.scrollspy             = Plugin
- * @private
+  $.fn.scrollspy.Constructor = ScrollSpy
- */
-ScrollSpy.prototype._clear = function () {
-  var activeParents = $(this._selector).parentsUntil(this._config.target, ScrollSpy._Selector.ACTIVE)
-
-  for (var i = activeParents.length; i--;) {
-    $(activeParents[i]).removeClass(ScrollSpy._ClassName.ACTIVE)
-  }
-}
 
 
-/**
+  // SCROLLSPY NO CONFLICT
- * ------------------------------------------------------------------------
+  // =====================
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
 
-/**
+  $.fn.scrollspy.noConflict = function () {
- * @const
+    $.fn.scrollspy = old
- * @type {Function}
- */
-$.fn[ScrollSpy._NAME] = ScrollSpy._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[ScrollSpy._NAME]['Constructor'] = ScrollSpy
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[ScrollSpy._NAME]['noConflict'] = function () {
-  $.fn[ScrollSpy._NAME] = ScrollSpy._JQUERY_NO_CONFLICT
     return this
   }
 
 
-/**
+  // SCROLLSPY DATA-API
- * ------------------------------------------------------------------------
+  // ==================
- * Data Api implementation
- * ------------------------------------------------------------------------
- */
 
   $(window).on('load.bs.scrollspy.data-api', function () {
-  var scrollSpys = /** @type {Array.<Element>} */ ($.makeArray($(ScrollSpy._Selector.DATA_SPY)))
+    $('[data-spy="scroll"]').each(function () {
-
+      var $spy = $(this)
-  for (var i = scrollSpys.length; i--;) {
+      Plugin.call($spy, $spy.data())
-    var $spy = $(scrollSpys[i])
-    ScrollSpy._jQueryInterface.call($spy, /** @type {Object|null} */ ($spy.data()))
-  }
     })
+  })
+
+}(jQuery);

js/tab.js

@@ -1,324 +1,155 @@
-/** =======================================================================
+/* ========================================================================
- * Bootstrap: tab.js v4.0.0
+ * Bootstrap: tab.js v3.3.4
  * http://getbootstrap.com/javascript/#tabs
  * ========================================================================
  * Copyright 2011-2015 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
+ * ======================================================================== */
- * @fileoverview - Bootstrap's tab plugin. Tab O_O
- *
- * Public Methods & Properties:
- *
- *   + $.tab
- *   + $.tab.noConflict
- *   + $.tab.Constructor
- *   + $.tab.Constructor.VERSION
- *   + $.tab.Constructor.prototype.show
- *
- * ========================================================================
- */
 
 
++function ($) {
   'use strict';
 
-/**
+  // TAB CLASS DEFINITION
- * Our Tab class.
+  // ====================
- * @param {Element!} element
+
- * @constructor
- */
   var Tab = function (element) {
-
+    // jscs:disable requireDollarBeforejQueryAssignment
-  /** @type {Element} */
+    this.element = $(element)
-  this._element = element
+    // jscs:enable requireDollarBeforejQueryAssignment
-
   }
 
+  Tab.VERSION = '3.3.4'
 
-/**
+  Tab.TRANSITION_DURATION = 150
- * @const
- * @type {string}
- */
-Tab['VERSION'] = '4.0.0'
 
+  Tab.prototype.show = function () {
+    var $this    = this.element
+    var $ul      = $this.closest('ul:not(.dropdown-menu)')
+    var selector = $this.data('target')
 
-/**
+    if (!selector) {
- * @const
+      selector = $this.attr('href')
- * @type {string}
+      selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
- * @private
- */
-Tab._NAME = 'tab'
-
-
-/**
- * @const
- * @type {string}
- * @private
- */
-Tab._DATA_KEY = 'bs.tab'
-
-
-/**
- * @const
- * @type {number}
- * @private
- */
-Tab._TRANSITION_DURATION = 150
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Tab._Event = {
-  HIDE   : 'hide.bs.tab',
-  HIDDEN : 'hidden.bs.tab',
-  SHOW   : 'show.bs.tab',
-  SHOWN  : 'shown.bs.tab'
     }
 
+    if ($this.parent('li').hasClass('active')) return
 
-/**
+    var $previous = $ul.find('.active:last a')
- * @const
+    var hideEvent = $.Event('hide.bs.tab', {
- * @enum {string}
+      relatedTarget: $this[0]
- * @private
- */
-Tab._ClassName = {
-  DROPDOWN_MENU : 'dropdown-menu',
-  ACTIVE        : 'active',
-  FADE          : 'fade',
-  IN            : 'in'
-}
-
-
-/**
- * @const
- * @enum {string}
- * @private
- */
-Tab._Selector = {
-  A                     : 'a',
-  LI                    : 'li',
-  LI_DROPDOWN           : 'li.dropdown',
-  UL                    : 'ul:not(.dropdown-menu)',
-  FADE_CHILD            : ':scope > .fade',
-  ACTIVE                : '.active',
-  ACTIVE_CHILD          : ':scope > .active',
-  DATA_TOGGLE           : '[data-toggle="tab"], [data-toggle="pill"]',
-  DROPDOWN_ACTIVE_CHILD : ':scope > .dropdown-menu > .active'
-}
-
-
-/**
- * @param {Object|string=} opt_config
- * @this {jQuery}
- * @return {jQuery}
- * @private
- */
-Tab._jQueryInterface = function (opt_config) {
-  return this.each(function () {
-    var $this = $(this)
-    var data  = $this.data(Tab._DATA_KEY)
-
-    if (!data) {
-      data = data = new Tab(this)
-      $this.data(Tab._DATA_KEY, data)
-    }
-
-    if (typeof opt_config === 'string') {
-      data[opt_config]()
-    }
     })
-}
+    var showEvent = $.Event('show.bs.tab', {
-
+      relatedTarget: $previous[0]
-
-/**
- * Show the tab
- */
-Tab.prototype['show'] = function () {
-  if ( this._element.parentNode
-    && this._element.parentNode.nodeType == Node.ELEMENT_NODE
-    && $(this._element).parent().hasClass(Tab._ClassName.ACTIVE)) {
-    return
-  }
-
-  var ulElement = $(this._element).closest(Tab._Selector.UL)[0]
-  var selector  = Bootstrap.getSelectorFromElement(this._element)
-
-  if (ulElement) {
-    var previous = /** @type {Array.<Element>} */ ($.makeArray($(ulElement).find(Tab._Selector.ACTIVE)))
-    previous = previous[previous.length - 1]
-
-    if (previous) {
-      previous = $(previous).find('a')[0]
-    }
-  }
-
-  var hideEvent = $.Event(Tab._Event.HIDE, {
-    relatedTarget: this._element
     })
 
-  var showEvent = $.Event(Tab._Event.SHOW, {
+    $previous.trigger(hideEvent)
-    relatedTarget: previous
+    $this.trigger(showEvent)
-  })
-
-  if (previous) {
-    $(previous).trigger(hideEvent)
-  }
-
-  $(this._element).trigger(showEvent)
 
     if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) return
 
-  if (selector) {
+    var $target = $(selector)
-    var target = $(selector)[0]
-  }
 
-  this._activate($(this._element).closest(Tab._Selector.LI)[0], ulElement)
+    this.activate($this.closest('li'), $ul)
-
+    this.activate($target, $target.parent(), function () {
-  var complete = function () {
+      $previous.trigger({
-    var hiddenEvent = $.Event(Tab._Event.HIDDEN, {
+        type: 'hidden.bs.tab',
-      relatedTarget: this._element
+        relatedTarget: $this[0]
       })
-
+      $this.trigger({
-    var shownEvent  = $.Event(Tab._Event.SHOWN, {
+        type: 'shown.bs.tab',
-      relatedTarget: previous
+        relatedTarget: $previous[0]
       })
+    })
+  }
 
-    $(previous).trigger(hiddenEvent)
+  Tab.prototype.activate = function (element, container, callback) {
-    $(this._element).trigger(shownEvent)
+    var $active    = container.find('> .active')
-  }.bind(this)
+    var transition = callback
+      && $.support.transition
+      && ($active.length && $active.hasClass('fade') || !!container.find('> .fade').length)
 
-  if (target) {
+    function next() {
-    this._activate(target, /** @type {Element} */ (target.parentNode), complete)
+      $active
+        .removeClass('active')
+        .find('> .dropdown-menu > .active')
+          .removeClass('active')
+        .end()
+        .find('[data-toggle="tab"]')
+          .attr('aria-expanded', false)
+
+      element
+        .addClass('active')
+        .find('[data-toggle="tab"]')
+          .attr('aria-expanded', true)
+
+      if (transition) {
+        element[0].offsetWidth // reflow for transition
+        element.addClass('in')
       } else {
-    complete()
+        element.removeClass('fade')
       }
+
+      if (element.parent('.dropdown-menu').length) {
+        element
+          .closest('li.dropdown')
+            .addClass('active')
+          .end()
+          .find('[data-toggle="tab"]')
+            .attr('aria-expanded', true)
+      }
+
+      callback && callback()
+    }
+
+    $active.length && transition ?
+      $active
+        .one('bsTransitionEnd', next)
+        .emulateTransitionEnd(Tab.TRANSITION_DURATION) :
+      next()
+
+    $active.removeClass('in')
   }
 
 
-/**
+  // TAB PLUGIN DEFINITION
- * @param {Element} element
+  // =====================
- * @param {Element} container
- * @param {Function=} opt_callback
- * @private
- */
-Tab.prototype._activate = function (element, container, opt_callback) {
-  var active          = $(container).find(Tab._Selector.ACTIVE_CHILD)[0]
-  var isTransitioning = opt_callback
-    && Bootstrap.transition
-    && ((active && $(active).hasClass(Tab._ClassName.FADE))
-       || !!$(container).find(Tab._Selector.FADE_CHILD)[0])
 
-  var complete = this._transitionComplete.bind(this, element, active, isTransitioning, opt_callback)
+  function Plugin(option) {
+    return this.each(function () {
+      var $this = $(this)
+      var data  = $this.data('bs.tab')
 
-  if (active && isTransitioning) {
+      if (!data) $this.data('bs.tab', (data = new Tab(this)))
-    $(active)
+      if (typeof option == 'string') data[option]()
-      .one(Bootstrap.TRANSITION_END, complete)
+    })
-      .emulateTransitionEnd(Tab._TRANSITION_DURATION)
-
-  } else {
-    complete()
   }
 
-  if (active) {
+  var old = $.fn.tab
-    $(active).removeClass(Tab._ClassName.IN)
+
-  }
+  $.fn.tab             = Plugin
-}
+  $.fn.tab.Constructor = Tab
 
 
-/**
+  // TAB NO CONFLICT
- * @param {Element} element
+  // ===============
- * @param {Element} active
- * @param {boolean} isTransitioning
- * @param {Function=} opt_callback
- * @private
- */
-Tab.prototype._transitionComplete = function (element, active, isTransitioning, opt_callback) {
-  if (active) {
-    $(active).removeClass(Tab._ClassName.ACTIVE)
 
-    var dropdownChild = $(active).find(Tab._Selector.DROPDOWN_ACTIVE_CHILD)[0]
+  $.fn.tab.noConflict = function () {
-    if (dropdownChild) {
+    $.fn.tab = old
-      $(dropdownChild).removeClass(Tab._ClassName.ACTIVE)
-    }
-
-    var activeToggle = $(active).find(Tab._Selector.DATA_TOGGLE)[0]
-    if (activeToggle) {
-      activeToggle.setAttribute('aria-expanded', false)
-    }
-  }
-
-  $(element).addClass(Tab._ClassName.ACTIVE)
-
-  var elementToggle = $(element).find(Tab._Selector.DATA_TOGGLE)[0]
-  if (elementToggle) {
-    elementToggle.setAttribute('aria-expanded', true)
-  }
-
-  if (isTransitioning) {
-    Bootstrap.reflow(element)
-    $(element).addClass(Tab._ClassName.IN)
-  } else {
-    $(element).removeClass(Tab._ClassName.FADE)
-  }
-
-  if (element.parentNode && $(element.parentNode).hasClass(Tab._ClassName.DROPDOWN_MENU)) {
-    var dropdownElement = $(element).closest(Tab._Selector.LI_DROPDOWN)[0]
-    if (dropdownElement) {
-      $(dropdownElement).addClass(Tab._ClassName.ACTIVE)
-    }
-
-    elementToggle = $(element).find(Tab._Selector.DATA_TOGGLE)[0]
-    if (elementToggle) {
-      elementToggle.setAttribute('aria-expanded', true)
-    }
-  }
-
-  if (opt_callback) {
-    opt_callback()
-  }
-}
-
-
-/**
- * ------------------------------------------------------------------------
- * jQuery Interface + noConflict implementaiton
- * ------------------------------------------------------------------------
- */
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Tab._NAME] = Tab._jQueryInterface
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Tab._NAME]['Constructor'] = Tab
-
-
-/**
- * @const
- * @type {Function}
- */
-$.fn[Tab._NAME]['noConflict'] = function () {
-  $.fn[Tab._NAME] = Tab._JQUERY_NO_CONFLICT
     return this
   }
 
 
-
   // TAB DATA-API
   // ============
 
   var clickHandler = function (e) {
     e.preventDefault()
-  Tab._jQueryInterface.call($(this), 'show')
+    Plugin.call($(this), 'show')
   }
 
   $(document)
-  .on('click.bs.tab.data-api', Tab._Selector.DATA_TOGGLE, clickHandler)
+    .on('click.bs.tab.data-api', '[data-toggle="tab"]', clickHandler)
+    .on('click.bs.tab.data-api', '[data-toggle="pill"]', clickHandler)
+
+}(jQuery);

js/tests/closure.html

@@ -1,83 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <title>Bootstrap Plugin Test Suite</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-
-    <!-- jQuery -->
-    <script src="vendor/jquery.min.js"></script>
-
-    <!-- QUnit -->
-    <link rel="stylesheet" href="vendor/qunit.css" media="screen">
-    <script src="vendor/qunit.js"></script>
-    <style>
-      #qunit-tests > li.pass {
-        display: none;/* Make it easier to see failing tests in Sauce screencasts */
-      }
-
-      #qunit-fixture {
-        top: 0;
-        left: 0;
-      }
-    </style>
-    <script>
-      // See https://github.com/axemclion/grunt-saucelabs#test-result-details-with-qunit
-      var log = []
-      QUnit.done(function (testResults) {
-        var tests = []
-        for (var i = 0, len = log.length; i < len; i++) {
-          var details = log[i]
-          tests.push({
-            name: details.name,
-            result: details.result,
-            expected: details.expected,
-            actual: details.actual,
-            source: details.source
-          })
-        }
-        testResults.tests = tests
-
-        window.global_test_results = testResults
-      })
-
-      QUnit.testStart(function (testDetails) {
-        $(window).scrollTop(0)
-        QUnit.log = function (details) {
-          if (!details.result) {
-            details.name = testDetails.name
-            log.push(details)
-          }
-        }
-      })
-
-      // Cleanup
-      QUnit.testDone(function () {
-        $('#qunit-fixture').empty()
-        $('#modal-test, .modal-backdrop').remove()
-      })
-    </script>
-
-    <!-- Plugin sources -->
-    <script src="../../dist/js/bootstrap.min.js"></script>
-
-    <!-- Unit tests -->
-    <script src="unit/alert.js"></script>
-    <script src="unit/button.js"></script>
-    <script src="unit/carousel.js"></script>
-    <script src="unit/collapse.js"></script>
-    <script src="unit/dropdown.js"></script>
-    <script src="unit/modal.js"></script>
-    <script src="unit/scrollspy.js"></script>
-    <script src="unit/tab.js"></script>
-    <script src="unit/tooltip.js"></script>
-    <script src="unit/popover.js"></script>
-
-  </head>
-  <body>
-    <div id="qunit-container">
-      <div id="qunit"></div>
-      <div id="qunit-fixture"></div>
-    </div>
-  </body>
-</html>

js/tests/index.html

@@ -130,7 +130,7 @@
     </script>
 
     <!-- Plugin sources -->
-    <script src="../../js/util.js"></script>
+    <script>$.support.transition = false</script>
     <script src="../../js/alert.js"></script>
     <script src="../../js/button.js"></script>
     <script src="../../js/carousel.js"></script>
@@ -141,6 +141,7 @@
     <script src="../../js/tab.js"></script>
     <script src="../../js/tooltip.js"></script>
     <script src="../../js/popover.js"></script>
+    <script src="../../js/affix.js"></script>
 
     <!-- Unit tests -->
     <script src="unit/alert.js"></script>
@@ -153,6 +154,7 @@
     <script src="unit/tab.js"></script>
     <script src="unit/tooltip.js"></script>
     <script src="unit/popover.js"></script>
+    <script src="unit/affix.js"></script>
 
   </head>
   <body>

js/tests/unit/affix.js

@@ -0,0 +1,107 @@
+$(function () {
+  'use strict';
+
+  QUnit.module('affix plugin')
+
+  QUnit.test('should be defined on jquery object', function (assert) {
+    assert.expect(1)
+    assert.ok($(document.body).affix, 'affix method is defined')
+  })
+
+  QUnit.module('affix', {
+    beforeEach: function () {
+      // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
+      $.fn.bootstrapAffix = $.fn.affix.noConflict()
+    },
+    afterEach: function () {
+      $.fn.affix = $.fn.bootstrapAffix
+      delete $.fn.bootstrapAffix
+    }
+  })
+
+  QUnit.test('should provide no conflict', function (assert) {
+    assert.expect(1)
+    assert.strictEqual($.fn.affix, undefined, 'affix was set back to undefined (org value)')
+  })
+
+  QUnit.test('should return jquery collection containing the element', function (assert) {
+    assert.expect(2)
+    var $el = $('<div/>')
+    var $affix = $el.bootstrapAffix()
+    assert.ok($affix instanceof $, 'returns jquery collection')
+    assert.strictEqual($affix[0], $el[0], 'collection contains element')
+  })
+
+  QUnit.test('should exit early if element is not visible', function (assert) {
+    assert.expect(1)
+    var $affix = $('<div style="display: none"/>').bootstrapAffix()
+    $affix.data('bs.affix').checkPosition()
+    assert.ok(!$affix.hasClass('affix'), 'affix class was not added')
+  })
+
+  QUnit.test('should trigger affixed event after affix', function (assert) {
+    assert.expect(2)
+    var done = assert.async()
+
+    var templateHTML = '<div id="affixTarget">'
+        + '<ul>'
+        + '<li>Please affix</li>'
+        + '<li>And unaffix</li>'
+        + '</ul>'
+        + '</div>'
+        + '<div id="affixAfter" style="height: 20000px; display: block;"/>'
+    $(templateHTML).appendTo(document.body)
+
+    $('#affixTarget').bootstrapAffix({
+      offset: $('#affixTarget ul').position()
+    })
+
+    $('#affixTarget')
+      .on('affix.bs.affix', function () {
+        assert.ok(true, 'affix event fired')
+      }).on('affixed.bs.affix', function () {
+        assert.ok(true, 'affixed event fired')
+        $('#affixTarget, #affixAfter').remove()
+        done()
+      })
+
+    setTimeout(function () {
+      window.scrollTo(0, document.body.scrollHeight)
+
+      setTimeout(function () {
+        window.scroll(0, 0)
+      }, 16) // for testing in a browser
+    }, 0)
+  })
+
+  QUnit.test('should affix-top when scrolling up to offset when parent has padding', function (assert) {
+    assert.expect(1)
+    var done = assert.async()
+
+    var templateHTML = '<div id="padding-offset" style="padding-top: 20px;">'
+        + '<div id="affixTopTarget">'
+        + '<p>Testing affix-top class is added</p>'
+        + '</div>'
+        + '<div style="height: 1000px; display: block;"/>'
+        + '</div>'
+    $(templateHTML).appendTo(document.body)
+
+    $('#affixTopTarget')
+      .bootstrapAffix({
+        offset: { top: 120, bottom: 0 }
+      })
+      .on('affixed-top.bs.affix', function () {
+        assert.ok($('#affixTopTarget').hasClass('affix-top'), 'affix-top class applied')
+        $('#padding-offset').remove()
+        done()
+      })
+
+    setTimeout(function () {
+      window.scrollTo(0, document.body.scrollHeight)
+
+      setTimeout(function () {
+        window.scroll(0, 119)
+      }, 250)
+    }, 250)
+  })
+})

js/tests/unit/button.js

@@ -1,83 +1,137 @@
 $(function () {
   'use strict';
 
-  module('button plugin')
+  QUnit.module('button plugin')
 
-  test('should be defined on jquery object', function () {
+  QUnit.test('should be defined on jquery object', function (assert) {
-    ok($(document.body).button, 'button method is defined')
+    assert.expect(1)
+    assert.ok($(document.body).button, 'button method is defined')
   })
 
-  module('button', {
+  QUnit.module('button', {
-    setup: function () {
+    beforeEach: function () {
       // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
       $.fn.bootstrapButton = $.fn.button.noConflict()
     },
-    teardown: function () {
+    afterEach: function () {
       $.fn.button = $.fn.bootstrapButton
       delete $.fn.bootstrapButton
     }
   })
 
-  test('should provide no conflict', function () {
+  QUnit.test('should provide no conflict', function (assert) {
-    strictEqual($.fn.button, undefined, 'button was set back to undefined (org value)')
+    assert.expect(1)
+    assert.strictEqual($.fn.button, undefined, 'button was set back to undefined (org value)')
   })
 
-  test('should return jquery collection containing the element', function () {
+  QUnit.test('should return jquery collection containing the element', function (assert) {
+    assert.expect(2)
     var $el = $('<div/>')
     var $button = $el.bootstrapButton()
-    ok($button instanceof $, 'returns jquery collection')
+    assert.ok($button instanceof $, 'returns jquery collection')
-    strictEqual($button[0], $el[0], 'collection contains element')
+    assert.strictEqual($button[0], $el[0], 'collection contains element')
   })
 
-  test('should toggle active', function () {
+  QUnit.test('should return set state to loading', function (assert) {
+    assert.expect(4)
+    var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
+    assert.strictEqual($btn.html(), 'mdo', 'btn text equals mdo')
+    $btn.bootstrapButton('loading')
+    var done = assert.async()
+    setTimeout(function () {
+      assert.strictEqual($btn.html(), 'fat', 'btn text equals fat')
+      assert.ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
+      assert.ok($btn.hasClass('disabled'), 'btn has disabled class')
+      done()
+    }, 0)
+  })
+
+  QUnit.test('should return reset state', function (assert) {
+    assert.expect(7)
+    var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
+    assert.strictEqual($btn.html(), 'mdo', 'btn text equals mdo')
+    $btn.bootstrapButton('loading')
+    var doneOne = assert.async()
+    setTimeout(function () {
+      assert.strictEqual($btn.html(), 'fat', 'btn text equals fat')
+      assert.ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
+      assert.ok($btn.hasClass('disabled'), 'btn has disabled class')
+      doneOne()
+      var doneTwo = assert.async()
+      $btn.bootstrapButton('reset')
+      setTimeout(function () {
+        assert.strictEqual($btn.html(), 'mdo', 'btn text equals mdo')
+        assert.ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
+        assert.ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
+        doneTwo()
+      }, 0)
+    }, 0)
+  })
+
+  QUnit.test('should work with an empty string as reset state', function (assert) {
+    assert.expect(7)
+    var $btn = $('<button class="btn" data-loading-text="fat"/>')
+    assert.strictEqual($btn.html(), '', 'btn text equals ""')
+    $btn.bootstrapButton('loading')
+    var doneOne = assert.async()
+    setTimeout(function () {
+      assert.strictEqual($btn.html(), 'fat', 'btn text equals fat')
+      assert.ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
+      assert.ok($btn.hasClass('disabled'), 'btn has disabled class')
+      doneOne()
+      var doneTwo = assert.async()
+      $btn.bootstrapButton('reset')
+      setTimeout(function () {
+        assert.strictEqual($btn.html(), '', 'btn text equals ""')
+        assert.ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
+        assert.ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
+        doneTwo()
+      }, 0)
+    }, 0)
+  })
+
+  QUnit.test('should toggle active', function (assert) {
+    assert.expect(2)
     var $btn = $('<button class="btn" data-toggle="button">mdo</button>')
-    ok(!$btn.hasClass('active'), 'btn does not have active class')
+    assert.ok(!$btn.hasClass('active'), 'btn does not have active class')
     $btn.bootstrapButton('toggle')
-    ok($btn.hasClass('active'), 'btn has class active')
+    assert.ok($btn.hasClass('active'), 'btn has class active')
   })
 
-  test('should toggle active when btn children are clicked', function () {
+  QUnit.test('should toggle active when btn children are clicked', function (assert) {
+    assert.expect(2)
     var $btn = $('<button class="btn" data-toggle="button">mdo</button>')
     var $inner = $('<i/>')
     $btn
       .append($inner)
       .appendTo('#qunit-fixture')
-    ok(!$btn.hasClass('active'), 'btn does not have active class')
+    assert.ok(!$btn.hasClass('active'), 'btn does not have active class')
-    $inner.click()
+    $inner.trigger('click')
-    ok($btn.hasClass('active'), 'btn has class active')
+    assert.ok($btn.hasClass('active'), 'btn has class active')
   })
 
-  test('should toggle aria-pressed', function () {
+  QUnit.test('should toggle aria-pressed', function (assert) {
+    assert.expect(2)
     var $btn = $('<button class="btn" data-toggle="button" aria-pressed="false">redux</button>')
-    equal($btn.attr('aria-pressed'), 'false', 'btn aria-pressed state is false')
+    assert.strictEqual($btn.attr('aria-pressed'), 'false', 'btn aria-pressed state is false')
     $btn.bootstrapButton('toggle')
-    equal($btn.attr('aria-pressed'), 'true', 'btn aria-pressed state is true')
+    assert.strictEqual($btn.attr('aria-pressed'), 'true', 'btn aria-pressed state is true')
   })
 
-  test('should toggle aria-pressed when btn children are clicked', function () {
+  QUnit.test('should toggle aria-pressed when btn children are clicked', function (assert) {
+    assert.expect(2)
     var $btn = $('<button class="btn" data-toggle="button" aria-pressed="false">redux</button>')
     var $inner = $('<i/>')
     $btn
       .append($inner)
       .appendTo('#qunit-fixture')
-    equal($btn.attr('aria-pressed'), 'false', 'btn aria-pressed state is false')
+    assert.strictEqual($btn.attr('aria-pressed'), 'false', 'btn aria-pressed state is false')
-    $inner.click()
+    $inner.trigger('click')
-    equal($btn.attr('aria-pressed'), 'true', 'btn aria-pressed state is true')
+    assert.strictEqual($btn.attr('aria-pressed'), 'true', 'btn aria-pressed state is true')
   })
 
-  test('should toggle active when btn children are clicked within btn-group', function () {
+  QUnit.test('should check for closest matching toggle', function (assert) {
-    var $btngroup = $('<div class="btn-group" data-toggle="buttons"/>')
+    assert.expect(12)
-    var $btn = $('<button class="btn">fat</button>')
-    var $inner = $('<i/>')
-    $btngroup
-      .append($btn.append($inner))
-      .appendTo('#qunit-fixture')
-    ok(!$btn.hasClass('active'), 'btn does not have active class')
-    $inner.click()
-    ok($btn.hasClass('active'), 'btn has class active')
-  })
-
-  test('should check for closest matching toggle', function () {
     var groupHTML = '<div class="btn-group" data-toggle="buttons">'
       + '<label class="btn btn-primary active">'
       + '<input type="radio" name="options" id="option1" checked="true"> Option 1'
@@ -94,21 +148,21 @@ $(function () {
     var $btn1 = $group.children().eq(0)
     var $btn2 = $group.children().eq(1)
 
-    ok($btn1.hasClass('active'), 'btn1 has active class')
+    assert.ok($btn1.hasClass('active'), 'btn1 has active class')
-    ok($btn1.find('input').prop('checked'), 'btn1 is checked')
+    assert.ok($btn1.find('input').prop('checked'), 'btn1 is checked')
-    ok(!$btn2.hasClass('active'), 'btn2 does not have active class')
+    assert.ok(!$btn2.hasClass('active'), 'btn2 does not have active class')
-    ok(!$btn2.find('input').prop('checked'), 'btn2 is not checked')
+    assert.ok(!$btn2.find('input').prop('checked'), 'btn2 is not checked')
-    $btn2.find('input').click()
+    $btn2.find('input').trigger('click')
-    ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
+    assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
-    ok(!$btn1.find('input').prop('checked'), 'btn1 is checked')
+    assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked')
-    ok($btn2.hasClass('active'), 'btn2 has active class')
+    assert.ok($btn2.hasClass('active'), 'btn2 has active class')
-    ok($btn2.find('input').prop('checked'), 'btn2 is checked')
+    assert.ok($btn2.find('input').prop('checked'), 'btn2 is checked')
 
-    $btn2.find('input').click() // clicking an already checked radio should not un-check it
+    $btn2.find('input').trigger('click') // clicking an already checked radio should not un-check it
-    ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
+    assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
-    ok(!$btn1.find('input').prop('checked'), 'btn1 is checked')
+    assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked')
-    ok($btn2.hasClass('active'), 'btn2 has active class')
+    assert.ok($btn2.hasClass('active'), 'btn2 has active class')
-    ok($btn2.find('input').prop('checked'), 'btn2 is checked')
+    assert.ok($btn2.find('input').prop('checked'), 'btn2 is checked')
   })
 
 })

js/tests/unit/carousel.js

@@ -1,49 +1,54 @@
 $(function () {
   'use strict';
 
-  module('carousel plugin')
+  QUnit.module('carousel plugin')
 
-  test('should be defined on jQuery object', function () {
+  QUnit.test('should be defined on jQuery object', function (assert) {
-    ok($(document.body).carousel, 'carousel method is defined')
+    assert.expect(1)
+    assert.ok($(document.body).carousel, 'carousel method is defined')
   })
 
-  module('carousel', {
+  QUnit.module('carousel', {
-    setup: function () {
+    beforeEach: function () {
       // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
       $.fn.bootstrapCarousel = $.fn.carousel.noConflict()
     },
-    teardown: function () {
+    afterEach: function () {
       $.fn.carousel = $.fn.bootstrapCarousel
       delete $.fn.bootstrapCarousel
     }
   })
 
-  test('should provide no conflict', function () {
+  QUnit.test('should provide no conflict', function (assert) {
-    strictEqual($.fn.carousel, undefined, 'carousel was set back to undefined (orig value)')
+    assert.expect(1)
+    assert.strictEqual($.fn.carousel, undefined, 'carousel was set back to undefined (orig value)')
   })
 
-  test('should return jquery collection containing the element', function () {
+  QUnit.test('should return jquery collection containing the element', function (assert) {
+    assert.expect(2)
     var $el = $('<div/>')
     var $carousel = $el.bootstrapCarousel()
-    ok($carousel instanceof $, 'returns jquery collection')
+    assert.ok($carousel instanceof $, 'returns jquery collection')
-    strictEqual($carousel[0], $el[0], 'collection contains element')
+    assert.strictEqual($carousel[0], $el[0], 'collection contains element')
   })
 
-  test('should not fire slid when slide is prevented', function (assert) {
+  QUnit.test('should not fire slid when slide is prevented', function (assert) {
+    assert.expect(1)
     var done = assert.async()
     $('<div class="carousel"/>')
       .on('slide.bs.carousel', function (e) {
         e.preventDefault()
-        ok(true, 'slide event fired')
+        assert.ok(true, 'slide event fired')
         done()
       })
       .on('slid.bs.carousel', function () {
-        ok(false, 'slid event fired')
+        assert.ok(false, 'slid event fired')
       })
       .bootstrapCarousel('next')
   })
 
-  test('should reset when slide is prevented', function (assert) {
+  QUnit.test('should reset when slide is prevented', function (assert) {
+    assert.expect(6)
     var carouselHTML = '<div id="carousel-example-generic" class="carousel slide">'
         + '<ol class="carousel-indicators">'
         + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -51,13 +56,13 @@ $(function () {
         + '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
         + '</ol>'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<div class="carousel-caption"/>'
         + '</div>'
         + '</div>'
@@ -71,27 +76,28 @@ $(function () {
       .one('slide.bs.carousel', function (e) {
         e.preventDefault()
         setTimeout(function () {
-          ok($carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active')
+          assert.ok($carousel.find('.item:eq(0)').is('.active'), 'first item still active')
-          ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
+          assert.ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
           $carousel.bootstrapCarousel('next')
         }, 0)
       })
       .one('slid.bs.carousel', function () {
         setTimeout(function () {
-          ok(!$carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active')
+          assert.ok(!$carousel.find('.item:eq(0)').is('.active'), 'first item still active')
-          ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
+          assert.ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
-          ok($carousel.find('.carousel-item:eq(1)').is('.active'), 'second item active')
+          assert.ok($carousel.find('.item:eq(1)').is('.active'), 'second item active')
-          ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active')
+          assert.ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active')
           done()
         }, 0)
       })
       .bootstrapCarousel('next')
   })
 
-  test('should fire slide event with direction', function (assert) {
+  QUnit.test('should fire slide event with direction', function (assert) {
+    assert.expect(4)
     var carouselHTML = '<div id="myCarousel" class="carousel slide">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>First Thumbnail label</h4>'
@@ -100,7 +106,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Second Thumbnail label</h4>'
@@ -109,7 +115,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Third Thumbnail label</h4>'
@@ -128,13 +134,13 @@ $(function () {
 
     $carousel
       .one('slide.bs.carousel', function (e) {
-        ok(e.direction, 'direction present on next')
+        assert.ok(e.direction, 'direction present on next')
-        strictEqual(e.direction, 'left', 'direction is left on next')
+        assert.strictEqual(e.direction, 'left', 'direction is left on next')
 
         $carousel
           .one('slide.bs.carousel', function (e) {
-            ok(e.direction, 'direction present on prev')
+            assert.ok(e.direction, 'direction present on prev')
-            strictEqual(e.direction, 'right', 'direction is right on prev')
+            assert.strictEqual(e.direction, 'right', 'direction is right on prev')
             done()
           })
           .bootstrapCarousel('prev')
@@ -142,10 +148,11 @@ $(function () {
       .bootstrapCarousel('next')
   })
 
-  test('should fire slid event with direction', function (assert) {
+  QUnit.test('should fire slid event with direction', function (assert) {
+    assert.expect(4)
     var carouselHTML = '<div id="myCarousel" class="carousel slide">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>First Thumbnail label</h4>'
@@ -154,7 +161,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Second Thumbnail label</h4>'
@@ -163,7 +170,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Third Thumbnail label</h4>'
@@ -182,13 +189,13 @@ $(function () {
 
     $carousel
       .one('slid.bs.carousel', function (e) {
-        ok(e.direction, 'direction present on next')
+        assert.ok(e.direction, 'direction present on next')
-        strictEqual(e.direction, 'left', 'direction is left on next')
+        assert.strictEqual(e.direction, 'left', 'direction is left on next')
 
         $carousel
           .one('slid.bs.carousel', function (e) {
-            ok(e.direction, 'direction present on prev')
+            assert.ok(e.direction, 'direction present on prev')
-            strictEqual(e.direction, 'right', 'direction is right on prev')
+            assert.strictEqual(e.direction, 'right', 'direction is right on prev')
             done()
           })
           .bootstrapCarousel('prev')
@@ -196,10 +203,11 @@ $(function () {
       .bootstrapCarousel('next')
   })
 
-  test('should fire slide event with relatedTarget', function (assert) {
+  QUnit.test('should fire slide event with relatedTarget', function (assert) {
+    assert.expect(2)
     var template = '<div id="myCarousel" class="carousel slide">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>First Thumbnail label</h4>'
@@ -208,7 +216,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Second Thumbnail label</h4>'
@@ -217,7 +225,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Third Thumbnail label</h4>'
@@ -235,17 +243,18 @@ $(function () {
 
     $(template)
       .on('slide.bs.carousel', function (e) {
-        ok(e.relatedTarget, 'relatedTarget present')
+        assert.ok(e.relatedTarget, 'relatedTarget present')
-        ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "carousel-item"')
+        assert.ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"')
         done()
       })
       .bootstrapCarousel('next')
   })
 
-  test('should fire slid event with relatedTarget', function (assert) {
+  QUnit.test('should fire slid event with relatedTarget', function (assert) {
+    assert.expect(2)
     var template = '<div id="myCarousel" class="carousel slide">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>First Thumbnail label</h4>'
@@ -254,7 +263,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Second Thumbnail label</h4>'
@@ -263,7 +272,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Third Thumbnail label</h4>'
@@ -281,17 +290,18 @@ $(function () {
 
     $(template)
       .on('slid.bs.carousel', function (e) {
-        ok(e.relatedTarget, 'relatedTarget present')
+        assert.ok(e.relatedTarget, 'relatedTarget present')
-        ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "carousel-item"')
+        assert.ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"')
         done()
       })
       .bootstrapCarousel('next')
   })
 
-  test('should set interval from data attribute', function () {
+  QUnit.test('should set interval from data attribute', function (assert) {
+    assert.expect(4)
     var templateHTML = '<div id="myCarousel" class="carousel slide">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>First Thumbnail label</h4>'
@@ -300,7 +310,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Second Thumbnail label</h4>'
@@ -309,7 +319,7 @@ $(function () {
         + 'ultricies vehicula ut id elit.</p>'
         + '</div>'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '<div class="carousel-caption">'
         + '<h4>Third Thumbnail label</h4>'
@@ -322,45 +332,45 @@ $(function () {
         + '<a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a>'
         + '<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>'
         + '</div>'
-
     var $carousel = $(templateHTML)
     $carousel.attr('data-interval', 1814)
 
     $carousel.appendTo('body')
-    $('[data-slide]').first().click()
+    $('[data-slide]').first().trigger('click')
-    equal($carousel.data('bs.carousel').getConfig().interval, 1814)
+    assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814)
     $carousel.remove()
 
     $carousel.appendTo('body').attr('data-modal', 'foobar')
-    $('[data-slide]').first().click()
+    $('[data-slide]').first().trigger('click')
-    equal($carousel.data('bs.carousel').getConfig().interval, 1814, 'even if there is an data-modal attribute set')
+    assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814, 'even if there is an data-modal attribute set')
     $carousel.remove()
 
     $carousel.appendTo('body')
-    $('[data-slide]').first().click()
+    $('[data-slide]').first().trigger('click')
     $carousel.attr('data-interval', 1860)
-    $('[data-slide]').first().click()
+    $('[data-slide]').first().trigger('click')
-    equal($carousel.data('bs.carousel').getConfig().interval, 1814, 'attributes should be read only on initialization')
+    assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814, 'attributes should be read only on initialization')
     $carousel.remove()
 
     $carousel.attr('data-interval', false)
     $carousel.appendTo('body')
     $carousel.bootstrapCarousel(1)
-    strictEqual($carousel.data('bs.carousel').getConfig().interval, false, 'data attribute has higher priority than default options')
+    assert.strictEqual($carousel.data('bs.carousel').options.interval, false, 'data attribute has higher priority than default options')
     $carousel.remove()
   })
 
-  test('should skip over non-items when using item indices', function () {
+  QUnit.test('should skip over non-items when using item indices', function (assert) {
+    assert.expect(2)
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="1814">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '</div>'
         + '<script type="text/x-metamorph" id="thingy"/>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '</div>'
         + '</div>'
         + '</div>'
@@ -368,24 +378,25 @@ $(function () {
 
     $template.bootstrapCarousel()
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
 
     $template.bootstrapCarousel(1)
 
-    strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
+    assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
   })
 
-  test('should skip over non-items when using next/prev methods', function () {
+  QUnit.test('should skip over non-items when using next/prev methods', function (assert) {
+    assert.expect(2)
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="1814">'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active">'
+        + '<div class="item active">'
         + '<img alt="">'
         + '</div>'
         + '<script type="text/x-metamorph" id="thingy"/>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div class="carousel-item">'
+        + '<div class="item">'
         + '</div>'
         + '</div>'
         + '</div>'
@@ -393,23 +404,24 @@ $(function () {
 
     $template.bootstrapCarousel()
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
 
     $template.bootstrapCarousel('next')
 
-    strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
+    assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
   })
 
-  test('should go to previous item if left arrow key is pressed', function () {
+  QUnit.test('should go to previous item if left arrow key is pressed', function (assert) {
+    assert.expect(2)
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
         + '<div class="carousel-inner">'
-        + '<div id="first" class="carousel-item">'
+        + '<div id="first" class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="second" class="carousel-item active">'
+        + '<div id="second" class="item active">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="third" class="carousel-item">'
+        + '<div id="third" class="item">'
         + '<img alt="">'
         + '</div>'
         + '</div>'
@@ -418,23 +430,24 @@ $(function () {
 
     $template.bootstrapCarousel()
 
-    strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
+    assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
 
     $template.trigger($.Event('keydown', { which: 37 }))
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
   })
 
-  test('should go to next item if right arrow key is pressed', function () {
+  QUnit.test('should go to next item if right arrow key is pressed', function (assert) {
+    assert.expect(2)
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
         + '<div class="carousel-inner">'
-        + '<div id="first" class="carousel-item active">'
+        + '<div id="first" class="item active">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="second" class="carousel-item">'
+        + '<div id="second" class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="third" class="carousel-item">'
+        + '<div id="third" class="item">'
         + '<img alt="">'
         + '</div>'
         + '</div>'
@@ -443,23 +456,24 @@ $(function () {
 
     $template.bootstrapCarousel()
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
 
     $template.trigger($.Event('keydown', { which: 39 }))
 
-    strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
+    assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
   })
 
-  test('should support disabling the keyboard navigation', function () {
+  QUnit.test('should support disabling the keyboard navigation', function (assert) {
+    assert.expect(3)
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-keyboard="false">'
         + '<div class="carousel-inner">'
-        + '<div id="first" class="carousel-item active">'
+        + '<div id="first" class="item active">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="second" class="carousel-item">'
+        + '<div id="second" class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="third" class="carousel-item">'
+        + '<div id="third" class="item">'
         + '<img alt="">'
         + '</div>'
         + '</div>'
@@ -468,29 +482,30 @@ $(function () {
 
     $template.bootstrapCarousel()
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
 
     $template.trigger($.Event('keydown', { which: 39 }))
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press')
 
     $template.trigger($.Event('keydown', { which: 37 }))
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press')
   })
 
-  test('should ignore keyboard events within <input>s and <textarea>s', function () {
+  QUnit.test('should ignore keyboard events within <input>s and <textarea>s', function (assert) {
+    assert.expect(7)
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
         + '<div class="carousel-inner">'
-        + '<div id="first" class="carousel-item active">'
+        + '<div id="first" class="item active">'
         + '<img alt="">'
         + '<input type="text" id="in-put">'
         + '<textarea id="text-area"></textarea>'
         + '</div>'
-        + '<div id="second" class="carousel-item">'
+        + '<div id="second" class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="third" class="carousel-item">'
+        + '<div id="third" class="item">'
         + '<img alt="">'
         + '</div>'
         + '</div>'
@@ -499,39 +514,40 @@ $(function () {
     var $input = $template.find('#in-put')
     var $textarea = $template.find('#text-area')
 
-    strictEqual($input.length, 1, 'found <input>')
+    assert.strictEqual($input.length, 1, 'found <input>')
-    strictEqual($textarea.length, 1, 'found <textarea>')
+    assert.strictEqual($textarea.length, 1, 'found <textarea>')
 
     $template.bootstrapCarousel()
 
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
 
 
     $input.trigger($.Event('keydown', { which: 39 }))
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>')
 
     $input.trigger($.Event('keydown', { which: 37 }))
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>')
 
 
     $textarea.trigger($.Event('keydown', { which: 39 }))
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>')
 
     $textarea.trigger($.Event('keydown', { which: 37 }))
-    strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>')
+    assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>')
   })
 
-  test('should only add mouseenter and mouseleave listeners when not on mobile', function () {
+  QUnit.test('should only add mouseenter and mouseleave listeners when not on mobile', function (assert) {
+    assert.expect(2)
     var isMobile     = 'ontouchstart' in document.documentElement
     var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-pause="hover">'
         + '<div class="carousel-inner">'
-        + '<div id="first" class="carousel-item active">'
+        + '<div id="first" class="item active">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="second" class="carousel-item">'
+        + '<div id="second" class="item">'
         + '<img alt="">'
         + '</div>'
-        + '<div id="third" class="carousel-item">'
+        + '<div id="third" class="item">'
         + '<img alt="">'
         + '</div>'
         + '</div>'
@@ -539,11 +555,12 @@ $(function () {
     var $template = $(templateHTML).bootstrapCarousel()
 
     $.each(['mouseover', 'mouseout'], function (i, type) {
-      strictEqual(type in $._data($template[0], 'events'), !isMobile, 'does' + (isMobile ? ' not' : '') + ' listen for ' + type + ' events')
+      assert.strictEqual(type in $._data($template[0], 'events'), !isMobile, 'does' + (isMobile ? ' not' : '') + ' listen for ' + type + ' events')
     })
   })
 
-  test('should wrap around from end to start when wrap option is true', function (assert) {
+  QUnit.test('should wrap around from end to start when wrap option is true', function (assert) {
+    assert.expect(3)
     var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="true">'
         + '<ol class="carousel-indicators">'
         + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -551,13 +568,13 @@ $(function () {
         + '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
         + '</ol>'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active" id="one">'
+        + '<div class="item active" id="one">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="two">'
+        + '<div class="item" id="two">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="three">'
+        + '<div class="item" id="three">'
         + '<div class="carousel-caption"/>'
         + '</div>'
         + '</div>'
@@ -565,19 +582,19 @@ $(function () {
         + '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>'
         + '</div>'
     var $carousel = $(carouselHTML)
-    var getActiveId = function () { return $carousel.find('.carousel-item.active').attr('id') }
+    var getActiveId = function () { return $carousel.find('.item.active').attr('id') }
 
     var done = assert.async()
 
     $carousel
       .one('slid.bs.carousel', function () {
-        strictEqual(getActiveId(), 'two', 'carousel slid from 1st to 2nd slide')
+        assert.strictEqual(getActiveId(), 'two', 'carousel slid from 1st to 2nd slide')
         $carousel
           .one('slid.bs.carousel', function () {
-            strictEqual(getActiveId(), 'three', 'carousel slid from 2nd to 3rd slide')
+            assert.strictEqual(getActiveId(), 'three', 'carousel slid from 2nd to 3rd slide')
             $carousel
               .one('slid.bs.carousel', function () {
-                strictEqual(getActiveId(), 'one', 'carousel wrapped around and slid from 3rd to 1st slide')
+                assert.strictEqual(getActiveId(), 'one', 'carousel wrapped around and slid from 3rd to 1st slide')
                 done()
               })
               .bootstrapCarousel('next')
@@ -587,7 +604,8 @@ $(function () {
       .bootstrapCarousel('next')
   })
 
-  test('should wrap around from start to end when wrap option is true', function (assert) {
+  QUnit.test('should wrap around from start to end when wrap option is true', function (assert) {
+    assert.expect(1)
     var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="true">'
         + '<ol class="carousel-indicators">'
         + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -595,13 +613,13 @@ $(function () {
         + '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
         + '</ol>'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active" id="one">'
+        + '<div class="item active" id="one">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="two">'
+        + '<div class="item" id="two">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="three">'
+        + '<div class="item" id="three">'
         + '<div class="carousel-caption"/>'
         + '</div>'
         + '</div>'
@@ -614,13 +632,14 @@ $(function () {
 
     $carousel
       .on('slid.bs.carousel', function () {
-        strictEqual($carousel.find('.carousel-item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide')
+        assert.strictEqual($carousel.find('.item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide')
         done()
       })
       .bootstrapCarousel('prev')
   })
 
-  test('should stay at the end when the next method is called and wrap is false', function (assert) {
+  QUnit.test('should stay at the end when the next method is called and wrap is false', function (assert) {
+    assert.expect(3)
     var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="false">'
         + '<ol class="carousel-indicators">'
         + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -628,13 +647,13 @@ $(function () {
         + '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
         + '</ol>'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active" id="one">'
+        + '<div class="item active" id="one">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="two">'
+        + '<div class="item" id="two">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="three">'
+        + '<div class="item" id="three">'
         + '<div class="carousel-caption"/>'
         + '</div>'
         + '</div>'
@@ -642,22 +661,22 @@ $(function () {
         + '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>'
         + '</div>'
     var $carousel = $(carouselHTML)
-    var getActiveId = function () { return $carousel.find('.carousel-item.active').attr('id') }
+    var getActiveId = function () { return $carousel.find('.item.active').attr('id') }
 
     var done = assert.async()
 
     $carousel
       .one('slid.bs.carousel', function () {
-        strictEqual(getActiveId(), 'two', 'carousel slid from 1st to 2nd slide')
+        assert.strictEqual(getActiveId(), 'two', 'carousel slid from 1st to 2nd slide')
         $carousel
           .one('slid.bs.carousel', function () {
-            strictEqual(getActiveId(), 'three', 'carousel slid from 2nd to 3rd slide')
+            assert.strictEqual(getActiveId(), 'three', 'carousel slid from 2nd to 3rd slide')
             $carousel
               .one('slid.bs.carousel', function () {
-                ok(false, 'carousel slid when it should not have slid')
+                assert.ok(false, 'carousel slid when it should not have slid')
               })
               .bootstrapCarousel('next')
-            strictEqual(getActiveId(), 'three', 'carousel did not wrap around and stayed on 3rd slide')
+            assert.strictEqual(getActiveId(), 'three', 'carousel did not wrap around and stayed on 3rd slide')
             done()
           })
           .bootstrapCarousel('next')
@@ -665,7 +684,8 @@ $(function () {
       .bootstrapCarousel('next')
   })
 
-  test('should stay at the start when the prev method is called and wrap is false', function () {
+  QUnit.test('should stay at the start when the prev method is called and wrap is false', function (assert) {
+    assert.expect(1)
     var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="false">'
         + '<ol class="carousel-indicators">'
         + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -673,13 +693,13 @@ $(function () {
         + '<li data-target="#carousel-example-generic" data-slide-to="2"/>'
         + '</ol>'
         + '<div class="carousel-inner">'
-        + '<div class="carousel-item active" id="one">'
+        + '<div class="item active" id="one">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="two">'
+        + '<div class="item" id="two">'
         + '<div class="carousel-caption"/>'
         + '</div>'
-        + '<div class="carousel-item" id="three">'
+        + '<div class="item" id="three">'
         + '<div class="carousel-caption"/>'
         + '</div>'
         + '</div>'
@@ -690,9 +710,9 @@ $(function () {
 
     $carousel
       .on('slid.bs.carousel', function () {
-        ok(false, 'carousel slid when it should not have slid')
+        assert.ok(false, 'carousel slid when it should not have slid')
       })
       .bootstrapCarousel('prev')
-    strictEqual($carousel.find('.carousel-item.active').attr('id'), 'one', 'carousel did not wrap around and stayed on 1st slide')
+    assert.strictEqual($carousel.find('.item.active').attr('id'), 'one', 'carousel did not wrap around and stayed on 1st slide')
   })
 })

js/tests/unit/collapse.js

@@ -400,7 +400,7 @@ $(function () {
 
     $body2
       .toggleClass('in collapsing')
-      .data('bs.collapse').setTransitioning(true)
+      .data('bs.collapse').transitioning = 1
 
     $target1.trigger('click')
 

js/tests/unit/modal.js

@@ -1,194 +1,209 @@
 $(function () {
   'use strict';
 
-  module('modal plugin')
+  QUnit.module('modal plugin')
 
-  test('should be defined on jquery object', function () {
+  QUnit.test('should be defined on jquery object', function (assert) {
-    ok($(document.body).modal, 'modal method is defined')
+    assert.expect(1)
+    assert.ok($(document.body).modal, 'modal method is defined')
   })
 
-  module('modal', {
+  QUnit.module('modal', {
-    setup: function () {
+    beforeEach: function () {
       // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
       $.fn.bootstrapModal = $.fn.modal.noConflict()
     },
-    teardown: function () {
+    afterEach: function () {
       $.fn.modal = $.fn.bootstrapModal
       delete $.fn.bootstrapModal
     }
   })
 
-  test('should provide no conflict', function () {
+  QUnit.test('should provide no conflict', function (assert) {
-    strictEqual($.fn.modal, undefined, 'modal was set back to undefined (orig value)')
+    assert.expect(1)
+    assert.strictEqual($.fn.modal, undefined, 'modal was set back to undefined (orig value)')
   })
 
-  test('should return jquery collection containing the element', function () {
+  QUnit.test('should return jquery collection containing the element', function (assert) {
+    assert.expect(2)
     var $el = $('<div id="modal-test"/>')
     var $modal = $el.bootstrapModal()
-    ok($modal instanceof $, 'returns jquery collection')
+    assert.ok($modal instanceof $, 'returns jquery collection')
-    strictEqual($modal[0], $el[0], 'collection contains element')
+    assert.strictEqual($modal[0], $el[0], 'collection contains element')
   })
 
-  test('should expose defaults var for settings', function () {
+  QUnit.test('should expose defaults var for settings', function (assert) {
-    ok($.fn.bootstrapModal.Constructor.Defaults, 'default object exposed')
+    assert.expect(1)
+    assert.ok($.fn.bootstrapModal.Constructor.DEFAULTS, 'default object exposed')
   })
 
-  test('should insert into dom when show method is called', function (assert) {
+  QUnit.test('should insert into dom when show method is called', function (assert) {
+    assert.expect(1)
     var done = assert.async()
 
     $('<div id="modal-test"/>')
       .on('shown.bs.modal', function () {
-        notEqual($('#modal-test').length, 0, 'modal inserted into dom')
+        assert.notEqual($('#modal-test').length, 0, 'modal inserted into dom')
         done()
       })
       .bootstrapModal('show')
   })
 
-  test('should fire show event', function (assert) {
+  QUnit.test('should fire show event', function (assert) {
+    assert.expect(1)
     var done = assert.async()
 
     $('<div id="modal-test"/>')
       .on('show.bs.modal', function () {
-        ok(true, 'show event fired')
+        assert.ok(true, 'show event fired')
         done()
       })
       .bootstrapModal('show')
   })
 
-  test('should not fire shown when show was prevented', function (assert) {
+  QUnit.test('should not fire shown when show was prevented', function (assert) {
+    assert.expect(1)
     var done = assert.async()
 
     $('<div id="modal-test"/>')
       .on('show.bs.modal', function (e) {
         e.preventDefault()
-        ok(true, 'show event fired')
+        assert.ok(true, 'show event fired')
         done()
       })
       .on('shown.bs.modal', function () {
-        ok(false, 'shown event fired')
+        assert.ok(false, 'shown event fired')
       })
       .bootstrapModal('show')
   })
 
-  test('should hide modal when hide is called', function (assert) {
+  QUnit.test('should hide modal when hide is called', function (assert) {
+    assert.expect(3)
     var done = assert.async()
 
     $('<div id="modal-test"/>')
       .on('shown.bs.modal', function () {
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        notEqual($('#modal-test').length, 0, 'modal inserted into dom')
+        assert.notEqual($('#modal-test').length, 0, 'modal inserted into dom')
         $(this).bootstrapModal('hide')
       })
       .on('hidden.bs.modal', function () {
-        ok(!$('#modal-test').is(':visible'), 'modal hidden')
+        assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
         done()
       })
       .bootstrapModal('show')
   })
 
-  test('should toggle when toggle is called', function (assert) {
+  QUnit.test('should toggle when toggle is called', function (assert) {
+    assert.expect(3)
     var done = assert.async()
 
     $('<div id="modal-test"/>')
       .on('shown.bs.modal', function () {
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        notEqual($('#modal-test').length, 0, 'modal inserted into dom')
+        assert.notEqual($('#modal-test').length, 0, 'modal inserted into dom')
         $(this).bootstrapModal('toggle')
       })
       .on('hidden.bs.modal', function () {
-        ok(!$('#modal-test').is(':visible'), 'modal hidden')
+        assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
         done()
       })
       .bootstrapModal('toggle')
   })
 
-  test('should remove from dom when click [data-dismiss="modal"]', function (assert) {
+  QUnit.test('should remove from dom when click [data-dismiss="modal"]', function (assert) {
+    assert.expect(3)
     var done = assert.async()
 
     $('<div id="modal-test"><span class="close" data-dismiss="modal"/></div>')
       .on('shown.bs.modal', function () {
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        notEqual($('#modal-test').length, 0, 'modal inserted into dom')
+        assert.notEqual($('#modal-test').length, 0, 'modal inserted into dom')
-        $(this).find('.close').click()
+        $(this).find('.close').trigger('click')
       })
       .on('hidden.bs.modal', function () {
-        ok(!$('#modal-test').is(':visible'), 'modal hidden')
+        assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
         done()
       })
       .bootstrapModal('toggle')
   })
 
-  test('should allow modal close with "backdrop:false"', function (assert) {
+  QUnit.test('should allow modal close with "backdrop:false"', function (assert) {
+    assert.expect(2)
     var done = assert.async()
 
     $('<div id="modal-test" data-backdrop="false"/>')
       .on('shown.bs.modal', function () {
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
         $(this).bootstrapModal('hide')
       })
       .on('hidden.bs.modal', function () {
-        ok(!$('#modal-test').is(':visible'), 'modal hidden')
+        assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
         done()
       })
       .bootstrapModal('show')
   })
 
-  test('should close modal when clicking outside of modal-content', function (assert) {
+  QUnit.test('should close modal when clicking outside of modal-content', function (assert) {
+    assert.expect(3)
     var done = assert.async()
 
     $('<div id="modal-test"><div class="contents"/></div>')
       .on('shown.bs.modal', function () {
-        notEqual($('#modal-test').length, 0, 'modal insterted into dom')
+        assert.notEqual($('#modal-test').length, 0, 'modal inserted into dom')
-        $('.contents').click()
+        $('.contents').trigger('click')
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        $('#modal-test .modal-backdrop').click()
+        $('#modal-test').trigger('click')
       })
       .on('hidden.bs.modal', function () {
-        ok(!$('#modal-test').is(':visible'), 'modal hidden')
+        assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
         done()
       })
       .bootstrapModal('show')
   })
 
-  test('should close modal when escape key is pressed via keydown', function (assert) {
+  QUnit.test('should close modal when escape key is pressed via keydown', function (assert) {
+    assert.expect(3)
     var done = assert.async()
 
-    var div = $('<div id="modal-test"/>')
+    var $div = $('<div id="modal-test"/>')
-    div
+    $div
       .on('shown.bs.modal', function () {
-        ok($('#modal-test').length, 'modal insterted into dom')
+        assert.ok($('#modal-test').length, 'modal insterted into dom')
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        div.trigger($.Event('keydown', { which: 27 }))
+        $div.trigger($.Event('keydown', { which: 27 }))
 
         setTimeout(function () {
-          ok(!$('#modal-test').is(':visible'), 'modal hidden')
+          assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
-          div.remove()
+          $div.remove()
           done()
         }, 0)
       })
       .bootstrapModal('show')
   })
 
-  test('should not close modal when escape key is pressed via keyup', function (assert) {
+  QUnit.test('should not close modal when escape key is pressed via keyup', function (assert) {
+    assert.expect(3)
     var done = assert.async()
 
-    var div = $('<div id="modal-test"/>')
+    var $div = $('<div id="modal-test"/>')
-    div
+    $div
       .on('shown.bs.modal', function () {
-        ok($('#modal-test').length, 'modal insterted into dom')
+        assert.ok($('#modal-test').length, 'modal inserted into dom')
-        ok($('#modal-test').is(':visible'), 'modal visible')
+        assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        div.trigger($.Event('keyup', { which: 27 }))
+        $div.trigger($.Event('keyup', { which: 27 }))
 
         setTimeout(function () {
-          ok($('#modal-test').is(':visible'), 'modal still visible')
+          assert.ok($div.is(':visible'), 'modal still visible')
-          div.remove()
+          $div.remove()
           done()
         }, 0)
       })
       .bootstrapModal('show')
   })
 
-  test('should trigger hide event once when clicking outside of modal-content', function (assert) {
+  QUnit.test('should trigger hide event once when clicking outside of modal-content', function (assert) {
+    assert.expect(1)
     var done = assert.async()
 
     var triggered
@@ -196,32 +211,33 @@ $(function () {
     $('<div id="modal-test"><div class="contents"/></div>')
       .on('shown.bs.modal', function () {
         triggered = 0
-        $('#modal-test .modal-backdrop').click()
+        $('#modal-test').trigger('click')
       })
       .on('hide.bs.modal', function () {
         triggered += 1
-        strictEqual(triggered, 1, 'modal hide triggered once')
+        assert.strictEqual(triggered, 1, 'modal hide triggered once')
         done()
       })
       .bootstrapModal('show')
   })
 
-  test('should close reopened modal with [data-dismiss="modal"] click', function (assert) {
+  QUnit.test('should close reopened modal with [data-dismiss="modal"] click', function (assert) {
+    assert.expect(2)
     var done = assert.async()
 
     $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div></div>')
       .one('shown.bs.modal', function () {
-        $('#close').click()
+        $('#close').trigger('click')
       })
       .one('hidden.bs.modal', function () {
         // after one open-close cycle
-        ok(!$('#modal-test').is(':visible'), 'modal hidden')
+        assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
         $(this)
           .one('shown.bs.modal', function () {
-            $('#close').click()
+            $('#close').trigger('click')
           })
           .one('hidden.bs.modal', function () {
-            ok(!$('#modal-test').is(':visible'), 'modal hidden')
+            assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
             done()
           })
           .bootstrapModal('show')
@@ -229,7 +245,8 @@ $(function () {
       .bootstrapModal('show')
   })
 
-  test('should restore focus to toggling element when modal is hidden after having been opened via data-api', function (assert) {
+  QUnit.test('should restore focus to toggling element when modal is hidden after having been opened via data-api', function (assert) {
+    assert.expect(1)
     var done = assert.async()
 
     var $toggleBtn = $('<button data-toggle="modal" data-target="#modal-test"/>').appendTo('#qunit-fixture')
@@ -237,19 +254,20 @@ $(function () {
     $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div></div>')
       .on('hidden.bs.modal', function () {
         setTimeout(function () {
-          ok($(document.activeElement).is($toggleBtn), 'toggling element is once again focused')
+          assert.ok($(document.activeElement).is($toggleBtn), 'toggling element is once again focused')
           done()
         }, 0)
       })
       .on('shown.bs.modal', function () {
-        $('#close').click()
+        $('#close').trigger('click')
       })
       .appendTo('#qunit-fixture')
 
-    $toggleBtn.click()
+    $toggleBtn.trigger('click')
   })
 
-  test('should not restore focus to toggling element if the associated show event gets prevented', function (assert) {
+  QUnit.test('should not restore focus to toggling element if the associated show event gets prevented', function (assert) {
+    assert.expect(1)
     var done = assert.async()
     var $toggleBtn = $('<button data-toggle="modal" data-target="#modal-test"/>').appendTo('#qunit-fixture')
     var $otherBtn = $('<button id="other-btn"/>').appendTo('#qunit-fixture')
@@ -257,22 +275,103 @@ $(function () {
     $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div>')
       .one('show.bs.modal', function (e) {
         e.preventDefault()
-        $otherBtn.focus()
+        $otherBtn.trigger('focus')
         setTimeout($.proxy(function () {
           $(this).bootstrapModal('show')
         }, this), 0)
       })
       .on('hidden.bs.modal', function () {
         setTimeout(function () {
-          ok($(document.activeElement).is($otherBtn), 'focus returned to toggling element')
+          assert.ok($(document.activeElement).is($otherBtn), 'focus returned to toggling element')
           done()
         }, 0)
       })
       .on('shown.bs.modal', function () {
-        $('#close').click()
+        $('#close').trigger('click')
       })
       .appendTo('#qunit-fixture')
 
-    $toggleBtn.click()
+    $toggleBtn.trigger('click')
+  })
+
+  QUnit.test('should restore inline body padding after closing', function (assert) {
+    assert.expect(2)
+    var done = assert.async()
+    var originalBodyPad = 0
+    var $body = $(document.body)
+
+    $body.css('padding-right', originalBodyPad)
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        var currentBodyPad = parseInt($body.css('padding-right'), 10)
+        assert.notStrictEqual($body.attr('style'), '', 'body has non-empty style attribute')
+        assert.strictEqual(currentBodyPad, originalBodyPad, 'original body padding was not changed')
+        $body.removeAttr('style')
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
+
+  QUnit.test('should ignore values set via CSS when trying to restore body padding after closing', function (assert) {
+    assert.expect(1)
+    var done = assert.async()
+    var $body = $(document.body)
+    var $style = $('<style>body { padding-right: 42px; }</style>').appendTo('head')
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        assert.ok(!$body.attr('style'), 'body does not have inline padding set')
+        $style.remove()
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
+
+  QUnit.test('should ignore other inline styles when trying to restore body padding after closing', function (assert) {
+    assert.expect(2)
+    var done = assert.async()
+    var $body = $(document.body)
+    var $style = $('<style>body { padding-right: 42px; }</style>').appendTo('head')
+
+    $body.css('color', 'red')
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        assert.strictEqual($body[0].style.paddingRight, '', 'body does not have inline padding set')
+        assert.strictEqual($body[0].style.color, 'red', 'body still has other inline styles set')
+        $body.removeAttr('style')
+        $style.remove()
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
+
+  QUnit.test('should properly restore non-pixel inline body padding after closing', function (assert) {
+    assert.expect(1)
+    var done = assert.async()
+    var $body = $(document.body)
+
+    $body.css('padding-right', '5%')
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        assert.strictEqual($body[0].style.paddingRight, '5%', 'body does not have inline padding set')
+        $body.removeAttr('style')
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
   })
 })

js/tests/unit/phantom.js

@@ -52,9 +52,9 @@
 
   QUnit.moduleDone(function (obj) {
     if (obj.failed === 0) {
-      console.log('\r\u2714 All tests passed in "' + obj.name + '" module')
+      console.log('\r\u221A All tests passed in "' + obj.name + '" module')
     } else {
-      console.log('\u2716 ' + obj.failed + ' tests failed in "' + obj.name + '" module')
+      console.log('\u00D7 ' + obj.failed + ' tests failed in "' + obj.name + '" module')
     }
     sendMessage('qunit.moduleDone', obj.name, obj.failed, obj.passed, obj.total)
   })

js/tests/unit/popover.js

@@ -152,7 +152,7 @@ $(function () {
       .bootstrapPopover({
         title: 'Test',
         content: 'Test',
-        template: '<div class="popover foobar"><div class="popover-arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>'
+        template: '<div class="popover foobar"><div class="arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>'
       })
 
     $popover.bootstrapPopover('show')
@@ -166,8 +166,7 @@ $(function () {
 
   QUnit.test('should destroy popover', function (assert) {
     assert.expect(7)
-    var $popover = $('<div>Popover trigger</div>')
+    var $popover = $('<div/>')
-      .appendTo('#qunit-fixture')
       .bootstrapPopover({
         trigger: 'hover'
       })
@@ -241,17 +240,6 @@ $(function () {
       .bootstrapPopover('show')
   })
 
-  QUnit.test('should throw an error when trying to show a popover on a hidden element', function (assert) {
-    assert.expect(1)
-    var $target = $('<a href="#" title="Another popover" data-content="Body" style="display: none;">I am hidden</a>').appendTo('#qunit-fixture')
-
-    assert.throws(function () {
-      $target.bootstrapPopover('show')
-    }, new Error('Can\'t show a tooltip/popover on a hidden element'))
-
-    $target.remove()
-  })
-
   QUnit.test('should throw an error when initializing popover on the document object without specifying a delegation selector', function (assert) {
     assert.expect(1)
     assert.throws(function () {
@@ -271,4 +259,32 @@ $(function () {
     assert.strictEqual($popover.data('bs.popover'), undefined, 'should not initialize the popover')
   })
 
+  QUnit.test('should throw an error when template contains multiple top-level elements', function (assert) {
+    assert.expect(1)
+    assert.throws(function () {
+      $('<span data-toggle="popover" data-title="some title" data-content="some content">some text</span>')
+        .appendTo('#qunit-fixture')
+        .bootstrapPopover({ template: '<div>Foo</div><div>Bar</div>' })
+        .bootstrapPopover('show')
+    }, new Error('popover `template` option must consist of exactly 1 top-level element!'))
+  })
+
+  QUnit.test('should fire inserted event', function (assert) {
+    assert.expect(2)
+    var done = assert.async()
+
+    $('<a href="#">@Johann-S</a>')
+      .appendTo('#qunit-fixture')
+      .on('inserted.bs.popover', function () {
+        assert.notEqual($('.popover').length, 0, 'popover was inserted')
+        assert.ok(true, 'inserted event fired')
+        done()
+      })
+      .bootstrapPopover({
+        title: 'Test',
+        content: 'Test'
+      })
+      .bootstrapPopover('show')
+  })
+
 })

js/tests/visual/affix-with-sticky-footer.html

@@ -0,0 +1,317 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Affix</title>
+  <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <style>
+    html {
+      position: relative;
+      min-height: 100%;
+    }
+    body {
+      /* Margin bottom by footer height */
+      margin-bottom: 200px;
+    }
+    .footer {
+      position: absolute;
+      bottom: 0;
+      width: 100%;
+      /* Set the fixed height of the footer here */
+      height: 200px;
+      background-color: #f5f5f5;
+    }
+    /* Test Styles */
+    .affixed-element-top.affix {
+      top: 10px;
+    }
+    .affixed-element-top.affix-bottom {
+      position: absolute;
+    }
+    .affixed-element-bottom {
+      margin-bottom: 0;
+    }
+    .affixed-element-bottom.affix {
+      bottom: 10px;
+    }
+    .affixed-element-bottom.affix-bottom {
+      position: relative;
+    }
+    .grow-btn, .shrink-btn {
+      color: #FFF;
+    }
+    .grow-btn {
+      background-color: #2ECC40;
+    }
+    .grow-btn:hover {
+      background-color: #3D9970;
+    }
+    .shrink-btn {
+      background-color: #FF4136;
+    }
+    .shrink-btn:hover {
+      background-color: #85144B;
+    }
+  </style>
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
+</head>
+<body>
+
+<div class="container">
+
+  <div class="page-header js-page-header">
+    <h1>Affix <small>Bootstrap Visual Test</small></h1>
+  </div>
+
+  <div class="col-md-3">
+    <ul class="list-group affixed-element-top js-affixed-element-top">
+      <li class="list-group-item">Cras justo odio</li>
+      <li class="list-group-item">Dapibus ac facilisis in</li>
+      <li class="list-group-item">Morbi leo risus</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+      <li class="list-group-item">Vestibulum at eros</li>
+      <li class="list-group-item">Cras justo odio</li>
+      <li class="list-group-item">Dapibus ac facilisis in</li>
+      <li class="list-group-item">Morbi leo risus</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+      <li class="list-group-item">Vestibulum at eros</li>
+      <li class="list-group-item">Cras justo odio</li>
+      <li class="list-group-item">Dapibus ac facilisis in</li>
+      <li class="list-group-item">Morbi leo risus</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+      <li class="list-group-item">Vestibulum at eros</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+    </ul>
+  </div>
+
+  <div class="col-md-6 js-content">
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+  </div>
+
+  <div class="col-md-3">
+    <ul class="list-group affixed-element-bottom js-affixed-element-bottom">
+      <li class="list-group-item">Sit necessitatibus aspernatur.</li>
+      <li class="list-group-item">Adipisicing alias dolor!</li>
+      <li class="list-group-item">Ipsum molestiae impedit.</li>
+      <li class="list-group-item">Amet quis iste?</li>
+      <li class="list-group-item">Ipsum quaerat porro.</li>
+      <li class="list-group-item">Elit lorem libero.</li>
+      <li class="list-group-item">Ipsum dolore facilis.</li>
+      <li class="list-group-item">Elit ad atque.</li>
+      <li class="list-group-item">Dolor amet sequi!</li>
+      <li class="list-group-item">Consectetur voluptatum facilis!</li>
+      <li class="list-group-item">Sit neque eligendi?</li>
+      <li class="list-group-item">Amet fuga consectetur!</li>
+      <li class="list-group-item">Amet molestias repellat!</li>
+      <li class="list-group-item">Consectetur minima repellendus.</li>
+      <li class="list-group-item grow-btn js-grow-btn">Grow content</li>
+      <li class="list-group-item shrink-btn js-shrink-btn">Shrink content</li>
+    </ul>
+  </div>
+
+
+</div>
+
+<footer class="footer js-footer">
+  <div class="container">
+    <p class="text-muted">Place sticky footer content here.</p>
+  </div>
+</footer>
+
+<!-- JavaScript Includes -->
+<script src="../vendor/jquery.min.js"></script>
+<script src="../../transition.js"></script>
+<script src="../../affix.js"></script>
+
+
+<!-- JavaScript Test -->
+<script>
+$(function () {
+  $('.js-affixed-element-top').affix({
+    offset: {
+      top: $('.js-page-header').outerHeight(true) - 10
+    , bottom: $('.js-footer').outerHeight(true) + 10
+    }
+  })
+  // todo(fat): sux you have to do this.
+  .on('affix.bs.affix', function (e) {
+    $(e.target).width(e.target.offsetWidth)
+  })
+
+  $('.js-affixed-element-bottom').affix({
+    offset: {
+      bottom: $('.js-footer').outerHeight(true) + 10
+    }
+  })
+
+  $('.js-grow-btn').on('click', function() {
+    $('.js-content').append('<p>Ipsum corrupti ipsam est temporibus.</p>')
+  })
+  $('.js-shrink-btn').on('click', function() {
+    $('.js-content p').last().remove()
+  })
+})
+</script>
+</body>
+</html>

js/tests/visual/affix.html

@@ -0,0 +1,306 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Affix</title>
+  <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <style>
+    /* Test Styles */
+    .affixed-element-top.affix {
+      top: 10px;
+    }
+    .affixed-element-top.affix-bottom {
+      position: absolute;
+    }
+    .affixed-element-bottom {
+      margin-bottom: 0;
+    }
+    .affixed-element-bottom.affix {
+      bottom: 10px;
+    }
+    .affixed-element-bottom.affix-bottom {
+      position: relative;
+    }
+    .grow-btn, .shrink-btn {
+      color: #FFF;
+    }
+    .grow-btn {
+      background-color: #2ECC40;
+    }
+    .grow-btn:hover {
+      background-color: #3D9970;
+    }
+    .shrink-btn {
+      background-color: #FF4136;
+    }
+    .shrink-btn:hover {
+      background-color: #85144B;
+    }
+  </style>
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
+</head>
+<body>
+
+<div class="container">
+
+  <div class="page-header js-page-header">
+    <h1>Affix <small>Bootstrap Visual Test</small></h1>
+  </div>
+
+  <div class="col-md-3">
+    <ul class="list-group affixed-element-top js-affixed-element-top">
+      <li class="list-group-item">Cras justo odio</li>
+      <li class="list-group-item">Dapibus ac facilisis in</li>
+      <li class="list-group-item">Morbi leo risus</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+      <li class="list-group-item">Vestibulum at eros</li>
+      <li class="list-group-item">Cras justo odio</li>
+      <li class="list-group-item">Dapibus ac facilisis in</li>
+      <li class="list-group-item">Morbi leo risus</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+      <li class="list-group-item">Vestibulum at eros</li>
+      <li class="list-group-item">Cras justo odio</li>
+      <li class="list-group-item">Dapibus ac facilisis in</li>
+      <li class="list-group-item">Morbi leo risus</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+      <li class="list-group-item">Vestibulum at eros</li>
+      <li class="list-group-item">Porta ac consectetur ac</li>
+    </ul>
+  </div>
+
+  <div class="col-md-6 js-content">
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+
+  </div>
+
+  <div class="col-md-3">
+    <ul class="list-group affixed-element-bottom js-affixed-element-bottom">
+      <li class="list-group-item">Sit necessitatibus aspernatur.</li>
+      <li class="list-group-item">Adipisicing alias dolor!</li>
+      <li class="list-group-item">Ipsum molestiae impedit.</li>
+      <li class="list-group-item">Amet quis iste?</li>
+      <li class="list-group-item">Ipsum quaerat porro.</li>
+      <li class="list-group-item">Elit lorem libero.</li>
+      <li class="list-group-item">Ipsum dolore facilis.</li>
+      <li class="list-group-item">Elit ad atque.</li>
+      <li class="list-group-item">Dolor amet sequi!</li>
+      <li class="list-group-item">Consectetur voluptatum facilis!</li>
+      <li class="list-group-item">Sit neque eligendi?</li>
+      <li class="list-group-item">Amet fuga consectetur!</li>
+      <li class="list-group-item">Amet molestias repellat!</li>
+      <li class="list-group-item">Consectetur minima repellendus.</li>
+      <li class="list-group-item grow-btn js-grow-btn">Grow content</li>
+      <li class="list-group-item shrink-btn js-shrink-btn">Shrink content</li>
+    </ul>
+  </div>
+
+  <div class="col-md-12 js-footer">
+    <hr>
+
+    <p>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.</p>
+
+    <p>Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+
+    <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.</p>
+
+    <p>Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+  </div>
+
+</div>
+
+<!-- JavaScript Includes -->
+<script src="../vendor/jquery.min.js"></script>
+<script src="../../transition.js"></script>
+<script src="../../affix.js"></script>
+
+
+<!-- JavaScript Test -->
+<script>
+$(function () {
+  $('.js-affixed-element-top').affix({
+    offset: {
+      top: $('.js-page-header').outerHeight(true) - 10
+    , bottom: $('.js-footer').outerHeight(true) + 10
+    }
+  })
+  // todo(fat): sux you have to do this.
+  .on('affix.bs.affix', function (e) {
+    $(e.target).width(e.target.offsetWidth)
+  })
+
+  $('.js-affixed-element-bottom').affix({
+    offset: {
+      bottom: $('.js-footer').outerHeight(true) + 10
+    }
+  })
+
+  $('.js-grow-btn').on('click', function() {
+    $('.js-content').append('<p>Ipsum corrupti ipsam est temporibus.</p>')
+  })
+  $('.js-shrink-btn').on('click', function() {
+    $('.js-content p').last().remove()
+  })
+})
+</script>
+</body>
+</html>

js/tests/visual/alert.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Alert</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -34,7 +41,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../alert.js"></script>
 
 </body>

js/tests/visual/button.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Button</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -15,6 +22,10 @@
     <h1>Button <small>Bootstrap Visual Test</small></h1>
   </div>
 
+  <button type="button" data-loading-text="Loading for 3 seconds..." class="btn btn-primary js-loading-button">
+    Loading state
+  </button>
+
   <button type="button" class="btn btn-primary" data-toggle="button">Single toggle</button>
 
   <div class="btn-group" data-toggle="buttons">
@@ -45,7 +56,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../button.js"></script>
 
 <!-- JavaScript Test -->

js/tests/visual/carousel.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Carousel</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -22,13 +29,13 @@
       <li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
     </ol>
     <div class="carousel-inner">
-      <div class="carousel-item active">
+      <div class="item active">
         <img alt="First slide" src="http://37.media.tumblr.com/tumblr_m8tay0JcfG1qa42jro1_1280.jpg">
       </div>
-      <div class="carousel-item">
+      <div class="item">
         <img alt="Second slide" src="http://37.media.tumblr.com/tumblr_m8tazfiVYJ1qa42jro1_1280.jpg">
       </div>
-      <div class="carousel-item">
+      <div class="item">
         <img alt="Third slide" src="http://38.media.tumblr.com/tumblr_m8tb2rVsD31qa42jro1_1280.jpg">
       </div>
     </div>
@@ -44,7 +51,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../carousel.js"></script>
 
 </body>

js/tests/visual/collapse.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Collapse</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -64,7 +71,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../collapse.js"></script>
 
 </body>

js/tests/visual/dropdown.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Dropdown</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -93,7 +100,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../dropdown.js"></script>
 <script src="../../collapse.js"></script>
 

js/tests/visual/modal.html

@@ -6,16 +6,55 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Modal</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
+
+  <style>
+    #tall {
+      height: 1500px;
+      width: 100px;
+      background-color: black;
+      color: white;
+    }
+  </style>
 </head>
 <body>
 
+<nav class="navbar navbar-default navbar-static-top">
+  <div class="container-fluid">
+    <div class="navbar-header">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+      <a class="navbar-brand" href="#">navbar-static-top</a>
+    </div>
+    <div id="navbar" class="navbar-collapse collapse">
+      <ul class="nav navbar-nav">
+        <li><a href="#about">About</a></li>
+        <li><a href="#contact">Contact</a></li>
+      </ul>
+      <ul class="nav navbar-nav navbar-right">
+        <li><a href="#">This should not jump to the left when the modal is shown.</a></li>
+      </ul>
+    </div><!--/.nav-collapse -->
+  </div>
+</nav>
+
 <div class="container">
 
   <div class="page-header">
     <h1>Modal <small>Bootstrap Visual Test</small></h1>
   </div>
 
-  <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+  <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
     <div class="modal-dialog">
       <div class="modal-content">
 
@@ -28,10 +67,43 @@
           <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
 
           <h4>Popover in a modal</h4>
-          <p>This <a href="#" role="button" class="btn btn-default js-popover" title="" data-content="And here's some amazing content. It's very engaging. right?" data-original-title="A Title">button</a> should trigger a popover on click.</p>
+          <p>This <a href="#" role="button" class="btn btn-default js-popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?" data-placement="left">button</a> should trigger a popover on click.</p>
 
           <h4>Tooltips in a modal</h4>
-          <p><a href="#" class="js-tooltip" title="" data-original-title="Tooltip">This link</a> and <a href="#" class="js-tooltip" title="" data-original-title="Tooltip">that link</a> should have tooltips on hover.</p>
+          <p><a href="#" class="js-tooltip" title="Tooltip">This link</a> and <a href="#" class="js-tooltip" title="Tooltip">that link</a> should have tooltips on hover.</p>
+
+          <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
+            <div class="panel panel-default">
+              <div class="panel-heading" role="tab" id="headingOne">
+                <h4 class="panel-title">
+                  <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
+                    Collapsible Group Item #1
+                  </a>
+                </h4>
+              </div>
+              <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
+                <div class="panel-body">
+                  Lorem ipsum
+                </div>
+              </div>
+            </div>
+            <div class="panel panel-default">
+              <div class="panel-heading" role="tab" id="headingTwo">
+                <h4 class="panel-title">
+                  <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
+                    Collapsible Group Item #2
+                  </a>
+                </h4>
+              </div>
+              <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
+                <div class="panel-body">
+                  Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
+                  Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
+                  Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
+                </div>
+              </div>
+            </div>
+          </div>
 
           <hr>
 
@@ -59,20 +131,30 @@
     Launch demo modal
   </button>
 
+  <button id="tall-toggle" class="btn btn-default">Toggle tall &lt;body&gt; content</button>
+  <br><br>
+  <div id="tall" style="display: none;">
+    Tall body content to force the page to have a scrollbar.
+  </div>
+
 </div>
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../modal.js"></script>
 <script src="../../tooltip.js"></script>
 <script src="../../popover.js"></script>
+<script src="../../collapse.js"></script>
 
 <!-- JavaScript Test -->
 <script>
 $(function () {
   $('.js-popover').popover()
   $('.js-tooltip').tooltip()
+  $('#tall-toggle').click(function () {
+    $('#tall').toggle()
+  })
 })
 </script>
 

js/tests/visual/popover.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Popover</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -32,7 +39,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../tooltip.js"></script>
 <script src="../../popover.js"></script>
 

js/tests/visual/scrollspy.html

@@ -10,6 +10,13 @@
   <style>
     body { padding-top: 70px; }
   </style>
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body data-spy="scroll" data-target=".navbar" data-offset="70">
 
@@ -93,7 +100,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../scrollspy.js"></script>
 <script src="../../dropdown.js"></script>
 <script src="../../collapse.js"></script>

js/tests/visual/tab.html

@@ -16,6 +16,13 @@
       margin-bottom: 15px;
     }
   </style>
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -157,7 +164,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../tab.js"></script>
 <script src="../../dropdown.js"></script>
 

js/tests/visual/tooltip.html

@@ -6,6 +6,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Tooltip</title>
   <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
+
+  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+  <!--[if lt IE 9]>
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+  <![endif]-->
 </head>
 <body>
 
@@ -29,7 +36,7 @@
 
 <!-- JavaScript Includes -->
 <script src="../vendor/jquery.min.js"></script>
-<script src="../../util.js"></script>
+<script src="../../transition.js"></script>
 <script src="../../tooltip.js"></script>
 
 <!-- JavaScript Test -->

js/util.js

@@ -1,165 +0,0 @@
-/** =======================================================================
- * Bootstrap: util.js v4.0.0
- * http://getbootstrap.com/javascript/#alerts
- * ========================================================================
- * Copyright 2011-2015 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * ========================================================================
- * @fileoverview - Bootstrap's private util helper. Adds private util
- * helpers for things like accesibility and transitions. These methods are
- * shared across all bootstrap plugins.
- * ========================================================================
- */
-
-'use strict';
-
-
-/**
- * @type {Object}
- */
-var Bootstrap = {}
-
-
-/**
- * @const
- * @type {string}
- */
-Bootstrap.TRANSITION_END = 'bsTransitionEnd'
-
-
-/**
- * @const
- * @type {Object}
- */
-Bootstrap.TransitionEndEvent = {
-  'WebkitTransition' : 'webkitTransitionEnd',
-  'MozTransition'    : 'transitionend',
-  'OTransition'      : 'oTransitionEnd otransitionend',
-  'transition'       : 'transitionend'
-}
-
-
-/**
- * @param {Function} childConstructor
- * @param {Function} parentConstructor
- */
-Bootstrap.inherits = function(childConstructor, parentConstructor) {
-  /** @constructor */
-  function tempConstructor() {}
-  tempConstructor.prototype = parentConstructor.prototype
-  childConstructor.prototype = new tempConstructor()
-  /** @override */
-  childConstructor.prototype.constructor = childConstructor
-}
-
-
-/**
- * @param {Element} element
- * @return {string|null}
- */
-Bootstrap.getSelectorFromElement = function (element) {
-  var selector = element.getAttribute('data-target')
-
-  if (!selector) {
-    selector = element.getAttribute('href') || ''
-    selector = /^#[a-z]/i.test(selector) ? selector : null
-  }
-
-  return selector
-}
-
-
-/**
- * @param {string} prefix
- * @return {string}
- */
-Bootstrap.getUID = function (prefix) {
-  do prefix += ~~(Math.random() * 1000000)
-  while (document.getElementById(prefix))
-  return prefix
-}
-
-
-/**
- * @return {Object}
- */
-Bootstrap.getSpecialTransitionEndEvent = function () {
-  return {
-    bindType: Bootstrap.transition.end,
-    delegateType: Bootstrap.transition.end,
-    handle: /** @param {jQuery.Event} event */ (function (event) {
-      if ($(event.target).is(this)) {
-        return event.handleObj.handler.apply(this, arguments)
-      }
-    })
-  }
-}
-
-
-/**
- * @param {Element} element
- */
-Bootstrap.reflow = function (element) {
-  new Function('bs',"return bs")(element.offsetHeight)
-}
-
-
-/**
- * @return {Object|boolean}
- */
-Bootstrap.transitionEndTest = function () {
-  if (window['QUnit']) {
-    return false
-  }
-
-  var el = document.createElement('bootstrap')
-  for (var name in Bootstrap.TransitionEndEvent) {
-    if (el.style[name] !== undefined) {
-      return { end: Bootstrap.TransitionEndEvent[name] }
-    }
-  }
-  return false
-}
-
-
-/**
- * @param {number} duration
- * @this {Element}
- * @return {Object}
- */
-Bootstrap.transitionEndEmulator = function (duration) {
-  var called = false
-
-  $(this).one(Bootstrap.TRANSITION_END, function () {
-    called = true
-  })
-
-  var callback = function () {
-    if (!called) {
-      $(this).trigger(Bootstrap.transition.end)
-    }
-  }.bind(this)
-
-  setTimeout(callback, duration)
-
-  return this
-}
-
-
-/**
- * ------------------------------------------------------------------------
- * jQuery Interface
- * ------------------------------------------------------------------------
- */
-
-$.fn.emulateTransitionEnd = Bootstrap.transitionEndEmulator
-
-$(function () {
-  Bootstrap.transition = Bootstrap.transitionEndTest()
-
-  if (!Bootstrap.transition) {
-    return
-  }
-
-  $.event.special[Bootstrap.TRANSITION_END] = Bootstrap.getSpecialTransitionEndEvent()
-})

package.json

@@ -36,7 +36,6 @@
     "grunt": "~0.4.5",
     "grunt-autoprefixer": "~2.2.0",
     "grunt-banner": "~0.3.1",
-    "grunt-closure-tools": "^0.9.7",
     "grunt-contrib-clean": "~0.6.0",
     "grunt-contrib-compress": "~0.13.0",
     "grunt-contrib-concat": "~0.5.1",
@@ -54,7 +53,7 @@
     "grunt-exec": "~0.4.6",
     "grunt-html": "~4.0.1",
     "grunt-jekyll": "~0.4.2",
-    "grunt-jscs": "~1.5.0",
+    "grunt-jscs": "~1.8.0",
     "grunt-postcss": "^0.3.0",
     "grunt-sass": "^1.0.0",
     "grunt-saucelabs": "~8.6.0",
@@ -64,7 +63,6 @@
     "markdown-it": "^4.0.1",
     "mq4-hover-shim": "^0.1.0",
     "npm-shrinkwrap": "^200.1.0",
-    "superstartup-closure-compiler": "^0.1.6",
     "time-grunt": "^1.1.0"
   },
   "engines": {