optimization; avoid reading computed styles unless necessary

This commit is contained in:
Hakim El Hattab 2018-12-18 14:21:11 +01:00
parent 9f1856d55b
commit db9c346b41

View file

@ -1131,18 +1131,27 @@
if( data.backgroundPosition ) contentElement.style.backgroundPosition = data.backgroundPosition; if( data.backgroundPosition ) contentElement.style.backgroundPosition = data.backgroundPosition;
if( data.backgroundOpacity ) contentElement.style.opacity = data.backgroundOpacity; if( data.backgroundOpacity ) contentElement.style.opacity = data.backgroundOpacity;
// If this slide has a background color, add a class that // If this slide has a background color, we add a class that
// signals if it is light or dark. If the slide has no background // signals if it is light or dark. If the slide has no background
// color, no class will be set // color, no class will be added
var contrastColor = data.backgroundColor;
// If no bg color was found, check the computed background
if( !contrastColor ) {
var computedBackgroundStyle = window.getComputedStyle( element ); var computedBackgroundStyle = window.getComputedStyle( element );
if( computedBackgroundStyle && computedBackgroundStyle.backgroundColor ) { if( computedBackgroundStyle && computedBackgroundStyle.backgroundColor ) {
var rgb = colorToRgb( computedBackgroundStyle.backgroundColor ); contrastColor = computedBackgroundStyle.backgroundColor;
}
}
if( contrastColor ) {
var rgb = colorToRgb( contrastColor );
// Ignore fully transparent backgrounds. Some browsers return // Ignore fully transparent backgrounds. Some browsers return
// rgba(0,0,0,0) when reading the computed background color of // rgba(0,0,0,0) when reading the computed background color of
// an element with no background // an element with no background
if( rgb && rgb.a !== 0 ) { if( rgb && rgb.a !== 0 ) {
if( colorBrightness( computedBackgroundStyle.backgroundColor ) < 128 ) { if( colorBrightness( contrastColor ) < 128 ) {
slide.classList.add( 'has-dark-background' ); slide.classList.add( 'has-dark-background' );
} }
else { else {