Add autoplayDirection
This commit is contained in:
@@ -46,6 +46,11 @@
|
|||||||
*/
|
*/
|
||||||
export let autoplaySpeed = 3000
|
export let autoplaySpeed = 3000
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Auto play change direction ('next', 'prev')
|
||||||
|
*/
|
||||||
|
export let autoplayDirection = 'next'
|
||||||
|
|
||||||
let pagesCount = 0
|
let pagesCount = 0
|
||||||
let contentContainerWidth = 0
|
let contentContainerWidth = 0
|
||||||
let offset
|
let offset
|
||||||
@@ -67,14 +72,18 @@
|
|||||||
children[slideIndex].style.minWidth = `${slideSizePx}px`
|
children[slideIndex].style.minWidth = `${slideSizePx}px`
|
||||||
children[slideIndex].style.maxWidth = `${slideSizePx}px`
|
children[slideIndex].style.maxWidth = `${slideSizePx}px`
|
||||||
}
|
}
|
||||||
moveToPage(initialPage)
|
showPage(initialPage)
|
||||||
}
|
}
|
||||||
|
|
||||||
function applyAutoplay() {
|
function applyAutoplay() {
|
||||||
|
const autoplayDirectionFnDescription = {
|
||||||
|
'next': showNextPage,
|
||||||
|
'prev': showPrevPage
|
||||||
|
}
|
||||||
let interval
|
let interval
|
||||||
if (autoplay) {
|
if (autoplay) {
|
||||||
interval = setInterval(() => {
|
interval = setInterval(() => {
|
||||||
showNextPage()
|
autoplayDirectionFnDescription[autoplayDirection]()
|
||||||
}, autoplaySpeed)
|
}, autoplaySpeed)
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
@@ -97,15 +106,14 @@
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
function moveToPage(pageIndex) {
|
|
||||||
store.moveToPage({ pageIndex, pagesCount })
|
|
||||||
applyOffset()
|
|
||||||
}
|
|
||||||
|
|
||||||
function applyOffset() {
|
function applyOffset() {
|
||||||
offset = -$store.currentItemIndex * contentContainerWidth
|
offset = -$store.currentItemIndex * contentContainerWidth
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function showPage(pageIndex) {
|
||||||
|
store.moveToPage({ pageIndex, pagesCount })
|
||||||
|
applyOffset()
|
||||||
|
}
|
||||||
function showPrevPage() {
|
function showPrevPage() {
|
||||||
store.prev({ infinite, pagesCount })
|
store.prev({ infinite, pagesCount })
|
||||||
applyOffset()
|
applyOffset()
|
||||||
|
|||||||
@@ -36,6 +36,11 @@
|
|||||||
*/
|
*/
|
||||||
export let autoplaySpeed = 3000
|
export let autoplaySpeed = 3000
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Auto play change direction ('next', 'prev')
|
||||||
|
*/
|
||||||
|
export let autoplayDirection = 'next'
|
||||||
|
|
||||||
const colors = [
|
const colors = [
|
||||||
'#e5f9f0',
|
'#e5f9f0',
|
||||||
'#ccf3e2',
|
'#ccf3e2',
|
||||||
@@ -59,6 +64,7 @@
|
|||||||
{speed}
|
{speed}
|
||||||
{autoplay}
|
{autoplay}
|
||||||
{autoplaySpeed}
|
{autoplaySpeed}
|
||||||
|
{autoplayDirection}
|
||||||
>
|
>
|
||||||
{#each colors as color (color)}
|
{#each colors as color (color)}
|
||||||
<div
|
<div
|
||||||
|
|||||||
Reference in New Issue
Block a user