← All changes | includes/controls/icon.php +359 -0 2.7.6 → 2.13.0 View file →

		@@ -1,0 +1,359 @@
	1	+<?php
	2	+namespace ABlocks\Controls;
	3	+
	4	+if ( ! defined( 'ABSPATH' ) ) {
	5	+ exit;
	6	+}
	7	+
	8	+
	9	+use ABlocks\Controls\Dimensions;
	10	+use ABlocks\Controls\Range;
	11	+use ABlocks\Helper;
	12	+use ABlocks\Controls\Color;
	13	+use ABlocks\Controls\Border;
	14	+use ABlocks\Controls\BoxShadow;
	15	+
	16	+class Icon {
	17	+ public static function get_attribute_default_value( $is_responsive = false ) {
	18	+ return [];
	19	+ }
	20	+
	21	+ public static function get_attribute( $attribute_prefix = 'icon', $default = [] ) {
	22	+ $default_args = wp_parse_args($default, [
	23	+ 'path' => 'M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 448c-110.3 0-200-89.7-200-200S137.7 56 248 56s200 89.7 200 200-89.7 200-200 200zm84-143.4c-20.8 25-51.5 39.4-84 39.4s-63.2-14.3-84-39.4c-8.5-10.2-23.6-11.5-33.8-3.1-10.2 8.5-11.5 23.6-3.1 33.8 30 36 74.1 56.6 120.9 56.6s90.9-20.6 120.9-56.6c8.5-10.2 7.1-25.3-3.1-33.8-10.2-8.4-25.3-7.1-33.8 3.1zM136.5 211c7.7-13.7 19.2-21.6 31.5-21.6s23.8 7.9 31.5 21.6l9.5 17c2.1 3.7 6.2 4.7 9.3 3.7 3.6-1.1 6-4.5 5.7-8.3-3.3-42.1-32.2-71.4-56-71.4s-52.7 29.3-56 71.4c-.3 3.7 2.1 7.2 5.7 8.3 3.4 1.1 7.4-.5 9.3-3.7l9.5-17zM328 152c-23.8 0-52.7 29.3-56 71.4-.3 3.7 2.1 7.2 5.7 8.3 3.5 1.1 7.4-.5 9.3-3.7l9.5-17c7.7-13.7 19.2-21.6 31.5-21.6s23.8 7.9 31.5 21.6l9.5 17c2.1 3.7 6.2 4.7 9.3 3.7 3.6-1.1 6-4.5 5.7-8.3-3.3-42.1-32.2-71.4-56-71.4z',
	24	+ 'viewBox' => '0 0 496 512',
	25	+ 'className' => 'far fa-smile-beam',
	26	+ 'hasNoSelectorOrSource' => false,
	27	+ 'size' => 55,
	28	+ 'color' => '#69727d',
	29	+ 'BgColor' => '',
	30	+ 'hoverColor' => '',
	31	+ 'iconType' => 'default',
	32	+ 'iconShape' => 'circle',
	33	+ ]);
	34	+
	35	+ $svgPathKey = $attribute_prefix . 'SvgPath';
	36	+ $svgViewBoxKey = $attribute_prefix . 'SvgViewBox';
	37	+ $svgClassKey = $attribute_prefix . 'Class';
	38	+ $customImageUrl = $attribute_prefix . 'ImageUrl';
	39	+ $customImageID = $attribute_prefix . 'ImageID';
	40	+ $customImageSize = $attribute_prefix . 'ImageSize';
	41	+
	42	+ $attribute = [
	43	+ $svgPathKey => [
	44	+ 'type' => 'string',
	45	+ 'default' => $default_args['path'],
	46	+ ],
	47	+ $svgViewBoxKey => [
	48	+ 'type' => 'string',
	49	+ 'default' => $default_args['viewBox'],
	50	+ ],
	51	+ $svgClassKey => [
	52	+ 'type' => 'string',
	53	+ 'default' => $default_args['className'],
	54	+ ],
	55	+ $customImageUrl => [
	56	+ 'type' => 'string',
	57	+ 'default' => '',
	58	+ ],
	59	+ $customImageID => [
	60	+ 'type' => 'number',
	61	+ 'default' => 0,
	62	+ ],
	63	+ $customImageSize => [
	64	+ 'type' => 'string',
	65	+ 'default' => '',
	66	+ ],
	67	+ $attribute_prefix . 'Color' => [
	68	+ 'type' => 'string',
	69	+ 'default' => $default_args['color'],
	70	+ ],
	71	+ $attribute_prefix . 'BgColor' => [
	72	+ 'type' => 'string',
	73	+ 'default' => $default_args['BgColor'],
	74	+ ],
	75	+ $attribute_prefix . 'HoverColor' => [
	76	+ 'type' => 'string',
	77	+ 'default' => $default_args['hoverColor'],
	78	+ ],
	79	+ $attribute_prefix . 'HoverBgColor' => [
	80	+ 'type' => 'string',
	81	+ 'default' => $default_args['BgColor'],
	82	+ ],
	83	+ $attribute_prefix . 'Type' => [
	84	+ 'type' => 'string',
	85	+ 'default' => $default_args['iconType'],
	86	+ ],
	87	+ $attribute_prefix . 'Shape' => [
	88	+ 'type' => 'string',
	89	+ 'default' => $default_args['iconShape'],
	90	+ ],
	91	+ ];
	92	+
	93	+ // Add additional attributes if 'hasNoSelectorOrSource' is false
	94	+ if ( ! $default_args['hasNoSelectorOrSource'] ) {
	95	+ $attribute[ $svgPathKey ]['source'] = 'attribute';
	96	+ $attribute[ $svgPathKey ]['selector'] = 'svg.ablocks-svg-icon path';
	97	+ $attribute[ $svgPathKey ]['attribute'] = 'd';
	98	+
	99	+ $attribute[ $svgViewBoxKey ]['source'] = 'attribute';
	100	+ $attribute[ $svgViewBoxKey ]['selector'] = 'svg.ablocks-svg-icon';
	101	+ $attribute[ $svgViewBoxKey ]['attribute'] = 'viewBox';
	102	+ }
	103	+
	104	+ $attribute = array_merge(
	105	+ $attribute,
	106	+ Dimensions::get_attribute( $attribute_prefix . 'Padding', false ),
	107	+ Border::get_attribute( $attribute_prefix . 'Border', false ),
	108	+ BoxShadow::get_attribute( $attribute_prefix . 'BoxShadow', true ),
	109	+ Range::get_attribute([
	110	+ 'attributeName' => $attribute_prefix . 'Size',
	111	+ 'isResponsive' => false,
	112	+ 'defaultValue' => $default_args['size'],
	113	+ ]),
	114	+ Range::get_attribute([
	115	+ 'attributeName' => $attribute_prefix . 'Rotate',
	116	+ 'isResponsive' => false,
	117	+ 'defaultValue' => 0,
	118	+ ]),
	119	+ Range::get_attribute([
	120	+ 'attributeName' => $attribute_prefix . 'Sizing',
	121	+ 'attributeObjectKey' => 'value',
	122	+ 'isResponsive' => true,
	123	+ 'hasUnit' => true,
	124	+ 'unitDefaultValue' => 'px',
	125	+ 'defaultValue' => $default_args['size'],
	126	+
	127	+ ]),
	128	+ Range::get_attribute([
	129	+ 'attributeName' => $attribute_prefix . 'Rotated',
	130	+ 'attributeObjectKey' => 'value',
	131	+ 'isResponsive' => true,
	132	+ 'hasUnit' => true,
	133	+ 'unitDefaultValue' => 'deg',
	134	+ 'defaultValue' => 0,
	135	+ ]),
	136	+ Range::get_attribute([
	137	+ 'attributeName' => $attribute_prefix . 'RotateHover',
	138	+ 'attributeObjectKey' => 'value',
	139	+ 'isResponsive' => true,
	140	+ 'hasUnit' => true,
	141	+ 'unitDefaultValue' => 'deg',
	142	+ 'defaultValue' => 0,
	143	+ ] ),
	144	+ Range::get_attribute([
	145	+ 'attributeName' => $attribute_prefix . 'transitionDuration',
	146	+ 'isResponsive' => false,
	147	+ 'defaultValue' => 0,
	148	+ ] ),
	149	+ Range::get_attribute([
	150	+ 'attributeName' => $attribute_prefix . 'ImageWidth',
	151	+ 'isResponsive' => false,
	152	+ 'defaultValue' => 0,
	153	+ ])
	154	+ );
	155	+
	156	+ return $attribute;
	157	+ }
	158	+
	159	+ public static function get_css( $attribute_value, $property = '', $device = '' ) {
	160	+ return [];
	161	+ }
	162	+
	163	+
	164	+
	165	+ public static function get_wrapper_css( $attributes, $device = '', $attributePrefix = 'icon' ) {
	166	+ $iconType = $attributes[ $attributePrefix . 'Type' ];
	167	+ $iconShape = $attributes[ $attributePrefix . 'Shape' ];
	168	+ $backgroundColor = Color::get_css( $attributes[ $attributePrefix . 'BgColor' ] );
	169	+ $primaryColor = Color::get_css( $attributes[ $attributePrefix . 'Color' ] );
	170	+ $iconViewCSS = [];
	171	+
	172	+ if ( $iconType !== 'default' ) {
	173	+ if ( $iconType === 'stacked' ) {
	174	+ if ( $iconShape === 'circle' ) {
	175	+ $iconViewCSS = [
	176	+ 'background' => $backgroundColor ? $backgroundColor : '#ddd',
	177	+ 'border-radius' => '50%',
	178	+ 'padding' => '.5em',
	179	+ ];
	180	+ } elseif ( $iconShape === 'square' ) {
	181	+ $iconViewCSS = [
	182	+ 'background' => $backgroundColor ? $backgroundColor : '#ddd',
	183	+ 'padding' => '.5em',
	184	+ ];
	185	+ }
	186	+ } elseif ( $iconType === 'framed' ) {
	187	+ if ( $iconShape === 'circle' ) {
	188	+ $iconViewCSS = [
	189	+ 'background' => $backgroundColor ? $backgroundColor : 'transparent',
	190	+ 'padding' => '.5em',
	191	+ 'border-radius' => '50%',
	192	+ 'border' => '2px solid ' . ( Color::get_css( $primaryColor ? $primaryColor : '#69727d' ) ),
	193	+ ];
	194	+ } elseif ( $iconShape === 'square' ) {
	195	+ $iconViewCSS = [
	196	+ 'background' => $backgroundColor ? $backgroundColor : 'transparent',
	197	+ 'padding' => '.5em',
	198	+ 'border' => '2px solid ' . ( Color::get_css( $primaryColor ? $primaryColor : '#69727d' ) ),
	199	+ ];
	200	+ }
	201	+ }//end if
	202	+ }//end if
	203	+
	204	+ if ( ! empty( $attributes[ $attributePrefix . 'Sizing' ] ) && empty( $attributes[ $attributePrefix . 'ImageUrl' ] ) ) {
	205	+ $sizeValue = isset( $attributes[ $attributePrefix . 'Sizing' ][ 'value' . $device ] ) ? $attributes[ $attributePrefix . 'Sizing' ][ 'value' . $device ] : $attributes[ $attributePrefix . 'Sizing' ]['value'];
	206	+
	207	+ $sizeUnit = self::get_unit( [
	208	+ 'attributeValue' => $attributes[ $attributePrefix . 'Sizing' ],
	209	+ 'attributeObjectKey' => 'value',
	210	+ 'unitDefaultValue' => 'px',
	211	+ 'device' => $device,
	212	+ ] );
	213	+
	214	+ $iconViewCSS['font-size'] = $sizeValue . $sizeUnit;
	215	+ }
	216	+ // Remove font size for fixing
	217	+ if ( isset( $attributes[ $attributePrefix . 'ImageUrl' ] ) && ! empty( $attributes[ $attributePrefix . 'ImageUrl' ] ) ) {
	218	+ $iconViewCSS['font-size'] = 'unset';
	219	+ }
	220	+
	221	+ return array_merge(
	222	+ [ 'background' => $backgroundColor ],
	223	+ $iconViewCSS,
	224	+ 'default' !== $iconType ? array_merge(
	225	+ Dimensions::get_css( $attributes[ $attributePrefix . 'Padding' ], 'padding', $device ),
	226	+ Border::get_css( $attributes[ $attributePrefix . 'Border' ], 'border', $device ),
	227	+ BoxShadow::get_css( $attributes[ $attributePrefix . 'BoxShadow' ], '', $device )
	228	+ ) : []
	229	+ );
	230	+ }
	231	+
	232	+ public static function get_wrapper_hover_css( $attributes, $device = '', $attributePrefix = 'icon' ) {
	233	+ $primaryHoverColor = Color::get_css( $attributes[ $attributePrefix . 'HoverBgColor' ] ?? '' );
	234	+ $iconViewHoverCSS = [];
	235	+
	236	+ if ( $primaryHoverColor ) {
	237	+ $iconViewHoverCSS['background'] = $primaryHoverColor;
	238	+ }
	239	+
	240	+ return array_merge(
	241	+ Border::get_hover_css( $attributes[ $attributePrefix . 'Border' ], 'border', $device ),
	242	+ BoxShadow::get_hover_css( $attributes[ $attributePrefix . 'BoxShadow' ], '', $device ),
	243	+ $iconViewHoverCSS
	244	+ );
	245	+ }
	246	+
	247	+ public static function get_element_css( $attributes, $device = '', $attributePrefix = 'icon' ) {
	248	+ $iconType = $attributes[ $attributePrefix . 'Type' ] ?? 'default';
	249	+ $iconShape = $attributes[ $attributePrefix . 'Shape' ] ?? '';
	250	+ $primaryColor = Color::get_css( $attributes[ $attributePrefix . 'Color' ] ?? '#69727d' );
	251	+ $rotate = ! empty( $attributes[ $attributePrefix . 'Rotated' ][ 'value' . $device ] ) ?? 0;
	252	+ $iconViewCSS = [];
	253	+
	254	+ if ( ! empty( $attributes[ $attributePrefix . 'Rotated' ][ 'value' . $device ] ) ) {
	255	+ $rotate = $attributes[ $attributePrefix . 'Rotated' ][ 'value' . $device ];
	256	+ }
	257	+
	258	+ if ( $iconType !== 'default' ) {
	259	+ $iconViewCSS['fill'] = $primaryColor;
	260	+ }
	261	+
	262	+ if ( $rotate ) {
	263	+ $iconViewCSS['transform'] = 'rotate(' . $rotate . 'deg)';
	264	+ }
	265	+
	266	+ return array_merge(
	267	+ [ 'fill' => $primaryColor ],
	268	+ $iconViewCSS
	269	+ );
	270	+ }
	271	+
	272	+ public static function get_element_image_css( $attributes, $device = '', $attributePrefix = 'icon' ) {
	273	+ $rotate = ! empty( $attributes[ $attributePrefix . 'Rotated' ][ 'value' . $device ] ) ?? 0;
	274	+ $iconViewCSS = [];
	275	+
	276	+ if ( isset( $attributes[ $attributePrefix . 'Rotated' ][ 'value' . $device ] ) ) {
	277	+ $rotate = $attributes[ $attributePrefix . 'Rotated' ][ 'value' . $device ];
	278	+ }
	279	+
	280	+ if ( $rotate ) {
	281	+ $iconViewCSS['transform'] = 'rotate(' . $rotate . 'deg)';
	282	+ }
	283	+ if ( isset( $attributes[ $attributePrefix . 'ImageUrl' ] ) ) {
	284	+ $image_size_value = isset( $attributes[ $attributePrefix . 'Sizing' ][ 'value' . $device ] )
	285	+ ? $attributes[ $attributePrefix . 'Sizing' ][ 'value' . $device ]
	286	+ : $attributes[ $attributePrefix . 'Sizing' ]['value'];
	287	+
	288	+ $image_size_unit = isset( $attributes[ $attributePrefix . 'Sizing' ][ 'valueUnit' . $device ] )
	289	+ ? $attributes[ $attributePrefix . 'Sizing' ][ 'valueUnit' . $device ]
	290	+ : ( isset( $attributes[ $attributePrefix . 'Sizing' ]['valueUnit'] )
	291	+ ? $attributes[ $attributePrefix . 'Sizing' ]['valueUnit']
	292	+ : '' );
	293	+
	294	+ if ( empty( $image_size_unit ) ) {
	295	+ $image_size_unit = 'px';
	296	+ }
	297	+
	298	+ $iconViewCSS['width'] = "{$image_size_value}{$image_size_unit}";
	299	+ }
	300	+
	301	+ return array_merge(
	302	+ [
	303	+ 'height' => 'auto'
	304	+ ],
	305	+ $iconViewCSS
	306	+ );
	307	+ }
	308	+
	309	+ public static function get_element_image_hover_css( $attributes, $device = '', $attributePrefix = 'icon' ) {
	310	+ $rotateHover = $attributes[ $attributePrefix . 'RotateHover' ][ 'value' . $device ] ?? 0;
	311	+ $transitionHover = $attributes[ $attributePrefix . 'transitionDuration' ] ?? 0;
	312	+ $HoverColor = Color::get_css( $attributes[ $attributePrefix . 'HoverColor' ] ?? '' );
	313	+ $iconViewCSS = [];
	314	+ if ( isset( $attributes[ $attributePrefix . 'RotateHover' ][ 'value' . $device ] ) ) {
	315	+ $rotateHover = $attributes[ $attributePrefix . 'RotateHover' ][ 'value' . $device ];
	316	+ }
	317	+ if ( $rotateHover ) {
	318	+ $iconViewCSS['transform'] = 'rotate(' . $rotateHover . 'deg)';
	319	+ }
	320	+ if ( $transitionHover ) {
	321	+ $iconViewCSS['transition'] = $transitionHover . 's';
	322	+ }
	323	+
	324	+ if ( $HoverColor ) {
	325	+ $iconViewCSS['fill'] = $HoverColor;
	326	+ }
	327	+ return array_merge(
	328	+ $iconViewCSS
	329	+ );
	330	+ }
	331	+
	332	+ // copy from control-base-abstract-two.php
	333	+ public static function get_unit( $args ) {
	334	+ $defaultUnit = $args['unitDefaultValue'];
	335	+ $value = $args['attributeValue'];
	336	+ $device = $args['device'];
	337	+ $keyPrefix = $args['attributeObjectKey'] . 'Unit';
	338	+
	339	+ // Retrieve units with fallback to default
	340	+ $unitDesktop = Helper::get_array_value( $value, $keyPrefix, $defaultUnit ); // Desktop
	341	+ $unitTablet = Helper::get_array_value( $value, $keyPrefix . 'Tablet', $unitDesktop ); // Tablet inherits from Desktop
	342	+ $unitMobile = Helper::get_array_value( $value, $keyPrefix . 'Mobile', $unitTablet ); // Mobile inherits from Tablet
	343	+
	344	+ // Return the appropriate unit based on the device
	345	+ if ( '' === $device ) {
	346	+ return $unitDesktop; // Desktop
	347	+ }
	348	+
	349	+ if ( 'Tablet' === $device ) {
	350	+ return $unitTablet; // Tablet
	351	+ }
	352	+
	353	+ if ( 'Mobile' === $device ) {
	354	+ return $unitMobile; // Mobile
	355	+ }
	356	+
	357	+ return $defaultUnit; // Default fallback
	358	+ }
	359	+}