diff --git a/fixed-layout.js b/fixed-layout.js index bf713da..51c705d 100644 --- a/fixed-layout.js +++ b/fixed-layout.js @@ -293,13 +293,21 @@ export class FixedLayout extends HTMLElement { const { index, side } = this.getSpreadOf(section) await this.goToSpread(index, side) } + get atStart() { + return this.#index === 0 + } + get atEnd() { + return this.#index === this.#spreads.length - 1 + } async next() { const s = this.rtl ? this.#goLeft() : this.#goRight() + if (!s && this.atEnd) this.dispatchEvent(new Event("reached-end")); if (s) this.#reportLocation('page') else return this.goToSpread(this.#index + 1, this.rtl ? 'right' : 'left', 'page') } async prev() { const s = this.rtl ? this.#goRight() : this.#goLeft() + if (!s && this.atStart) this.dispatchEvent(new Event("reached-start")); if (s) this.#reportLocation('page') else return this.goToSpread(this.#index - 1, this.rtl ? 'left' : 'right', 'page') } diff --git a/paginator.js b/paginator.js index 6cf729f..f91a9ea 100644 --- a/paginator.js +++ b/paginator.js @@ -1023,7 +1023,10 @@ export class Paginator extends HTMLElement { Math.max(0, this.start - (distance ?? this.size)), null, true) return true } - if (this.atStart) return + if (this.atStart) { + this.dispatchEvent(new Event('reached-start')) + return + } const page = this.page - 1 return this.#scrollToPage(page, 'page', true).then(() => page <= 0) } @@ -1034,7 +1037,10 @@ export class Paginator extends HTMLElement { Math.min(this.viewSize, distance ? this.start + distance : this.end), null, true) return true } - if (this.atEnd) return + if (this.atEnd) { + this.dispatchEvent(new Event('reached-end')) + return + } const page = this.page + 1 const pages = this.pages return this.#scrollToPage(page, 'page', true).then(() => page >= pages - 1) diff --git a/view.js b/view.js index 55c818f..5d2d1cf 100644 --- a/view.js +++ b/view.js @@ -259,6 +259,8 @@ export class View extends HTMLElement { this.renderer.setAttribute('exportparts', 'head,foot,filter') this.renderer.addEventListener('load', e => this.#onLoad(e.detail)) this.renderer.addEventListener('relocate', e => this.#onRelocate(e.detail)) + this.renderer.addEventListener('reached-start', () => this.#onReachedStart()) + this.renderer.addEventListener('reached-end', () => this.#onReachedEnd()) this.renderer.addEventListener('create-overlayer', e => e.detail.attach(this.#createOverlayer(e.detail))) this.renderer.open(book) @@ -345,6 +347,12 @@ export class View extends HTMLElement { this.#emit('load', { doc, index }) } + #onReachedStart() { + this.#emit('reached-start') + } + #onReachedEnd() { + this.#emit('reached-end') + } #handleLinks(doc, index) { const { book } = this const section = book.sections[index]