ablocks / includes / blocks / progress-tracker / block.php

block.php in aBlocks – Gutenberg Blocks, User Dashboard Builder, Popup Builder, Form Builder & Animation Builder 2.14.0, at includes/blocks/progress-tracker/block.php

229 lines 8.5 KB

Raw Download Zip

1	<?php
2	namespace ABlocks\Blocks\ProgressTracker;
3
4	if ( ! defined( 'ABSPATH' ) ) {
5	exit;
6	}
7
8	use ABlocks\Classes\BlockBaseAbstract;
9	use ABlocks\Classes\CssGenerator;
10	use ABlocks\Classes\CssGeneratorV2;
11	use ABlocks\Controls\Alignment;
12	use ABlocks\Controls\TextShadow;
13	use ABlocks\Controls\TextStroke;
14	use ABlocks\Controls\Typography;
15	use Google\Service\Slides\Shadow;
16	use ABlocks\Controls\Border;
17	use ABlocks\Controls\Range;
18	use ABlocks\Controls\Color;
19
20	class Block extends BlockBaseAbstract {
21	protected $block_name = 'progress-tracker';
22
23
24	public function build_css_v1( $attributes ) {
25	$css_generator = new CssGenerator( $attributes, $this->block_name );
26
27	// Generate wrapper CSS start
28	$css_generator->add_class_styles(
29	'{{WRAPPER}} .ablocks-block-progress-circle',
30	$this->get_wrapper_css( $attributes ),
31	$this->get_wrapper_css( $attributes, 'Tablet' ),
32	$this->get_wrapper_css( $attributes, 'Mobile' ),
33	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_wrapper_css( $attributes, $device ); } )
34	);
35
36	$css_generator->add_class_styles(
37	'{{WRAPPER}} .ablocks-block-progress__text',
38	$this->get_content_css( $attributes ),
39	$this->get_content_css( $attributes, 'Tablet' ),
40	$this->get_content_css( $attributes, 'Mobile' ),
41	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_content_css( $attributes, $device ); } )
42	);
43	// Progress Bar Background CSS
44	$css_generator->add_class_styles(
45	'{{WRAPPER}} .ablocks-block-progress-bar-track',
46	$this->get_progress_bar_track_css( $attributes ),
47	$this->get_progress_bar_track_css( $attributes, 'Tablet' ),
48	$this->get_progress_bar_track_css( $attributes, 'Mobile' ),
49	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_progress_bar_track_css( $attributes, $device ); } )
50	);
51
52	$css_generator->add_class_styles(
53	'{{WRAPPER}} .ablocks-block-progress-bar-track:hover',
54	$this->get_progress_bar_hover_css( $attributes ),
55	$this->get_progress_bar_hover_css( $attributes, 'Tablet' ),
56	$this->get_progress_bar_hover_css( $attributes, 'Mobile' ),
57	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_progress_bar_hover_css( $attributes, $device ); } )
58	);
59
60	// Progress Bar Progress CSS
61	$css_generator->add_class_styles(
62	'{{WRAPPER}} .ablocks-block-progress-bar',
63	$this->get_progress_bar_css( $attributes )
64	);
65
66	// circle css
67	$css_generator->add_class_styles(
68	'{{WRAPPER}} .ablocks-block-progress-circle__svg-bar',
69	$this->get_progress_circle_css( $attributes ),
70	);
71	$css_generator->add_class_styles(
72	'{{WRAPPER}} .ablocks-block-progress-circle__svg-track',
73	$this->get_progress_circle_bg_css( $attributes ),
74	);
75
76	return $css_generator->generate_css();
77	}
78
79
80	public function build_css_v2( $attributes ) {
81	$css_generator = new CssGeneratorV2( $attributes, $this->block_name );
82	// Generate wrapper CSS start
83	$css_generator->add_class_styles(
84	'{{WRAPPER}} .ablocks-block-progress-circle',
85	$this->get_wrapper_css( $attributes ),
86	$this->get_wrapper_css( $attributes, 'Tablet' ),
87	$this->get_wrapper_css( $attributes, 'Mobile' ),
88	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_wrapper_css( $attributes, $device ); } )
89	);
90
91	$css_generator->add_class_styles(
92	'{{WRAPPER}} .ablocks-block-progress__text',
93	$this->get_content_css( $attributes ),
94	$this->get_content_css( $attributes, 'Tablet' ),
95	$this->get_content_css( $attributes, 'Mobile' ),
96	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_content_css( $attributes, $device ); } )
97	);
98	// Progress Bar Background CSS
99	$css_generator->add_class_styles(
100	'{{WRAPPER}} .ablocks-block-progress-bar-track',
101	$this->get_progress_bar_track_css( $attributes ),
102	$this->get_progress_bar_track_css( $attributes, 'Tablet' ),
103	$this->get_progress_bar_track_css( $attributes, 'Mobile' ),
104	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_progress_bar_track_css( $attributes, $device ); } )
105	);
106
107	$css_generator->add_class_styles(
108	'{{WRAPPER}} .ablocks-block-progress-bar-track:hover',
109	$this->get_progress_bar_hover_css( $attributes ),
110	$this->get_progress_bar_hover_css( $attributes, 'Tablet' ),
111	$this->get_progress_bar_hover_css( $attributes, 'Mobile' ),
112	$css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_progress_bar_hover_css( $attributes, $device ); } )
113	);
114
115	// Progress Bar Progress CSS
116	$css_generator->add_class_styles(
117	'{{WRAPPER}} .ablocks-block-progress-bar',
118	$this->get_progress_bar_css( $attributes )
119	);
120
121	// circle css
122	$css_generator->add_class_styles(
123	'{{WRAPPER}} .ablocks-block-progress-circle__svg-bar',
124	$this->get_progress_circle_css( $attributes ),
125	);
126	$css_generator->add_class_styles(
127	'{{WRAPPER}} .ablocks-block-progress-circle__svg-track',
128	$this->get_progress_circle_bg_css( $attributes ),
129	);
130
131	return $css_generator->generate_css();
132	}
133
134	public function build_css( $attributes ) {
135	if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
136	return $this->build_css_v2( $attributes );
137	}
138	return $this->build_css_v1( $attributes );
139	}
140
141
142	public function get_wrapper_css( $attributes, $device = '' ) {
143	$alignment_key = 'value' . $device;
144	$alignment = isset( $attributes['alignment'][ $alignment_key ] )
145	? $attributes['alignment'][ $alignment_key ]
146	: 'center';
147	switch ( $alignment ) {
148	case 'center':
149	$justify_content_value = 'center';
150	break;
151	case 'right':
152	$justify_content_value = 'flex-end';
153	break;
154	default:
155	$justify_content_value = 'flex-start';
156	break;
157	}
158	return array(
159	'display' => 'flex',
160	'justify-content' => $justify_content_value,
161	);
162	}
163
164
165	public function get_content_css( $attributes, $device = '' ) {
166	$typography = isset( $attributes['contentTypography'] ) ? $attributes['contentTypography'] : '';
167	$text_stroke = isset( $attributes['contentTextStroke'] ) ? $attributes['contentTextStroke'] : '';
168	$text_shadow = isset( $attributes['contentTextShadow'] ) ? $attributes['contentTextShadow'] : '';
169	$typographyValueGlobal = ! empty( $attributes['contentTypographyGlobal'] ) ? $attributes['contentTypographyGlobal'] : array();
170	return array_merge(
171	[ 'color' => Color::get_css( isset( $attributes['contentColor'] ) ? $attributes['contentColor'] : '' ) ],
172	Typography::get_css( $typography, '', $device, $typographyValueGlobal ),
173	TextStroke::get_css( $text_stroke, '', $device ),
174	TextShadow::get_css( $text_shadow, '', $device )
175	);
176	}
177	public function get_progress_bar_track_css( $attributes, $device = '' ) {
178	return array_merge(
179	[ 'background' => Color::get_css( isset( $attributes['barBackgroundColor'] ) ? $attributes['barBackgroundColor'] : '' ) ],
180	Range::get_css([
181	'attributeValue' => $attributes['barHeightSize'],
182	'attribute_object_key' => 'value',
183	'isResponsive' => true,
184	'defaultValue' => 40,
185	'hasUnit' => true,
186	'unitDefaultValue' => 'px',
187	'property' => 'height',
188	'device' => $device,
189	]),
190	isset( $attributes['barBorder'] ) ? Border::get_css( $attributes['barBorder'], '', $device ) : [],
191	);
192	}
193	public function get_progress_bar_hover_css( $attributes, $device = '' ) {
194	return array_merge(
195	isset( $attributes['barBorder'] ) ? Border::get_hover_css( $attributes['barBorder'], '', $device ) : []
196	);
197	}
198
199	public function get_progress_bar_css( $attributes ) {
200	$css = [];
201	if ( ! empty( $attributes['direction'] ) && $attributes['direction'] === 'left' ) {
202	$css['justify-content'] = 'right';
203	} elseif ( ! empty( $attributes['direction'] ) && $attributes['direction'] === 'right' ) {
204	$css['justify-content'] = 'left';
205	}
206	return array_merge(
207	$css,
208	[ 'background' => Color::get_css( isset( $attributes['barProgressColor'] ) ? $attributes['barProgressColor'] : '' ) ]
209	);
210	}
211
212	public function get_progress_circle_css( $attributes ) {
213	return [ 'stroke' => Color::get_css( isset( $attributes['circleProgressColor'] ) ? $attributes['circleProgressColor'] : '' ) ];
214	}
215
216	public function get_progress_circle_bg_css( $attributes ) {
217	return array_merge(
218	[ 'stroke' => Color::get_css( isset( $attributes['circleBackgroundColor'] ) ? $attributes['circleBackgroundColor'] : '' ) ],
219	Range::get_css([
220	'attributeValue' => $attributes['circleStrokeSize'],
221	'attribute_object_key' => 'value',
222	'defaultValue' => 10,
223	'unitDefaultValue' => 'px',
224	'property' => 'stroke-width'
225	]),
226	);
227	}
228	}
229