base.php
3 months ago
border.php
3 months ago
dimensions.php
3 months ago
range.php
3 months ago
typography.php
3 months ago
border.php
196 lines
| 1 | <?php |
| 2 | namespace Crocoblock\Blocks_Style\Field_Handlers; |
| 3 | |
| 4 | class Border extends Base { |
| 5 | |
| 6 | /** |
| 7 | * Replace data in the string with CSS variable macros. |
| 8 | * |
| 9 | * @param string $string String with macros. |
| 10 | * @param array $data Data to replace in the string. |
| 11 | * |
| 12 | * @return array |
| 13 | */ |
| 14 | public function parse_variable( $variable = array() ) { |
| 15 | |
| 16 | $prefix = isset($variable['prefix']) ? $variable['prefix'] : ''; |
| 17 | $name = isset($variable['name']) ? $variable['name'] : false; |
| 18 | $full_name = isset($variable['full_name']) ? $variable['full_name'] : $prefix . '-' . $name; |
| 19 | |
| 20 | if ( ! $full_name ) { |
| 21 | return array(); |
| 22 | } |
| 23 | |
| 24 | if ( isset( $variable['suffix'] ) ) { |
| 25 | $full_name .= $variable['suffix']; |
| 26 | } |
| 27 | |
| 28 | $values = $this->get_parsed_value(); |
| 29 | $result = array(); |
| 30 | |
| 31 | if ( ! empty( $values['radius'] ) ) { |
| 32 | |
| 33 | $radius = ''; |
| 34 | |
| 35 | if ( is_string( $values['radius'] ) ) { |
| 36 | $radius = $values['radius']; |
| 37 | } else { |
| 38 | $props_order = [ |
| 39 | 'topLeft', |
| 40 | 'topRight', |
| 41 | 'bottomRight', |
| 42 | 'bottomLeft', |
| 43 | ]; |
| 44 | |
| 45 | foreach ( $props_order as $prop ) { |
| 46 | $radius .= isset( $values['radius'][ $prop ] ) ? $values['radius'][ $prop ] . ' ' : '0 '; |
| 47 | } |
| 48 | |
| 49 | $radius = trim( $radius ); |
| 50 | } |
| 51 | |
| 52 | $result[] = $full_name . '__radius: ' . $radius; |
| 53 | } |
| 54 | |
| 55 | if ( ! empty( $values['border'] ) && is_array( $values['border'] ) ) { |
| 56 | |
| 57 | $global = isset( $values['border']['global'] ) ? $values['border']['global'] : []; |
| 58 | $sides = [ 'top', 'right', 'bottom', 'left' ]; |
| 59 | |
| 60 | foreach ( $sides as $side ) { |
| 61 | $side_props = isset( $values['border'][ $side ] ) && is_array( $values['border'][ $side ] ) |
| 62 | ? $values['border'][ $side ] |
| 63 | : []; |
| 64 | |
| 65 | $color = isset( $side_props['color'] ) ? $side_props['color'] : ( isset( $global['color'] ) ? $global['color'] : 'transparent' ); |
| 66 | $width = isset( $side_props['width'] ) ? $side_props['width'] : ( isset( $global['width'] ) ? $global['width'] : '0' ); |
| 67 | $style = isset( $side_props['style'] ) ? $side_props['style'] : ( isset( $global['style'] ) ? $global['style'] : 'solid' ); |
| 68 | |
| 69 | $result[] = $full_name . '__' . $side . ': ' . $width . ' ' . $style . ' ' . $color; |
| 70 | } |
| 71 | } |
| 72 | |
| 73 | return $result; |
| 74 | } |
| 75 | |
| 76 | /** |
| 77 | * Get the parsed value. |
| 78 | * |
| 79 | * @return array |
| 80 | */ |
| 81 | public function get_parsed_value() { |
| 82 | if ( ! $this->raw_value ) { |
| 83 | return [ |
| 84 | 'border' => [], |
| 85 | 'radius' => [], |
| 86 | ]; |
| 87 | } else { |
| 88 | return [ |
| 89 | 'border' => $this->parse_border_value(isset($this->raw_value['border']) ? $this->raw_value['border'] : null), |
| 90 | 'radius' => isset($this->raw_value['radius']) ? $this->raw_value['radius'] : null, |
| 91 | ]; |
| 92 | } |
| 93 | } |
| 94 | |
| 95 | /** |
| 96 | * Parse the border value. |
| 97 | * |
| 98 | * @param mixed $value The raw border value. |
| 99 | * @return array Parsed border value. |
| 100 | */ |
| 101 | public function parse_border_value($value) { |
| 102 | |
| 103 | if ( ! $value ) { |
| 104 | return []; |
| 105 | } |
| 106 | |
| 107 | if ( isset($value['color']) || isset($value['width']) || isset($value['style']) ) { |
| 108 | return [ |
| 109 | 'global' => [ |
| 110 | 'color' => isset($value['color']) ? $value['color'] : 'inherit', |
| 111 | 'width' => isset($value['width']) ? $value['width'] : 'inherit', |
| 112 | 'style' => isset($value['style']) ? $value['style'] : 'inherit', |
| 113 | ] |
| 114 | ]; |
| 115 | } else { |
| 116 | return $value; |
| 117 | } |
| 118 | } |
| 119 | |
| 120 | /** |
| 121 | * Get parsed properties for CSS. |
| 122 | * We ignore the $rule_string parameter as it is not used for this type of field. |
| 123 | * |
| 124 | * @param string $rule_string Properties to parse. |
| 125 | * @return string Parsed CSS properties. |
| 126 | */ |
| 127 | public function get_css_rule( $rule_string = '' ) { |
| 128 | |
| 129 | $values = $this->get_parsed_value(); |
| 130 | |
| 131 | $result = ''; |
| 132 | |
| 133 | if ( isset($values['border']) && is_array($values['border']) ) { |
| 134 | foreach ( $values['border'] as $key => $value ) { |
| 135 | if ( $key === 'global' ) { |
| 136 | $result .= $this->get_border_css($value); |
| 137 | } else { |
| 138 | $result .= $this->get_border_css($value, $key); |
| 139 | } |
| 140 | } |
| 141 | } |
| 142 | |
| 143 | if ( isset($values['radius']) ) { |
| 144 | if ( is_array($values['radius']) ) { |
| 145 | $props_map = [ |
| 146 | 'border-top-left-radius' => 'topLeft', |
| 147 | 'border-top-right-radius' => 'topRight', |
| 148 | 'border-bottom-right-radius' => 'bottomRight', |
| 149 | 'border-bottom-left-radius' => 'bottomLeft', |
| 150 | ]; |
| 151 | |
| 152 | foreach ( $props_map as $css_prop => $radius_key ) { |
| 153 | if ( isset($values['radius'][$radius_key]) ) { |
| 154 | $result .= $css_prop . ': ' . $values['radius'][$radius_key] . ';'; |
| 155 | } |
| 156 | } |
| 157 | } else { |
| 158 | $result .= 'border-radius: ' . $values['radius'] . ';'; |
| 159 | } |
| 160 | } |
| 161 | |
| 162 | return $result; |
| 163 | } |
| 164 | |
| 165 | /** |
| 166 | * Get CSS for border properties by key. |
| 167 | * |
| 168 | * @param array $props Properties to generate CSS for. |
| 169 | * @param string $key Optional key for specific border side. |
| 170 | * @return string Generated CSS string. |
| 171 | */ |
| 172 | public function get_border_css($props, $key = '') { |
| 173 | $css = ''; |
| 174 | |
| 175 | if ( $key ) { |
| 176 | $key = '-' . $key; |
| 177 | } else { |
| 178 | $key = ''; |
| 179 | } |
| 180 | |
| 181 | if ( isset($props['color']) ) { |
| 182 | $css .= "border{$key}-color: " . $props['color'] . ";"; |
| 183 | } |
| 184 | |
| 185 | if ( isset($props['width']) ) { |
| 186 | $css .= "border{$key}-width: " . $props['width'] . ";"; |
| 187 | } |
| 188 | |
| 189 | if ( isset($props['style']) ) { |
| 190 | $css .= "border{$key}-style: " . $props['style'] . ";"; |
| 191 | } |
| 192 | |
| 193 | return $css; |
| 194 | } |
| 195 | } |
| 196 |