← All changes | includes/blocks/text-path/block.php +56 -20 2.9.1 → 2.14.0 View file →

		@@ -18,8 +18,9 @@
18	18	use ABlocks\Controls\TextStroke;
19	19	use ABlocks\Controls\Responsive;
20	20	use ABlocks\Controls\Color;
21	21	use ABlocks\Controls\TextShadow;
	22	+use ABlocks\Classes\CssGeneratorV2;
22	23
23	24
24	25	class Block extends BlockBaseAbstract {
25	26
		@@ -24,22 +25,55 @@
24	25	class Block extends BlockBaseAbstract {
25	26
26	27	protected $block_name = 'text-path';
27	28
28		- public function build_css( $attributes ) {
29		- $css_generator = new CssGenerator( $attributes );
	29	+ public function build_css_v1( $attributes ) {
	30	+ $css_generator = new CssGenerator( $attributes, $this->block_name );
30	31	$css_generator->add_class_styles(
31		- '{{WRAPPER}}',
32		- $this->get_wrapper_css( $attributes ),
33		- $this->get_wrapper_css( $attributes, 'Tablet' ),
34		- $this->get_wrapper_css( $attributes, 'Mobile' )
	32	+ '{{WRAPPER}}.ablocks-block--text-path:not(.ablocks-block-container),
	33	+ {{WRAPPER}}.ablocks-block--text-path .ablocks-block-container',
	34	+ $this->get_text_path_container_css( $attributes ),
	35	+ $this->get_text_path_container_css( $attributes, 'Tablet' ),
	36	+ $this->get_text_path_container_css( $attributes, 'Mobile' ),
	37	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_path_container_css( $attributes, $device ); } )
35	38	);
36	39
37	40	$css_generator->add_class_styles(
38		- '{{WRAPPER}} .ablocks-text-path',
	41	+ '{{WRAPPER}} .ablocks-text-path-text',
	42	+ $this->get_text_css( $attributes ),
	43	+ $this->get_text_css( $attributes, 'Tablet' ),
	44	+ $this->get_text_css( $attributes, 'Mobile' ),
	45	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_css( $attributes, $device ); } )
	46	+ );
	47	+
	48	+ $css_generator->add_class_styles(
	49	+ '{{WRAPPER}} .ablocks-text-path-text:hover',
	50	+ $this->get_text_hover_css( $attributes ),
	51	+ $this->get_text_hover_css( $attributes, 'Tablet' ),
	52	+ $this->get_text_hover_css( $attributes, 'Mobile' ),
	53	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_hover_css( $attributes, $device ); } )
	54	+ );
	55	+
	56	+ $css_generator->add_class_styles(
	57	+ '{{WRAPPER}} .ablocks-path-text-path',
	58	+ $this->get_text_path_css( $attributes ),
	59	+ $this->get_text_path_css( $attributes, 'Tablet' ),
	60	+ $this->get_text_path_css( $attributes, 'Mobile' ),
	61	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_path_css( $attributes, $device ); } )
	62	+ );
	63	+
	64	+ return $css_generator->generate_css();
	65	+ }
	66	+ public function build_css_v2( $attributes ) {
	67	+ $css_generator = new CssGeneratorV2( $attributes, $this->block_name );
	68	+
	69	+ $css_generator->add_class_styles(
	70	+ '{{WRAPPER}}.ablocks-block--text-path:not(.ablocks-block-container),
	71	+ {{WRAPPER}}.ablocks-block--text-path .ablocks-block-container',
39	72	$this->get_text_path_container_css( $attributes ),
40	73	$this->get_text_path_container_css( $attributes, 'Tablet' ),
41		- $this->get_text_path_container_css( $attributes, 'Mobile' )
	74	+ $this->get_text_path_container_css( $attributes, 'Mobile' ),
	75	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_path_container_css( $attributes, $device ); } )
42	76	);
43	77
44	78	$css_generator->add_class_styles(
45	79	'{{WRAPPER}} .ablocks-text-path-text',
		@@ -44,9 +78,10 @@
44	78	$css_generator->add_class_styles(
45	79	'{{WRAPPER}} .ablocks-text-path-text',
46	80	$this->get_text_css( $attributes ),
47	81	$this->get_text_css( $attributes, 'Tablet' ),
48		- $this->get_text_css( $attributes, 'Mobile' )
	82	+ $this->get_text_css( $attributes, 'Mobile' ),
	83	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_css( $attributes, $device ); } )
49	84	);
50	85
51	86	$css_generator->add_class_styles(
52	87	'{{WRAPPER}} .ablocks-text-path-text:hover',
		@@ -51,9 +86,10 @@
51	86	$css_generator->add_class_styles(
52	87	'{{WRAPPER}} .ablocks-text-path-text:hover',
53	88	$this->get_text_hover_css( $attributes ),
54	89	$this->get_text_hover_css( $attributes, 'Tablet' ),
55		- $this->get_text_hover_css( $attributes, 'Mobile' )
	90	+ $this->get_text_hover_css( $attributes, 'Mobile' ),
	91	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_hover_css( $attributes, $device ); } )
56	92	);
57	93
58	94	$css_generator->add_class_styles(
59	95	'{{WRAPPER}} .ablocks-path-text-path',
		@@ -58,16 +94,19 @@
58	94	$css_generator->add_class_styles(
59	95	'{{WRAPPER}} .ablocks-path-text-path',
60	96	$this->get_text_path_css( $attributes ),
61	97	$this->get_text_path_css( $attributes, 'Tablet' ),
62		- $this->get_text_path_css( $attributes, 'Mobile' )
	98	+ $this->get_text_path_css( $attributes, 'Mobile' ),
	99	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_text_path_css( $attributes, $device ); } )
63	100	);
64	101
65	102	return $css_generator->generate_css();
66	103	}
67		- // wrapper css grnerate
68		- public function get_wrapper_css( $attributes, $device = '' ) {
69		- return [ 'width' => '100%' ];
	104	+ public function build_css( $attributes ) {
	105	+ if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
	106	+ return $this->build_css_v2( $attributes );
	107	+ }
	108	+ return $this->build_css_v1( $attributes );
70	109	}
71	110	// text path css generate
72	111	public function get_text_css( $attributes, $device = '' ) {
73	112	$typography = isset( $attributes['typography'] ) && is_array( $attributes['typography'] )
		@@ -72,8 +111,9 @@
72	111	public function get_text_css( $attributes, $device = '' ) {
73	112	$typography = isset( $attributes['typography'] ) && is_array( $attributes['typography'] )
74	113	? $attributes['typography']
75	114	: [];
	115	+ $typographyValueGlobal = ! empty( $attributes['typographyGlobal'] ) ? $attributes['typographyGlobal'] : [];
76	116
77	117	$text_shadow = ! empty( $attributes['textShadow'] )
78	118	? TextShadow::get_css( $attributes['textShadow'], '', $device ) : [];
79	119
		@@ -79,9 +119,9 @@
79	119
80	120	$typography_value = array_merge( $typography, [ 'font-weight' => '400' ] );
81	121
82	122	return array_merge(
83		- Typography::get_css( $typography_value, $device ),
	123	+ Typography::get_css( $typography_value, '', $device, $typographyValueGlobal ),
84	124	$text_shadow
85	125	);
86	126	}
87	127
		@@ -102,13 +142,10 @@
102	142	}
103	143
104	144	// text hover css generate
105	145	public function get_text_hover_css( $attributes, $device = '' ) {
106		- $css = [];
107		- if ( ! empty( $attributes['textColorH'] ) ) {
108		- $css['fill'] = $attributes['textColorH'];
109		- }
110	146	return array_merge(
	147	+ [ 'fill' => Color::get_css( isset( $attributes['textColorH'] ) ? $attributes['textColorH'] : '' ) ],
111	148	Range::get_css([
112	149	'attributeValue' => isset( $attributes['transition'] ) ? $attributes['transition'] : '',
113	150	'attribute_object_key' => 'value',
114	151	'defaultValue' => 0,
		@@ -115,9 +152,8 @@
115	152	'unitDefaultValue' => 's',
116	153	'property' => 'transition-duration',
117	154	'device' => $device,
118	155	]),
119		- $css,
120	156	);
121	157	}
122	158	// path css genarate
123	159	public function get_text_path_css( $attributes, $device = '' ) {