← All changes | includes/blocks/social-shares/block.php +110 -32 2.9.1 → 2.14.0 View file →

		@@ -7,23 +7,26 @@
7	7	use ABlocks\Classes\BlockBaseAbstract;
8	8	use ABlocks\Classes\CssGenerator;
9	9	use ABlocks\Controls\Alignment;
10	10	use ABlocks\Controls\Border;
	11	+use ABlocks\Controls\BoxShadow;
11	12	use ABlocks\Controls\Typography;
12	13	use ABlocks\Controls\TextShadow;
13	14	use ABlocks\Controls\TextStroke;
14	15	use ABlocks\Controls\Range;
	16	+use ABlocks\Classes\CssGeneratorV2;
	17	+use ABlocks\Controls\Color;
15	18	class Block extends BlockBaseAbstract {
16	19	protected $block_name = 'social-shares';
17	20
18		- public function build_css( $attributes ) {
19		- // Initialize CSS Generator
20		- $css_generator = new CssGenerator( $attributes );
	21	+ public function build_css_v1( $attributes ) {
	22	+ $css_generator = new CssGenerator( $attributes, $this->block_name );
21	23	$css_generator->add_class_styles(
22	24	'{{WRAPPER}}.ablocks-block--social-shares .ablocks-block-container',
23	25	$this->get_share_css( $attributes, '' ),
24	26	$this->get_share_css( $attributes, 'Tablet' ),
25		- $this->get_share_css( $attributes, 'Mobile' )
	27	+ $this->get_share_css( $attributes, 'Mobile' ),
	28	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_css( $attributes, $device ); } )
26	29	);
27	30	// Social Button Styles
28	31	$css_generator->add_class_styles(
29	32	'{{WRAPPER}} .ablocks-block-container .ablocks-social-share',
		@@ -35,9 +38,10 @@
35	38	$css_generator->add_class_styles(
36	39	'{{WRAPPER}} .ablocks-block-container .ablocks-social-share:hover',
37	40	$this->get_share_border_hover_css( $attributes, '' ),
38	41	$this->get_share_border_hover_css( $attributes, 'Tablet' ),
39		- $this->get_share_border_hover_css( $attributes, 'Mobile' )
	42	+ $this->get_share_border_hover_css( $attributes, 'Mobile' ),
	43	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_border_hover_css( $attributes, $device ); } )
40	44	);
41	45	// share Icon Size
42	46	$css_generator->add_class_styles(
43	47	'{{WRAPPER}} .ablocks-social-share > .ablocks-svg-icon',
		@@ -55,15 +59,17 @@
55	59	$css_generator->add_class_styles(
56	60	'{{WRAPPER}} .ablocks-social-share-item',
57	61	$this->get_item_border_css( $attributes ),
58	62	$this->get_item_border_css( $attributes, 'Tablet' ),
59		- $this->get_item_border_css( $attributes, 'Mobile' )
	63	+ $this->get_item_border_css( $attributes, 'Mobile' ),
	64	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_item_border_css( $attributes, $device ); } )
60	65	);
61	66	$css_generator->add_class_styles(
62	67	'{{WRAPPER}} .ablocks-block-container .ablocks-social-share-item:hover',
63	68	$this->get_Item_border_hover_css( $attributes ),
64	69	$this->get_Item_border_hover_css( $attributes, 'Tablet' ),
65		- $this->get_Item_border_hover_css( $attributes, 'Mobile' )
	70	+ $this->get_Item_border_hover_css( $attributes, 'Mobile' ),
	71	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_Item_border_hover_css( $attributes, $device ); } )
66	72	);
67	73	$css_generator->add_class_styles(
68	74	'{{WRAPPER}} .ablocks-social-share-item--icon',
69	75	$this->get_share_item_css( $attributes ),
		@@ -79,13 +85,96 @@
79	85	$css_generator->add_class_styles(
80	86	'{{WRAPPER}} .ablocks-social-share-item--text',
81	87	$this->get_share_item_text_css( $attributes, '' ),
82	88	$this->get_share_item_text_css( $attributes, 'Tablet' ),
83		- $this->get_share_item_text_css( $attributes, 'Mobile' )
	89	+ $this->get_share_item_text_css( $attributes, 'Mobile' ),
	90	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_item_text_css( $attributes, $device ); } )
84	91	);
85	92	return $css_generator->generate_css();
86	93	}
	94	+ public function build_css_v2( $attributes ) {
	95	+ $css_generator = new CssGeneratorV2( $attributes, $this->block_name );
	96	+ $css_generator->add_class_styles(
	97	+ '{{WRAPPER}}.ablocks-block--social-shares:not(.ablocks-has-container),
	98	+ {{WRAPPER}}.ablocks-block--social-shares .ablocks-block-container',
	99	+ $this->get_share_css( $attributes, '' ),
	100	+ $this->get_share_css( $attributes, 'Tablet' ),
	101	+ $this->get_share_css( $attributes, 'Mobile' ),
	102	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_css( $attributes, $device ); } )
	103	+ );
	104	+ // Social Button Styles
	105	+ $css_generator->add_class_styles(
	106	+ '{{WRAPPER}} .ablocks-social-share',
	107	+ $this->get_social_share_bar_css( $attributes ),
	108	+ $this->get_social_share_bar_css( $attributes, 'Table' ),
	109	+ $this->get_social_share_bar_css( $attributes, 'Mobile' )
	110	+ );
	111	+ // share Hover Styles
	112	+ $css_generator->add_class_styles(
	113	+ '{{WRAPPER}} .ablocks-social-share:hover',
	114	+ $this->get_share_border_hover_css( $attributes, '' ),
	115	+ $this->get_share_border_hover_css( $attributes, 'Tablet' ),
	116	+ $this->get_share_border_hover_css( $attributes, 'Mobile' ),
	117	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_border_hover_css( $attributes, $device ); } )
	118	+ );
87	119
	120	+ // share Icon Size
	121	+ $css_generator->add_class_styles(
	122	+ '{{WRAPPER}} .ablocks-social-share > .ablocks-svg-icon',
	123	+ $this->get_share_icon_css( $attributes ),
	124	+ $this->get_share_icon_css( $attributes, 'Table' ),
	125	+ $this->get_share_icon_css( $attributes, 'Mobile' ),
	126	+ );
	127	+ $css_generator->add_class_styles(
	128	+ '{{WRAPPER}} .ablocks-social-share > .ablocks-svg-icon:hover',
	129	+ $this->get_share_icon_hover_css(
	130	+ $attributes
	131	+ ),
	132	+ );
	133	+ // item style
	134	+ $css_generator->add_class_styles(
	135	+ '{{WRAPPER}} .ablocks-social-share-item',
	136	+ $this->get_item_border_css( $attributes ),
	137	+ $this->get_item_border_css( $attributes, 'Tablet' ),
	138	+ $this->get_item_border_css( $attributes, 'Mobile' ),
	139	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_item_border_css( $attributes, $device ); } )
	140	+ );
	141	+ $css_generator->add_class_styles(
	142	+ '{{WRAPPER}} .ablocks-social-share-item:hover',
	143	+ $this->get_Item_border_hover_css( $attributes ),
	144	+ $this->get_Item_border_hover_css( $attributes, 'Tablet' ),
	145	+ $this->get_Item_border_hover_css( $attributes, 'Mobile' ),
	146	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_Item_border_hover_css( $attributes, $device ); } )
	147	+ );
	148	+ $css_generator->add_class_styles(
	149	+ '{{WRAPPER}} .ablocks-social-share-item--icon',
	150	+ $this->get_share_item_css( $attributes ),
	151	+ $this->get_share_item_css( $attributes, 'Tablet' ),
	152	+ $this->get_share_item_css( $attributes, 'Mobile' ),
	153	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_item_css( $attributes, $device ); } )
	154	+ );
	155	+ $css_generator->add_class_styles(
	156	+ '{{WRAPPER}} .ablocks-social-share-item--icon>.ablocks-svg-icon',
	157	+ $this->shareItemIconSVG( $attributes ),
	158	+ $this->shareItemIconSVG( $attributes, 'Tablet' ),
	159	+ $this->shareItemIconSVG( $attributes, 'Mobile' ),
	160	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->shareItemIconSVG( $attributes, $device ); } )
	161	+ );
	162	+ $css_generator->add_class_styles(
	163	+ '{{WRAPPER}} .ablocks-social-share-item--text',
	164	+ $this->get_share_item_text_css( $attributes, '' ),
	165	+ $this->get_share_item_text_css( $attributes, 'Tablet' ),
	166	+ $this->get_share_item_text_css( $attributes, 'Mobile' ),
	167	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_share_item_text_css( $attributes, $device ); } )
	168	+ );
	169	+ return $css_generator->generate_css();
	170	+ }
	171	+ public function build_css( $attributes ) {
	172	+ if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
	173	+ return $this->build_css_v2( $attributes );
	174	+ }
	175	+ return $this->build_css_v1( $attributes );
	176	+ }
88	177	public function get_share_css( $attributes, $device = '' ) {
89	178	$css = [];
90	179	$stack = $attributes[ 'stack' . $device ] ?? $attributes['stack'] ?? '';
91	180	if ( $stack === 'vertical' ) {
		@@ -126,14 +215,10 @@
126	215	}
127	216
128	217
129	218	public function get_social_share_bar_css( $attributes, $device = '' ) {
130		- $css = [
131		- 'background' => $attributes['buttonBackground'],
132		- ];
133		-
134	219	return array_merge(
135		- $css,
	220	+ [ 'background' => Color::get_css( isset( $attributes['buttonBackground'] ) ? $attributes['buttonBackground'] : '' ) ],
136	221	Border::get_css( $attributes['border'], $device ),
137	222	Range::get_css([
138	223	'attributeValue' => $attributes['shareSize'],
139	224	'attribute_object_key' => 'value',
		@@ -157,23 +242,16 @@
157	242	);
158	243	}
159	244
160	245	public function get_share_border_hover_css( $attributes, $device = '' ) {
161		- $css = [];
162		- if ( ! empty( $attributes['buttonHover'] ) ) {
163		- $css['background'] = $attributes['buttonHover'];
164		- }
165	246	return array_merge(
166		- $css,
	247	+ [ 'background' => Color::get_css( isset( $attributes['buttonHover'] ) ? $attributes['buttonHover'] : '' ) ],
167	248	( isset( $attributes['border'] ) ? Border::get_hover_css( $attributes['border'], '', $device ) : [] )
168	249	);
169	250	}
170	251	public function get_share_icon_css( $attributes, $device = '' ) {
171		- $css = [];
172		- if ( ! empty( $attributes['shareButtonIconColor'] ) ) {
173		- $css['fill'] = $attributes['shareButtonIconColor'] . ' !important';
174		- }
175		- return array_merge( $css,
	252	+ return array_merge(
	253	+ [ 'fill' => Color::get_css( isset( $attributes['shareButtonIconColor'] ) ? $attributes['shareButtonIconColor'] : '' ) . '!important' ],
176	254	Range::get_css( [
177	255	'attributeValue' => $attributes['shareIconSize'],
178	256	'attribute_object_key' => 'value',
179	257	'isResponsive' => false,
		@@ -195,14 +273,9 @@
195	273	] )
196	274	);
197	275	}
198	276	public function get_share_icon_hover_css( $attributes, $device = '' ) {
199		- $css = [];
200		-
201		- if ( ! empty( $attributes['shareButtonIconColorH'] ) ) {
202		- $css['fill'] = $attributes['shareButtonIconColorH'] . ' !important';
203		- }
204		- return $css;
	277	+ return [ 'fill' => Color::get_css( isset( $attributes['shareButtonIconColorH'] ) ? $attributes['shareButtonIconColorH'] : '' ) . '!important' ];
205	278	}
206	279	public function shareItemIconSVG( $attributes, $device = '' ) {
207	280	return Range::get_css( [
208	281	'attributeValue' => $attributes['shareItemIconSize'],
		@@ -243,13 +316,17 @@
243	316	public function get_item_border_css( $attributes, $device = '' ) {
244	317	$css = ( isset( $attributes['itemBorder'] )
245	318	? Border::get_css( $attributes['itemBorder'], '', $device )
246	319	: [] );
247		- return $css;
	320	+ return array_merge(
	321	+ $css,
	322	+ BoxShadow::get_css( $attributes['shareItemShadow'], '', $device ),
	323	+ );
248	324	}
249	325	public function get_Item_border_hover_css( $attributes, $device = '' ) {
250	326	return array_merge(
251		- ( isset( $attributes['itemBorder'] ) ? Border::get_hover_css( $attributes['itemBorder'], '', $device ) : [] )
	327	+ ( isset( $attributes['itemBorder'] ) ? Border::get_hover_css( $attributes['itemBorder'], '', $device ) : [] ),
	328	+ BoxShadow::get_hover_css( $attributes['shareItemShadow'], '', $device )
252	329	);
253	330	}
254	331	public function get_share_item_text_css( $attributes, $device = '' ) {
255	332	$css = [];
		@@ -272,14 +349,15 @@
272	349	'unitDefaultValue' => 'px',
273	350	'property' => 'height',
274	351	'device' => $device,
275	352	] );
	353	+ $typographyValueGlobal = ! empty( $attributes['typographyGlobal'] ) ? $attributes['typographyGlobal'] : array();
276	354	return array_merge(
277	355	$css,
278	356	$range_width,
279	357	$range_height,
280	358	isset( $attributes['alignment'] ) ? Alignment::get_css( $attributes['alignment'], 'text-align', $device ) : [],
281		- isset( $attributes['typography'] ) ? Typography::get_css( $attributes['typography'], '', $device ) : [],
	359	+ isset( $attributes['typography'] ) ? Typography::get_css( $attributes['typography'], '', $device, $typographyValueGlobal ) : [],
282	360	isset( $attributes['textShadow'] ) ? TextShadow::get_css( $attributes['textShadow'], '', $device ) : [],
283	361	isset( $attributes['textStroke'] ) ? TextStroke::get_css( $attributes['textStroke'], '', $device ) : []
284	362	);
285	363	}