bootstrap-modal.js 6.01 KB
Newer Older
Jacob Thornton's avatar
Jacob Thornton committed
1
/* =========================================================
Jacob Thornton's avatar
Jacob Thornton committed
2
 * bootstrap-modal.js v2.0.4
Jon Stevens's avatar
Jon Stevens committed
3
 * http://twitter.github.com/bootstrap/javascript.html#modals
Jacob Thornton's avatar
Jacob Thornton committed
4
 * =========================================================
Mark Otto's avatar
Mark Otto committed
5
 * Copyright 2012 Twitter, Inc.
Jacob Thornton's avatar
Jacob Thornton committed
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * ========================================================= */


21
22
23
!function ($) {

  "use strict"; // jshint ;_;
Jacob Thornton's avatar
Jacob Thornton committed
24

25

Jacob Thornton's avatar
Jacob Thornton committed
26
27
 /* MODAL CLASS DEFINITION
  * ====================== */
Jacob Thornton's avatar
Jacob Thornton committed
28

29
  var Modal = function (content, options) {
30
    this.options = options
31
    this.$element = $(content)
Jacob Thornton's avatar
Jacob Thornton committed
32
      .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
Jacob Thornton's avatar
Jacob Thornton committed
33
34
35
36
  }

  Modal.prototype = {

37
38
39
      constructor: Modal

    , toggle: function () {
40
41
        return this[!this.isShown ? 'show' : 'hide']()
      }
Jacob Thornton's avatar
Jacob Thornton committed
42

43
44
    , show: function () {
        var that = this
45
          , e = $.Event('show')
Jacob Thornton's avatar
Jacob Thornton committed
46

47
48
49
        this.$element.trigger(e)

        if (this.isShown || e.isDefaultPrevented()) return
Jacob Thornton's avatar
Jacob Thornton committed
50

51
52
        $('body').addClass('modal-open')

53
        this.isShown = true
54

55
56
57
        this.escape()

        this.backdrop(function () {
58
59
          var transition = $.support.transition && that.$element.hasClass('fade')

60
61
62
          if (!that.$element.parent().length) {
            that.$element.appendTo(document.body) //don't move modals dom position
          }
63

64
65
66
67
68
69
70
71
72
          that.$element
            .show()

          if (transition) {
            that.$element[0].offsetWidth // force reflow
          }

          that.$element.addClass('in')

73
74
          that.enforceFocus()

75
          transition ?
76
            that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) :
77
78
79
            that.$element.trigger('shown')

        })
80
      }
81

82
    , hide: function (e) {
83
        e && e.preventDefault()
Jacob Thornton's avatar
Jacob Thornton committed
84

85
        var that = this
86
87
88
89
90
91
92

        e = $.Event('hide')

        this.$element.trigger(e)

        if (!this.isShown || e.isDefaultPrevented()) return

93
        this.isShown = false
Jacob Thornton's avatar
Jacob Thornton committed
94

95
96
        $('body').removeClass('modal-open')

97
        this.escape()
98
99

        $(document).off('focusin.modal')
Jacob Thornton's avatar
Jacob Thornton committed
100

101
        this.$element.removeClass('in')
Jacob Thornton's avatar
Jacob Thornton committed
102

103
        $.support.transition && this.$element.hasClass('fade') ?
104
105
          this.hideWithTransition() :
          this.hideModal()
106
      }
Jacob Thornton's avatar
Jacob Thornton committed
107

108
109
110
111
112
113
114
115
    , enforceFocus: function () {
        var that = this
        $(document).on('focusin.modal', function (e) {
          if (that.$element[0] !== e.target && !that.$element.has(e.target).length) {
            that.$element.focus()
          }
        })
      }
116

117
118
119
120
121
122
123
124
125
126
    , escape: function () {
        var that = this
        if (this.isShown && this.options.keyboard) {
          $(document).on('keyup.dismiss.modal', function ( e ) {
            e.which == 27 && that.hide()
          })
        } else if (!this.isShown) {
          $(document).off('keyup.dismiss.modal')
        }
      }
127

128
129
130
131
132
133
134
135
136
137
138
139
    , hideWithTransition: function () {
        var that = this
          , timeout = setTimeout(function () {
              that.$element.off($.support.transition.end)
              that.hideModal()
            }, 500)

        this.$element.one($.support.transition.end, function () {
          clearTimeout(timeout)
          that.hideModal()
        })
      }
140

141
142
143
144
    , hideModal: function (that) {
        this.$element
          .hide()
          .trigger('hidden')
145

146
147
        this.backdrop()
      }
Jacob Thornton's avatar
Jacob Thornton committed
148

149
150
151
152
    , removeBackdrop: function () {
        this.$backdrop.remove()
        this.$backdrop = null
      }
153

154
155
156
    , backdrop: function (callback) {
        var that = this
          , animate = this.$element.hasClass('fade') ? 'fade' : ''
157

158
159
        if (this.isShown && this.options.backdrop) {
          var doAnimate = $.support.transition && animate
160

161
162
          this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
            .appendTo(document.body)
163

164
165
166
          if (this.options.backdrop != 'static') {
            this.$backdrop.click($.proxy(this.hide, this))
          }
167

168
          if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
169

170
          this.$backdrop.addClass('in')
Jacob Thornton's avatar
Jacob Thornton committed
171

172
173
174
          doAnimate ?
            this.$backdrop.one($.support.transition.end, callback) :
            callback()
175

176
177
        } else if (!this.isShown && this.$backdrop) {
          this.$backdrop.removeClass('in')
Jacob Thornton's avatar
Jacob Thornton committed
178

179
180
181
          $.support.transition && this.$element.hasClass('fade')?
            this.$backdrop.one($.support.transition.end, $.proxy(this.removeBackdrop, this)) :
            this.removeBackdrop()
182

183
184
185
186
        } else if (callback) {
          callback()
        }
      }
Jacob Thornton's avatar
Jacob Thornton committed
187
188
189
190
191
192
  }


 /* MODAL PLUGIN DEFINITION
  * ======================= */

193
  $.fn.modal = function (option) {
Jacob Thornton's avatar
Jacob Thornton committed
194
195
196
    return this.each(function () {
      var $this = $(this)
        , data = $this.data('modal')
197
        , options = $.extend({}, $.fn.modal.defaults, $this.data(), typeof option == 'object' && option)
Jacob Thornton's avatar
Jacob Thornton committed
198
199
      if (!data) $this.data('modal', (data = new Modal(this, options)))
      if (typeof option == 'string') data[option]()
200
      else if (options.show) data.show()
Jacob Thornton's avatar
Jacob Thornton committed
201
    })
Jacob Thornton's avatar
Jacob Thornton committed
202
203
  }

204
  $.fn.modal.defaults = {
Jacob Thornton's avatar
Jacob Thornton committed
205
206
      backdrop: true
    , keyboard: true
207
    , show: true
208
209
  }

210
  $.fn.modal.Constructor = Modal
Jacob Thornton's avatar
Jacob Thornton committed
211

212

Jacob Thornton's avatar
Jacob Thornton committed
213
214
 /* MODAL DATA-API
  * ============== */
215

216
217
  $(function () {
    $('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
Jacob Thornton's avatar
Jacob Thornton committed
218
219
      var $this = $(this), href
        , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
220
221
        , option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data())

Jacob Thornton's avatar
Jacob Thornton committed
222
      e.preventDefault()
223
      $target.modal(option)
224
225
226
    })
  })

227
}(window.jQuery);