mirror of
https://github.com/hakimel/reveal.js.git
synced 2025-08-19 13:02:22 +02:00
separate reader mode into individual controller, add scroll triggers for fragments
This commit is contained in:
@@ -1867,12 +1867,8 @@ $notesWidthPercent: 25%;
|
||||
/*********************************************
|
||||
* READER MODE
|
||||
*********************************************/
|
||||
html.reveal-reader {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: visible;
|
||||
|
||||
.reveal-viewport, body {
|
||||
.reveal-viewport.reveal-reader {
|
||||
& {
|
||||
margin: 0 auto !important;
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -1892,7 +1888,6 @@ html.reveal-reader {
|
||||
}
|
||||
.reveal .slides {
|
||||
position: static;
|
||||
zoom: 1 !important;
|
||||
pointer-events: initial;
|
||||
transform-origin: 50% 0;
|
||||
|
||||
|
4
dist/reveal.css
vendored
4
dist/reveal.css
vendored
File diff suppressed because one or more lines are too long
2
dist/reveal.esm.js
vendored
2
dist/reveal.esm.js
vendored
File diff suppressed because one or more lines are too long
2
dist/reveal.esm.js.map
vendored
2
dist/reveal.esm.js.map
vendored
File diff suppressed because one or more lines are too long
2
dist/reveal.js
vendored
2
dist/reveal.js
vendored
File diff suppressed because one or more lines are too long
2
dist/reveal.js.map
vendored
2
dist/reveal.js.map
vendored
File diff suppressed because one or more lines are too long
10
index.html
10
index.html
@@ -17,7 +17,15 @@
|
||||
<div class="reveal">
|
||||
<div class="slides">
|
||||
<section>Slide 1</section>
|
||||
<section>Slide 2</section>
|
||||
<section data-background="indigo">
|
||||
<h2>Slide 2</h2>
|
||||
<ul>
|
||||
<li class="fragment">Fragment one</li>
|
||||
<li class="fragment">Fragment two</li>
|
||||
<li class="fragment">Fragment three</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>Slide 3</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@@ -38,10 +38,12 @@ export default class Notes {
|
||||
*/
|
||||
update() {
|
||||
|
||||
if( this.Reveal.getConfig().showNotes && this.element && this.Reveal.getCurrentSlide() && !this.Reveal.reader.isActive() ) {
|
||||
|
||||
if( this.Reveal.getConfig().showNotes &&
|
||||
this.element && this.Reveal.getCurrentSlide() &&
|
||||
!this.Reveal.isReaderMode() &&
|
||||
!this.Reveal.isPrintMode()
|
||||
) {
|
||||
this.element.innerHTML = this.getSlideNotes() || '<span class="notes-placeholder">No notes on this slide.</span>';
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@@ -54,7 +56,11 @@ export default class Notes {
|
||||
*/
|
||||
updateVisibility() {
|
||||
|
||||
if( this.Reveal.getConfig().showNotes && this.hasNotes() && !this.Reveal.reader.isActive() ) {
|
||||
if( this.Reveal.getConfig().showNotes &&
|
||||
this.hasNotes() &&
|
||||
!this.Reveal.isReaderMode() &&
|
||||
!this.Reveal.isPrintMode()
|
||||
) {
|
||||
this.Reveal.getRevealElement().classList.add( 'show-notes' );
|
||||
}
|
||||
else {
|
||||
|
242
js/controllers/print.js
Normal file
242
js/controllers/print.js
Normal file
@@ -0,0 +1,242 @@
|
||||
import { SLIDES_SELECTOR } from '../utils/constants.js'
|
||||
import { queryAll, createStyleSheet } from '../utils/util.js'
|
||||
|
||||
/**
|
||||
* Setups up our presentation for printing/exporting to PDF.
|
||||
*/
|
||||
export default class Print {
|
||||
|
||||
constructor( Reveal ) {
|
||||
|
||||
this.Reveal = Reveal;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Configures the presentation for printing to a static
|
||||
* PDF.
|
||||
*/
|
||||
async activate() {
|
||||
|
||||
const config = this.Reveal.getConfig();
|
||||
const slides = queryAll( this.Reveal.getRevealElement(), SLIDES_SELECTOR )
|
||||
|
||||
// Compute slide numbers now, before we start duplicating slides
|
||||
const injectPageNumbers = config.slideNumber && /all|print/i.test( config.showSlideNumber );
|
||||
|
||||
const slideSize = this.Reveal.getComputedSlideSize( window.innerWidth, window.innerHeight );
|
||||
|
||||
// Dimensions of the PDF pages
|
||||
const pageWidth = Math.floor( slideSize.width * ( 1 + config.margin ) ),
|
||||
pageHeight = Math.floor( slideSize.height * ( 1 + config.margin ) );
|
||||
|
||||
// Dimensions of slides within the pages
|
||||
const slideWidth = slideSize.width,
|
||||
slideHeight = slideSize.height;
|
||||
|
||||
await new Promise( requestAnimationFrame );
|
||||
|
||||
// Let the browser know what page size we want to print
|
||||
createStyleSheet( '@page{size:'+ pageWidth +'px '+ pageHeight +'px; margin: 0px;}' );
|
||||
|
||||
// Limit the size of certain elements to the dimensions of the slide
|
||||
createStyleSheet( '.reveal section>img, .reveal section>video, .reveal section>iframe{max-width: '+ slideWidth +'px; max-height:'+ slideHeight +'px}' );
|
||||
|
||||
document.documentElement.classList.add( 'reveal-print', 'print-pdf' );
|
||||
document.body.style.width = pageWidth + 'px';
|
||||
document.body.style.height = pageHeight + 'px';
|
||||
|
||||
const viewportElement = this.Reveal.getViewportElement();
|
||||
let presentationBackground;
|
||||
if( viewportElement ) {
|
||||
const viewportStyles = window.getComputedStyle( viewportElement );
|
||||
if( viewportStyles && viewportStyles.background ) {
|
||||
presentationBackground = viewportStyles.background;
|
||||
}
|
||||
}
|
||||
|
||||
// Make sure stretch elements fit on slide
|
||||
await new Promise( requestAnimationFrame );
|
||||
this.Reveal.layoutSlideContents( slideWidth, slideHeight );
|
||||
|
||||
// Batch scrollHeight access to prevent layout thrashing
|
||||
await new Promise( requestAnimationFrame );
|
||||
|
||||
const slideScrollHeights = slides.map( slide => slide.scrollHeight );
|
||||
|
||||
const pages = [];
|
||||
const pageContainer = slides[0].parentNode;
|
||||
let slideNumber = 1;
|
||||
|
||||
// Slide and slide background layout
|
||||
slides.forEach( function( slide, index ) {
|
||||
|
||||
// Vertical stacks are not centred since their section
|
||||
// children will be
|
||||
if( slide.classList.contains( 'stack' ) === false ) {
|
||||
// Center the slide inside of the page, giving the slide some margin
|
||||
let left = ( pageWidth - slideWidth ) / 2;
|
||||
let top = ( pageHeight - slideHeight ) / 2;
|
||||
|
||||
const contentHeight = slideScrollHeights[ index ];
|
||||
let numberOfPages = Math.max( Math.ceil( contentHeight / pageHeight ), 1 );
|
||||
|
||||
// Adhere to configured pages per slide limit
|
||||
numberOfPages = Math.min( numberOfPages, config.pdfMaxPagesPerSlide );
|
||||
|
||||
// Center slides vertically
|
||||
if( numberOfPages === 1 && config.center || slide.classList.contains( 'center' ) ) {
|
||||
top = Math.max( ( pageHeight - contentHeight ) / 2, 0 );
|
||||
}
|
||||
|
||||
// Wrap the slide in a page element and hide its overflow
|
||||
// so that no page ever flows onto another
|
||||
const page = document.createElement( 'div' );
|
||||
pages.push( page );
|
||||
|
||||
page.className = 'pdf-page';
|
||||
page.style.height = ( ( pageHeight + config.pdfPageHeightOffset ) * numberOfPages ) + 'px';
|
||||
|
||||
// Copy the presentation-wide background to each individual
|
||||
// page when printing
|
||||
if( presentationBackground ) {
|
||||
page.style.background = presentationBackground;
|
||||
}
|
||||
|
||||
page.appendChild( slide );
|
||||
|
||||
// Position the slide inside of the page
|
||||
slide.style.left = left + 'px';
|
||||
slide.style.top = top + 'px';
|
||||
slide.style.width = slideWidth + 'px';
|
||||
|
||||
this.Reveal.slideContent.layout( slide );
|
||||
|
||||
if( slide.slideBackgroundElement ) {
|
||||
page.insertBefore( slide.slideBackgroundElement, slide );
|
||||
}
|
||||
|
||||
// Inject notes if `showNotes` is enabled
|
||||
if( config.showNotes ) {
|
||||
|
||||
// Are there notes for this slide?
|
||||
const notes = this.Reveal.getSlideNotes( slide );
|
||||
if( notes ) {
|
||||
|
||||
const notesSpacing = 8;
|
||||
const notesLayout = typeof config.showNotes === 'string' ? config.showNotes : 'inline';
|
||||
const notesElement = document.createElement( 'div' );
|
||||
notesElement.classList.add( 'speaker-notes' );
|
||||
notesElement.classList.add( 'speaker-notes-pdf' );
|
||||
notesElement.setAttribute( 'data-layout', notesLayout );
|
||||
notesElement.innerHTML = notes;
|
||||
|
||||
if( notesLayout === 'separate-page' ) {
|
||||
pages.push( notesElement );
|
||||
}
|
||||
else {
|
||||
notesElement.style.left = notesSpacing + 'px';
|
||||
notesElement.style.bottom = notesSpacing + 'px';
|
||||
notesElement.style.width = ( pageWidth - notesSpacing*2 ) + 'px';
|
||||
page.appendChild( notesElement );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Inject page numbers if `slideNumbers` are enabled
|
||||
if( injectPageNumbers ) {
|
||||
const numberElement = document.createElement( 'div' );
|
||||
numberElement.classList.add( 'slide-number' );
|
||||
numberElement.classList.add( 'slide-number-pdf' );
|
||||
numberElement.innerHTML = slideNumber++;
|
||||
page.appendChild( numberElement );
|
||||
}
|
||||
|
||||
// Copy page and show fragments one after another
|
||||
if( config.pdfSeparateFragments ) {
|
||||
|
||||
// Each fragment 'group' is an array containing one or more
|
||||
// fragments. Multiple fragments that appear at the same time
|
||||
// are part of the same group.
|
||||
const fragmentGroups = this.Reveal.fragments.sort( page.querySelectorAll( '.fragment' ), true );
|
||||
|
||||
let previousFragmentStep;
|
||||
|
||||
fragmentGroups.forEach( function( fragments, index ) {
|
||||
|
||||
// Remove 'current-fragment' from the previous group
|
||||
if( previousFragmentStep ) {
|
||||
previousFragmentStep.forEach( function( fragment ) {
|
||||
fragment.classList.remove( 'current-fragment' );
|
||||
} );
|
||||
}
|
||||
|
||||
// Show the fragments for the current index
|
||||
fragments.forEach( function( fragment ) {
|
||||
fragment.classList.add( 'visible', 'current-fragment' );
|
||||
}, this );
|
||||
|
||||
// Create a separate page for the current fragment state
|
||||
const clonedPage = page.cloneNode( true );
|
||||
|
||||
// Inject unique page numbers for fragments
|
||||
if( injectPageNumbers ) {
|
||||
const numberElement = clonedPage.querySelector( '.slide-number-pdf' );
|
||||
const fragmentNumber = index + 1;
|
||||
numberElement.innerHTML += '.' + fragmentNumber;
|
||||
}
|
||||
|
||||
pages.push( clonedPage );
|
||||
|
||||
previousFragmentStep = fragments;
|
||||
|
||||
}, this );
|
||||
|
||||
// Reset the first/original page so that all fragments are hidden
|
||||
fragmentGroups.forEach( function( fragments ) {
|
||||
fragments.forEach( function( fragment ) {
|
||||
fragment.classList.remove( 'visible', 'current-fragment' );
|
||||
} );
|
||||
} );
|
||||
|
||||
}
|
||||
// Show all fragments
|
||||
else {
|
||||
queryAll( page, '.fragment:not(.fade-out)' ).forEach( function( fragment ) {
|
||||
fragment.classList.add( 'visible' );
|
||||
} );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}, this );
|
||||
|
||||
await new Promise( requestAnimationFrame );
|
||||
|
||||
pages.forEach( page => pageContainer.appendChild( page ) );
|
||||
|
||||
// Re-run JS-based content layout after the slide is added to page DOM
|
||||
this.Reveal.slideContent.layout( this.Reveal.getSlidesElement() );
|
||||
|
||||
// Notify subscribers that the PDF layout is good to go
|
||||
this.Reveal.dispatchEvent({ type: 'pdf-ready' });
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks if the print mode is/should be activated.
|
||||
*/
|
||||
isActive() {
|
||||
|
||||
if( typeof this._isPrintMode === 'undefined' ) {
|
||||
this._isPrintMode = this.Reveal.getConfig().mode === 'pdf' ||
|
||||
( /print-pdf/gi ).test( window.location.search );
|
||||
}
|
||||
|
||||
return this._isPrintMode;
|
||||
|
||||
}
|
||||
|
||||
}
|
@@ -2,7 +2,8 @@ import { SLIDES_SELECTOR } from '../utils/constants.js'
|
||||
import { queryAll, createStyleSheet } from '../utils/util.js'
|
||||
|
||||
/**
|
||||
* Setups up our presentation for printing/exporting to PDF.
|
||||
* The reader mode lets you read a reveal.js presentation
|
||||
* as a linear scrollable page.
|
||||
*/
|
||||
export default class Reader {
|
||||
|
||||
@@ -12,47 +13,23 @@ export default class Reader {
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Configures the presentation for printing to a static.
|
||||
*/
|
||||
async setup() {
|
||||
async activate() {
|
||||
|
||||
const printing = this.isPrintMode();
|
||||
const slides = queryAll( this.Reveal.getRevealElement(), SLIDES_SELECTOR );
|
||||
|
||||
const config = this.Reveal.getConfig();
|
||||
const slides = queryAll( this.Reveal.getRevealElement(), SLIDES_SELECTOR )
|
||||
|
||||
// Compute slide numbers now, before we start duplicating slides
|
||||
const injectPageNumbers = config.slideNumber && /all|print/i.test( config.showSlideNumber );
|
||||
const viewportElement = this.Reveal.getViewportElement();
|
||||
|
||||
const slideSize = this.Reveal.getComputedSlideSize( window.innerWidth, window.innerHeight );
|
||||
|
||||
// Dimensions of the PDF pages
|
||||
const pageWidth = Math.floor( slideSize.width * ( 1 + config.margin ) ),
|
||||
pageHeight = Math.floor( slideSize.height * ( 1 + config.margin ) );
|
||||
|
||||
// Dimensions of slides within the pages
|
||||
const slideWidth = slideSize.width,
|
||||
slideHeight = slideSize.height;
|
||||
|
||||
await new Promise( requestAnimationFrame );
|
||||
|
||||
// Let the browser know what page size we want to print
|
||||
createStyleSheet( '@page{size:'+ pageWidth +'px '+ pageHeight +'px; margin: 0px;}' );
|
||||
viewportElement.classList.add( 'reveal-reader' );
|
||||
viewportElement.addEventListener( 'scroll', this.onScroll.bind( this ) );
|
||||
|
||||
// Limit the size of certain elements to the dimensions of the slide
|
||||
createStyleSheet( '.reveal section>img, .reveal section>video, .reveal section>iframe{max-width: '+ slideWidth +'px; max-height:'+ slideHeight +'px}' );
|
||||
|
||||
if( printing ) {
|
||||
document.documentElement.classList.add( 'reveal-print', 'print-pdf' );
|
||||
document.body.style.width = pageWidth + 'px';
|
||||
document.body.style.height = pageHeight + 'px';
|
||||
}
|
||||
else {
|
||||
document.documentElement.classList.add( 'reveal-reader' );
|
||||
}
|
||||
|
||||
const viewportElement = document.querySelector( '.reveal-viewport' );
|
||||
let presentationBackground;
|
||||
if( viewportElement ) {
|
||||
const viewportStyles = window.getComputedStyle( viewportElement );
|
||||
@@ -65,43 +42,25 @@ export default class Reader {
|
||||
await new Promise( requestAnimationFrame );
|
||||
this.Reveal.layoutSlideContents( slideWidth, slideHeight );
|
||||
|
||||
// Batch scrollHeight access to prevent layout thrashing
|
||||
await new Promise( requestAnimationFrame );
|
||||
|
||||
const slideScrollHeights = slides.map( slide => slide.scrollHeight );
|
||||
|
||||
const pages = [];
|
||||
const pageContainer = slides[0].parentNode;
|
||||
let slideNumber = 1;
|
||||
|
||||
// Slide and slide background layout
|
||||
slides.forEach( function( slide, index ) {
|
||||
slides.forEach( function( slide ) {
|
||||
|
||||
// Vertical stacks are not centred since their section
|
||||
// children will be
|
||||
if( slide.classList.contains( 'stack' ) === false ) {
|
||||
// Center the slide inside of the page, giving the slide some margin
|
||||
let left = ( pageWidth - slideWidth ) / 2;
|
||||
let top = ( pageHeight - slideHeight ) / 2;
|
||||
|
||||
const contentHeight = slideScrollHeights[ index ];
|
||||
let numberOfPages = Math.max( Math.ceil( contentHeight / pageHeight ), 1 );
|
||||
|
||||
// Adhere to configured pages per slide limit
|
||||
numberOfPages = Math.min( numberOfPages, config.pdfMaxPagesPerSlide );
|
||||
|
||||
// Center slides vertically
|
||||
if( numberOfPages === 1 && config.center || slide.classList.contains( 'center' ) ) {
|
||||
top = Math.max( ( pageHeight - contentHeight ) / 2, 0 );
|
||||
}
|
||||
|
||||
// Wrap the slide in a page element and hide its overflow
|
||||
// so that no page ever flows onto another
|
||||
const page = document.createElement( 'div' );
|
||||
pages.push( page );
|
||||
|
||||
page.className = printing ? 'pdf-page' : 'reader-page';
|
||||
page.style.height = ( ( pageHeight + config.pdfPageHeightOffset ) * numberOfPages ) + 'px';
|
||||
page.className = 'reader-page';
|
||||
page.style.width = slideWidth + 'px';
|
||||
page.style.height = slideHeight + 'px';
|
||||
|
||||
slide.style.width = slideWidth + 'px';
|
||||
|
||||
// Copy the presentation-wide background to each individual
|
||||
// page when printing
|
||||
@@ -111,119 +70,16 @@ export default class Reader {
|
||||
|
||||
page.appendChild( slide );
|
||||
|
||||
// Position the slide inside of the page
|
||||
if( printing ) {
|
||||
slide.style.left = left + 'px';
|
||||
slide.style.top = top + 'px';
|
||||
}
|
||||
|
||||
slide.style.width = slideWidth + 'px';
|
||||
|
||||
this.Reveal.slideContent.layout( slide );
|
||||
|
||||
if( slide.slideBackgroundElement ) {
|
||||
page.insertBefore( slide.slideBackgroundElement, slide );
|
||||
}
|
||||
|
||||
// Inject notes if `showNotes` is enabled
|
||||
if( config.showNotes ) {
|
||||
|
||||
// Are there notes for this slide?
|
||||
const notes = this.Reveal.getSlideNotes( slide );
|
||||
if( notes ) {
|
||||
|
||||
const notesSpacing = 8;
|
||||
const notesLayout = typeof config.showNotes === 'string' ? config.showNotes : 'inline';
|
||||
const notesElement = document.createElement( 'div' );
|
||||
notesElement.classList.add( 'speaker-notes' );
|
||||
notesElement.classList.add( 'speaker-notes-pdf' );
|
||||
notesElement.setAttribute( 'data-layout', notesLayout );
|
||||
notesElement.innerHTML = notes;
|
||||
|
||||
if( notesLayout === 'separate-page' ) {
|
||||
pages.push( notesElement );
|
||||
}
|
||||
else {
|
||||
notesElement.style.left = notesSpacing + 'px';
|
||||
notesElement.style.bottom = notesSpacing + 'px';
|
||||
notesElement.style.width = ( pageWidth - notesSpacing*2 ) + 'px';
|
||||
page.appendChild( notesElement );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Inject page numbers if `slideNumbers` are enabled
|
||||
if( injectPageNumbers ) {
|
||||
const numberElement = document.createElement( 'div' );
|
||||
numberElement.classList.add( 'slide-number' );
|
||||
numberElement.classList.add( 'slide-number-pdf' );
|
||||
numberElement.innerHTML = slideNumber++;
|
||||
page.appendChild( numberElement );
|
||||
}
|
||||
|
||||
// Copy page and show fragments one after another
|
||||
if( config.pdfSeparateFragments ) {
|
||||
|
||||
// Each fragment 'group' is an array containing one or more
|
||||
// fragments. Multiple fragments that appear at the same time
|
||||
// are part of the same group.
|
||||
const fragmentGroups = this.Reveal.fragments.sort( page.querySelectorAll( '.fragment' ), true );
|
||||
|
||||
let previousFragmentStep;
|
||||
|
||||
fragmentGroups.forEach( function( fragments, index ) {
|
||||
|
||||
// Remove 'current-fragment' from the previous group
|
||||
if( previousFragmentStep ) {
|
||||
previousFragmentStep.forEach( function( fragment ) {
|
||||
fragment.classList.remove( 'current-fragment' );
|
||||
} );
|
||||
}
|
||||
|
||||
// Show the fragments for the current index
|
||||
fragments.forEach( function( fragment ) {
|
||||
fragment.classList.add( 'visible', 'current-fragment' );
|
||||
}, this );
|
||||
|
||||
// Create a separate page for the current fragment state
|
||||
const clonedPage = page.cloneNode( true );
|
||||
|
||||
// Inject unique page numbers for fragments
|
||||
if( injectPageNumbers ) {
|
||||
const numberElement = clonedPage.querySelector( '.slide-number-pdf' );
|
||||
const fragmentNumber = index + 1;
|
||||
numberElement.innerHTML += '.' + fragmentNumber;
|
||||
}
|
||||
|
||||
pages.push( clonedPage );
|
||||
|
||||
previousFragmentStep = fragments;
|
||||
|
||||
}, this );
|
||||
|
||||
// Reset the first/original page so that all fragments are hidden
|
||||
fragmentGroups.forEach( function( fragments ) {
|
||||
fragments.forEach( function( fragment ) {
|
||||
fragment.classList.remove( 'visible', 'current-fragment' );
|
||||
} );
|
||||
} );
|
||||
|
||||
}
|
||||
// Show all fragments
|
||||
else {
|
||||
queryAll( page, '.fragment:not(.fade-out)' ).forEach( function( fragment ) {
|
||||
fragment.classList.add( 'visible' );
|
||||
} );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}, this );
|
||||
|
||||
// Remove leftover stacks
|
||||
queryAll( pageContainer, '.reveal .stack' ).forEach( stack => stack.remove() );
|
||||
queryAll( this.Reveal.getRevealElement(), '.stack' ).forEach( stack => stack.remove() );
|
||||
|
||||
await new Promise( requestAnimationFrame );
|
||||
|
||||
@@ -232,31 +88,14 @@ export default class Reader {
|
||||
// Re-run JS-based content layout after the slide is added to page DOM
|
||||
this.Reveal.slideContent.layout( this.Reveal.getSlidesElement() );
|
||||
|
||||
if( printing ) {
|
||||
// Notify subscribers that the PDF layout is good to go
|
||||
this.Reveal.dispatchEvent({ type: 'pdf-ready' });
|
||||
}
|
||||
this.Reveal.layout();
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks if reveal.js was initialized in printing mode.
|
||||
* Checks if the reader mode is/should be activated.
|
||||
*/
|
||||
isPrintMode() {
|
||||
|
||||
if( typeof this._isPrintMode === 'undefined' ) {
|
||||
this._isPrintMode = this.Reveal.getConfig().mode === 'pdf' ||
|
||||
( /print-pdf/gi ).test( window.location.search );
|
||||
}
|
||||
|
||||
return this._isPrintMode;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks if reveal.js was initialized in reader mode.
|
||||
*/
|
||||
isReaderMode() {
|
||||
isActive() {
|
||||
|
||||
if( typeof this._isReaderMode === 'undefined' ) {
|
||||
this._isReaderMode = this.Reveal.getConfig().mode === 'reader';
|
||||
@@ -266,9 +105,108 @@ export default class Reader {
|
||||
|
||||
}
|
||||
|
||||
isActive() {
|
||||
generatePageMap() {
|
||||
|
||||
return this.isPrintMode() || this.isReaderMode();
|
||||
const slideSize = this.Reveal.getComputedSlideSize( window.innerWidth, window.innerHeight );
|
||||
const scale = this.Reveal.getScale();
|
||||
|
||||
// The height that needs to be scrolled between scroll triggers
|
||||
const scrollTriggerHeight = slideSize.height * scale / 2;
|
||||
|
||||
this.pageElements = Array.from( this.Reveal.getRevealElement().querySelectorAll( '.reader-page' ) );
|
||||
|
||||
this.pageMap = this.pageElements.map( pageElement => {
|
||||
const page = {
|
||||
pageElement: pageElement,
|
||||
slideElement: pageElement.querySelector( 'section' ),
|
||||
top: pageElement.offsetTop * scale,
|
||||
pageHeight: pageElement.offsetHeight * scale,
|
||||
scrollTriggers: []
|
||||
};
|
||||
|
||||
page.fragments = this.Reveal.fragments.sort( pageElement.querySelectorAll( '.fragment:not(.disabled)' ) );
|
||||
|
||||
// Each fragment 'group' is an array containing one or more
|
||||
// fragments. Multiple fragments that appear at the same time
|
||||
// are part of the same group.
|
||||
page.fragmentGroups = this.Reveal.fragments.sort( pageElement.querySelectorAll( '.fragment' ), true );
|
||||
|
||||
// The amount of empty scrollable space that has been append
|
||||
page.scrollHeight = scrollTriggerHeight * Math.max( page.fragmentGroups.length - 1, 0 );
|
||||
|
||||
// The total height including scrollable space
|
||||
page.totalHeight = page.pageHeight + page.scrollHeight;
|
||||
|
||||
page.bottom = page.top + page.totalHeight;
|
||||
|
||||
// Pad the page height to reserve scrollable height
|
||||
page.pageElement.style.marginBottom = page.scrollHeight + 'px';
|
||||
|
||||
// Create scroll triggers that show/hide fragments
|
||||
if( page.fragmentGroups.length ) {
|
||||
const segmentSize = 1 / ( page.fragmentGroups.length + 1 );
|
||||
page.scrollTriggers.push(
|
||||
// Trigger for the initial state with no fragments visible
|
||||
{ range: [ 0, segmentSize ], fragmentIndex: -1 },
|
||||
|
||||
// Triggers for each fragment group
|
||||
...page.fragmentGroups.map( ( fragments, i ) => ({
|
||||
range: [ segmentSize * ( i + 1 ), segmentSize * ( i + 2 ) ],
|
||||
fragmentIndex: i
|
||||
}))
|
||||
);
|
||||
}
|
||||
|
||||
return page;
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
update() {
|
||||
|
||||
this.generatePageMap();
|
||||
this.onScroll();
|
||||
|
||||
}
|
||||
|
||||
onScroll() {
|
||||
|
||||
const viewportElement = this.Reveal.getViewportElement();
|
||||
|
||||
const scrollTop = viewportElement.scrollTop;
|
||||
const scale = this.Reveal.getScale();
|
||||
|
||||
this.pageMap.forEach( ( page, i ) => {
|
||||
const isPartiallyVisible = scrollTop >= page.top && scrollTop < page.top + page.bottom;
|
||||
|
||||
if( isPartiallyVisible ) {
|
||||
// Load the slide content when it becomes visible
|
||||
if( !page.visible ) {
|
||||
page.visible = true;
|
||||
this.Reveal.slideContent.load( page.slideElement );
|
||||
this.Reveal.slideContent.startEmbeddedContent( page.slideElement );
|
||||
}
|
||||
|
||||
if( page.totalHeight > page.pageHeight ) {
|
||||
const scrollProgress = Math.min( ( scrollTop - page.top ) / page.scrollHeight, 1 );
|
||||
|
||||
// Fix the slide to the top of the viewport while we're in its
|
||||
// scrollable region
|
||||
page.pageElement.style.transform = `translateY( ${ scrollProgress * page.scrollHeight / scale }px )`;
|
||||
|
||||
page.scrollTriggers.forEach( trigger => {
|
||||
if( scrollProgress >= trigger.range[0] && scrollProgress < trigger.range[1] ) {
|
||||
this.Reveal.fragments.update( trigger.fragmentIndex, page.fragments );
|
||||
}
|
||||
} );
|
||||
}
|
||||
}
|
||||
else if( page.visible ) {
|
||||
page.visible = false;
|
||||
this.Reveal.slideContent.unload( page.slideElement );
|
||||
this.Reveal.slideContent.stopEmbeddedContent( page.slideElement );
|
||||
}
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
|
@@ -26,7 +26,7 @@ export default class SlideContent {
|
||||
shouldPreload( element ) {
|
||||
|
||||
// Prefer an explicit global preload setting
|
||||
let preload = this.Reveal.getConfig().preloadIframes;
|
||||
let preload = this.Reveal.getConfig().preloadIframes || this.Reveal.isReaderMode();
|
||||
|
||||
// If no global setting is available, fall back on the element's
|
||||
// own preload setting
|
||||
|
33
js/reveal.js
33
js/reveal.js
@@ -12,6 +12,7 @@ import Progress from './controllers/progress.js'
|
||||
import Pointer from './controllers/pointer.js'
|
||||
import Plugins from './controllers/plugins.js'
|
||||
import Reader from './controllers/reader.js'
|
||||
import Print from './controllers/print.js'
|
||||
import Touch from './controllers/touch.js'
|
||||
import Focus from './controllers/focus.js'
|
||||
import Notes from './controllers/notes.js'
|
||||
@@ -114,6 +115,7 @@ export default function( revealElement, options ) {
|
||||
pointer = new Pointer( Reveal ),
|
||||
plugins = new Plugins( Reveal ),
|
||||
reader = new Reader( Reveal ),
|
||||
print = new Print( Reveal ),
|
||||
focus = new Focus( Reveal ),
|
||||
touch = new Touch( Reveal ),
|
||||
notes = new Notes( Reveal );
|
||||
@@ -225,9 +227,12 @@ export default function( revealElement, options ) {
|
||||
});
|
||||
}, 1 );
|
||||
|
||||
const isPrintMode = print.isActive();
|
||||
const isReaderMode = reader.isActive();
|
||||
|
||||
// Special setup and config is required when initializing a deck
|
||||
// to be read or printed linearly
|
||||
if( reader.isPrintMode() || reader.isReaderMode() ) {
|
||||
if( isPrintMode || isReaderMode ) {
|
||||
|
||||
removeEventListeners();
|
||||
|
||||
@@ -236,14 +241,23 @@ export default function( revealElement, options ) {
|
||||
// Avoid content flickering during layout
|
||||
revealElement.style.visibility = 'hidden';
|
||||
|
||||
const activate = () => {
|
||||
if( isPrintMode ) {
|
||||
print.activate();
|
||||
}
|
||||
else {
|
||||
reader.activate();
|
||||
}
|
||||
};
|
||||
|
||||
// The document needs to have loaded for the PDF layout
|
||||
// measurements to be accurate
|
||||
if( document.readyState === 'complete' ) {
|
||||
reader.setup().then( () => layout() );
|
||||
activate();
|
||||
}
|
||||
else {
|
||||
window.addEventListener( 'load', () => {
|
||||
reader.setup().then( () => layout() );
|
||||
activate();
|
||||
} );
|
||||
}
|
||||
}
|
||||
@@ -868,7 +882,7 @@ export default function( revealElement, options ) {
|
||||
*/
|
||||
function layout() {
|
||||
|
||||
if( dom.wrapper && !reader.isPrintMode() ) {
|
||||
if( dom.wrapper && !print.isActive() ) {
|
||||
|
||||
if( !config.disableLayout ) {
|
||||
|
||||
@@ -969,6 +983,7 @@ export default function( revealElement, options ) {
|
||||
|
||||
progress.update();
|
||||
backgrounds.updateParallax();
|
||||
reader.update();
|
||||
|
||||
if( overview.isActive() ) {
|
||||
overview.update();
|
||||
@@ -1022,6 +1037,7 @@ export default function( revealElement, options ) {
|
||||
* @param {number} [presentationHeight=dom.wrapper.offsetHeight]
|
||||
*/
|
||||
function getComputedSlideSize( presentationWidth, presentationHeight ) {
|
||||
|
||||
let width = config.width;
|
||||
let height = config.height;
|
||||
|
||||
@@ -1613,7 +1629,7 @@ export default function( revealElement, options ) {
|
||||
let slides = Util.queryAll( dom.wrapper, selector ),
|
||||
slidesLength = slides.length;
|
||||
|
||||
let printMode = reader.isActive();
|
||||
let printMode = reader.isActive() || print.isActive();
|
||||
let loopedForwards = false;
|
||||
let loopedBackwards = false;
|
||||
|
||||
@@ -1773,7 +1789,7 @@ export default function( revealElement, options ) {
|
||||
}
|
||||
|
||||
// All slides need to be visible when exporting to PDF
|
||||
if( reader.isPrintMode() || reader.isReaderMode() ) {
|
||||
if( print.isActive() ) {
|
||||
viewDistance = Number.MAX_VALUE;
|
||||
}
|
||||
|
||||
@@ -2712,8 +2728,9 @@ export default function( revealElement, options ) {
|
||||
isSpeakerNotes: notes.isSpeakerNotesWindow.bind( notes ),
|
||||
isOverview: overview.isActive.bind( overview ),
|
||||
isFocused: focus.isFocused.bind( focus ),
|
||||
isReaderMode: reader.isReaderMode.bind( reader ),
|
||||
isPrintingPDF: reader.isPrintMode.bind( reader ),
|
||||
|
||||
isReaderMode: reader.isActive.bind( reader ),
|
||||
isPrintMode: print.isActive.bind( print ),
|
||||
|
||||
// Checks if reveal.js has been loaded and is ready for use
|
||||
isReady: () => ready,
|
||||
|
@@ -2,4 +2,4 @@ var e={exports:{}};function t(e){return e instanceof Map?e.clear=e.delete=e.set=
|
||||
/*!
|
||||
* reveal.js plugin that adds syntax highlight support.
|
||||
*/
|
||||
const Si={id:"highlight",HIGHLIGHT_STEP_DELIMITER:"|",HIGHLIGHT_LINE_DELIMITER:",",HIGHLIGHT_LINE_RANGE_DELIMITER:"-",hljs:Ei,init:function(e){let t=e.getConfig().highlight||{};t.highlightOnLoad="boolean"!=typeof t.highlightOnLoad||t.highlightOnLoad,t.escapeHTML="boolean"!=typeof t.escapeHTML||t.escapeHTML,Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{e.parentNode.classList.add("code-wrapper");let a=e.querySelector('script[type="text/template"]');a&&(e.textContent=a.innerHTML),e.hasAttribute("data-trim")&&"function"==typeof e.innerHTML.trim&&(e.innerHTML=function(e){function t(e){return e.replace(/^[\s\uFEFF\xA0]+/g,"")}function a(e){for(var t=e.split("\n"),a=0;a<t.length&&""===t[a].trim();a++)t.splice(a--,1);for(a=t.length-1;a>=0&&""===t[a].trim();a--)t.splice(a,1);return t.join("\n")}return function(e){var n=a(e.innerHTML).split("\n"),r=n.reduce((function(e,a){return a.length>0&&t(a).length>0&&e>a.length-t(a).length?a.length-t(a).length:e}),Number.POSITIVE_INFINITY);return n.map((function(e,t){return e.slice(r)})).join("\n")}(e)}(e)),t.escapeHTML&&!e.hasAttribute("data-noescape")&&(e.innerHTML=e.innerHTML.replace(/</g,"<").replace(/>/g,">")),e.addEventListener("focusout",(function(e){Ei.highlightElement(e.currentTarget)}),!1)})),"function"==typeof t.beforeHighlight&&t.beforeHighlight(Ei),t.highlightOnLoad&&Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{Si.highlightBlock(e)})),e.on("pdf-ready",(function(){[].slice.call(e.getRevealElement().querySelectorAll("pre code[data-line-numbers].current-fragment")).forEach((function(e){Si.scrollHighlightedLineIntoView(e,{},!0)}))}))},highlightBlock:function(e){if(Ei.highlightElement(e),0!==e.innerHTML.trim().length&&e.hasAttribute("data-line-numbers")){Ei.lineNumbersBlock(e,{singleLine:!0});var t={currentBlock:e},a=Si.deserializeHighlightSteps(e.getAttribute("data-line-numbers"));if(a.length>1){var n=parseInt(e.getAttribute("data-fragment-index"),10);("number"!=typeof n||isNaN(n))&&(n=null),a.slice(1).forEach((function(a){var r=e.cloneNode(!0);r.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a])),r.classList.add("fragment"),e.parentNode.appendChild(r),Si.highlightLines(r),"number"==typeof n?(r.setAttribute("data-fragment-index",n),n+=1):r.removeAttribute("data-fragment-index"),r.addEventListener("visible",Si.scrollHighlightedLineIntoView.bind(Si,r,t)),r.addEventListener("hidden",Si.scrollHighlightedLineIntoView.bind(Si,r.previousSibling,t))})),e.removeAttribute("data-fragment-index"),e.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a[0]]))}var r="function"==typeof e.closest?e.closest("section:not(.stack)"):null;if(r){var i=function(){Si.scrollHighlightedLineIntoView(e,t,!0),r.removeEventListener("visible",i)};r.addEventListener("visible",i)}Si.highlightLines(e)}},scrollHighlightedLineIntoView:function(e,t,a){cancelAnimationFrame(t.animationFrameID),t.currentBlock&&(e.scrollTop=t.currentBlock.scrollTop),t.currentBlock=e;var n=this.getHighlightedLineBounds(e),r=e.offsetHeight,i=getComputedStyle(e);r-=parseInt(i.paddingTop)+parseInt(i.paddingBottom);var o=e.scrollTop,s=n.top+(Math.min(n.bottom-n.top,r)-r)/2;console.log(o,s);var l=e.querySelector(".hljs-ln");if(l&&(s+=l.offsetTop-parseInt(i.paddingTop)),s=Math.max(Math.min(s,e.scrollHeight-r),0),!0===a||o===s)e.scrollTop=s;else{if(e.scrollHeight<=r)return;var c=0,_=function(){c=Math.min(c+.02,1),e.scrollTop=o+(s-o)*Si.easeInOutQuart(c),c<1&&(t.animationFrameID=requestAnimationFrame(_))};_()}},easeInOutQuart:function(e){return e<.5?8*e*e*e*e:1-8*--e*e*e*e},getHighlightedLineBounds:function(e){var t=e.querySelectorAll(".highlight-line");if(0===t.length)return{top:0,bottom:0};var a=t[0],n=t[t.length-1];return{top:a.offsetTop,bottom:n.offsetTop+n.offsetHeight}},highlightLines:function(e,t){var a=Si.deserializeHighlightSteps(t||e.getAttribute("data-line-numbers"));a.length&&a[0].forEach((function(t){var a=[];"number"==typeof t.end?a=[].slice.call(e.querySelectorAll("table tr:nth-child(n+"+t.start+"):nth-child(-n+"+t.end+")")):"number"==typeof t.start&&(a=[].slice.call(e.querySelectorAll("table tr:nth-child("+t.start+")"))),a.length&&(a.forEach((function(e){e.classList.add("highlight-line")})),e.classList.add("has-highlights"))}))},deserializeHighlightSteps:function(e){return(e=(e=e.replace(/\s/g,"")).split(Si.HIGHLIGHT_STEP_DELIMITER)).map((function(e){return e.split(Si.HIGHLIGHT_LINE_DELIMITER).map((function(e){if(/^[\d-]+$/.test(e)){e=e.split(Si.HIGHLIGHT_LINE_RANGE_DELIMITER);var t=parseInt(e[0],10),a=parseInt(e[1],10);return isNaN(a)?{start:t}:{start:t,end:a}}return{}}))}))},serializeHighlightSteps:function(e){return e.map((function(e){return e.map((function(e){return"number"==typeof e.end?e.start+Si.HIGHLIGHT_LINE_RANGE_DELIMITER+e.end:"number"==typeof e.start?e.start:""})).join(Si.HIGHLIGHT_LINE_DELIMITER)})).join(Si.HIGHLIGHT_STEP_DELIMITER)}};export default()=>Si;
|
||||
const Si={id:"highlight",HIGHLIGHT_STEP_DELIMITER:"|",HIGHLIGHT_LINE_DELIMITER:",",HIGHLIGHT_LINE_RANGE_DELIMITER:"-",hljs:Ei,init:function(e){let t=e.getConfig().highlight||{};t.highlightOnLoad="boolean"!=typeof t.highlightOnLoad||t.highlightOnLoad,t.escapeHTML="boolean"!=typeof t.escapeHTML||t.escapeHTML,Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{e.parentNode.classList.add("code-wrapper");let a=e.querySelector('script[type="text/template"]');a&&(e.textContent=a.innerHTML),e.hasAttribute("data-trim")&&"function"==typeof e.innerHTML.trim&&(e.innerHTML=function(e){function t(e){return e.replace(/^[\s\uFEFF\xA0]+/g,"")}function a(e){for(var t=e.split("\n"),a=0;a<t.length&&""===t[a].trim();a++)t.splice(a--,1);for(a=t.length-1;a>=0&&""===t[a].trim();a--)t.splice(a,1);return t.join("\n")}return function(e){var n=a(e.innerHTML).split("\n"),r=n.reduce((function(e,a){return a.length>0&&t(a).length>0&&e>a.length-t(a).length?a.length-t(a).length:e}),Number.POSITIVE_INFINITY);return n.map((function(e,t){return e.slice(r)})).join("\n")}(e)}(e)),t.escapeHTML&&!e.hasAttribute("data-noescape")&&(e.innerHTML=e.innerHTML.replace(/</g,"<").replace(/>/g,">")),e.addEventListener("focusout",(function(e){Ei.highlightElement(e.currentTarget)}),!1)})),"function"==typeof t.beforeHighlight&&t.beforeHighlight(Ei),t.highlightOnLoad&&Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{Si.highlightBlock(e)})),e.on("pdf-ready",(function(){[].slice.call(e.getRevealElement().querySelectorAll("pre code[data-line-numbers].current-fragment")).forEach((function(e){Si.scrollHighlightedLineIntoView(e,{},!0)}))}))},highlightBlock:function(e){if(Ei.highlightElement(e),0!==e.innerHTML.trim().length&&e.hasAttribute("data-line-numbers")){Ei.lineNumbersBlock(e,{singleLine:!0});var t={currentBlock:e},a=Si.deserializeHighlightSteps(e.getAttribute("data-line-numbers"));if(a.length>1){var n=parseInt(e.getAttribute("data-fragment-index"),10);("number"!=typeof n||isNaN(n))&&(n=null),a.slice(1).forEach((function(a){var r=e.cloneNode(!0);r.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a])),r.classList.add("fragment"),e.parentNode.appendChild(r),Si.highlightLines(r),"number"==typeof n?(r.setAttribute("data-fragment-index",n),n+=1):r.removeAttribute("data-fragment-index"),r.addEventListener("visible",Si.scrollHighlightedLineIntoView.bind(Si,r,t)),r.addEventListener("hidden",Si.scrollHighlightedLineIntoView.bind(Si,r.previousSibling,t))})),e.removeAttribute("data-fragment-index"),e.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a[0]]))}var r="function"==typeof e.closest?e.closest("section:not(.stack)"):null;if(r){var i=function(){Si.scrollHighlightedLineIntoView(e,t,!0),r.removeEventListener("visible",i)};r.addEventListener("visible",i)}Si.highlightLines(e)}},scrollHighlightedLineIntoView:function(e,t,a){cancelAnimationFrame(t.animationFrameID),t.currentBlock&&(e.scrollTop=t.currentBlock.scrollTop),t.currentBlock=e;var n=this.getHighlightedLineBounds(e),r=e.offsetHeight,i=getComputedStyle(e);r-=parseInt(i.paddingTop)+parseInt(i.paddingBottom);var o=e.scrollTop,s=n.top+(Math.min(n.bottom-n.top,r)-r)/2,l=e.querySelector(".hljs-ln");if(l&&(s+=l.offsetTop-parseInt(i.paddingTop)),s=Math.max(Math.min(s,e.scrollHeight-r),0),!0===a||o===s)e.scrollTop=s;else{if(e.scrollHeight<=r)return;var c=0,_=function(){c=Math.min(c+.02,1),e.scrollTop=o+(s-o)*Si.easeInOutQuart(c),c<1&&(t.animationFrameID=requestAnimationFrame(_))};_()}},easeInOutQuart:function(e){return e<.5?8*e*e*e*e:1-8*--e*e*e*e},getHighlightedLineBounds:function(e){var t=e.querySelectorAll(".highlight-line");if(0===t.length)return{top:0,bottom:0};var a=t[0],n=t[t.length-1];return{top:a.offsetTop,bottom:n.offsetTop+n.offsetHeight}},highlightLines:function(e,t){var a=Si.deserializeHighlightSteps(t||e.getAttribute("data-line-numbers"));a.length&&a[0].forEach((function(t){var a=[];"number"==typeof t.end?a=[].slice.call(e.querySelectorAll("table tr:nth-child(n+"+t.start+"):nth-child(-n+"+t.end+")")):"number"==typeof t.start&&(a=[].slice.call(e.querySelectorAll("table tr:nth-child("+t.start+")"))),a.length&&(a.forEach((function(e){e.classList.add("highlight-line")})),e.classList.add("has-highlights"))}))},deserializeHighlightSteps:function(e){return(e=(e=e.replace(/\s/g,"")).split(Si.HIGHLIGHT_STEP_DELIMITER)).map((function(e){return e.split(Si.HIGHLIGHT_LINE_DELIMITER).map((function(e){if(/^[\d-]+$/.test(e)){e=e.split(Si.HIGHLIGHT_LINE_RANGE_DELIMITER);var t=parseInt(e[0],10),a=parseInt(e[1],10);return isNaN(a)?{start:t}:{start:t,end:a}}return{}}))}))},serializeHighlightSteps:function(e){return e.map((function(e){return e.map((function(e){return"number"==typeof e.end?e.start+Si.HIGHLIGHT_LINE_RANGE_DELIMITER+e.end:"number"==typeof e.start?e.start:""})).join(Si.HIGHLIGHT_LINE_DELIMITER)})).join(Si.HIGHLIGHT_STEP_DELIMITER)}};export default()=>Si;
|
||||
|
@@ -2,4 +2,4 @@
|
||||
/*!
|
||||
* reveal.js plugin that adds syntax highlight support.
|
||||
*/
|
||||
const Si={id:"highlight",HIGHLIGHT_STEP_DELIMITER:"|",HIGHLIGHT_LINE_DELIMITER:",",HIGHLIGHT_LINE_RANGE_DELIMITER:"-",hljs:Ei,init:function(e){let t=e.getConfig().highlight||{};t.highlightOnLoad="boolean"!=typeof t.highlightOnLoad||t.highlightOnLoad,t.escapeHTML="boolean"!=typeof t.escapeHTML||t.escapeHTML,Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{e.parentNode.classList.add("code-wrapper");let a=e.querySelector('script[type="text/template"]');a&&(e.textContent=a.innerHTML),e.hasAttribute("data-trim")&&"function"==typeof e.innerHTML.trim&&(e.innerHTML=function(e){function t(e){return e.replace(/^[\s\uFEFF\xA0]+/g,"")}function a(e){for(var t=e.split("\n"),a=0;a<t.length&&""===t[a].trim();a++)t.splice(a--,1);for(a=t.length-1;a>=0&&""===t[a].trim();a--)t.splice(a,1);return t.join("\n")}return function(e){var n=a(e.innerHTML).split("\n"),r=n.reduce((function(e,a){return a.length>0&&t(a).length>0&&e>a.length-t(a).length?a.length-t(a).length:e}),Number.POSITIVE_INFINITY);return n.map((function(e,t){return e.slice(r)})).join("\n")}(e)}(e)),t.escapeHTML&&!e.hasAttribute("data-noescape")&&(e.innerHTML=e.innerHTML.replace(/</g,"<").replace(/>/g,">")),e.addEventListener("focusout",(function(e){Ei.highlightElement(e.currentTarget)}),!1)})),"function"==typeof t.beforeHighlight&&t.beforeHighlight(Ei),t.highlightOnLoad&&Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{Si.highlightBlock(e)})),e.on("pdf-ready",(function(){[].slice.call(e.getRevealElement().querySelectorAll("pre code[data-line-numbers].current-fragment")).forEach((function(e){Si.scrollHighlightedLineIntoView(e,{},!0)}))}))},highlightBlock:function(e){if(Ei.highlightElement(e),0!==e.innerHTML.trim().length&&e.hasAttribute("data-line-numbers")){Ei.lineNumbersBlock(e,{singleLine:!0});var t={currentBlock:e},a=Si.deserializeHighlightSteps(e.getAttribute("data-line-numbers"));if(a.length>1){var n=parseInt(e.getAttribute("data-fragment-index"),10);("number"!=typeof n||isNaN(n))&&(n=null),a.slice(1).forEach((function(a){var r=e.cloneNode(!0);r.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a])),r.classList.add("fragment"),e.parentNode.appendChild(r),Si.highlightLines(r),"number"==typeof n?(r.setAttribute("data-fragment-index",n),n+=1):r.removeAttribute("data-fragment-index"),r.addEventListener("visible",Si.scrollHighlightedLineIntoView.bind(Si,r,t)),r.addEventListener("hidden",Si.scrollHighlightedLineIntoView.bind(Si,r.previousSibling,t))})),e.removeAttribute("data-fragment-index"),e.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a[0]]))}var r="function"==typeof e.closest?e.closest("section:not(.stack)"):null;if(r){var i=function(){Si.scrollHighlightedLineIntoView(e,t,!0),r.removeEventListener("visible",i)};r.addEventListener("visible",i)}Si.highlightLines(e)}},scrollHighlightedLineIntoView:function(e,t,a){cancelAnimationFrame(t.animationFrameID),t.currentBlock&&(e.scrollTop=t.currentBlock.scrollTop),t.currentBlock=e;var n=this.getHighlightedLineBounds(e),r=e.offsetHeight,i=getComputedStyle(e);r-=parseInt(i.paddingTop)+parseInt(i.paddingBottom);var o=e.scrollTop,s=n.top+(Math.min(n.bottom-n.top,r)-r)/2;console.log(o,s);var l=e.querySelector(".hljs-ln");if(l&&(s+=l.offsetTop-parseInt(i.paddingTop)),s=Math.max(Math.min(s,e.scrollHeight-r),0),!0===a||o===s)e.scrollTop=s;else{if(e.scrollHeight<=r)return;var c=0,_=function(){c=Math.min(c+.02,1),e.scrollTop=o+(s-o)*Si.easeInOutQuart(c),c<1&&(t.animationFrameID=requestAnimationFrame(_))};_()}},easeInOutQuart:function(e){return e<.5?8*e*e*e*e:1-8*--e*e*e*e},getHighlightedLineBounds:function(e){var t=e.querySelectorAll(".highlight-line");if(0===t.length)return{top:0,bottom:0};var a=t[0],n=t[t.length-1];return{top:a.offsetTop,bottom:n.offsetTop+n.offsetHeight}},highlightLines:function(e,t){var a=Si.deserializeHighlightSteps(t||e.getAttribute("data-line-numbers"));a.length&&a[0].forEach((function(t){var a=[];"number"==typeof t.end?a=[].slice.call(e.querySelectorAll("table tr:nth-child(n+"+t.start+"):nth-child(-n+"+t.end+")")):"number"==typeof t.start&&(a=[].slice.call(e.querySelectorAll("table tr:nth-child("+t.start+")"))),a.length&&(a.forEach((function(e){e.classList.add("highlight-line")})),e.classList.add("has-highlights"))}))},deserializeHighlightSteps:function(e){return(e=(e=e.replace(/\s/g,"")).split(Si.HIGHLIGHT_STEP_DELIMITER)).map((function(e){return e.split(Si.HIGHLIGHT_LINE_DELIMITER).map((function(e){if(/^[\d-]+$/.test(e)){e=e.split(Si.HIGHLIGHT_LINE_RANGE_DELIMITER);var t=parseInt(e[0],10),a=parseInt(e[1],10);return isNaN(a)?{start:t}:{start:t,end:a}}return{}}))}))},serializeHighlightSteps:function(e){return e.map((function(e){return e.map((function(e){return"number"==typeof e.end?e.start+Si.HIGHLIGHT_LINE_RANGE_DELIMITER+e.end:"number"==typeof e.start?e.start:""})).join(Si.HIGHLIGHT_LINE_DELIMITER)})).join(Si.HIGHLIGHT_STEP_DELIMITER)}};return()=>Si}));
|
||||
const Si={id:"highlight",HIGHLIGHT_STEP_DELIMITER:"|",HIGHLIGHT_LINE_DELIMITER:",",HIGHLIGHT_LINE_RANGE_DELIMITER:"-",hljs:Ei,init:function(e){let t=e.getConfig().highlight||{};t.highlightOnLoad="boolean"!=typeof t.highlightOnLoad||t.highlightOnLoad,t.escapeHTML="boolean"!=typeof t.escapeHTML||t.escapeHTML,Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{e.parentNode.classList.add("code-wrapper");let a=e.querySelector('script[type="text/template"]');a&&(e.textContent=a.innerHTML),e.hasAttribute("data-trim")&&"function"==typeof e.innerHTML.trim&&(e.innerHTML=function(e){function t(e){return e.replace(/^[\s\uFEFF\xA0]+/g,"")}function a(e){for(var t=e.split("\n"),a=0;a<t.length&&""===t[a].trim();a++)t.splice(a--,1);for(a=t.length-1;a>=0&&""===t[a].trim();a--)t.splice(a,1);return t.join("\n")}return function(e){var n=a(e.innerHTML).split("\n"),r=n.reduce((function(e,a){return a.length>0&&t(a).length>0&&e>a.length-t(a).length?a.length-t(a).length:e}),Number.POSITIVE_INFINITY);return n.map((function(e,t){return e.slice(r)})).join("\n")}(e)}(e)),t.escapeHTML&&!e.hasAttribute("data-noescape")&&(e.innerHTML=e.innerHTML.replace(/</g,"<").replace(/>/g,">")),e.addEventListener("focusout",(function(e){Ei.highlightElement(e.currentTarget)}),!1)})),"function"==typeof t.beforeHighlight&&t.beforeHighlight(Ei),t.highlightOnLoad&&Array.from(e.getRevealElement().querySelectorAll("pre code")).forEach((e=>{Si.highlightBlock(e)})),e.on("pdf-ready",(function(){[].slice.call(e.getRevealElement().querySelectorAll("pre code[data-line-numbers].current-fragment")).forEach((function(e){Si.scrollHighlightedLineIntoView(e,{},!0)}))}))},highlightBlock:function(e){if(Ei.highlightElement(e),0!==e.innerHTML.trim().length&&e.hasAttribute("data-line-numbers")){Ei.lineNumbersBlock(e,{singleLine:!0});var t={currentBlock:e},a=Si.deserializeHighlightSteps(e.getAttribute("data-line-numbers"));if(a.length>1){var n=parseInt(e.getAttribute("data-fragment-index"),10);("number"!=typeof n||isNaN(n))&&(n=null),a.slice(1).forEach((function(a){var r=e.cloneNode(!0);r.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a])),r.classList.add("fragment"),e.parentNode.appendChild(r),Si.highlightLines(r),"number"==typeof n?(r.setAttribute("data-fragment-index",n),n+=1):r.removeAttribute("data-fragment-index"),r.addEventListener("visible",Si.scrollHighlightedLineIntoView.bind(Si,r,t)),r.addEventListener("hidden",Si.scrollHighlightedLineIntoView.bind(Si,r.previousSibling,t))})),e.removeAttribute("data-fragment-index"),e.setAttribute("data-line-numbers",Si.serializeHighlightSteps([a[0]]))}var r="function"==typeof e.closest?e.closest("section:not(.stack)"):null;if(r){var i=function(){Si.scrollHighlightedLineIntoView(e,t,!0),r.removeEventListener("visible",i)};r.addEventListener("visible",i)}Si.highlightLines(e)}},scrollHighlightedLineIntoView:function(e,t,a){cancelAnimationFrame(t.animationFrameID),t.currentBlock&&(e.scrollTop=t.currentBlock.scrollTop),t.currentBlock=e;var n=this.getHighlightedLineBounds(e),r=e.offsetHeight,i=getComputedStyle(e);r-=parseInt(i.paddingTop)+parseInt(i.paddingBottom);var o=e.scrollTop,s=n.top+(Math.min(n.bottom-n.top,r)-r)/2,l=e.querySelector(".hljs-ln");if(l&&(s+=l.offsetTop-parseInt(i.paddingTop)),s=Math.max(Math.min(s,e.scrollHeight-r),0),!0===a||o===s)e.scrollTop=s;else{if(e.scrollHeight<=r)return;var c=0,_=function(){c=Math.min(c+.02,1),e.scrollTop=o+(s-o)*Si.easeInOutQuart(c),c<1&&(t.animationFrameID=requestAnimationFrame(_))};_()}},easeInOutQuart:function(e){return e<.5?8*e*e*e*e:1-8*--e*e*e*e},getHighlightedLineBounds:function(e){var t=e.querySelectorAll(".highlight-line");if(0===t.length)return{top:0,bottom:0};var a=t[0],n=t[t.length-1];return{top:a.offsetTop,bottom:n.offsetTop+n.offsetHeight}},highlightLines:function(e,t){var a=Si.deserializeHighlightSteps(t||e.getAttribute("data-line-numbers"));a.length&&a[0].forEach((function(t){var a=[];"number"==typeof t.end?a=[].slice.call(e.querySelectorAll("table tr:nth-child(n+"+t.start+"):nth-child(-n+"+t.end+")")):"number"==typeof t.start&&(a=[].slice.call(e.querySelectorAll("table tr:nth-child("+t.start+")"))),a.length&&(a.forEach((function(e){e.classList.add("highlight-line")})),e.classList.add("has-highlights"))}))},deserializeHighlightSteps:function(e){return(e=(e=e.replace(/\s/g,"")).split(Si.HIGHLIGHT_STEP_DELIMITER)).map((function(e){return e.split(Si.HIGHLIGHT_LINE_DELIMITER).map((function(e){if(/^[\d-]+$/.test(e)){e=e.split(Si.HIGHLIGHT_LINE_RANGE_DELIMITER);var t=parseInt(e[0],10),a=parseInt(e[1],10);return isNaN(a)?{start:t}:{start:t,end:a}}return{}}))}))},serializeHighlightSteps:function(e){return e.map((function(e){return e.map((function(e){return"number"==typeof e.end?e.start+Si.HIGHLIGHT_LINE_RANGE_DELIMITER+e.end:"number"==typeof e.start?e.start:""})).join(Si.HIGHLIGHT_LINE_DELIMITER)})).join(Si.HIGHLIGHT_STEP_DELIMITER)}};return()=>Si}));
|
||||
|
@@ -194,8 +194,6 @@ const Plugin = {
|
||||
var startTop = block.scrollTop;
|
||||
var targetTop = highlightBounds.top + ( Math.min( highlightBounds.bottom - highlightBounds.top, viewportHeight ) - viewportHeight ) / 2;
|
||||
|
||||
console.log(startTop, targetTop)
|
||||
|
||||
// Account for offsets in position applied to the
|
||||
// <table> that holds our lines of code
|
||||
var lineTable = block.querySelector( '.hljs-ln' );
|
||||
|
Reference in New Issue
Block a user