bootstrap-modal.js

(function( $ ){

 /* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
  * ======================================================= */

  var transitionEnd

  $(function () {

    $.support.transition = (function () {
      var thisBody = document.body || document.documentElement
        , thisStyle = thisBody.style
        , support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
      return support
    })()

    // set CSS transition event type
    if ( $.support.transition ) {
      transitionEnd = "TransitionEnd"
      if ( $.browser.webkit ) {
      	transitionEnd = "webkitTransitionEnd"
      } else if ( $.browser.mozilla ) {
      	transitionEnd = "transitionend"
      } else if ( $.browser.opera ) {
      	transitionEnd = "oTransitionEnd"
      }
    }

  })


 /* MODAL PUBLIC CLASS DEFINITION
  * ============================= */

  var Modal = function ( content, options ) {
    this.settings = $.extend({}, $.fn.modal.defaults)

    if ( options ) {
      $.extend( this.settings, options )
    }

    this.$element = $(content)
      .bind('modal:show', $.proxy(this.show, this))
      .bind('modal:hide', $.proxy(this.hide, this))
      .bind('modal:toggle', $.proxy(this.toggle, this))
      .delegate('.close', 'click', $.proxy(this.hide, this))

    return this
  }

  Modal.prototype = {

    toggle: function () {
      return this[!this.isShown ? 'show' : 'hide']()
    }

  , show: function () {
      var that = this
      this.isShown = true

      _.escape.call(this)
      _.backdrop.call(this, function () {

        that.$element
          .appendTo(document.body)
          .show()

        setTimeout(function () {
          that.$element.addClass('in').trigger('modal:shown')
        }, 1)