| 1 |
<?php |
| 2 |
/** |
| 3 |
* Desktop Mode — Heartbeat widget (built-in, lazy-loaded). |
| 4 |
* |
| 5 |
* Dogfoods the public `desktop_mode_register_widget()` API for a |
| 6 |
* built-in widget: the metadata + script handle live here, the |
| 7 |
* JS + CSS ship as their own Vite bundle |
| 8 |
* (`assets/js/widget-heartbeat[.min].js` and matching `.css`). |
| 9 |
* The shell's widgets `server-sync` only loads them when the user |
| 10 |
* adds the widget or the picker is opened — main bundle keeps |
| 11 |
* none of the heart's code. |
| 12 |
* |
| 13 |
* @package WPDesktopMode |
| 14 |
* @since 0.18.0 |
| 15 |
*/ |
| 16 |
|
| 17 |
defined( 'ABSPATH' ) || exit; |
| 18 |
|
| 19 |
/** |
| 20 |
* Register the JS bundle as a script handle so it can be loaded |
| 21 |
* lazily via `wp_register_script()` / its URL. The CSS file |
| 22 |
* emitted by Vite alongside the JS gets enqueued as a stylesheet |
| 23 |
* dependency so the chrome always paints with the JS. |
| 24 |
* |
| 25 |
* @since 0.18.0 |
| 26 |
*/ |
| 27 |
function desktop_mode_register_heartbeat_widget_assets() { |
| 28 |
$suffix = ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) ? '' : '.min'; |
| 29 |
$version = defined( 'DESKTOP_MODE_VERSION' ) ? DESKTOP_MODE_VERSION : '0'; |
| 30 |
|
| 31 |
$js_path = DESKTOP_MODE_DIR . 'assets/js/widget-heartbeat' . $suffix . '.js'; |
| 32 |
$css_path = DESKTOP_MODE_DIR . 'assets/js/widget-heartbeat' . $suffix . '.css'; |
| 33 |
|
| 34 |
wp_register_style( |
| 35 |
'desktop-mode-heartbeat-widget', |
| 36 |
DESKTOP_MODE_URL . 'assets/js/widget-heartbeat' . $suffix . '.css', |
| 37 |
array(), |
| 38 |
file_exists( $css_path ) ? (string) filemtime( $css_path ) : $version |
| 39 |
); |
| 40 |
wp_register_script( |
| 41 |
'desktop-mode-heartbeat-widget', |
| 42 |
DESKTOP_MODE_URL . 'assets/js/widget-heartbeat' . $suffix . '.js', |
| 43 |
array( 'wp-hooks' ), |
| 44 |
file_exists( $js_path ) ? (string) filemtime( $js_path ) : $version, |
| 45 |
true |
| 46 |
); |
| 47 |
} |
| 48 |
add_action( 'init', 'desktop_mode_register_heartbeat_widget_assets', 5 ); |
| 49 |
|
| 50 |
/** |
| 51 |
* Register the widget itself. Sizing constraints + chrome metadata |
| 52 |
* (label / description / icon) live here so the framework knows |
| 53 |
* the widget exists at picker-render time, before the JS bundle |
| 54 |
* is even fetched. |
| 55 |
* |
| 56 |
* @since 0.18.0 |
| 57 |
*/ |
| 58 |
function desktop_mode_register_heartbeat_widget() { |
| 59 |
if ( ! function_exists( 'desktop_mode_register_widget' ) ) { |
| 60 |
return; |
| 61 |
} |
| 62 |
desktop_mode_register_widget( 'desktop-mode/heartbeat', array( |
| 63 |
'label' => __( 'Heartbeat', 'desktop-mode' ), |
| 64 |
'description' => __( |
| 65 |
'A gently beating heart that pulses with the WordPress Heartbeat. The bar fills as the next tick approaches.', |
| 66 |
'desktop-mode' |
| 67 |
), |
| 68 |
'icon' => 'dashicons-heart', |
| 69 |
'script' => 'desktop-mode-heartbeat-widget', |
| 70 |
'movable' => true, |
| 71 |
'resizable' => false, |
| 72 |
'min_width' => 310, |
| 73 |
'max_width' => 310, |
| 74 |
'min_height' => 230, |
| 75 |
'max_height' => 230, |
| 76 |
'default_width' => 310, |
| 77 |
'default_height' => 230, |
| 78 |
) ); |
| 79 |
} |
| 80 |
add_action( 'init', 'desktop_mode_register_heartbeat_widget', 6 ); |
| 81 |
|
| 82 |
/** |
| 83 |
/** |
| 84 |
* Eagerly enqueue the widget's CSS handle ONLY when the current |
| 85 |
* request is a Desktop Mode SHELL request — not a chromeless |
| 86 |
* iframe load, not an admin page that doesn't mount the desktop. |
| 87 |
* The JS bundle stays lazy and loads via the widget server-sync |
| 88 |
* the first time the picker opens or the widget mounts. |
| 89 |
* |
| 90 |
* Why eager (on shell pages): the shell injects a `<script>` for |
| 91 |
* the widget at runtime, but there is no matching auto-load for |
| 92 |
* the stylesheet. A pure-JS CSS injection creates a flash of |
| 93 |
* unstyled content while the link's stylesheet is still in |
| 94 |
* flight — long enough for the widget frame's children to render |
| 95 |
* past the card boundary before the stylesheet's flex layout |
| 96 |
* kicks in. 1.9 KB ungzipped is small enough to live in the |
| 97 |
* shell's always-loaded set without measurable cost; the |
| 98 |
* heavier JS (9 KB + PIXI) stays lazy. |
| 99 |
* |
| 100 |
* Why NOT eager elsewhere: a chromeless iframe never mounts a |
| 101 |
* widget, and an admin page that hasn't opted into the shell |
| 102 |
* doesn't either — sending the stylesheet anyway is dead weight. |
| 103 |
* The `desktop_mode_heartbeat_widget_eager_css` filter lets a |
| 104 |
* site owner opt out entirely (or, conversely, force-enable on |
| 105 |
* a non-shell page) without forking the plugin. |
| 106 |
* |
| 107 |
* @since 0.18.0 |
| 108 |
*/ |
| 109 |
function desktop_mode_enqueue_heartbeat_widget_styles() { |
| 110 |
if ( function_exists( 'desktop_mode_is_enabled' ) && ! desktop_mode_is_enabled() ) { |
| 111 |
return; |
| 112 |
} |
| 113 |
// Chromeless requests render content inside an iframe owned |
| 114 |
// by a shell elsewhere — they never mount widgets themselves. |
| 115 |
if ( |
| 116 |
function_exists( 'desktop_mode_is_chromeless_request' ) |
| 117 |
&& desktop_mode_is_chromeless_request() |
| 118 |
) { |
| 119 |
return; |
| 120 |
} |
| 121 |
/** |
| 122 |
* Whether to enqueue the heartbeat widget's stylesheet on |
| 123 |
* this request. Defaults to `true` for shell requests in |
| 124 |
* Desktop Mode. Sites that never plan to ship the heartbeat |
| 125 |
* widget can return `false` and save the ~0.66 KB gzipped |
| 126 |
* stylesheet roundtrip. |
| 127 |
* |
| 128 |
* @since 0.18.x |
| 129 |
* |
| 130 |
* @param bool $eager Default `true` once the chromeless + |
| 131 |
* desktop-mode gates above have passed. |
| 132 |
*/ |
| 133 |
$eager = (bool) apply_filters( 'desktop_mode_heartbeat_widget_eager_css', true ); |
| 134 |
if ( ! $eager ) { |
| 135 |
return; |
| 136 |
} |
| 137 |
wp_enqueue_style( 'desktop-mode-heartbeat-widget' ); |
| 138 |
} |
| 139 |
add_action( 'admin_enqueue_scripts', 'desktop_mode_enqueue_heartbeat_widget_styles', 20 ); |
| 140 |
|