Group background reads and writes
parent
10f02ece99
commit
e57ff233a4
|
@ -27,8 +27,6 @@ export default class Backgrounds {
|
||||||
*/
|
*/
|
||||||
create() {
|
create() {
|
||||||
|
|
||||||
let printMode = this.Reveal.isPrintingPDF();
|
|
||||||
|
|
||||||
// Clear prior backgrounds
|
// Clear prior backgrounds
|
||||||
this.element.innerHTML = '';
|
this.element.innerHTML = '';
|
||||||
this.element.classList.add( 'no-transition' );
|
this.element.classList.add( 'no-transition' );
|
||||||
|
@ -114,9 +112,24 @@ export default class Backgrounds {
|
||||||
*/
|
*/
|
||||||
sync( slide ) {
|
sync( slide ) {
|
||||||
|
|
||||||
let element = slide.slideBackgroundElement,
|
const element = slide.slideBackgroundElement,
|
||||||
contentElement = slide.slideBackgroundContentElement;
|
contentElement = slide.slideBackgroundContentElement;
|
||||||
|
|
||||||
|
const data = {
|
||||||
|
background: slide.getAttribute( 'data-background' ),
|
||||||
|
backgroundSize: slide.getAttribute( 'data-background-size' ),
|
||||||
|
backgroundImage: slide.getAttribute( 'data-background-image' ),
|
||||||
|
backgroundVideo: slide.getAttribute( 'data-background-video' ),
|
||||||
|
backgroundIframe: slide.getAttribute( 'data-background-iframe' ),
|
||||||
|
backgroundColor: slide.getAttribute( 'data-background-color' ),
|
||||||
|
backgroundRepeat: slide.getAttribute( 'data-background-repeat' ),
|
||||||
|
backgroundPosition: slide.getAttribute( 'data-background-position' ),
|
||||||
|
backgroundTransition: slide.getAttribute( 'data-background-transition' ),
|
||||||
|
backgroundOpacity: slide.getAttribute( 'data-background-opacity' ),
|
||||||
|
};
|
||||||
|
|
||||||
|
const dataPreload = slide.hasAttribute( 'data-preload' );
|
||||||
|
|
||||||
// Reset the prior background state in case this is not the
|
// Reset the prior background state in case this is not the
|
||||||
// initial sync
|
// initial sync
|
||||||
slide.classList.remove( 'has-dark-background' );
|
slide.classList.remove( 'has-dark-background' );
|
||||||
|
@ -135,19 +148,6 @@ export default class Backgrounds {
|
||||||
contentElement.style.opacity = '';
|
contentElement.style.opacity = '';
|
||||||
contentElement.innerHTML = '';
|
contentElement.innerHTML = '';
|
||||||
|
|
||||||
let data = {
|
|
||||||
background: slide.getAttribute( 'data-background' ),
|
|
||||||
backgroundSize: slide.getAttribute( 'data-background-size' ),
|
|
||||||
backgroundImage: slide.getAttribute( 'data-background-image' ),
|
|
||||||
backgroundVideo: slide.getAttribute( 'data-background-video' ),
|
|
||||||
backgroundIframe: slide.getAttribute( 'data-background-iframe' ),
|
|
||||||
backgroundColor: slide.getAttribute( 'data-background-color' ),
|
|
||||||
backgroundRepeat: slide.getAttribute( 'data-background-repeat' ),
|
|
||||||
backgroundPosition: slide.getAttribute( 'data-background-position' ),
|
|
||||||
backgroundTransition: slide.getAttribute( 'data-background-transition' ),
|
|
||||||
backgroundOpacity: slide.getAttribute( 'data-background-opacity' )
|
|
||||||
};
|
|
||||||
|
|
||||||
if( data.background ) {
|
if( data.background ) {
|
||||||
// Auto-wrap image urls in url(...)
|
// Auto-wrap image urls in url(...)
|
||||||
if( /^(http|file|\/\/)/gi.test( data.background ) || /\.(svg|png|jpg|jpeg|gif|bmp)([?#\s]|$)/gi.test( data.background ) ) {
|
if( /^(http|file|\/\/)/gi.test( data.background ) || /\.(svg|png|jpg|jpeg|gif|bmp)([?#\s]|$)/gi.test( data.background ) ) {
|
||||||
|
@ -179,7 +179,7 @@ export default class Backgrounds {
|
||||||
if( data.backgroundColor ) element.style.backgroundColor = data.backgroundColor;
|
if( data.backgroundColor ) element.style.backgroundColor = data.backgroundColor;
|
||||||
if( data.backgroundTransition ) element.setAttribute( 'data-background-transition', data.backgroundTransition );
|
if( data.backgroundTransition ) element.setAttribute( 'data-background-transition', data.backgroundTransition );
|
||||||
|
|
||||||
if( slide.hasAttribute( 'data-preload' ) ) element.setAttribute( 'data-preload', '' );
|
if( dataPreload ) element.setAttribute( 'data-preload', '' );
|
||||||
|
|
||||||
// Background image options are set on the content wrapper
|
// Background image options are set on the content wrapper
|
||||||
if( data.backgroundSize ) contentElement.style.backgroundSize = data.backgroundSize;
|
if( data.backgroundSize ) contentElement.style.backgroundSize = data.backgroundSize;
|
||||||
|
@ -194,14 +194,14 @@ export default class Backgrounds {
|
||||||
|
|
||||||
// If no bg color was found, check the computed background
|
// If no bg color was found, check the computed background
|
||||||
if( !contrastColor ) {
|
if( !contrastColor ) {
|
||||||
let computedBackgroundStyle = window.getComputedStyle( element );
|
const computedBackgroundStyle = window.getComputedStyle( element );
|
||||||
if( computedBackgroundStyle && computedBackgroundStyle.backgroundColor ) {
|
if( computedBackgroundStyle && computedBackgroundStyle.backgroundColor ) {
|
||||||
contrastColor = computedBackgroundStyle.backgroundColor;
|
contrastColor = computedBackgroundStyle.backgroundColor;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if( contrastColor ) {
|
if( contrastColor ) {
|
||||||
let rgb = colorToRgb( contrastColor );
|
const 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
|
||||||
|
@ -394,4 +394,4 @@ export default class Backgrounds {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue