mirror of https://github.com/twbs/bootstrap.git
Merge branch 'slide-event-reset' of git://github.com/Rowno/bootstrap into Rowno-slide-event-reset
Conflicts: js/tests/unit/carousel.js
This commit is contained in:
commit
fe7fffe034
|
@ -35,6 +35,8 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
|
||||||
return { end: transEndEventNames[name] }
|
return { end: transEndEventNames[name] }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return false // explicit for ie8 ( ._.)
|
||||||
}
|
}
|
||||||
|
|
||||||
// http://blog.alexmaccaw.com/css-transitions
|
// http://blog.alexmaccaw.com/css-transitions
|
||||||
|
@ -347,14 +349,16 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
|
||||||
$next = this.$element.find('.item')[fallback]()
|
$next = this.$element.find('.item')[fallback]()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if ($next.hasClass('active')) return
|
||||||
|
|
||||||
|
var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
|
||||||
|
this.$element.trigger(e)
|
||||||
|
if (e.isDefaultPrevented()) return
|
||||||
|
|
||||||
this.sliding = true
|
this.sliding = true
|
||||||
|
|
||||||
isCycling && this.pause()
|
isCycling && this.pause()
|
||||||
|
|
||||||
var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
|
|
||||||
|
|
||||||
if ($next.hasClass('active')) return
|
|
||||||
|
|
||||||
if (this.$indicators.length) {
|
if (this.$indicators.length) {
|
||||||
this.$indicators.find('.active').removeClass('active')
|
this.$indicators.find('.active').removeClass('active')
|
||||||
this.$element.one('slid.bs.carousel', function () {
|
this.$element.one('slid.bs.carousel', function () {
|
||||||
|
@ -364,8 +368,6 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($.support.transition && this.$element.hasClass('slide')) {
|
if ($.support.transition && this.$element.hasClass('slide')) {
|
||||||
this.$element.trigger(e)
|
|
||||||
if (e.isDefaultPrevented()) return
|
|
||||||
$next.addClass(type)
|
$next.addClass(type)
|
||||||
$next[0].offsetWidth // force reflow
|
$next[0].offsetWidth // force reflow
|
||||||
$active.addClass(direction)
|
$active.addClass(direction)
|
||||||
|
@ -379,8 +381,6 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
|
||||||
})
|
})
|
||||||
.emulateTransitionEnd($active.css('transition-duration').slice(0, -1) * 1000)
|
.emulateTransitionEnd($active.css('transition-duration').slice(0, -1) * 1000)
|
||||||
} else {
|
} else {
|
||||||
this.$element.trigger(e)
|
|
||||||
if (e.isDefaultPrevented()) return
|
|
||||||
$active.removeClass('active')
|
$active.removeClass('active')
|
||||||
$next.addClass('active')
|
$next.addClass('active')
|
||||||
this.sliding = false
|
this.sliding = false
|
||||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -100,14 +100,16 @@
|
||||||
$next = this.$element.find('.item')[fallback]()
|
$next = this.$element.find('.item')[fallback]()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if ($next.hasClass('active')) return
|
||||||
|
|
||||||
|
var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
|
||||||
|
this.$element.trigger(e)
|
||||||
|
if (e.isDefaultPrevented()) return
|
||||||
|
|
||||||
this.sliding = true
|
this.sliding = true
|
||||||
|
|
||||||
isCycling && this.pause()
|
isCycling && this.pause()
|
||||||
|
|
||||||
var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
|
|
||||||
|
|
||||||
if ($next.hasClass('active')) return
|
|
||||||
|
|
||||||
if (this.$indicators.length) {
|
if (this.$indicators.length) {
|
||||||
this.$indicators.find('.active').removeClass('active')
|
this.$indicators.find('.active').removeClass('active')
|
||||||
this.$element.one('slid.bs.carousel', function () {
|
this.$element.one('slid.bs.carousel', function () {
|
||||||
|
@ -117,8 +119,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($.support.transition && this.$element.hasClass('slide')) {
|
if ($.support.transition && this.$element.hasClass('slide')) {
|
||||||
this.$element.trigger(e)
|
|
||||||
if (e.isDefaultPrevented()) return
|
|
||||||
$next.addClass(type)
|
$next.addClass(type)
|
||||||
$next[0].offsetWidth // force reflow
|
$next[0].offsetWidth // force reflow
|
||||||
$active.addClass(direction)
|
$active.addClass(direction)
|
||||||
|
@ -132,8 +132,6 @@
|
||||||
})
|
})
|
||||||
.emulateTransitionEnd($active.css('transition-duration').slice(0, -1) * 1000)
|
.emulateTransitionEnd($active.css('transition-duration').slice(0, -1) * 1000)
|
||||||
} else {
|
} else {
|
||||||
this.$element.trigger(e)
|
|
||||||
if (e.isDefaultPrevented()) return
|
|
||||||
$active.removeClass('active')
|
$active.removeClass('active')
|
||||||
$next.addClass('active')
|
$next.addClass('active')
|
||||||
this.sliding = false
|
this.sliding = false
|
||||||
|
|
|
@ -16,7 +16,7 @@ $(function () {
|
||||||
ok($(document.body).carousel()[0] == document.body, 'document.body returned')
|
ok($(document.body).carousel()[0] == document.body, 'document.body returned')
|
||||||
})
|
})
|
||||||
|
|
||||||
test('should not fire sliden when slide is prevented', function () {
|
test('should not fire slide when slide is prevented', function () {
|
||||||
$.support.transition = false
|
$.support.transition = false
|
||||||
stop()
|
stop()
|
||||||
$('<div class="carousel"/>')
|
$('<div class="carousel"/>')
|
||||||
|
@ -31,6 +31,29 @@ $(function () {
|
||||||
.carousel('next')
|
.carousel('next')
|
||||||
})
|
})
|
||||||
|
|
||||||
|
test('should reset when slide is prevented', function () {
|
||||||
|
var template = '<div id="carousel-example-generic" class="carousel slide"><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li></ol><div class="carousel-inner"><div class="item active"><div class="carousel-caption"></div></div><div class="item"><div class="carousel-caption"></div></div><div class="item"><div class="carousel-caption"></div></div></div><a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"></a><a class="right carousel-control" href="#carousel-example-generic" data-slide="next"></a></div>'
|
||||||
|
var $carousel = $(template)
|
||||||
|
$.support.transition = false
|
||||||
|
stop()
|
||||||
|
$carousel.one('slide.bs.carousel', function (e) {
|
||||||
|
e.preventDefault()
|
||||||
|
setTimeout(function () {
|
||||||
|
ok($carousel.find('.item:eq(0)').is('.active'))
|
||||||
|
ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'))
|
||||||
|
$carousel.carousel('next')
|
||||||
|
}, 1);
|
||||||
|
})
|
||||||
|
$carousel.one('slid.bs.carousel', function () {
|
||||||
|
setTimeout(function () {
|
||||||
|
ok($carousel.find('.item:eq(1)').is('.active'))
|
||||||
|
ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'))
|
||||||
|
start()
|
||||||
|
}, 1);
|
||||||
|
})
|
||||||
|
$carousel.carousel('next')
|
||||||
|
})
|
||||||
|
|
||||||
test('should fire slide event with direction', function () {
|
test('should fire slide event with direction', function () {
|
||||||
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a><a class="right carousel-control" href="#myCarousel" data-slide="next">›</a></div>'
|
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a><a class="right carousel-control" href="#myCarousel" data-slide="next">›</a></div>'
|
||||||
$.support.transition = false
|
$.support.transition = false
|
||||||
|
|
Loading…
Reference in New Issue