Current File : /home/getxxhzo/xpertbee.com/wp-content/plugins/gutenkit-blocks-addon/includes/Hooks/Visibility.php |
<?php
namespace Gutenkit\Hooks;
defined( 'ABSPATH' ) || exit;
use Gutenkit\Helpers\Utils;
class Visibility {
use \Gutenkit\Traits\Singleton;
/**
* class constructor.
* private for singleton
*
* @return void
* @since 1.0.0
*/
public function __construct() {
add_filter("gutenkit/collected_css", function($block) {
$block = $this->add_gutenkit_block_visibility($block, 'visibilityModuleStyles');
return $block;
}, 10);
}
public function add_gutenkit_block_visibility($block, $module_key) {
if (!isset($block['blockName']) || !strstr($block['blockName'], 'gutenkit')) {
return $block;
}
$attributes = $block['attrs'];
$module_css = $attributes[$module_key] ?? [];
$isVisibility = $attributes['visibilityModuleStyles'] ?? [];
//Checking is visibility is set in block attributes
if(isset($isVisibility)){
$filteredArray = array_filter($isVisibility, function($value) {
return !empty($value);
});
//If visibility array is empty then return the block
if(empty($filteredArray)){
return $block;
}
} else {
return $block;
}
//TODO: Remove this backward compatibility in future version
if(empty($module_css['desktop']) && !empty($attributes['commonBlockHideDesktop'])) {
$module_css['desktop'] = ".gutenkit-frontend :where(.{$block['attrs']['blockClass']}) { display: none; }";
}
if(empty($module_css['tablet']) && !empty($attributes['commonBlockHideTablet'])) {
$module_css['tablet'] = ".gutenkit-frontend :where(.{$block['attrs']['blockClass']}) { display: none; }";
}
if(empty($module_css['mobile']) && !empty($attributes['commonBlockHideMobile'])) {
$module_css['mobile'] = ".gutenkit-frontend :where(.{$block['attrs']['blockClass']}) { display: none; }";
}
$device_list = Utils::get_device_list() ?? [];
$mediaQueries = $this->make_media_query_string($device_list) ?? [];
$common_css = $attributes['customStyles'] ?? [];
$css_content = [];
foreach ($device_list as $device) {
$device = strtolower($device['slug']);
if (empty($css_content[$device])) {
$css_content[$device] = "";
}
if (!empty($module_css[$device])) {
$css_content[$device] .= $module_css[$device];
}
}
// Initialize the result CSS string
$cssString = '';
// Loop through the commonStyle array
foreach ($css_content as $device => $cssRule) {
// If there is a CSS rule defined, wrap it with the appropriate media query
if (!empty($cssRule) && isset($mediaQueries[$device])) {
$cssString .= $mediaQueries[$device] . " {\n" . $cssRule . "\n}\n";
}
}
if (isset($block['attrs']['blocksCSS']['customStyles'])) {
$block['attrs']['blocksCSS']['customStyles'] .= $cssString;
}
return $block;
}
/**
* Creates an array of media queries based on the given device list.
* @param array $device_list The list of devices to create media queries for.
* @return array The array of media queries.
*/
public function make_media_query_string($device_list){
$isWideScreen = false;
$hasWideScreen = array_filter($device_list, function($item) {
return $item['slug'] === 'WideScreen';
});
if(!empty($hasWideScreen)) { $isWideScreen = true; }
$mediaQueries = [];
// creating an array of media queries
//example of array element: [desktop] => @media (min-width: 1367px) and (max-width: 2399px)
foreach ($device_list as $key => $device) {
// Handle the "WideScreen" case with only min-width
if ($device['slug'] === 'WideScreen') {
$mediaQueries[strtolower($device['slug'])] = "@media (min-width: {$device['value']}px)";
continue;
}
// Handle the "Desktop" case with dynamic min-width and max-width
if ($device['value'] == 'base') {
$minWidth = null;
$maxWidth = null;
// Find min and max width for desktop if widescreen is enabled
foreach ($device_list as $i => $bp) {
if ($isWideScreen == true && $bp['slug'] === 'WideScreen') {
$maxWidth = $bp['value'];
$minWidth = isset($device_list[$i + 1]) ? $device_list[$i + 1]['value'] : null;
}
}
// Find min width for desktop if widescreen is disabled
if($isWideScreen == false) {
$minWidth = isset($device_list[$key + 1]) ? $device_list[$key + 1]['value'] : null;
}
//creating the media query for desktop
if ($isWideScreen == true) {
$mediaQueries[strtolower($device['slug'])] = "@media (min-width: " . ($minWidth + 1) . "px) and (max-width: " . ($maxWidth - 1) ."px)";
} else {
$mediaQueries[strtolower($device['slug'])] = "@media (min-width: " . ($minWidth + 1) . "px)";
}
} else {
// Other breakpoints: dynamically get min-width and max-width based on previous and next device
$minWidth = isset($device_list[$key + 1]) ? $device_list[$key + 1]['value'] : null;
$maxWidth = $device['value'];
if ($minWidth) {
$mediaQueries[strtolower($device['slug'])] = "@media (min-width: " . ($minWidth + 1) . "px) and (max-width: {$maxWidth}px)";
} else {
$mediaQueries[strtolower($device['slug'])] = "@media (max-width: {$maxWidth}px)";
}
}
}
return $mediaQueries;
}
}