2020-11-17 20:00:08 +01:00
|
|
|
/* global twentytwentyoneIsDarkMode, setTimeout */
|
2020-11-02 20:45:07 +01:00
|
|
|
|
2020-11-17 20:00:08 +01:00
|
|
|
// Check the color scheme preference and inject the classes if necessary.
|
2020-11-02 20:45:07 +01:00
|
|
|
if ( document.body.classList.contains( 'twentytwentyone-supports-dark-theme' ) ) {
|
2020-11-17 20:00:08 +01:00
|
|
|
twentytwentyoneDarkModeEditorInit();
|
2020-11-02 20:45:07 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
2020-11-17 20:00:08 +01:00
|
|
|
* 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.
|
2020-11-02 20:45:07 +01:00
|
|
|
*
|
|
|
|
* @since 1.0.0
|
|
|
|
*
|
2020-11-17 20:00:08 +01:00
|
|
|
* @param {number} attempt Track the number of tries
|
2020-11-02 20:45:07 +01:00
|
|
|
* @return {void}
|
|
|
|
*/
|
2020-11-17 20:00:08 +01:00
|
|
|
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 );
|
|
|
|
},
|
2020-11-02 20:45:07 +01:00
|
|
|
// Double the delay, give the server some time to breathe.
|
2020-11-17 20:00:08 +01:00
|
|
|
25 * Math.pow( 2, attempt )
|
|
|
|
);
|
2020-11-02 20:45:07 +01:00
|
|
|
}
|
2020-11-17 20:00:08 +01:00
|
|
|
return;
|
2020-11-02 20:45:07 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
document.body.classList.add( 'is-dark-theme' );
|
2020-11-12 19:36:15 +01:00
|
|
|
document.documentElement.classList.add( 'is-dark-theme' );
|
2020-11-17 20:00:08 +01:00
|
|
|
container.classList.add( 'is-dark-theme' );
|
2020-11-02 20:45:07 +01:00
|
|
|
}
|
|
|
|
}
|