[Summary view] [Print] [Text view]

   1  /* =========================================================
   2   * bootstrap-modal.js v2.0.1
   3   * http://twitter.github.com/bootstrap/javascript.html#modals
   4   * =========================================================
   5   * Copyright 2012 Twitter, Inc.
   6   *
   7   * Licensed under the Apache License, Version 2.0 (the "License");
   8   * you may not use this file except in compliance with the License.
   9   * You may obtain a copy of the License at
  10   *
  11   * http://www.apache.org/licenses/LICENSE-2.0
  12   *
  13   * Unless required by applicable law or agreed to in writing, software
  14   * distributed under the License is distributed on an "AS IS" BASIS,
  15   * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16   * See the License for the specific language governing permissions and
  17   * limitations under the License.
  18   * ========================================================= */
  19  
  20  
  21  !function( $ ){
  22  
  23    "use strict"
  24  
  25   /* MODAL CLASS DEFINITION
  26    * ====================== */
  27  
  28    var Modal = function ( content, options ) {
  29      this.options = options
  30      this.$element = $(content)
  31        .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
  32    }
  33  
  34    Modal.prototype = {
  35  
  36        constructor: Modal
  37  
  38      , toggle: function () {
  39          return this[!this.isShown ? 'show' : 'hide']()
  40        }
  41  
  42      , show: function () {
  43          var that = this
  44  
  45          if (this.isShown) return
  46  
  47          $('body').addClass('modal-open')
  48  
  49          this.isShown = true
  50          this.$element.trigger('show')
  51  
  52          escape.call(this)
  53          backdrop.call(this, function () {
  54            var transition = $.support.transition && that.$element.hasClass('fade')
  55  
  56            !that.$element.parent().length && that.$element.appendTo(document.body) //don't move modals dom position
  57  
  58            that.$element
  59              .show()
  60  
  61            if (transition) {
  62              that.$element[0].offsetWidth // force reflow
  63            }
  64  
  65            that.$element.addClass('in')
  66  
  67            transition ?
  68              that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) :
  69              that.$element.trigger('shown')
  70  
  71          })
  72        }
  73  
  74      , hide: function ( e ) {
  75          e && e.preventDefault()
  76  
  77          if (!this.isShown) return
  78  
  79          var that = this
  80          this.isShown = false
  81  
  82          $('body').removeClass('modal-open')
  83  
  84          escape.call(this)
  85  
  86          this.$element
  87            .trigger('hide')
  88            .removeClass('in')
  89  
  90          $.support.transition && this.$element.hasClass('fade') ?
  91            hideWithTransition.call(this) :
  92            hideModal.call(this)
  93        }
  94  
  95    }
  96  
  97  
  98   /* MODAL PRIVATE METHODS
  99    * ===================== */
 100  
 101    function hideWithTransition() {
 102      var that = this
 103        , timeout = setTimeout(function () {
 104            that.$element.off($.support.transition.end)
 105            hideModal.call(that)
 106          }, 500)
 107  
 108      this.$element.one($.support.transition.end, function () {
 109        clearTimeout(timeout)
 110        hideModal.call(that)
 111      })
 112    }
 113  
 114    function hideModal( that ) {
 115      this.$element
 116        .hide()
 117        .trigger('hidden')
 118  
 119      backdrop.call(this)
 120    }
 121  
 122    function backdrop( callback ) {
 123      var that = this
 124        , animate = this.$element.hasClass('fade') ? 'fade' : ''
 125  
 126      if (this.isShown && this.options.backdrop) {
 127        var doAnimate = $.support.transition && animate
 128  
 129        this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
 130          .appendTo(document.body)
 131  
 132        if (this.options.backdrop != 'static') {
 133          this.$backdrop.click($.proxy(this.hide, this))
 134        }
 135  
 136        if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
 137  
 138        this.$backdrop.addClass('in')
 139  
 140        doAnimate ?
 141          this.$backdrop.one($.support.transition.end, callback) :
 142          callback()
 143  
 144      } else if (!this.isShown && this.$backdrop) {
 145        this.$backdrop.removeClass('in')
 146  
 147        $.support.transition && this.$element.hasClass('fade')?
 148          this.$backdrop.one($.support.transition.end, $.proxy(removeBackdrop, this)) :
 149          removeBackdrop.call(this)
 150  
 151      } else if (callback) {
 152        callback()
 153      }
 154    }
 155  
 156    function removeBackdrop() {
 157      this.$backdrop.remove()
 158      this.$backdrop = null
 159    }
 160  
 161    function escape() {
 162      var that = this
 163      if (this.isShown && this.options.keyboard) {
 164        $(document).on('keyup.dismiss.modal', function ( e ) {
 165          e.which == 27 && that.hide()
 166        })
 167      } else if (!this.isShown) {
 168        $(document).off('keyup.dismiss.modal')
 169      }
 170    }
 171  
 172  
 173   /* MODAL PLUGIN DEFINITION
 174    * ======================= */
 175  
 176    $.fn.modal = function ( option ) {
 177      return this.each(function () {
 178        var $this = $(this)
 179          , data = $this.data('modal')
 180          , options = $.extend({}, $.fn.modal.defaults, $this.data(), typeof option == 'object' && option)
 181        if (!data) $this.data('modal', (data = new Modal(this, options)))
 182        if (typeof option == 'string') data[option]()
 183        else if (options.show) data.show()
 184      })
 185    }
 186  
 187    $.fn.modal.defaults = {
 188        backdrop: true
 189      , keyboard: true
 190      , show: true
 191    }
 192  
 193    $.fn.modal.Constructor = Modal
 194  
 195  
 196   /* MODAL DATA-API
 197    * ============== */
 198  
 199    $(function () {
 200      $('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
 201        var $this = $(this), href
 202          , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
 203          , option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data())
 204  
 205        e.preventDefault()
 206        $target.modal(option)
 207      })
 208    })
 209  
 210  }( window.jQuery );