convertkit / includes / blocks / class-convertkit-block-product.php

class-convertkit-block-product.php in Kit (formerly ConvertKit) – Email Newsletter, Email Marketing, Membership, Subscribers and Landing Pages 2.4.1, at includes/blocks/class-convertkit-block-product.php

454 lines 13.0 KB

Raw Download Zip

1	<?php
2	/**
3	* ConvertKit Product Button Block class.
4	*
5	* @package ConvertKit
6	* @author ConvertKit
7	*/
8
9	/**
10	* ConvertKit Product Button Block for Gutenberg and Shortcode.
11	*
12	* @package ConvertKit
13	* @author ConvertKit
14	*/
15	class ConvertKit_Block_Product extends ConvertKit_Block {
16
17	/**
18	* Constructor
19	*
20	* @since 1.9.8.5
21	*/
22	public function __construct() {
23
24	// Register this as a shortcode in the ConvertKit Plugin.
25	add_filter( 'convertkit_shortcodes', array( $this, 'register' ) );
26
27	// Register this as a Gutenberg block in the ConvertKit Plugin.
28	add_filter( 'convertkit_blocks', array( $this, 'register' ) );
29
30	// Enqueue scripts and styles for this Gutenberg Block in the editor view.
31	add_action( 'convertkit_gutenberg_enqueue_scripts', array( $this, 'enqueue_scripts_editor' ) );
32
33	// Enqueue scripts and styles for this Gutenberg Block in the editor and frontend views.
34	add_action( 'convertkit_gutenberg_enqueue_scripts_editor_and_frontend', array( $this, 'enqueue_scripts' ) );
35	add_action( 'convertkit_gutenberg_enqueue_styles_editor_and_frontend', array( $this, 'enqueue_styles' ) );
36
37	}
38
39	/**
40	* Enqueues scripts for this Gutenberg Block in the editor view.
41	*
42	* @since 1.9.8.5
43	*/
44	public function enqueue_scripts_editor() {
45
46	wp_enqueue_script( 'convertkit-gutenberg-block-product', CONVERTKIT_PLUGIN_URL . 'resources/backend/js/gutenberg-block-product.js', array( 'convertkit-gutenberg' ), CONVERTKIT_PLUGIN_VERSION, true );
47
48	}
49
50	/**
51	* Enqueues scripts for this Gutenberg Block in the editor and frontend views.
52	*
53	* @since 1.9.8.5
54	*/
55	public function enqueue_scripts() {
56
57	// Get URL for commerce.js from Products.
58	$convertkit_products = new ConvertKit_Resource_Products();
59	$commerce_js_url = $convertkit_products->get_commerce_js_url();
60
61	// Bail if the commerce.js URL could not be fetched, as this means there are no Products.
62	if ( ! $commerce_js_url ) {
63	return;
64	}
65
66	// Enqueue.
67	wp_enqueue_script( 'convertkit-commerce', $commerce_js_url, array(), false, true ); // phpcs:ignore
68
69	}
70
71	/**
72	* Enqueues styles for this Gutenberg Block in the editor and frontend views.
73	*
74	* @since 1.9.8.5
75	*/
76	public function enqueue_styles() {
77
78	wp_enqueue_style( 'convertkit-button', CONVERTKIT_PLUGIN_URL . 'resources/frontend/css/button.css', array(), CONVERTKIT_PLUGIN_VERSION );
79
80	}
81
82	/**
83	* Returns this block's programmatic name, excluding the convertkit- prefix.
84	*
85	* @since 1.9.8.5
86	*/
87	public function get_name() {
88
89	/**
90	* This will register as:
91	* - a shortcode, with the name [convertkit_product].
92	* - a Gutenberg block, with the name convertkit/product.
93	*/
94	return 'product';
95
96	}
97
98	/**
99	* Returns this block's Title, Icon, Categories, Keywords and properties.
100	*
101	* @since 1.9.8.5
102	*/
103	public function get_overview() {
104
105	$convertkit_products = new ConvertKit_Resource_Products( 'block_edit' );
106	$settings = new ConvertKit_Settings();
107
108	return array(
109	'title' => __( 'ConvertKit Product', 'convertkit' ),
110	'description' => __( 'Displays a button to purchase a ConvertKit product.', 'convertkit' ),
111	'icon' => 'resources/backend/images/block-icon-product.svg',
112	'category' => 'convertkit',
113	'keywords' => array(
114	__( 'ConvertKit', 'convertkit' ),
115	__( 'Product', 'convertkit' ),
116	),
117
118	// Function to call when rendering as a block or a shortcode on the frontend web site.
119	'render_callback' => array( $this, 'render' ),
120
121	// Shortcode: TinyMCE / QuickTags Modal Width and Height.
122	'modal' => array(
123	'width' => 600,
124	'height' => 440,
125	),
126
127	// Shortcode: Include a closing [/shortcode] tag when using TinyMCE or QuickTag Modals.
128	'shortcode_include_closing_tag' => false,
129
130	// Gutenberg: Block Icon in Editor.
131	'gutenberg_icon' => convertkit_get_file_contents( CONVERTKIT_PLUGIN_PATH . '/resources/backend/images/block-icon-product.svg' ),
132
133	// Gutenberg: Example image showing how this block looks when choosing it in Gutenberg.
134	'gutenberg_example_image' => CONVERTKIT_PLUGIN_URL . 'resources/backend/images/block-example-product.png',
135
136	// Help descriptions, displayed when no API key / resources exist and this block/shortcode is added.
137	'no_api_key' => array(
138	'notice' => __( 'No API Key specified.', 'convertkit' ),
139	'link' => convertkit_get_setup_wizard_plugin_link(),
140	'link_text' => __( 'Click here to add your API Key.', 'convertkit' ),
141	),
142	'no_resources' => array(
143	'notice' => __( 'No products exist in ConvertKit.', 'convertkit' ),
144	'link' => convertkit_get_new_product_url(),
145	'link_text' => __( 'Click here to create your first product.', 'convertkit' ),
146	),
147
148	// Gutenberg: Help descriptions, displayed when no settings defined for a newly added Block.
149	'gutenberg_help_description' => __( 'Select a Product using the Product option in the Gutenberg sidebar.', 'convertkit' ),
150
151	// Gutenberg: JS function to call when rendering the block preview in the Gutenberg editor.
152	// If not defined, render_callback above will be used.
153	'gutenberg_preview_render_callback' => 'convertKitGutenbergProductBlockRenderPreview',
154
155	// Whether an API Key exists in the Plugin, and are the required resources (products) available.
156	// If no API Key is specified in the Plugin's settings, render the "No API Key" output.
157	'has_api_key' => $settings->has_api_key_and_secret(),
158	'has_resources' => $convertkit_products->exist(),
159	);
160
161	}
162
163	/**
164	* Returns this block's Attributes
165	*
166	* @since 1.9.8.5
167	*/
168	public function get_attributes() {
169
170	return array(
171	// Block attributes.
172	'product' => array(
173	'type' => 'string',
174	'default' => $this->get_default_value( 'product' ),
175	),
176	'text' => array(
177	'type' => 'string',
178	'default' => $this->get_default_value( 'text' ),
179	),
180	'discount_code' => array(
181	'type' => 'string',
182	'default' => $this->get_default_value( 'discount_code' ),
183	),
184	'disable_modal_on_mobile' => array(
185	'type' => 'boolean',
186	'default' => $this->get_default_value( 'disable_modal_on_mobile' ),
187	),
188
189	// The below are built in Gutenberg attributes registered in get_supports().
190
191	// Color.
192	'backgroundColor' => array(
193	'type' => 'string',
194	),
195	'textColor' => array(
196	'type' => 'string',
197	),
198
199	// Typography.
200	'fontSize' => array(
201	'type' => 'string',
202	),
203
204	// Spacing/Dimensions > Padding.
205	'style' => array(
206	'type' => 'object',
207	'visualizers' => array(
208	'type' => 'object',
209	'padding' => array(
210	'type' => 'object',
211	'top' => array(
212	'type' => 'boolean',
213	),
214	'bottom' => array(
215	'type' => 'boolean',
216	),
217	'left' => array(
218	'type' => 'boolean',
219	),
220	'right' => array(
221	'type' => 'boolean',
222	),
223	),
224	),
225	),
226
227	// Always required for Gutenberg.
228	'is_gutenberg_example' => array(
229	'type' => 'boolean',
230	'default' => false,
231	),
232	);
233
234	}
235
236	/**
237	* Returns this block's supported built-in Attributes.
238	*
239	* @since 1.9.8.5
240	*
241	* @return array Supports
242	*/
243	public function get_supports() {
244
245	return array(
246	'className' => true,
247	'color' => array(
248	'background' => true,
249	'text' => true,
250
251	// Don't apply styles to the block editor's div element.
252	// This ensures what's rendered in the Gutenberg editor matches the frontend output for styling.
253	// See: https://github.com/WordPress/gutenberg/issues/32417.
254	'__experimentalSkipSerialization' => true,
255	),
256	'typography' => array(
257	'fontSize' => true,
258	),
259	'spacing' => array(
260	'padding' => array(
261	'horizontal',
262	'vertical',
263	),
264	),
265	);
266
267	}
268
269	/**
270	* Returns this block's Fields
271	*
272	* @since 1.9.8.5
273	*
274	* @return bool\|array
275	*/
276	public function get_fields() {
277
278	// Bail if the request is not for the WordPress Administration or frontend editor.
279	if ( ! WP_ConvertKit()->is_admin_or_frontend_editor() ) {
280	return false;
281	}
282
283	// Get ConvertKit Products.
284	$products = array();
285	$convertkit_products = new ConvertKit_Resource_Products();
286	if ( $convertkit_products->exist() ) {
287	foreach ( $convertkit_products->get() as $product ) {
288	$products[ absint( $product['id'] ) ] = sanitize_text_field( $product['name'] );
289	}
290	}
291
292	// Gutenberg's built-in fields (such as styling, padding etc) don't need to be defined here, as they'll be included
293	// automatically by Gutenberg.
294	return array(
295	'product' => array(
296	'label' => __( 'Product', 'convertkit' ),
297	'type' => 'select',
298	'values' => $products,
299	),
300	'text' => array(
301	'label' => __( 'Button Text', 'convertkit' ),
302	'type' => 'text',
303	'description' => __( 'The text to display for the button.', 'convertkit' ),
304	),
305	'discount_code' => array(
306	'label' => __( 'Discount Code', 'convertkit' ),
307	'type' => 'text',
308	'description' => __( 'Optional: A discount code to include. Must be defined in the ConvertKit Product.', 'convertkit' ),
309	),
310	'disable_modal_on_mobile' => array(
311	'label' => __( 'Disable modal on mobile', 'convertkit' ),
312	'type' => 'toggle',
313	'description' => __( 'Recommended if the ConvertKit Product is a digital download being purchased on mobile, to ensure the subscriber can immediately download the PDF once purchased.', 'convertkit' ),
314	),
315
316	// These fields will only display on the shortcode, and are deliberately not registered in get_attributes(),
317	// because Gutenberg will register its own color pickers for link, background and text.
318	'background_color' => array(
319	'label' => __( 'Background color', 'convertkit' ),
320	'type' => 'color',
321	),
322	'text_color' => array(
323	'label' => __( 'Text color', 'convertkit' ),
324	'type' => 'color',
325	),
326	);
327
328	}
329
330	/**
331	* Returns this block's UI panels / sections.
332	*
333	* @since 1.9.8.5
334	*
335	* @return bool\|array
336	*/
337	public function get_panels() {
338
339	// Bail if the request is not for the WordPress Administration or frontend editor.
340	if ( ! WP_ConvertKit()->is_admin_or_frontend_editor() ) {
341	return false;
342	}
343
344	// Gutenberg's built-in fields (such as styling, padding etc) don't need to be defined here, as they'll be included
345	// automatically by Gutenberg.
346	return array(
347	'general' => array(
348	'label' => __( 'General', 'convertkit' ),
349	'fields' => array(
350	'product',
351	'text',
352	'discount_code',
353	'disable_modal_on_mobile',
354	'background_color',
355	'text_color',
356	),
357	),
358	);
359
360	}
361
362	/**
363	* Returns this block's Default Values
364	*
365	* @since 1.9.8.5
366	*
367	* @return array
368	*/
369	public function get_default_values() {
370
371	return array(
372	'product' => '',
373	'text' => __( 'Buy my product', 'convertkit' ),
374	'discount_code' => '',
375	'disable_modal_on_mobile' => false,
376	'background_color' => '',
377	'text_color' => '',
378
379	// Built-in Gutenberg block attributes.
380	'backgroundColor' => '',
381	'textColor' => '',
382	'fontSize' => '',
383	'style' => array(
384	'visualizers' => array(
385	'padding' => array(
386	'top' => '',
387	'bottom' => '',
388	'left' => '',
389	'right' => '',
390	),
391	),
392	),
393	);
394
395	}
396
397	/**
398	* Returns the block's output, based on the supplied configuration attributes.
399	*
400	* @since 1.9.8.5
401	*
402	* @param array $atts Block / Shortcode Attributes.
403	* @return string Output
404	*/
405	public function render( $atts ) {
406
407	// Parse attributes, defining fallback defaults if required
408	// and moving some attributes (such as Gutenberg's styles), if defined.
409	$atts = $this->sanitize_and_declare_atts( $atts );
410
411	// Setup Settings class.
412	$settings = new ConvertKit_Settings();
413
414	// Get Products Resource.
415	$convertkit_products = new ConvertKit_Resource_Products();
416
417	// Build HTML.
418	$html = $convertkit_products->get_html(
419	$atts['product'],
420	$atts['text'],
421	array(
422	'discount_code' => $atts['discount_code'],
423	'disable_modal' => ( $atts['disable_modal_on_mobile'] && wp_is_mobile() ),
424	'css_classes' => $atts['_css_classes'],
425	'css_styles' => $atts['_css_styles'],
426	'return_as_span' => $this->is_block_editor_request(),
427	)
428	);
429
430	// Bail if an error occured.
431	if ( is_wp_error( $html ) ) {
432	if ( $settings->debug_enabled() ) {
433	return '<!-- ' . $html->get_error_message() . ' -->';
434	}
435
436	return '';
437	}
438
439	/**
440	* Filter the block's content immediately before it is output.
441	*
442	* @since 1.9.8.5
443	*
444	* @param string $html ConvertKit Product button HTML.
445	* @param array $atts Block Attributes.
446	*/
447	$html = apply_filters( 'convertkit_block_product_render', $html, $atts );
448
449	return $html;
450
451	}
452
453	}
454