* Reads the current scroll position and updates our active * trigger states accordingly.
()
| 611 | * trigger states accordingly. |
| 612 | */ |
| 613 | syncScrollPosition() { |
| 614 | |
| 615 | const viewportHeight = this.viewportElement.offsetHeight; |
| 616 | const viewportHeightFactor = viewportHeight / this.viewportElement.scrollHeight; |
| 617 | |
| 618 | const scrollTop = this.viewportElement.scrollTop; |
| 619 | const scrollHeight = this.viewportElement.scrollHeight - viewportHeight |
| 620 | const scrollProgress = Math.max( Math.min( scrollTop / scrollHeight, 1 ), 0 ); |
| 621 | const scrollProgressMid = Math.max( Math.min( ( scrollTop + viewportHeight / 2 ) / this.viewportElement.scrollHeight, 1 ), 0 ); |
| 622 | |
| 623 | let activePage; |
| 624 | |
| 625 | this.slideTriggers.forEach( ( trigger ) => { |
| 626 | const { page } = trigger; |
| 627 | |
| 628 | const shouldPreload = scrollProgress >= trigger.range[0] - viewportHeightFactor*2 && |
| 629 | scrollProgress <= trigger.range[1] + viewportHeightFactor*2; |
| 630 | |
| 631 | // Load slides that are within the preload range |
| 632 | if( shouldPreload && !page.loaded ) { |
| 633 | page.loaded = true; |
| 634 | this.Reveal.slideContent.load( page.slideElement ); |
| 635 | } |
| 636 | else if( page.loaded ) { |
| 637 | page.loaded = false; |
| 638 | this.Reveal.slideContent.unload( page.slideElement ); |
| 639 | } |
| 640 | |
| 641 | // If we're within this trigger range, activate it |
| 642 | if( scrollProgress >= trigger.range[0] && scrollProgress <= trigger.range[1] ) { |
| 643 | this.activateTrigger( trigger ); |
| 644 | activePage = trigger.page; |
| 645 | } |
| 646 | // .. otherwise deactivate |
| 647 | else if( trigger.active ) { |
| 648 | this.deactivateTrigger( trigger ); |
| 649 | } |
| 650 | } ); |
| 651 | |
| 652 | // Each page can have its own scroll triggers, check if any of those |
| 653 | // need to be activated/deactivated |
| 654 | if( activePage ) { |
| 655 | activePage.scrollTriggers.forEach( ( trigger ) => { |
| 656 | if( scrollProgressMid >= trigger.range[0] && scrollProgressMid <= trigger.range[1] ) { |
| 657 | this.activateTrigger( trigger ); |
| 658 | } |
| 659 | else if( trigger.active ) { |
| 660 | this.deactivateTrigger( trigger ); |
| 661 | } |
| 662 | } ); |
| 663 | } |
| 664 | |
| 665 | // Update our visual progress indication |
| 666 | this.setProgressBarValue( scrollTop / ( this.viewportElement.scrollHeight - viewportHeight ) ); |
| 667 | |
| 668 | } |
| 669 | |
| 670 | /** |
no test coverage detected