← All changes | includes/Assets.php +118 -17 1.10.2 → 2.0.0 View file →

		@@ -1,5 +1,10 @@
1	1	<?php
	2	+/**
	3	+ * Registers and enqueues admin/frontend scripts and styles.
	4	+ *
	5	+ * @package SpringDevs\Subscription
	6	+ */
2	7
3	8	namespace SpringDevs\Subscription;
4	9
5	10	/**
		@@ -12,13 +17,18 @@
12	17	*/
13	18	public function __construct() {
14	19	if ( is_admin() ) {
15	20	add_action( 'admin_enqueue_scripts', array( $this, 'register' ), 5 );
16		- add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_tailwind_css' ), 5 );
17	21	add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_admin_components' ), 6 );
18	22	} else {
19	23	add_action( 'wp_enqueue_scripts', array( $this, 'register' ), 5 );
20	24	}
	25	+
	26	+ // Development only: see version_asset_src().
	27	+ if ( false !== strpos( SUBSCRPT_VERSION, '#WPSUBS' ) ) {
	28	+ add_filter( 'script_loader_src', array( $this, 'version_asset_src' ) );
	29	+ add_filter( 'style_loader_src', array( $this, 'version_asset_src' ) );
	30	+ }
21	31	}
22	32
23	33	/**
24	34	* Register our app scripts and styles
		@@ -30,8 +40,44 @@
30	40	$this->register_styles( $this->get_styles() );
31	41	}
32	42
33	43	/**
	44	+ * Give this plugin's assets a version that actually changes in development.
	45	+ *
	46	+ * `SUBSCRPT_VERSION` is a build-time placeholder in a git checkout —
	47	+ * release.sh substitutes the real number when packaging — so every asset is
	48	+ * served under the same, never-changing version string and the browser
	49	+ * keeps its cached copy through edit after edit. That has cost real
	50	+ * debugging time: a fix already on disk and already being served, appearing
	51	+ * not to work.
	52	+ *
	53	+ * Filtering the loader rather than each registration catches the enqueues
	54	+ * that call wp_enqueue_script() directly with a version of their own, which
	55	+ * is most of the admin screens. On a release build the placeholder is gone
	56	+ * and this returns the src untouched.
	57	+ *
	58	+ * @param string $src Asset URL, with or without a `ver` argument.
	59	+ * @return string
	60	+ */
	61	+ public function version_asset_src( $src ) {
	62	+ if ( false === strpos( SUBSCRPT_VERSION, '#WPSUBS' ) ) {
	63	+ return $src;
	64	+ }
	65	+
	66	+ if ( ! is_string( $src ) || 0 !== strpos( $src, SUBSCRPT_ASSETS ) ) {
	67	+ return $src;
	68	+ }
	69	+
	70	+ $path = SUBSCRPT_PATH . '/assets' . strtok( substr( $src, strlen( SUBSCRPT_ASSETS ) ), '?' );
	71	+
	72	+ if ( ! file_exists( $path ) ) {
	73	+ return $src;
	74	+ }
	75	+
	76	+ return add_query_arg( 'ver', (string) filemtime( $path ), $src );
	77	+ }
	78	+
	79	+ /**
34	80	* Register scripts
35	81	*
36	82	* @param array $scripts scripts.
37	83	*
		@@ -82,8 +128,22 @@
82	128	'dependencies' => false,
83	129	'version' => SUBSCRPT_VERSION,
84	130	);
85	131
	132	+ // Admin UI components, one file each for readability (assets/js/admin-components/).
	133	+ // Each attaches its API to `window` and auto-inits; they are registered as
	134	+ // individual scripts and bundled behind the `subscrpt_admin_components` handle.
	135	+ $components = array();
	136	+ $component_files = array( 'adv-select', 'tag-select', 'editlist', 'modal', 'tabs', 'accordion', 'pagination', 'toast', 'save' );
	137	+ foreach ( $component_files as $component_file ) {
	138	+ $handle = 'subscrpt_component_' . str_replace( '-', '_', $component_file );
	139	+ $components[ $handle ] = array(
	140	+ 'src' => $plugin_js_assets_path . 'admin-components/' . $component_file . '.js',
	141	+ 'deps' => array(),
	142	+ 'in_footer' => true,
	143	+ );
	144	+ }
	145	+
86	146	$scripts = array(
87	147	'sdevs_subscription_admin' => array(
88	148	'src' => $plugin_js_assets_path . 'admin.js',
89	149	'deps' => array( 'jquery' ),
		@@ -89,12 +149,19 @@
89	149	'deps' => array( 'jquery' ),
90	150	'in_footer' => true,
91	151	),
92	152	'subscrpt_admin_components' => array(
93		- 'src' => $plugin_js_assets_path . 'admin-components.js',
94		- 'deps' => array(),
	153	+ 'src' => false,
	154	+ 'deps' => array_keys( $components ),
95	155	'in_footer' => true,
96	156	),
	157	+ 'subscrpt_plan_forms_js' => array(
	158	+ // Shared plan-group + selling-plan modal logic, used by both the
	159	+ // Plans admin screen and the product-editor Subscription tab.
	160	+ 'src' => $plugin_js_assets_path . 'admin/plan-forms.js',
	161	+ 'deps' => array( 'subscrpt_admin_components' ),
	162	+ 'in_footer' => true,
	163	+ ),
97	164	'sdevs_installer' => array(
98	165	'src' => $plugin_js_assets_path . 'installer.js',
99	166	'deps' => array( 'jquery' ),
100	167	'in_footer' => true,
		@@ -106,9 +173,9 @@
106	173	'in_footer' => true,
107	174	),
108	175	);
109	176
110		- return $scripts;
	177	+ return array_merge( $components, $scripts );
111	178	}
112	179
113	180	/**
114	181	* Get registered styles
		@@ -117,14 +184,49 @@
117	184	*/
118	185	public function get_styles() {
119	186	$plugin_css_assets_path = SUBSCRPT_ASSETS . '/css/';
120	187
	188	+ // Admin UI component styles, split by section for readability
	189	+ // (assets/css/admin-components/). Loaded in this order behind the
	190	+ // `subscrpt_admin_components` handle; `tokens` must stay first.
	191	+ $component_styles = array();
	192	+ $component_files = array(
	193	+ 'tokens',
	194	+ 'layout',
	195	+ 'page-header',
	196	+ 'forms',
	197	+ 'buttons',
	198	+ 'select',
	199	+ 'table',
	200	+ 'badges',
	201	+ 'dropdown',
	202	+ 'pagination',
	203	+ 'empty',
	204	+ 'toggle',
	205	+ 'settings',
	206	+ 'tag-select',
	207	+ 'modal',
	208	+ 'editlist',
	209	+ 'tabs',
	210	+ 'vnav',
	211	+ 'accordion',
	212	+ 'tooltip',
	213	+ 'toast',
	214	+ );
	215	+ foreach ( $component_files as $component_file ) {
	216	+ $handle = 'subscrpt_style_' . str_replace( '-', '_', $component_file );
	217	+ $component_styles[ $handle ] = array(
	218	+ 'src' => $plugin_css_assets_path . 'admin-components/' . $component_file . '.css',
	219	+ );
	220	+ }
	221	+
121	222	$styles = array(
122	223	'subscrpt_admin_css' => array(
123	224	'src' => $plugin_css_assets_path . 'admin.css',
124	225	),
125	226	'subscrpt_admin_components' => array(
126		- 'src' => $plugin_css_assets_path . 'admin-components.css',
	227	+ 'src' => false,
	228	+ 'deps' => array_keys( $component_styles ),
127	229	),
128	230	'subscrpt_status_css' => array(
129	231	'src' => $plugin_css_assets_path . 'status.css',
130	232	),
		@@ -132,22 +234,12 @@
132	234	'src' => $plugin_css_assets_path . 'installer.css',
133	235	),
134	236	);
135	237
136		- return $styles;
	238	+ return array_merge( $component_styles, $styles );
137	239	}
138	240
139	241	/**
140		- * Enqueue Tailwind CSS for admin pages of WPSubscription.
141		- *
142		- * @param string $hook The current admin page hook.
143		- */
144		- public function enqueue_tailwind_css( $hook ) {
145		- $is_wpsubs_admin_page = str_starts_with( $hook, 'wp-subscription_page' );
146		- $is_wpsubs_admin_page && subscrpt_include_tailwind_css();
147		- }
148		-
149		- /**
150	242	* Enqueue admin component styles on all WPSubscription admin pages.
151	243	*
152	244	* @param string $hook The current admin page hook.
153	245	*/
		@@ -152,12 +244,21 @@
152	244	* @param string $hook The current admin page hook.
153	245	*/
154	246	public function enqueue_admin_components( $hook ) {
155	247	$is_main_page = 'toplevel_page_wp-subscription' === $hook;
156		- $is_subs_page = str_starts_with( $hook, 'wpsubscription_page' );
	248	+ $is_subs_page = str_starts_with( $hook, 'wpsubscription_page' ) || str_starts_with( $hook, 'wp-subscription_page' );
157	249
158	250	if ( $is_main_page || $is_subs_page ) {
159	251	wp_enqueue_style( 'subscrpt_admin_components' );
160	252	wp_enqueue_script( 'subscrpt_admin_components' );
161	253	}
	254	+ }
	255	+
	256	+ /**
	257	+ * Enqueue chart.js where this method is called.
	258	+ *
	259	+ * Source: https://cdn.jsdelivr.net/npm/chart.js
	260	+ */
	261	+ public static function enqueue_chart_js() {
	262	+ wp_enqueue_script( 'subscrpt-ext-lib-chartjs', SUBSCRPT_ASSETS . '/js/chart.js', [], SUBSCRPT_VERSION, true );
162	263	}
163	264	}