git.roojs.org Git - bootswatch/blob - bower_components/bootstrap/js/modal.js

   1 /* ========================================================================
   2  * Bootstrap: modal.js v3.0.0
   3  * http://getbootstrap.com/javascript/#modals
   4  * ========================================================================
   5  * Copyright 2013 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 ($) { "use strict";
  22
  23   // MODAL CLASS DEFINITION
  24   // ======================
  25
  26   var Modal = function (element, options) {
  27     this.options   = options
  28     this.$element  = $(element)
  29     this.$backdrop =
  30     this.isShown   = null
  31
  32     if (this.options.remote) this.$element.load(this.options.remote)
  33   }
  34
  35   Modal.DEFAULTS = {
  36       backdrop: true
  37     , keyboard: true
  38     , show: true
  39   }
  40
  41   Modal.prototype.toggle = function (_relatedTarget) {
  42     return this[!this.isShown ? 'show' : 'hide'](_relatedTarget)
  43   }
  44
  45   Modal.prototype.show = function (_relatedTarget) {
  46     var that = this
  47     var e    = $.Event('show.bs.modal', { relatedTarget: _relatedTarget })
  48
  49     this.$element.trigger(e)
  50
  51     if (this.isShown || e.isDefaultPrevented()) return
  52
  53     this.isShown = true
  54
  55     this.escape()
  56
  57     this.$element.on('click.dismiss.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
  58
  59     this.backdrop(function () {
  60       var transition = $.support.transition && that.$element.hasClass('fade')
  61
  62       if (!that.$element.parent().length) {
  63         that.$element.appendTo(document.body) // don't move modals dom position
  64       }
  65
  66       that.$element.show()
  67
  68       if (transition) {
  69         that.$element[0].offsetWidth // force reflow
  70       }
  71
  72       that.$element
  73         .addClass('in')
  74         .attr('aria-hidden', false)
  75
  76       that.enforceFocus()
  77
  78       var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
  79
  80       transition ?
  81         that.$element.find('.modal-dialog') // wait for modal to slide in
  82           .one($.support.transition.end, function () {
  83             that.$element.focus().trigger(e)
  84           })
  85           .emulateTransitionEnd(300) :
  86         that.$element.focus().trigger(e)
  87     })
  88   }
  89
  90   Modal.prototype.hide = function (e) {
  91     if (e) e.preventDefault()
  92
  93     e = $.Event('hide.bs.modal')
  94
  95     this.$element.trigger(e)
  96
  97     if (!this.isShown || e.isDefaultPrevented()) return
  98
  99     this.isShown = false
 100
 101     this.escape()
 102
 103     $(document).off('focusin.bs.modal')
 104
 105     this.$element
 106       .removeClass('in')
 107       .attr('aria-hidden', true)
 108       .off('click.dismiss.modal')
 109
 110     $.support.transition && this.$element.hasClass('fade') ?
 111       this.$element
 112         .one($.support.transition.end, $.proxy(this.hideModal, this))
 113         .emulateTransitionEnd(300) :
 114       this.hideModal()
 115   }
 116
 117   Modal.prototype.enforceFocus = function () {
 118     $(document)
 119       .off('focusin.bs.modal') // guard against infinite focus loop
 120       .on('focusin.bs.modal', $.proxy(function (e) {
 121         if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {
 122           this.$element.focus()
 123         }
 124       }, this))
 125   }
 126
 127   Modal.prototype.escape = function () {
 128     if (this.isShown && this.options.keyboard) {
 129       this.$element.on('keyup.dismiss.bs.modal', $.proxy(function (e) {
 130         e.which == 27 && this.hide()
 131       }, this))
 132     } else if (!this.isShown) {
 133       this.$element.off('keyup.dismiss.bs.modal')
 134     }
 135   }
 136
 137   Modal.prototype.hideModal = function () {
 138     var that = this
 139     this.$element.hide()
 140     this.backdrop(function () {
 141       that.removeBackdrop()
 142       that.$element.trigger('hidden.bs.modal')
 143     })
 144   }
 145
 146   Modal.prototype.removeBackdrop = function () {
 147     this.$backdrop && this.$backdrop.remove()
 148     this.$backdrop = null
 149   }
 150
 151   Modal.prototype.backdrop = function (callback) {
 152     var that    = this
 153     var animate = this.$element.hasClass('fade') ? 'fade' : ''
 154
 155     if (this.isShown && this.options.backdrop) {
 156       var doAnimate = $.support.transition && animate
 157
 158       this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
 159         .appendTo(document.body)
 160
 161       this.$element.on('click.dismiss.modal', $.proxy(function (e) {
 162         if (e.target !== e.currentTarget) return
 163         this.options.backdrop == 'static'
 164           ? this.$element[0].focus.call(this.$element[0])
 165           : this.hide.call(this)
 166       }, this))
 167
 168       if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
 169
 170       this.$backdrop.addClass('in')
 171
 172       if (!callback) return
 173
 174       doAnimate ?
 175         this.$backdrop
 176           .one($.support.transition.end, callback)
 177           .emulateTransitionEnd(150) :
 178         callback()
 179
 180     } else if (!this.isShown && this.$backdrop) {
 181       this.$backdrop.removeClass('in')
 182
 183       $.support.transition && this.$element.hasClass('fade')?
 184         this.$backdrop
 185           .one($.support.transition.end, callback)
 186           .emulateTransitionEnd(150) :
 187         callback()
 188
 189     } else if (callback) {
 190       callback()
 191     }
 192   }
 193
 194
 195   // MODAL PLUGIN DEFINITION
 196   // =======================
 197
 198   var old = $.fn.modal
 199
 200   $.fn.modal = function (option, _relatedTarget) {
 201     return this.each(function () {
 202       var $this   = $(this)
 203       var data    = $this.data('bs.modal')
 204       var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)
 205
 206       if (!data) $this.data('bs.modal', (data = new Modal(this, options)))
 207       if (typeof option == 'string') data[option](_relatedTarget)
 208       else if (options.show) data.show(_relatedTarget)
 209     })
 210   }
 211
 212   $.fn.modal.Constructor = Modal
 213
 214
 215   // MODAL NO CONFLICT
 216   // =================
 217
 218   $.fn.modal.noConflict = function () {
 219     $.fn.modal = old
 220     return this
 221   }
 222
 223
 224   // MODAL DATA-API
 225   // ==============
 226
 227   $(document).on('click.bs.modal.data-api', '[data-toggle="modal"]', function (e) {
 228     var $this   = $(this)
 229     var href    = $this.attr('href')
 230     var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
 231     var option  = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
 232
 233     e.preventDefault()
 234
 235     $target
 236       .modal(option, this)
 237       .one('hide', function () {
 238         $this.is(':visible') && $this.focus()
 239       })
 240   })
 241
 242   $(document)
 243     .on('show.bs.modal',  '.modal', function () { $(document.body).addClass('modal-open') })
 244     .on('hidden.bs.modal', '.modal', function () { $(document.body).removeClass('modal-open') })
 245
 246 }(window.jQuery);