Changeset 20893

Timestamp:

05/25/2012 12:15:12 AM (13 years ago)

Author:

koopersmith

Message:

Theme Customizer: Add CORS checks to the initial check for customize support. Prevents flash of customize links on large pages. see #20582, #19910.

Add wp_customize_support_script(), to quickly alter the body class based on whether customize is supported.

Location:

trunk

Files:

• wp-admin/admin-header.php (modified) (1 diff)
• wp-includes/theme.php (modified) (1 diff)

trunk/wp-admin/admin-header.php

@@ -98 +98 @@
 <script type="text/javascript">
     document.body.className = document.body.className.replace('no-js','js');
-<?php
-// If the customize loader is enqueued, then add the 'customize-support' class early.
-// This prevents a flash of unstyled content.
-if ( wp_script_is( 'customize-loader', 'queue' ) ) : ?>
-    if ( window.postMessage )
-        document.body.className = document.body.className.replace('no-customize-support','customize-support');
-<?php endif; ?>
 </script>
+
+<?php wp_customize_support_script(); ?>
 
 <div id="wpwrap">

trunk/wp-includes/theme.php

@@ -1619 +1619 @@
     return esc_url( admin_url( 'customize.php' ) . '?theme=' . $stylesheet );
 }
+
+/**
+ * Prints a script to check whether or not the customizer is supported,
+ * and apply either the no-customize-support or customize-support class
+ * to the body.
+ *
+ * This function MUST be called inside the body tag.
+ *
+ * Ideally, call this function immediately after the body tag is opened.
+ * This prevents a flash of unstyled content.
+ *
+ * It is also recommended that you add the "no-customize-support" class
+ * to the body tag by default.
+ *
+ * @since 3.4.0
+ */
+function wp_customize_support_script() {
+    if ( ! wp_script_is( 'customize-loader', 'queue' ) )
+        return;
+
+    $admin_origin = parse_url( admin_url() );
+    $home_origin  = parse_url( home_url() );
+    $cross_domain = ( strtolower( $admin_origin[ 'host' ] ) != strtolower( $home_origin[ 'host' ] ) );
+
+    ?>
+    <script type="text/javascript">
+        (function() {
+            var request, b = document.body, c = 'className', cs = 'customize-support', rcs = new RegExp('(^|\\s+)(no-)?'+cs+'(\\s+|$)');
+
+<?php       if ( $cross_domain ): ?>
+            request = (function(){ var xhr = new XMLHttpRequest(); return ('withCredentials' in xhr); })();
+<?php       else: ?>
+            request = true;
+<?php       endif; ?>
+
+            b[c] = b[c].replace( rcs, '' );
+            b[c] += ( window.postMessage && request ? ' ' : ' no-' ) + cs;
+        }());
+    </script>
+    <?php
+}