merchant / inc / modules / size-chart / class-size-chart.php

class-size-chart.php in Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant 1.6, at inc/modules/size-chart/class-size-chart.php

314 lines 13.2 KB

Raw Download Zip

1	<?php
2
3	/**
4	* Size Chart
5	*
6	* @package Merchant
7	*/
8
9	if ( ! defined( 'ABSPATH' ) ) {
10	exit; // Exit if accessed directly
11	}
12
13	/**
14	* Size Chart class.
15	*
16	*/
17	class Merchant_Size_Chart extends Merchant_Add_Module {
18
19	/**
20	* Module ID.
21	*
22	*/
23	const MODULE_ID = 'size-chart';
24
25	/**
26	* Is module preview.
27	*
28	*/
29	public static $is_module_preview = false;
30
31	/**
32	* Constructor.
33	*
34	*/
35	public function __construct() {
36	// Module id.
37	$this->module_id = self::MODULE_ID;
38
39	// WooCommerce only.
40	$this->wc_only = true;
41
42	// Parent construct.
43	parent::__construct();
44
45	// Module section.
46	$this->module_section = 'improve-experience';
47
48	// Module default settings.
49	$this->module_default_settings = array(
50	'global_size_chart' => '',
51	'text' => __( 'Size Chart', 'merchant' ),
52	'icon' => 'icon-size-chart'
53	);
54
55	// Mount preview url.
56	$preview_url = site_url( '/' );
57
58	if ( function_exists( 'wc_get_products' ) ) {
59	$products = wc_get_products( array( 'limit' => 1 ) );
60
61	if ( ! empty( $products ) && ! empty( $products[0] ) ) {
62	$preview_url = get_permalink( $products[0]->get_id() );
63	}
64	}
65
66	// Module data.
67	$this->module_data = Merchant_Admin_Modules::$modules_data[ self::MODULE_ID ];
68	$this->module_data['preview_url'] = $preview_url;
69
70	// Module options path.
71	$this->module_options_path = MERCHANT_DIR . 'inc/modules/' . self::MODULE_ID . '/admin/options.php';
72
73	// Is module preview page.
74	if ( is_admin() && parent::is_module_settings_page() ) {
75	self::$is_module_preview = true;
76
77	// Enqueue admin styles.
78	add_action( 'admin_enqueue_scripts', array( $this, 'admin_enqueue_css' ) );
79
80	// Enqueue admin scripts.
81	add_action( 'admin_enqueue_scripts', array( $this, 'admin_enqueue_scripts' ) );
82
83	// Render module essencial instructions before the module page body content.
84	add_action( 'merchant_admin_after_module_page_page_header', array( $this, 'admin_module_essencial_instructions' ) );
85
86	// Admin preview box.
87	add_filter( 'merchant_module_preview', array( $this, 'render_admin_preview' ), 10, 2 );
88
89	// Custom CSS.
90	// The custom CSS should be added here as well due to ensure preview box works properly.
91	add_filter( 'merchant_custom_css', array( $this, 'admin_custom_css' ) );
92	}
93	}
94
95	/**
96	* Admin enqueue CSS.
97	*
98	* @return void
99	*/
100	public function admin_enqueue_css() {
101	if ( parent::is_module_settings_page() ) {
102	wp_enqueue_style( 'merchant-' . self::MODULE_ID, MERCHANT_URI . 'assets/css/modules/' . self::MODULE_ID . '/size-chart.min.css', [], MERCHANT_VERSION );
103	wp_enqueue_style( 'merchant-admin-' . self::MODULE_ID, MERCHANT_URI . 'assets/css/modules/' . self::MODULE_ID . '/admin/preview.min.css', array(), MERCHANT_VERSION );
104	}
105	}
106
107	/**
108	* Admin Enqueue scripts.
109	*
110	* @return void
111	*/
112	public function admin_enqueue_scripts() {
113	// Register and enqueue the main module script.
114	wp_enqueue_script( 'merchant-' . self::MODULE_ID, MERCHANT_URI . 'assets/js/modules/' . self::MODULE_ID . '/size-chart.min.js', array(), MERCHANT_VERSION, true );
115	}
116
117	/**
118	* Render module essencial instructions.
119	*
120	* @return void
121	*/
122	public function admin_module_essencial_instructions() { ?>
123	<div class="merchant-module-page-settings">
124	<div class="merchant-module-page-setting-box merchant-module-page-setting-box-style-2">
125	<div class="merchant-module-page-setting-fields">
126	<div class="merchant-module-page-setting-field merchant-module-page-setting-field-content">
127	<div class="merchant-module-page-setting-field-inner">
128	<div class="merchant-tag-pre-orders">
129	<i class="dashicons dashicons-info"></i>
130	<p><?php echo esc_html__( 'You can have as many size charts you want and either specify in which product you want to add them or simply enable one globally to be displayed in all products. But if you want to display different size charts for each product, that\'s possible from admin product edit page.',
131	'merchant' ); ?><?php echo sprintf( '<a href="%s" target="_blank">%s</a>',
132	esc_url( admin_url( 'edit.php?post_type=product' ) ),
133	esc_html__( 'View All Products', 'merchant' ) ); ?></p>
134	</div>
135	</div>
136	</div>
137	</div>
138	</div>
139	</div>
140
141	<?php
142	}
143
144	/**
145	* Render admin preview
146	*
147	* @param Merchant_Admin_Preview $preview
148	* @param string $module
149	*
150	* @return Merchant_Admin_Preview
151	*/
152	public function render_admin_preview( $preview, $module ) {
153	if ( self::MODULE_ID === $module ) {
154	ob_start();
155	self::admin_preview_content();
156	$content = ob_get_clean();
157
158	// HTML.
159	$preview->set_html( $content );
160
161	// Label Text.
162	$preview->set_text( 'text', '.merchant-product-size-chart-button span' );
163
164	// Icon.
165	$preview->set_svg_icon( 'icon', '.size-chart-icon' );
166	}
167
168	return $preview;
169	}
170
171	/**
172	* Admin preview content.
173	*
174	* @return void
175	*/
176	public function admin_preview_content() {
177	$settings = $this->get_module_settings();
178
179	?>
180
181	<div class="mrc-preview-single-product-elements">
182	<div class="mrc-preview-left-column">
183	<div class="mrc-preview-product-image-wrapper">
184	<div class="mrc-preview-product-image"></div>
185	<div class="mrc-preview-product-image-thumbs">
186	<div class="mrc-preview-product-image-thumb"></div>
187	<div class="mrc-preview-product-image-thumb"></div>
188	<div class="mrc-preview-product-image-thumb"></div>
189	</div>
190	</div>
191	</div>
192	<div class="mrc-preview-right-column">
193	<div class="mrc-preview-text-placeholder"></div>
194	<div class="mrc-preview-text-placeholder mrc-mw-70"></div>
195	<div class="mrc-preview-text-placeholder mrc-mw-30"></div>
196	<div class="merchant-product-size-chart">
197	<div class="merchant-product-size-chart-button">
198	<a href="#">
199	<div class="size-chart-icon">
200	<?php echo wp_kses( Merchant_SVG_Icons::get_svg_icon( $settings['icon'] ), merchant_kses_allowed_tags( [], false ) ); ?>
201	</div>
202	<span><?php echo esc_html( $settings['text'] ); ?></span>
203	</a>
204	</div>
205	<div class="merchant-product-size-chart-modal">
206	<div class="merchant-product-size-chart-modal-inner">
207	<div class="merchant-product-size-chart-modal-close">
208	<?php echo wp_kses( Merchant_SVG_Icons::get_svg_icon( 'icon-close' ), merchant_kses_allowed_tags( [], false ) ); ?>
209	</div>
210	<div class="merchant-product-size-chart-modal-title">
211	<?php echo esc_html__( 'Size Chart Modal Title', 'merchant' ); ?>
212	</div>
213	<div class="merchant-product-size-chart-modal-tables">
214	<table class="merchant-product-size-chart-modal-table active">
215	<thead>
216	<tr>
217	<th><?php echo esc_html__( 'US', 'merchant' ); ?></th>
218	<th><?php echo esc_html__( 'EU', 'merchant' ); ?></th>
219	<th><?php echo esc_html__( 'UK', 'merchant' ); ?></th>
220	</tr>
221	</thead>
222	<tbody>
223	<tr>
224	<td>3</td>
225	<td>35</td>
226	<td>5</td>
227	</tr>
228	<tr>
229	<td>4</td>
230	<td>36</td>
231	<td>6</td>
232	</tr>
233	<tr>
234	<td>5</td>
235	<td>37</td>
236	<td>7</td>
237	</tr>
238	<tr>
239	<td>6</td>
240	<td>38</td>
241	<td>8</td>
242	</tr>
243	<tr>
244	<td>7</td>
245	<td>39</td>
246	<td>9</td>
247	</tr>
248	</tbody>
249	</table>
250	</div>
251	<div class="merchant-product-size-chart-modal-content">
252	<p>Lorem ipsum dolor sit a met, dont dolor sit a la quat. </p>
253	</div>
254	</div>
255	</div>
256	</div>
257	<div class="mrc-preview-addtocart-placeholder"></div>
258	</div>
259	</div>
260
261	<?php
262	}
263
264	/**
265	* Custom CSS.
266	*
267	* @return string
268	*/
269	public function get_module_custom_css() {
270	$css = '';
271
272	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'icon-size', 24, '.merchant-product-size-chart', '--mrc-sc-icon-size', 'px' );
273	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'title-text-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-title-text-color' );
274	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'title-text-color-hover', '#757575', '.merchant-product-size-chart', '--mrc-sc-title-text-color-hover' );
275	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'icon-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-icon-color' );
276	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'icon-color-hover', '#757575', '.merchant-product-size-chart', '--mrc-sc-icon-color-hover' );
277
278	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'popup-width', 750, '.merchant-product-size-chart', '--mrc-sc-popup-width', 'px' );
279	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'background-color', '#f2f2f2', '.merchant-product-size-chart', '--mrc-sc-background-color' );
280	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'close-icon-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-close-icon-color' );
281	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'close-icon-color-hover', '#757575', '.merchant-product-size-chart', '--mrc-sc-close-icon-color-hover' );
282	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'title-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-title-color' );
283	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'tabs-color', '#757575', '.merchant-product-size-chart', '--mrc-sc-tabs-color' );
284	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'tabs-color-active', '#212121', '.merchant-product-size-chart', '--mrc-sc-tabs-color-active' );
285	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'table-headings-background-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-table-headings-background-color' );
286	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'table-headings-text-color', '#ffffff', '.merchant-product-size-chart', '--mrc-sc-table-headings-text-color' );
287	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'table-body-background-color', '#ffffff', '.merchant-product-size-chart', '--mrc-sc-table-body-background-color' );
288	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'table-body-text-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-table-body-text-color' );
289	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'description-text-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-description-text-color' );
290	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'description-link-color', '#212121', '.merchant-product-size-chart', '--mrc-sc-description-link-color' );
291	$css .= Merchant_Custom_CSS::get_variable_css( self::MODULE_ID, 'description-link-color-hover', '#757575', '.merchant-product-size-chart', '--mrc-sc-description-link-color-hover' );
292
293	return $css;
294	}
295
296	/**
297	* Admin custom CSS.
298	*
299	* @param string $css The custom CSS.
300	*
301	* @return string $css The custom CSS.
302	*/
303	public function admin_custom_css( $css ) {
304	$css .= $this->get_module_custom_css();
305
306	return $css;
307	}
308	}
309
310	// Initialize the module.
311	add_action( 'init', function () {
312	Merchant_Modules::create_module( new Merchant_Size_Chart() );
313	} );
314