* @link https://www.tassos.gr * @copyright Copyright © 2024 Tassos All Rights Reserved * @license GNU GPLv3 or later */ namespace NRFramework\Helpers; defined('_JEXEC') or die; use NRFramework\Cache; use Joomla\CMS\Language\Text; use Joomla\CMS\Plugin\PluginHelper; class Responsive { /** * Renders the given CSS. * * @param array $css * @param string $selector * * @return string */ public static function renderResponsiveCSS($css, $selector = '') { if (!$css || !is_array($css)) { return; } $output = ''; foreach (self::getBreakpoints() as $breakpoint => $breakpoint_data) { if (!isset($css[$breakpoint]) || empty($css[$breakpoint])) { continue; } /** * If we were given an array of strings of CSS, transform them to a string so we can output it. * * i.e. transform * [ * 'color: #fff;', * 'background: #000;' * ] * * to: * * 'color: #fff;background: #000;' */ if (!is_string($css[$breakpoint])) { $css[$breakpoint] = implode('', $css[$breakpoint]); } $max_width = isset($breakpoint_data['max_width']) ? $breakpoint_data['max_width'] : ''; $output .= self::getGenericTemplate($css[$breakpoint], $max_width, $selector); } return $output; } /** * Returns the responsive output of a specific media query size. * * @param string $css The Custom CSS * @param int $size This is the max-width in pixels * @param string $selector The CSS Selector to apply the CSS * * @return string */ public static function getGenericTemplate($css, $size = '', $selector = '') { if (!is_string($css) || !is_scalar($size) || !is_string($selector)) { return ''; } $selector_prefix = $selector_suffix = $size_prefix = $size_suffix = ''; if (!empty($size)) { $size_prefix = '@media screen and (max-width: ' . $size . 'px){'; $size_suffix = '}'; } if (!empty($selector)) { $selector_prefix = $selector . '{'; $selector_suffix = '}'; } return $size_prefix . $selector_prefix . $css . $selector_suffix . $size_suffix; } /** * Returns all breakpoints. * * @return array */ public static function getBreakpoints() { $breakpointsSettings = self::getBreakpointsSettings(); $tablet_max_width = isset($breakpointsSettings['tablet']) && !empty($breakpointsSettings['tablet']) ? $breakpointsSettings['tablet'] : 1024; $mobile_max_width = isset($breakpointsSettings['mobile']) && !empty($breakpointsSettings['mobile']) ? $breakpointsSettings['mobile'] : 575; return [ 'desktop' => [ 'icon' => '', 'label' => Text::_('NR_DESKTOP'), 'desc' => Text::_('NR_DESKTOPS_WITH_BREAKPOINT_INFO') ], 'tablet' => [ 'icon' => '', 'label' => Text::_('NR_TABLET'), 'desc' => Text::sprintf('NR_TABLETS_WITH_BREAKPOINT_INFO', $tablet_max_width), 'max_width' => $tablet_max_width ], 'mobile' => [ 'icon' => '', 'label' => Text::_('NR_MOBILE'), 'desc' => Text::sprintf('NR_MOBILES_WITH_BREAKPOINT_INFO', $mobile_max_width), 'max_width' => $mobile_max_width ] ]; } public static function getBreakpointsSettings() { $hash = 'tassosResponsiveBreakpoints'; if (Cache::has($hash)) { return Cache::get($hash); } $settings = PluginHelper::getPlugin('system', 'nrframework'); $default = [ 'desktop' => 'any', 'tablet' => 1024, 'mobile' => 575 ]; if (!isset($settings->params)) { return $default; } if (!$params = json_decode($settings->params, true)) { return $default; } $data = isset($params['breakpoints']) ? $params['breakpoints'] : []; return Cache::set($hash, $data); } }