← All changes | includes/blocks/modal/block.php +225 -0 2.7.5 → 2.14.0 View file →

		@@ -1,0 +1,225 @@
	1	+<?php
	2	+
	3	+namespace ABlocks\Blocks\Modal;
	4	+
	5	+if ( ! defined( 'ABSPATH' ) ) {
	6	+ exit;
	7	+}
	8	+
	9	+use ABlocks\Classes\BlockBaseAbstract;
	10	+use ABlocks\Classes\CssGenerator;
	11	+use ABlocks\Controls\Range;
	12	+use ABlocks\Controls\Dimensions;
	13	+use ABlocks\Controls\Background;
	14	+use ABlocks\Controls\BoxShadow;
	15	+use ABlocks\Controls\Border;
	16	+use ABlocks\Classes\CssGeneratorV2;
	17	+use ABlocks\Controls\Color;
	18	+
	19	+
	20	+class Block extends BlockBaseAbstract {
	21	+
	22	+ protected $block_name = 'modal';
	23	+
	24	+ public function build_css_v1( $attributes ) {
	25	+ $css_generator = new CssGenerator( $attributes, $this->block_name );
	26	+ if ( ! empty( $attributes['popupPosition'] ) && 'popup' === $attributes['popupPosition'] && ! empty( $attributes['popupTopOffset'] ) ) {
	27	+ $css_generator->add_class_styles(
	28	+ '{{WRAPPER}}.ablocks-block-modal-position--popup .ablocks-block-modal---panel-wrap .ablocks-modal-popup-content-wrap',
	29	+ [ 'margin-top' => $attributes['popupTopOffset'] . 'px' ]
	30	+ );
	31	+ }
	32	+ $css_generator->add_class_styles(
	33	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap',
	34	+ $this->get_panel_main_wrapper_css( $attributes ),
	35	+ $this->get_panel_main_wrapper_css( $attributes, 'Tablet' ),
	36	+ $this->get_panel_main_wrapper_css( $attributes, 'Mobile' ),
	37	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_main_wrapper_css( $attributes, $device ); } )
	38	+ );
	39	+ $css_generator->add_class_styles(
	40	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-content-wrap',
	41	+ $this->get_panel_content_wrap_css( $attributes ),
	42	+ $this->get_panel_content_wrap_css( $attributes, 'Tablet' ),
	43	+ $this->get_panel_content_wrap_css( $attributes, 'Mobile' ),
	44	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_content_wrap_css( $attributes, $device ); } )
	45	+ );
	46	+ $css_generator->add_class_styles(
	47	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-content-wrap:hover',
	48	+ $this->get_panel_content_wrap_hover_css( $attributes ),
	49	+ $this->get_panel_content_wrap_hover_css( $attributes, 'Tablet' ),
	50	+ $this->get_panel_content_wrap_hover_css( $attributes, 'Mobile' ),
	51	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_content_wrap_hover_css( $attributes, $device ); } )
	52	+ );
	53	+ if ( empty( $attributes['disableCloseButton'] ) ) {
	54	+ $css_generator->add_class_styles(
	55	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-close',
	56	+ $this->get_panel_close_button_css( $attributes ),
	57	+ $this->get_panel_close_button_css( $attributes, 'Tablet' ),
	58	+ $this->get_panel_close_button_css( $attributes, 'Mobile' ),
	59	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_close_button_css( $attributes, $device ); } )
	60	+ );
	61	+
	62	+ if ( ! empty( $attributes['closeBtnColor'] ) ) {
	63	+ $css_generator->add_class_styles(
	64	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-close svg',
	65	+ [ 'fill' => $attributes['closeBtnColor'] ]
	66	+ );
	67	+ }
	68	+ }
	69	+ return $css_generator->generate_css();
	70	+ }
	71	+ public function build_css_v2( $attributes ) {
	72	+ $css_generator = new CssGeneratorV2( $attributes, $this->block_name );
	73	+ if ( ! empty( $attributes['popupPosition'] ) && 'popup' === $attributes['popupPosition'] && ! empty( $attributes['popupTopOffset'] ) ) {
	74	+ $css_generator->add_class_styles(
	75	+ '{{WRAPPER}}.ablocks-block-modal-position--popup .ablocks-block-modal---panel-wrap .ablocks-modal-popup-content-wrap',
	76	+ [ 'margin-top' => $attributes['popupTopOffset'] . 'px' ]
	77	+ );
	78	+ }
	79	+ $css_generator->add_class_styles(
	80	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap',
	81	+ $this->get_panel_main_wrapper_css( $attributes ),
	82	+ $this->get_panel_main_wrapper_css( $attributes, 'Tablet' ),
	83	+ $this->get_panel_main_wrapper_css( $attributes, 'Mobile' ),
	84	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_main_wrapper_css( $attributes, $device ); } )
	85	+ );
	86	+ $css_generator->add_class_styles(
	87	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-content-wrap',
	88	+ $this->get_panel_content_wrap_css( $attributes ),
	89	+ $this->get_panel_content_wrap_css( $attributes, 'Tablet' ),
	90	+ $this->get_panel_content_wrap_css( $attributes, 'Mobile' ),
	91	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_content_wrap_css( $attributes, $device ); } )
	92	+ );
	93	+ $css_generator->add_class_styles(
	94	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-content-wrap:hover',
	95	+ $this->get_panel_content_wrap_hover_css( $attributes ),
	96	+ $this->get_panel_content_wrap_hover_css( $attributes, 'Tablet' ),
	97	+ $this->get_panel_content_wrap_hover_css( $attributes, 'Mobile' ),
	98	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_content_wrap_hover_css( $attributes, $device ); } )
	99	+ );
	100	+ if ( empty( $attributes['disableCloseButton'] ) ) {
	101	+ $css_generator->add_class_styles(
	102	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-close',
	103	+ $this->get_panel_close_button_css( $attributes ),
	104	+ $this->get_panel_close_button_css( $attributes, 'Tablet' ),
	105	+ $this->get_panel_close_button_css( $attributes, 'Mobile' ),
	106	+ $css_generator->custom_device_map( function ( $device ) use ( $attributes ) { return $this->get_panel_close_button_css( $attributes, $device ); } )
	107	+ );
	108	+
	109	+ if ( ! empty( $attributes['closeBtnColor'] ) ) {
	110	+ $css_generator->add_class_styles(
	111	+ '{{WRAPPER}} .ablocks-block-modal---panel-wrap.ablocks-block-modal---panel-wrap .ablocks-modal-popup-close svg',
	112	+ [ 'fill' => $attributes['closeBtnColor'] ]
	113	+ );
	114	+ }
	115	+ }
	116	+ return $css_generator->generate_css();
	117	+ }
	118	+ public function build_css( $attributes ) {
	119	+ if ( isset( $attributes['blockVersion'] ) && (int) $attributes['blockVersion'] === 2 ) {
	120	+ return $this->build_css_v2( $attributes );
	121	+ }
	122	+ return $this->build_css_v1( $attributes );
	123	+ }
	124	+
	125	+ public function get_panel_main_wrapper_css( $attributes, $device = '' ) {
	126	+ if ( ! empty( $device ) ) {
	127	+ return [];
	128	+ }
	129	+ return [ 'background-color' => Color::get_css( isset( $attributes['backdropColor'] ) ? $attributes['backdropColor'] : '' ) ];
	130	+ }
	131	+
	132	+ public function get_panel_content_wrap_css( $attributes, $device = '' ) {
	133	+ $css = [];
	134	+
	135	+ if ( empty( $device ) && ! empty( $attributes['panelContentPosition'] ) ) {
	136	+ $css['align-items'] = $attributes['panelContentPosition'];
	137	+ }
	138	+
	139	+ $Background_css = Background::get_css( $attributes['panelBackground'], 'background', $device );
	140	+ $Border_css = Border::get_css( $attributes['panelBorder'], '', $device );
	141	+ $BoxShadow_css = BoxShadow::get_css( $attributes['panelShadow'], 'box-shadow' );
	142	+
	143	+ $transition_css = [];
	144	+ if ( ! $device ) {
	145	+ $transition_value = 'all 1s';
	146	+ if ( ! empty( $Background_css['transition'] ) ) {
	147	+ $transition_value = $transition_value . ',' . $Background_css['transition'];
	148	+ }
	149	+ if ( ! empty( $Border_css['transition'] ) ) {
	150	+ $transition_value = $transition_value . ',' . $Border_css['transition'];
	151	+ }
	152	+ if ( ! empty( $BoxShadow_css['transition'] ) ) {
	153	+ $transition_value = $transition_value . ',' . $BoxShadow_css['transition'];
	154	+ }
	155	+ $transition_css['transition'] = $transition_value;
	156	+ }
	157	+
	158	+ return array_merge(
	159	+ Range::get_css([
	160	+ 'attributeValue' => $attributes['panelWidth'],
	161	+ 'attribute_object_key' => 'value',
	162	+ 'isResponsive' => true,
	163	+ 'hasUnit' => true,
	164	+ 'defaultValue' => 50,
	165	+ 'hasUnit' => true,
	166	+ 'unitDefaultValue' => '%',
	167	+ 'property' => 'width',
	168	+ 'device' => $device,
	169	+ ]),
	170	+ Range::get_css([
	171	+ 'attributeValue' => $attributes['panelHeight'],
	172	+ 'attribute_object_key' => 'value',
	173	+ 'isResponsive' => true,
	174	+ 'hasUnit' => true,
	175	+ 'defaultValue' => 50,
	176	+ 'hasUnit' => true,
	177	+ 'unitDefaultValue' => '%',
	178	+ 'property' => 'min-height',
	179	+ 'device' => $device,
	180	+ ]),
	181	+ isset( $attributes['barBorder'] ) ? Border::get_css( $attributes['barBorder'], '', $device ) : [],
	182	+ $css,
	183	+ $css,
	184	+ Dimensions::get_css( $attributes['panelPadding'], 'padding', $device ),
	185	+ $Background_css,
	186	+ $Border_css,
	187	+ $BoxShadow_css,
	188	+ $transition_css,
	189	+ );
	190	+ }
	191	+
	192	+ public function get_panel_content_wrap_hover_css( $attributes, $device = '' ) {
	193	+ $css = [];
	194	+ return array_merge(
	195	+ $css,
	196	+ Dimensions::get_css( $attributes['panelPadding'], 'padding', $device ),
	197	+ Background::get_hover_css( $attributes['panelBackground'], 'background', $device ),
	198	+ Border::get_hover_css( $attributes['panelBorder'], $device ),
	199	+ BoxShadow::get_hover_css( $attributes['panelShadow'] ),
	200	+ );
	201	+ }
	202	+
	203	+ public function get_panel_close_button_css( $attributes, $device = '' ) {
	204	+ $css = [];
	205	+ if ( empty( $device ) ) {
	206	+ if ( ! empty( $attributes['closeBtnBackgroundColor'] ) ) {
	207	+ $css['background-color'] = Color::get_css(
	208	+ isset( $attributes['closeBtnBackgroundColor'] ) ? $attributes['closeBtnBackgroundColor'] : '');
	209	+ }
	210	+ }
	211	+ if ( ! empty( $attributes['closeBtnTop'] ) || 0 === $attributes['closeBtnTop'] ) {
	212	+ $css['top'] = $attributes['closeBtnTop'] . 'px';
	213	+ }
	214	+ if ( ! empty( $attributes['closeBtnSide'] ) || 0 === $attributes['closeBtnSide'] ) {
	215	+ if ( 'left' === $attributes['closePosition'] ) {
	216	+ $css['left'] = $attributes['closeBtnSide'] . 'px';
	217	+ $css['right'] = 'unset';
	218	+ } else {
	219	+ $css['right'] = $attributes['closeBtnSide'] . 'px';
	220	+ $css['left'] = 'unset';
	221	+ }
	222	+ }
	223	+ return $css;
	224	+ }
	225	+}