add support for overriding the default layout (#2121)
* 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 displayedit
parent
ea57e697a1
commit
9dbccd6978
114
js/reveal.js
114
js/reveal.js
|
@ -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 = '';
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue