WordPress/wp-content/themes/twentytwentyone/assets/js/editor-dark-mode-support.js
desrosj 634e6b16c8 Twenty Twenty-One: Sync the latest changes for 5.6 RC1.
For a full list of changes since [49574-49577], see https://github.com/WordPress/twentytwentyone/compare/aa284fd...trunk.

Props poena, luminuu, kjellr, ryelle, aristath.
See #51526.
Built from https://develop.svn.wordpress.org/trunk@49633


git-svn-id: http://core.svn.wordpress.org/trunk@49371 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-11-17 19:00:08 +00:00

45 lines
1.2 KiB
JavaScript

/* global twentytwentyoneIsDarkMode, setTimeout */
// Check the color scheme preference and inject the classes if necessary.
if ( document.body.classList.contains( 'twentytwentyone-supports-dark-theme' ) ) {
twentytwentyoneDarkModeEditorInit();
}
/**
* Once the editor loads, add the dark mode class.
*
* Wait for the editor to load by periodically checking for an element, then we add the classes.
*
* @since 1.0.0
*
* @param {number} attempt Track the number of tries
* @return {void}
*/
function twentytwentyoneDarkModeEditorInit( attempt ) {
var container = document.querySelector( '.block-editor__typewriter' ),
maxAttempts = 8;
// Set the initial attempt if it's undefined.
attempt = attempt || 0;
if ( twentytwentyoneIsDarkMode() ) {
if ( null === container ) {
// Try again.
if ( attempt < maxAttempts ) {
setTimeout(
function() {
twentytwentyoneDarkModeEditorInit( attempt + 1 );
},
// Double the delay, give the server some time to breathe.
25 * Math.pow( 2, attempt )
);
}
return;
}
document.body.classList.add( 'is-dark-theme' );
document.documentElement.classList.add( 'is-dark-theme' );
container.classList.add( 'is-dark-theme' );
}
}