dirk
/
why-cant-we-deploy-today
1
0
Fork 0
Code Releases Activity

fix auto-animate bug on centered slides

This commit is contained in:
Hakim El Hattab 2020-05-08 20:33:28 +02:00
parent ab273a19f2
commit 3a032a836a
4 changed files with 22 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/reveal.esm.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/reveal.js vendored
View File

File diff suppressed because one or more lines are too long

5
examples/auto-animate.html
View File

@ -162,12 +162,13 @@
</div> </div>
<script src="../dist/reveal.es5.js"></script> <script src="../dist/reveal.js"></script>
<script src="../dist/plugin/highlight.js"></script> <script src="../dist/plugin/highlight.js"></script>
<script> <script>
Reveal.initialize({ Reveal.initialize({
center: true, center: true,
hash: true hash: true,
plugins: [ RevealHighlight ]
}); });
</script> </script>

15
js/controllers/autoanimate.js
View File

@ -331,6 +331,8 @@ export default class AutoAnimate {
*/ */
getAutoAnimatableProperties( direction, element, elementOptions ) { getAutoAnimatableProperties( direction, element, elementOptions ) {
let config = this.Reveal.getConfig();
let properties = { styles: [] }; let properties = { styles: [] };
// Position and size // Position and size
@ -342,6 +344,12 @@ export default class AutoAnimate {
if( typeof elementOptions.measure === 'function' ) { if( typeof elementOptions.measure === 'function' ) {
bounds = elementOptions.measure( element ); bounds = elementOptions.measure( element );
} }
else {
if( config.center ) {
// More precise, but breaks when used in combination
// with zoom for scaling the deck ¯\_(ツ)_/¯
bounds = element.getBoundingClientRect();
}
else { else {
let scale = this.Reveal.getScale(); let scale = this.Reveal.getScale();
bounds = { bounds = {
@ -350,10 +358,7 @@ export default class AutoAnimate {
width: element.offsetWidth * scale, width: element.offsetWidth * scale,
height: element.offsetHeight * scale height: element.offsetHeight * scale
}; };
}
// More precise, but breaks when used in combination
// with zoom for scaling the deck ¯\_(ツ)_/¯
// bounds = element.getBoundingClientRect();
} }
properties.x = bounds.x; properties.x = bounds.x;
@ -365,7 +370,7 @@ export default class AutoAnimate {
const computedStyles = getComputedStyle( element ); const computedStyles = getComputedStyle( element );
// CSS styles // CSS styles
( elementOptions.styles || this.Reveal.getConfig().autoAnimateStyles ).forEach( style => { ( elementOptions.styles || config.autoAnimateStyles ).forEach( style => {
let value; let value;
// `style` is either the property name directly, or an object // `style` is either the property name directly, or an object