← All changes | includes/blocks/toggle/block.php +213 -0 1.0 → 2.14.0 View file →

		@@ -1,0 +1,213 @@
	1	+<?php
	2	+namespace ABlocks\Blocks\Toggle;
	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\Typography;
	13	+use ABlocks\Controls\Range;
	14	+use ABlocks\Controls\Dimensions;
	15	+use ABlocks\Controls\Border;
	16	+use ABlocks\Controls\Color;
	17	+
	18	+
	19	+class Block extends BlockBaseAbstract {
	20	+ protected $block_name = 'toggle';
	21	+
	22	+ public function build_css_v1( $attributes ) {
	23	+ $css_generator = new CssGenerator( $attributes );
	24	+
	25	+ $css_generator->add_class_styles(
	26	+ '{{WRAPPER}} .ablocks-toggle__topbar',
	27	+ $this->get_toggle_bar_css( $attributes ),
	28	+ $this->get_toggle_bar_css( $attributes, 'Tablet' ),
	29	+ $this->get_toggle_bar_css( $attributes, 'Mobile' ),
	30	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_bar_css( $attributes, $device ); } )
	31	+ );
	32	+ $css_generator->add_class_styles(
	33	+ '{{WRAPPER}} .ablocks-toggle__topbar:hover',
	34	+ $this->get_toggle_bar_hover_css( $attributes ),
	35	+ $this->get_toggle_bar_hover_css( $attributes, 'Tablet' ),
	36	+ $this->get_toggle_bar_hover_css( $attributes, 'Mobile' ),
	37	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_bar_hover_css( $attributes, $device ); } )
	38	+ );
	39	+ $css_generator->add_class_styles(
	40	+ '{{WRAPPER}} .ablocks-toggle__topbar-wrapper',
	41	+ $this->get_toggle_bar_wrapper_css( $attributes ),
	42	+ $this->get_toggle_bar_wrapper_css( $attributes, 'Tablet' ),
	43	+ $this->get_toggle_bar_wrapper_css( $attributes, 'Mobile' ),
	44	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_bar_wrapper_css( $attributes, $device ); } )
	45	+ );
	46	+ $css_generator->add_class_styles(
	47	+ '{{WRAPPER}} .ablocks-toggle__label',
	48	+ $this->get_toggle_label_css( $attributes ),
	49	+ $this->get_toggle_label_css( $attributes, 'Tablet' ),
	50	+ $this->get_toggle_label_css( $attributes, 'Mobile' ),
	51	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_label_css( $attributes, $device ); } )
	52	+ );
	53	+ $css_generator->add_class_styles(
	54	+ '{{WRAPPER}} .ablocks-toggle__label--active',
	55	+ $this->get_toggle_label_active_css( $attributes )
	56	+ );
	57	+
	58	+ if ( ! empty( $attributes['toggleNormalBgColor'] ) ) {
	59	+ $css_generator->add_class_styles(
	60	+ '{{WRAPPER}} .ablocks-toggle__slider',
	61	+ [ 'background-color' => $attributes['toggleNormalBgColor'] ]
	62	+ );
	63	+ }
	64	+
	65	+ if ( ! empty( $attributes['toggleNormalColor'] ) ) {
	66	+ $css_generator->add_class_styles(
	67	+ '{{WRAPPER}} .ablocks-toggle__slider:before',
	68	+ [ 'background-color' => $attributes['toggleNormalColor'] ]
	69	+ );
	70	+ }
	71	+
	72	+ if ( ! empty( $attributes['toggleActiveBgColor'] ) ) {
	73	+ $css_generator->add_class_styles(
	74	+ '{{WRAPPER}} input.ablocks-toggle__checkbox:checked + .ablocks-toggle__slider',
	75	+ [ 'background-color' => $attributes['toggleActiveBgColor'] ]
	76	+ );
	77	+ }
	78	+
	79	+ if ( ! empty( $attributes['toggleActiveColor'] ) ) {
	80	+ $css_generator->add_class_styles(
	81	+ '{{WRAPPER}} input.ablocks-toggle__checkbox:checked + .ablocks-toggle__slider:before',
	82	+ [ 'background-color' => $attributes['toggleActiveColor'] ]
	83	+ );
	84	+ }
	85	+
	86	+ return $css_generator->generate_css();
	87	+ }
	88	+ public function build_css_v2( $attributes ) {
	89	+ $css_generator = new CssGeneratorV2( $attributes );
	90	+
	91	+ $css_generator->add_class_styles(
	92	+ '{{WRAPPER}} .ablocks-toggle__topbar',
	93	+ $this->get_toggle_bar_css( $attributes ),
	94	+ $this->get_toggle_bar_css( $attributes, 'Tablet' ),
	95	+ $this->get_toggle_bar_css( $attributes, 'Mobile' ),
	96	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_bar_css( $attributes, $device ); } )
	97	+ );
	98	+ $css_generator->add_class_styles(
	99	+ '{{WRAPPER}} .ablocks-toggle__topbar:hover',
	100	+ $this->get_toggle_bar_hover_css( $attributes ),
	101	+ $this->get_toggle_bar_hover_css( $attributes, 'Tablet' ),
	102	+ $this->get_toggle_bar_hover_css( $attributes, 'Mobile' ),
	103	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_bar_hover_css( $attributes, $device ); } )
	104	+ );
	105	+ $css_generator->add_class_styles(
	106	+ '{{WRAPPER}} .ablocks-toggle__topbar-wrapper',
	107	+ $this->get_toggle_bar_wrapper_css( $attributes ),
	108	+ $this->get_toggle_bar_wrapper_css( $attributes, 'Tablet' ),
	109	+ $this->get_toggle_bar_wrapper_css( $attributes, 'Mobile' ),
	110	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_bar_wrapper_css( $attributes, $device ); } )
	111	+ );
	112	+ $css_generator->add_class_styles(
	113	+ '{{WRAPPER}} .ablocks-toggle__label',
	114	+ $this->get_toggle_label_css( $attributes ),
	115	+ $this->get_toggle_label_css( $attributes, 'Tablet' ),
	116	+ $this->get_toggle_label_css( $attributes, 'Mobile' ),
	117	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_toggle_label_css( $attributes, $device ); } )
	118	+ );
	119	+ $css_generator->add_class_styles(
	120	+ '{{WRAPPER}} .ablocks-toggle__label--active',
	121	+ $this->get_toggle_label_active_css( $attributes )
	122	+ );
	123	+
	124	+ if ( ! empty( $attributes['toggleNormalBgColor'] ) ) {
	125	+ $css_generator->add_class_styles(
	126	+ '{{WRAPPER}} .ablocks-toggle__slider',
	127	+ [ 'background-color' => Color::get_css( isset( $attributes['toggleNormalBgColor'] ) ? $attributes['toggleNormalBgColor'] : '' ) ]
	128	+ );
	129	+ }
	130	+
	131	+ if ( ! empty( $attributes['toggleNormalColor'] ) ) {
	132	+ $css_generator->add_class_styles(
	133	+ '{{WRAPPER}} .ablocks-toggle__slider:before',
	134	+ [ 'background-color' => Color::get_css( isset( $attributes['toggleNormalColor'] ) ? $attributes['toggleNormalColor'] : '' ) ]
	135	+ );
	136	+ }
	137	+
	138	+ if ( ! empty( $attributes['toggleActiveBgColor'] ) ) {
	139	+ $css_generator->add_class_styles(
	140	+ '{{WRAPPER}} input.ablocks-toggle__checkbox:checked + .ablocks-toggle__slider',
	141	+ [ 'background-color' => Color::get_css( isset( $attributes['toggleActiveBgColor'] ) ? $attributes['toggleActiveBgColor'] : '' ) ]
	142	+ );
	143	+ }
	144	+
	145	+ if ( ! empty( $attributes['toggleActiveColor'] ) ) {
	146	+ $css_generator->add_class_styles(
	147	+ '{{WRAPPER}} input.ablocks-toggle__checkbox:checked + .ablocks-toggle__slider:before',
	148	+ [ 'background-color' => Color::get_css( isset( $attributes['toggleActiveColor'] ) ? $attributes['toggleActiveColor'] : '' ) ]
	149	+ );
	150	+ }
	151	+
	152	+ return $css_generator->generate_css();
	153	+ }
	154	+ public function build_css( $attributes ) {
	155	+ if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
	156	+ return $this->build_css_v2( $attributes );
	157	+ }
	158	+ return $this->build_css_v1( $attributes );
	159	+ }
	160	+
	161	+ public function get_toggle_bar_css( $attributes, $device = '' ) {
	162	+
	163	+ return array_merge(
	164	+ [ 'background-color' => Color::get_css( isset( $attributes['toggleBarBgColor'] ) ? $attributes['toggleBarBgColor'] : '' ) ],
	165	+ Range::get_css([
	166	+ 'attributeValue' => $attributes['space'],
	167	+ 'attribute_object_key' => 'value',
	168	+ 'isResponsive' => true,
	169	+ 'defaultValue' => 10,
	170	+ 'unitDefaultValue' => 'px',
	171	+ 'property' => 'margin-bottom',
	172	+ 'device' => $device,
	173	+ ]),
	174	+ isset( $attributes['alignment'] ) ? Alignment::get_css( $attributes['alignment'], 'text-align', $device ) : [],
	175	+ isset( $attributes['toggleBarBorder'] ) ? Border::get_css( $attributes['toggleBarBorder'], '', $device ) : [],
	176	+ isset( $attributes['toggleBarPadding'] ) ? Dimensions::get_css( $attributes['toggleBarPadding'], 'padding', $device ) : [],
	177	+ );
	178	+ }
	179	+
	180	+ public function get_toggle_bar_wrapper_css( $attributes, $device = '' ) {
	181	+ $toggleBarWrapperCSS = Range::get_css([
	182	+ 'attributeValue' => $attributes['gap'],
	183	+ 'attribute_object_key' => 'value',
	184	+ 'isResponsive' => true,
	185	+ 'defaultValue' => 10,
	186	+ 'unitDefaultValue' => 'px',
	187	+ 'property' => 'gap',
	188	+ 'device' => $device,
	189	+ ]);
	190	+
	191	+ if ( ! empty( $attributes['toggleDirection'] ) ) {
	192	+ $toggleBarWrapperCSS['flex-direction'] = $attributes['toggleDirection'];
	193	+ }
	194	+ return $toggleBarWrapperCSS;
	195	+ }
	196	+
	197	+ public function get_toggle_bar_hover_css( $attributes, $device = '' ) {
	198	+ return isset( $attributes['toggleBarBorder'] ) ? Border::get_hover_css( $attributes['toggleBarBorder'], $device ) : [];
	199	+ }
	200	+
	201	+ public function get_toggle_label_css( $attributes, $device = '' ) {
	202	+ $typographyValueGlobal = ! empty( $attributes['labelTypographyGlobal'] ) ? $attributes['labelTypographyGlobal'] : [];
	203	+ $labelCSS = isset( $attributes['labelTypography'] ) ? Typography::get_css( $attributes['labelTypography'], '', $device, $typographyValueGlobal ) : [];
	204	+ return array_merge(
	205	+ [ 'color' => Color::get_css( isset( $attributes['labelNormalColor'] ) ? $attributes['labelNormalColor'] : '' ) ],
	206	+ $labelCSS
	207	+ );
	208	+ }
	209	+
	210	+ public function get_toggle_label_active_css( $attributes ) {
	211	+ return [ 'color' => Color::get_css( isset( $attributes['labelActiveColor'] ) ? $attributes['labelActiveColor'] : '' ) ];
	212	+ }
	213	+}