xobs/lca2019-talk
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add support for overriding the default layout (#2121)

Browse Source 
* add support for overriding the default layout
New `overrideLayout` option (if true) will prevent h/w calcs.

* fix error if options are empty

* Implement requested changes
Rename overrideLayout to disableLayout and remove code to unset display
This commit is contained in:
Steve Hartzog 2018-03-22 06:06:19 -04:00 committed by Hakim El Hattab
parent ea57e697a1
commit 9dbccd6978
1 changed files with 61 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
js/reveal.js
View File

@ -84,6 +84,10 @@
// Enable the slide overview mode // Enable the slide overview mode
overview: true, overview: true,
// Enable/disable user specified layouts (like css-grid)
// (basically prevents all the display & height/width calculations)
disableLayout: false,
// Vertical centering of slides // Vertical centering of slides
center: true, center: true,
@ -1853,76 +1857,80 @@
if( dom.wrapper && !isPrintingPDF() ) { if( dom.wrapper && !isPrintingPDF() ) {
var size = getComputedSlideSize(); if( !config.disableLayout ) {
// Layout the contents of the slides var size = getComputedSlideSize();
layoutSlideContents( config.width, config.height );
dom.slides.style.width = size.width + 'px'; // Layout the contents of the slides
dom.slides.style.height = size.height + 'px'; layoutSlideContents( config.width, config.height );
// Determine scale of content to fit within available space dom.slides.style.width = size.width + 'px';
scale = Math.min( size.presentationWidth / size.width, size.presentationHeight / size.height ); dom.slides.style.height = size.height + 'px';
// Respect max/min scale settings // Determine scale of content to fit within available space
scale = Math.max( scale, config.minScale ); scale = Math.min( size.presentationWidth / size.width, size.presentationHeight / size.height );
scale = Math.min( scale, config.maxScale );
// Don't apply any scaling styles if scale is 1 // Respect max/min scale settings
if( scale === 1 ) { scale = Math.max( scale, config.minScale );
dom.slides.style.zoom = ''; scale = Math.min( scale, config.maxScale );
dom.slides.style.left = '';
dom.slides.style.top = ''; // Don't apply any scaling styles if scale is 1
dom.slides.style.bottom = ''; if( scale === 1 ) {
dom.slides.style.right = ''; dom.slides.style.zoom = '';
transformSlides( { layout: '' } );
}
else {
// Prefer zoom for scaling up so that content remains crisp.
// Don't use zoom to scale down since that can lead to shifts
// in text layout/line breaks.
if( scale > 1 && features.zoom ) {
dom.slides.style.zoom = scale;
dom.slides.style.left = ''; dom.slides.style.left = '';
dom.slides.style.top = ''; dom.slides.style.top = '';
dom.slides.style.bottom = ''; dom.slides.style.bottom = '';
dom.slides.style.right = ''; dom.slides.style.right = '';
transformSlides( { layout: '' } ); transformSlides( { layout: '' } );
} }
// Apply scale transform as a fallback
else { else {
dom.slides.style.zoom = ''; // Prefer zoom for scaling up so that content remains crisp.
dom.slides.style.left = '50%'; // Don't use zoom to scale down since that can lead to shifts
dom.slides.style.top = '50%'; // in text layout/line breaks.
dom.slides.style.bottom = 'auto'; if( scale > 1 && features.zoom ) {
dom.slides.style.right = 'auto'; dom.slides.style.zoom = scale;
transformSlides( { layout: 'translate(-50%, -50%) scale('+ scale +')' } ); dom.slides.style.left = '';
} dom.slides.style.top = '';
} dom.slides.style.bottom = '';
dom.slides.style.right = '';
// Select all slides, vertical and horizontal transformSlides( { layout: '' } );
var slides = toArray( dom.wrapper.querySelectorAll( SLIDES_SELECTOR ) ); }
// Apply scale transform as a fallback
for( var i = 0, len = slides.length; i < len; i++ ) { else {
var slide = slides[ i ]; dom.slides.style.zoom = '';
dom.slides.style.left = '50%';
// Don't bother updating invisible slides dom.slides.style.top = '50%';
if( slide.style.display === 'none' ) { dom.slides.style.bottom = 'auto';
continue; dom.slides.style.right = 'auto';
transformSlides( { layout: 'translate(-50%, -50%) scale('+ scale +')' } );
}
} }
if( config.center || slide.classList.contains( 'center' ) ) { // Select all slides, vertical and horizontal
// Vertical stacks are not centred since their section var slides = toArray( dom.wrapper.querySelectorAll( SLIDES_SELECTOR ) );
// children will be
if( slide.classList.contains( 'stack' ) ) { for( var i = 0, len = slides.length; i < len; i++ ) {
slide.style.top = 0; var slide = slides[ i ];
// Don't bother updating invisible slides
if( slide.style.display === 'none' ) {
continue;
}
if( config.center || slide.classList.contains( 'center' ) ) {
// Vertical stacks are not centred since their section
// children will be
if( slide.classList.contains( 'stack' ) ) {
slide.style.top = 0;
}
else {
slide.style.top = Math.max( ( size.height - slide.scrollHeight ) / 2, 0 ) + 'px';
}
} }
else { else {
slide.style.top = Math.max( ( size.height - slide.scrollHeight ) / 2, 0 ) + 'px'; slide.style.top = '';
} }
}
else {
slide.style.top = '';
} }
} }