Skip to content

B
bootstrap
Commit 4b537781 authored by Jacob Thornton's avatar Jacob Thornton
Browse files
Options

Merge branch 'master' into 2.0.4-wip

parents 5ecab611 a404ac33
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 251 additions and 194 deletions
docs/assets/js/bootstrap-modal.js
View file @ 4b537781
...@@ -52,8 +52,9 @@ ...@@ -52,8 +52,9 @@
this.isShown = true this.isShown = true
escape.call(this) this.escape()
backdrop.call(this, function () {
this.backdrop(function () {
var transition = $.support.transition && that.$element.hasClass('fade') var transition = $.support.transition && that.$element.hasClass('fade')
if (!that.$element.parent().length) { if (!that.$element.parent().length) {
...@@ -69,6 +70,8 @@ ...@@ -69,6 +70,8 @@
that.$element.addClass('in') that.$element.addClass('in')
that.enforceFocus()
transition ? transition ?
that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) : that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) :
that.$element.trigger('shown') that.$element.trigger('shown')
...@@ -91,90 +94,102 @@ ...@@ -91,90 +94,102 @@
$('body').removeClass('modal-open') $('body').removeClass('modal-open')
escape.call(this) this.escape()
this.relaxFocus()
this.$element.removeClass('in') this.$element.removeClass('in')
$.support.transition && this.$element.hasClass('fade') ? $.support.transition && this.$element.hasClass('fade') ?
hideWithTransition.call(this) : this.hideWithTransition() :
hideModal.call(this) this.hideModal()
} }
} , enforceFocus: function () {
var that = this
var console = window.console
/* MODAL PRIVATE METHODS console.log('attach');
* ===================== */ $(document).on('focusin.modal', function (e) {
console.log('triggered');
if (that.$element[0] !== e.target && !that.$element.has(e.target).length) {
that.$element.focus()
}
})
}
function hideWithTransition() { , relaxFocus: function () {
var that = this $(document).off('focus.modal')
, timeout = setTimeout(function () { }
that.$element.off($.support.transition.end)
hideModal.call(that)
}, 500)
this.$element.one($.support.transition.end, function () { , escape: function () {
clearTimeout(timeout) var that = this
hideModal.call(that) 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')
}
}
function hideModal(that) { , hideWithTransition: function () {
this.$element var that = this
.hide() , timeout = setTimeout(function () {
.trigger('hidden') that.$element.off($.support.transition.end)
that.hideModal()
}, 500)
this.$element.one($.support.transition.end, function () {
clearTimeout(timeout)
that.hideModal()
})
}
backdrop.call(this) , hideModal: function (that) {
} this.$element
.hide()
.trigger('hidden')
function backdrop(callback) { this.backdrop()
var that = this }
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if (this.isShown && this.options.backdrop) { , removeBackdrop: function () {
var doAnimate = $.support.transition && animate this.$backdrop.remove()
this.$backdrop = null
}
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />') , backdrop: function (callback) {
.appendTo(document.body) var that = this
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if (this.options.backdrop != 'static') { if (this.isShown && this.options.backdrop) {
this.$backdrop.click($.proxy(this.hide, this)) var doAnimate = $.support.transition && animate
}
if (doAnimate) this.$backdrop[0].offsetWidth // force reflow this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
this.$backdrop.addClass('in') if (this.options.backdrop != 'static') {
this.$backdrop.click($.proxy(this.hide, this))
}
doAnimate ? if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
this.$backdrop.one($.support.transition.end, callback) :
callback()
} else if (!this.isShown && this.$backdrop) { this.$backdrop.addClass('in')
this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')? doAnimate ?
this.$backdrop.one($.support.transition.end, $.proxy(removeBackdrop, this)) : this.$backdrop.one($.support.transition.end, callback) :
removeBackdrop.call(this) callback()
} else if (callback) { } else if (!this.isShown && this.$backdrop) {
callback() this.$backdrop.removeClass('in')
}
}
function removeBackdrop() { $.support.transition && this.$element.hasClass('fade')?
this.$backdrop.remove() this.$backdrop.one($.support.transition.end, $.proxy(this.removeBackdrop, this)) :
this.$backdrop = null this.removeBackdrop()
}
function escape() { } else if (callback) {
var that = this callback()
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')
}
} }
......
docs/assets/js/bootstrap.js
View file @ 4b537781
...@@ -719,8 +719,9 @@ ...@@ -719,8 +719,9 @@
this.isShown = true this.isShown = true
escape.call(this) this.escape()
backdrop.call(this, function () {
this.backdrop(function () {
var transition = $.support.transition && that.$element.hasClass('fade') var transition = $.support.transition && that.$element.hasClass('fade')
if (!that.$element.parent().length) { if (!that.$element.parent().length) {
...@@ -736,6 +737,8 @@ ...@@ -736,6 +737,8 @@
that.$element.addClass('in') that.$element.addClass('in')
that.enforceFocus()
transition ? transition ?
that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) : that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) :
that.$element.trigger('shown') that.$element.trigger('shown')
...@@ -758,90 +761,102 @@ ...@@ -758,90 +761,102 @@
$('body').removeClass('modal-open') $('body').removeClass('modal-open')
escape.call(this) this.escape()
this.relaxFocus()
this.$element.removeClass('in') this.$element.removeClass('in')
$.support.transition && this.$element.hasClass('fade') ? $.support.transition && this.$element.hasClass('fade') ?
hideWithTransition.call(this) : this.hideWithTransition() :
hideModal.call(this) this.hideModal()
} }
} , enforceFocus: function () {
var that = this
var console = window.console
console.log('attach');
$(document).on('focusin.modal', function (e) {
console.log('triggered');
if (that.$element[0] !== e.target && !that.$element.has(e.target).length) {
that.$element.focus()
}
})
}
/* MODAL PRIVATE METHODS , relaxFocus: function () {
* ===================== */ $(document).off('focus.modal')
}
function hideWithTransition() { , escape: function () {
var that = this var that = this
, timeout = setTimeout(function () { if (this.isShown && this.options.keyboard) {
that.$element.off($.support.transition.end) $(document).on('keyup.dismiss.modal', function ( e ) {
hideModal.call(that) e.which == 27 && that.hide()
}, 500) })
} else if (!this.isShown) {
$(document).off('keyup.dismiss.modal')
}
}
this.$element.one($.support.transition.end, function () { , hideWithTransition: function () {
clearTimeout(timeout) var that = this
hideModal.call(that) , timeout = setTimeout(function () {
}) that.$element.off($.support.transition.end)
} that.hideModal()
}, 500)
function hideModal(that) { this.$element.one($.support.transition.end, function () {
this.$element clearTimeout(timeout)
.hide() that.hideModal()
.trigger('hidden') })
}
backdrop.call(this) , hideModal: function (that) {
} this.$element
.hide()
.trigger('hidden')
function backdrop(callback) { this.backdrop()
var that = this }
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if (this.isShown && this.options.backdrop) { , removeBackdrop: function () {
var doAnimate = $.support.transition && animate this.$backdrop.remove()
this.$backdrop = null
}
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />') , backdrop: function (callback) {
.appendTo(document.body) var that = this
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if (this.options.backdrop != 'static') { if (this.isShown && this.options.backdrop) {
this.$backdrop.click($.proxy(this.hide, this)) var doAnimate = $.support.transition && animate
}
if (doAnimate) this.$backdrop[0].offsetWidth // force reflow this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
this.$backdrop.addClass('in') if (this.options.backdrop != 'static') {
this.$backdrop.click($.proxy(this.hide, this))
}
doAnimate ? if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
this.$backdrop.one($.support.transition.end, callback) :
callback()
} else if (!this.isShown && this.$backdrop) { this.$backdrop.addClass('in')
this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')? doAnimate ?
this.$backdrop.one($.support.transition.end, $.proxy(removeBackdrop, this)) : this.$backdrop.one($.support.transition.end, callback) :
removeBackdrop.call(this) callback()
} else if (callback) { } else if (!this.isShown && this.$backdrop) {
callback() this.$backdrop.removeClass('in')
}
}
function removeBackdrop() { $.support.transition && this.$element.hasClass('fade')?
this.$backdrop.remove() this.$backdrop.one($.support.transition.end, $.proxy(this.removeBackdrop, this)) :
this.$backdrop = null this.removeBackdrop()
}
function escape() { } else if (callback) {
var that = this callback()
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')
}
} }
......
docs/assets/js/bootstrap.min.js
View file @ 4b537781
This diff is collapsed.
docs/javascript.html
View file @ 4b537781
...@@ -199,8 +199,9 @@ ...@@ -199,8 +199,9 @@
<h2>Live demo</h2> <h2>Live demo</h2>
<p>Toggle a modal via javascript by clicking the button below. It will slide down and fade in from the top of the page.</p> <p>Toggle a modal via javascript by clicking the button below. It will slide down and fade in from the top of the page.</p>
<!-- sample modal content --> <!-- sample modal content -->
<div id="myModal" class="modal hide fade"> <div id="myModal" class="modal hide fade" tabindex=0>
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button> <button type="button" class="close" data-dismiss="modal">&times;</button>
<h3>Modal Heading</h3> <h3>Modal Heading</h3>
...@@ -209,6 +210,11 @@ ...@@ -209,6 +210,11 @@
<h4>Text in a modal</h4> <h4>Text in a modal</h4>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p> <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p>
<form class="well">
<label>Label name</label>
<input type="text" class="span3" placeholder="Type something…">
</form>
<h4>Popover in a modal</h4> <h4>Popover in a modal</h4>
<p>This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.</p> <p>This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.</p>
......
docs/templates/pages/javascript.mustache
View file @ 4b537781
...@@ -122,8 +122,9 @@ ...@@ -122,8 +122,9 @@
<h2>{{_i}}Live demo{{/i}}</h2> <h2>{{_i}}Live demo{{/i}}</h2>
<p>{{_i}}Toggle a modal via javascript by clicking the button below. It will slide down and fade in from the top of the page.{{/i}}</p> <p>{{_i}}Toggle a modal via javascript by clicking the button below. It will slide down and fade in from the top of the page.{{/i}}</p>
<!-- sample modal content --> <!-- sample modal content -->
<div id="myModal" class="modal hide fade"> <div id="myModal" class="modal hide fade" tabindex="0">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button> <button type="button" class="close" data-dismiss="modal">&times;</button>
<h3>{{_i}}Modal Heading{{/i}}</h3> <h3>{{_i}}Modal Heading{{/i}}</h3>
...@@ -132,6 +133,11 @@ ...@@ -132,6 +133,11 @@
<h4>{{_i}}Text in a modal{{/i}}</h4> <h4>{{_i}}Text in a modal{{/i}}</h4>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p> <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p>
<form class="well">
<label>Label name</label>
<input type="text" class="span3" placeholder="Type something…">
</form>
<h4>{{_i}}Popover in a modal{{/i}}</h4> <h4>{{_i}}Popover in a modal{{/i}}</h4>
<p>{{_i}}This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.{{/i}}</p> <p>{{_i}}This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.{{/i}}</p>
......
js/bootstrap-modal.js
View file @ 4b537781
...@@ -52,8 +52,9 @@ ...@@ -52,8 +52,9 @@
this.isShown = true this.isShown = true
escape.call(this) this.escape()
backdrop.call(this, function () {
this.backdrop(function () {
var transition = $.support.transition && that.$element.hasClass('fade') var transition = $.support.transition && that.$element.hasClass('fade')
if (!that.$element.parent().length) { if (!that.$element.parent().length) {
...@@ -69,6 +70,8 @@ ...@@ -69,6 +70,8 @@
that.$element.addClass('in') that.$element.addClass('in')
that.enforceFocus()
transition ? transition ?
that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) : that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) :
that.$element.trigger('shown') that.$element.trigger('shown')
...@@ -91,90 +94,102 @@ ...@@ -91,90 +94,102 @@
$('body').removeClass('modal-open') $('body').removeClass('modal-open')
escape.call(this) this.escape()
this.relaxFocus()
this.$element.removeClass('in') this.$element.removeClass('in')
$.support.transition && this.$element.hasClass('fade') ? $.support.transition && this.$element.hasClass('fade') ?
hideWithTransition.call(this) : this.hideWithTransition() :
hideModal.call(this) this.hideModal()
} }
} , enforceFocus: function () {
var that = this
var console = window.console
/* MODAL PRIVATE METHODS console.log('attach');
* ===================== */ $(document).on('focusin.modal', function (e) {
console.log('triggered');
if (that.$element[0] !== e.target && !that.$element.has(e.target).length) {
that.$element.focus()
}
})
}
function hideWithTransition() { , relaxFocus: function () {
var that = this $(document).off('focus.modal')
, timeout = setTimeout(function () { }
that.$element.off($.support.transition.end)
hideModal.call(that)
}, 500)
this.$element.one($.support.transition.end, function () { , escape: function () {
clearTimeout(timeout) var that = this
hideModal.call(that) 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')
}
}
function hideModal(that) { , hideWithTransition: function () {
this.$element var that = this
.hide() , timeout = setTimeout(function () {
.trigger('hidden') that.$element.off($.support.transition.end)
that.hideModal()
}, 500)
this.$element.one($.support.transition.end, function () {
clearTimeout(timeout)
that.hideModal()
})
}
backdrop.call(this) , hideModal: function (that) {
} this.$element
.hide()
.trigger('hidden')
function backdrop(callback) { this.backdrop()
var that = this }
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if (this.isShown && this.options.backdrop) { , removeBackdrop: function () {
var doAnimate = $.support.transition && animate this.$backdrop.remove()
this.$backdrop = null
}
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />') , backdrop: function (callback) {
.appendTo(document.body) var that = this
, animate = this.$element.hasClass('fade') ? 'fade' : ''
if (this.options.backdrop != 'static') { if (this.isShown && this.options.backdrop) {
this.$backdrop.click($.proxy(this.hide, this)) var doAnimate = $.support.transition && animate
}
if (doAnimate) this.$backdrop[0].offsetWidth // force reflow this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
this.$backdrop.addClass('in') if (this.options.backdrop != 'static') {
this.$backdrop.click($.proxy(this.hide, this))
}
doAnimate ? if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
this.$backdrop.one($.support.transition.end, callback) :
callback()
} else if (!this.isShown && this.$backdrop) { this.$backdrop.addClass('in')
this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')? doAnimate ?
this.$backdrop.one($.support.transition.end, $.proxy(removeBackdrop, this)) : this.$backdrop.one($.support.transition.end, callback) :
removeBackdrop.call(this) callback()
} else if (callback) { } else if (!this.isShown && this.$backdrop) {
callback() this.$backdrop.removeClass('in')
}
}
function removeBackdrop() { $.support.transition && this.$element.hasClass('fade')?
this.$backdrop.remove() this.$backdrop.one($.support.transition.end, $.proxy(this.removeBackdrop, this)) :
this.$backdrop = null this.removeBackdrop()
}
function escape() { } else if (callback) {
var that = this callback()
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')
}
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment