rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-19 16:54:24 +01:00
Code Issues Actions Packages Releases Activity

revert collapse change + add emulateTransitionEvent to catch dead css transitions

Browse Source
This commit is contained in:
Jacob Thornton 2013-07-23 18:44:08 -07:00
parent 43e5e90a6d
commit f1009c19b3
10 changed files with 91 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
dist/js/bootstrap.js vendored
View File

@ -40,6 +40,14 @@
} }
} }
// http://blog.alexmaccaw.com/css-transitions
$.fn.emulateTransitionEnd = function (duration) {
var called = false, $el = this
$(this).one('webkitTransitionEnd', function () { called = true })
var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') }
setTimeout(callback, duration)
}
$(function () { $(function () {
$.support.transition = transitionEnd() $.support.transition = transitionEnd()
}) })
@ -103,7 +111,9 @@
} }
$.support.transition && $parent.hasClass('fade') ? $.support.transition && $parent.hasClass('fade') ?
$parent.on($.support.transition.end, removeElement) : $parent
.one($.support.transition.end, removeElement)
.emulateTransitionEnd(150) :
removeElement() removeElement()
} }
@ -380,12 +390,14 @@
$next[0].offsetWidth // force reflow $next[0].offsetWidth // force reflow
$active.addClass(direction) $active.addClass(direction)
$next.addClass(direction) $next.addClass(direction)
this.$element.find('.item').one($.support.transition.end, function () { this.$element.find('.item')
$next.removeClass([type, direction].join(' ')).addClass('active') .one($.support.transition.end, function () {
$active.removeClass(['active', direction].join(' ')) $next.removeClass([type, direction].join(' ')).addClass('active')
that.sliding = false $active.removeClass(['active', direction].join(' '))
setTimeout(function () { that.$element.trigger('slid') }, 0) that.sliding = false
}) setTimeout(function () { that.$element.trigger('slid') }, 0)
})
.emulateTransitionEnd(600)
} else { } else {
this.$element.trigger(e) this.$element.trigger(e)
if (e.isDefaultPrevented()) return if (e.isDefaultPrevented()) return
@ -511,7 +523,7 @@
var dimension = this.dimension() var dimension = this.dimension()
var scroll = $.camelCase(['scroll', dimension].join('-')) var scroll = $.camelCase(['scroll', dimension].join('-'))
var actives = this.$parent && this.$parent.find('.collapse.in') var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
if (actives && actives.length) { if (actives && actives.length) {
var hasData = actives.data('bs.collapse') var hasData = actives.data('bs.collapse')
@ -565,7 +577,9 @@
this.$element[method]('in') this.$element[method]('in')
$.support.transition && this.$element.hasClass('collapse') ? $.support.transition && this.$element.hasClass('collapse') ?
this.$element.one($.support.transition.end, complete) : this.$element
.one($.support.transition.end, complete)
.emulateTransitionEnd(350) :
complete() complete()
} }
@ -772,7 +786,6 @@
// APPLY TO STANDARD DROPDOWN ELEMENTS // APPLY TO STANDARD DROPDOWN ELEMENTS
// =================================== // ===================================
$(document) $(document)
.on('click.bs.dropdown.data-api', clearMenus) .on('click.bs.dropdown.data-api', clearMenus)
.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() }) .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
@ -856,7 +869,11 @@
that.enforceFocus() that.enforceFocus()
transition ? transition ?
that.$element.one($.support.transition.end, function () { that.$element.focus().trigger('shown.bs.modal') }) : that.$element
.one($.support.transition.end, function () {
that.$element.focus().trigger('shown.bs.modal')
})
.emulateTransitionEnd(300) :
that.$element.focus().trigger('shown.bs.modal') that.$element.focus().trigger('shown.bs.modal')
}) })
} }
@ -881,7 +898,9 @@
.attr('aria-hidden', true) .attr('aria-hidden', true)
$.support.transition && this.$element.hasClass('fade') ? $.support.transition && this.$element.hasClass('fade') ?
this.hideWithTransition() : this.$element
.one($.support.transition.end, $.proxy(this.hideModal, this))
.emulateTransitionEnd(300) :
this.hideModal() this.hideModal()
} }
@ -905,19 +924,6 @@
} }
} }
Modal.prototype.hideWithTransition = function () {
var that = this
var timeout = setTimeout(function () {
that.$element.off($.support.transition.end)
that.hideModal()
}, 500)
this.$element.one($.support.transition.end, function () {
clearTimeout(timeout)
that.hideModal()
})
}
Modal.prototype.hideModal = function () { Modal.prototype.hideModal = function () {
var that = this var that = this
this.$element.hide() this.$element.hide()
@ -956,14 +962,18 @@
if (!callback) return if (!callback) return
doAnimate ? doAnimate ?
this.$backdrop.one($.support.transition.end, callback) : this.$backdrop
.one($.support.transition.end, callback)
.emulateTransitionEnd(150) :
callback() callback()
} else if (!this.isShown && this.$backdrop) { } else if (!this.isShown && this.$backdrop) {
this.$backdrop.removeClass('in') this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')? $.support.transition && this.$element.hasClass('fade')?
this.$backdrop.one($.support.transition.end, callback) : this.$backdrop
.one($.support.transition.end, callback)
.emulateTransitionEnd(150) :
callback() callback()
} else if (callback) { } else if (callback) {
@ -1020,8 +1030,8 @@
}) })
var $body = $(document.body) var $body = $(document.body)
.on('bs.modal.shown', '.modal', function () { $body.addClass('modal-open') }) .on('shown.bs.modal', '.modal', function () { $body.addClass('modal-open') })
.on('bs.modal.hidden', '.modal', function () { $body.removeClass('modal-open') }) .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
}(window.jQuery); }(window.jQuery);
/* ======================================================================== /* ========================================================================
@ -1264,19 +1274,10 @@
$tip.removeClass('in') $tip.removeClass('in')
function removeWithAnimation() {
var timeout = setTimeout(function () {
$tip.off($.support.transition.end).detach()
}, 500)
$tip.one($.support.transition.end, function () {
clearTimeout(timeout)
$tip.detach()
})
}
$.support.transition && this.$tip.hasClass('fade') ? $.support.transition && this.$tip.hasClass('fade') ?
removeWithAnimation() : $tip
.one($.support.transition.end, $tip.detach)
.emulateTransitionEnd(150) :
$tip.detach() $tip.detach()
this.$element.trigger('hidden.bs.' + this.type) this.$element.trigger('hidden.bs.' + this.type)
@ -1739,7 +1740,9 @@
} }
transition ? transition ?
$active.one($.support.transition.end, next) : $active
.one($.support.transition.end, next)
.emulateTransitionEnd(150) :
next() next()
$active.removeClass('in') $active.removeClass('in')

2
dist/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

4
js/alert.js
View File

@ -56,7 +56,9 @@
} }
$.support.transition && $parent.hasClass('fade') ? $.support.transition && $parent.hasClass('fade') ?
$parent.on($.support.transition.end, removeElement) : $parent
.one($.support.transition.end, removeElement)
.emulateTransitionEnd(150) :
removeElement() removeElement()
} }

14
js/carousel.js
View File

@ -130,12 +130,14 @@
$next[0].offsetWidth // force reflow $next[0].offsetWidth // force reflow
$active.addClass(direction) $active.addClass(direction)
$next.addClass(direction) $next.addClass(direction)
this.$element.find('.item').one($.support.transition.end, function () { this.$element.find('.item')
$next.removeClass([type, direction].join(' ')).addClass('active') .one($.support.transition.end, function () {
$active.removeClass(['active', direction].join(' ')) $next.removeClass([type, direction].join(' ')).addClass('active')
that.sliding = false $active.removeClass(['active', direction].join(' '))
setTimeout(function () { that.$element.trigger('slid') }, 0) that.sliding = false
}) setTimeout(function () { that.$element.trigger('slid') }, 0)
})
.emulateTransitionEnd(600)
} else { } else {
this.$element.trigger(e) this.$element.trigger(e)
if (e.isDefaultPrevented()) return if (e.isDefaultPrevented()) return

6
js/collapse.js
View File

@ -50,7 +50,7 @@
var dimension = this.dimension() var dimension = this.dimension()
var scroll = $.camelCase(['scroll', dimension].join('-')) var scroll = $.camelCase(['scroll', dimension].join('-'))
var actives = this.$parent && this.$parent.find('.collapse.in') var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
if (actives && actives.length) { if (actives && actives.length) {
var hasData = actives.data('bs.collapse') var hasData = actives.data('bs.collapse')
@ -104,7 +104,9 @@
this.$element[method]('in') this.$element[method]('in')
$.support.transition && this.$element.hasClass('collapse') ? $.support.transition && this.$element.hasClass('collapse') ?
this.$element.one($.support.transition.end, complete) : this.$element
.one($.support.transition.end, complete)
.emulateTransitionEnd(350) :
complete() complete()
} }

1
js/dropdown.js
View File

@ -145,7 +145,6 @@
// APPLY TO STANDARD DROPDOWN ELEMENTS // APPLY TO STANDARD DROPDOWN ELEMENTS
// =================================== // ===================================
$(document) $(document)
.on('click.bs.dropdown.data-api', clearMenus) .on('click.bs.dropdown.data-api', clearMenus)
.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() }) .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })

31
js/modal.js
View File

@ -74,7 +74,11 @@
that.enforceFocus() that.enforceFocus()
transition ? transition ?
that.$element.one($.support.transition.end, function () { that.$element.focus().trigger('shown.bs.modal') }) : that.$element
.one($.support.transition.end, function () {
that.$element.focus().trigger('shown.bs.modal')
})
.emulateTransitionEnd(300) :
that.$element.focus().trigger('shown.bs.modal') that.$element.focus().trigger('shown.bs.modal')
}) })
} }
@ -99,7 +103,9 @@
.attr('aria-hidden', true) .attr('aria-hidden', true)
$.support.transition && this.$element.hasClass('fade') ? $.support.transition && this.$element.hasClass('fade') ?
this.hideWithTransition() : this.$element
.one($.support.transition.end, $.proxy(this.hideModal, this))
.emulateTransitionEnd(300) :
this.hideModal() this.hideModal()
} }
@ -123,19 +129,6 @@
} }
} }
Modal.prototype.hideWithTransition = function () {
var that = this
var timeout = setTimeout(function () {
that.$element.off($.support.transition.end)
that.hideModal()
}, 500)
this.$element.one($.support.transition.end, function () {
clearTimeout(timeout)
that.hideModal()
})
}
Modal.prototype.hideModal = function () { Modal.prototype.hideModal = function () {
var that = this var that = this
this.$element.hide() this.$element.hide()
@ -174,14 +167,18 @@
if (!callback) return if (!callback) return
doAnimate ? doAnimate ?
this.$backdrop.one($.support.transition.end, callback) : this.$backdrop
.one($.support.transition.end, callback)
.emulateTransitionEnd(150) :
callback() callback()
} else if (!this.isShown && this.$backdrop) { } else if (!this.isShown && this.$backdrop) {
this.$backdrop.removeClass('in') this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')? $.support.transition && this.$element.hasClass('fade')?
this.$backdrop.one($.support.transition.end, callback) : this.$backdrop
.one($.support.transition.end, callback)
.emulateTransitionEnd(150) :
callback() callback()
} else if (callback) { } else if (callback) {

4
js/tab.js
View File

@ -88,7 +88,9 @@
} }
transition ? transition ?
$active.one($.support.transition.end, next) : $active
.one($.support.transition.end, next)
.emulateTransitionEnd(150) :
next() next()
$active.removeClass('in') $active.removeClass('in')

15
js/tooltip.js
View File

@ -238,19 +238,10 @@
$tip.removeClass('in') $tip.removeClass('in')
function removeWithAnimation() {
var timeout = setTimeout(function () {
$tip.off($.support.transition.end).detach()
}, 500)
$tip.one($.support.transition.end, function () {
clearTimeout(timeout)
$tip.detach()
})
}
$.support.transition && this.$tip.hasClass('fade') ? $.support.transition && this.$tip.hasClass('fade') ?
removeWithAnimation() : $tip
.one($.support.transition.end, $tip.detach)
.emulateTransitionEnd(150) :
$tip.detach() $tip.detach()
this.$element.trigger('hidden.bs.' + this.type) this.$element.trigger('hidden.bs.' + this.type)

8
js/transition.js
View File

@ -40,6 +40,14 @@
} }
} }
// http://blog.alexmaccaw.com/css-transitions
$.fn.emulateTransitionEnd = function (duration) {
var called = false, $el = this
$(this).one('webkitTransitionEnd', function () { called = true })
var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') }
setTimeout(callback, duration)
}
$(function () { $(function () {
$.support.transition = transitionEnd() $.support.transition = transitionEnd()
}) })