- Remove custom_css field from schema (v1.4.0 → v1.5.0) - Remove buildCssGroup() from FormBuilder - Remove renderCustomCSS() from Renderer - Update layout: single JS card instead of 2-column layout - Update descriptions to reference CustomCSSManager (TIPO 3) CSS personalizado ahora se gestiona exclusivamente desde el componente CustomCSSManager, eliminando duplicidad funcional. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
193 lines
5.2 KiB
PHP
193 lines
5.2 KiB
PHP
<?php
|
|
declare(strict_types=1);
|
|
|
|
namespace ROITheme\Public\ThemeSettings\Infrastructure\Ui;
|
|
|
|
use ROITheme\Shared\Domain\Contracts\RendererInterface;
|
|
use ROITheme\Shared\Domain\Entities\Component;
|
|
|
|
/**
|
|
* ThemeSettingsRenderer
|
|
*
|
|
* Renderizador del componente Theme Settings.
|
|
* A diferencia de otros componentes, no renderiza HTML visual
|
|
* sino que genera codigo para inyectar en wp_head y wp_footer.
|
|
*
|
|
* NOTA: CSS personalizado se gestiona desde CustomCSSManager (TIPO 3).
|
|
* Analytics y AdSense se gestionan desde el componente adsense-placement.
|
|
*
|
|
* Responsabilidades:
|
|
* - Generar Layout CSS (container width)
|
|
* - Generar JavaScript para header
|
|
* - Generar JavaScript para footer
|
|
*
|
|
* @package ROITheme\Public\ThemeSettings\Infrastructure\Ui
|
|
*/
|
|
final class ThemeSettingsRenderer implements RendererInterface
|
|
{
|
|
/**
|
|
* {@inheritDoc}
|
|
*
|
|
* Para este componente, render() no se usa directamente.
|
|
* Se usan los metodos especificos: renderHeadContent() y renderFooterContent()
|
|
*/
|
|
public function render(Component $component): string
|
|
{
|
|
// Este componente no renderiza HTML visual
|
|
// Los contenidos se inyectan via hooks wp_head y wp_footer
|
|
return '';
|
|
}
|
|
|
|
/**
|
|
* {@inheritDoc}
|
|
*/
|
|
public function supports(string $componentType): bool
|
|
{
|
|
return $componentType === 'theme-settings';
|
|
}
|
|
|
|
/**
|
|
* Genera contenido para wp_head
|
|
*
|
|
* Incluye:
|
|
* - Layout CSS (container width)
|
|
* - Custom JS Header (si configurado)
|
|
*
|
|
* NOTA: CSS personalizado se gestiona desde CustomCSSManager (TIPO 3)
|
|
*
|
|
* @param array $data Datos del componente desde BD
|
|
* @return string Contenido para wp_head
|
|
*/
|
|
public function renderHeadContent(array $data): string
|
|
{
|
|
$output = '';
|
|
|
|
// Layout CSS (container width configurable)
|
|
$layoutOutput = $this->renderLayoutCSS($data);
|
|
if (!empty($layoutOutput)) {
|
|
$output .= $layoutOutput . "\n";
|
|
}
|
|
|
|
// Custom JS Header
|
|
$jsHeaderOutput = $this->renderCustomJSHeader($data);
|
|
if (!empty($jsHeaderOutput)) {
|
|
$output .= $jsHeaderOutput . "\n";
|
|
}
|
|
|
|
return $output;
|
|
}
|
|
|
|
/**
|
|
* Genera CSS para el layout configurable
|
|
*
|
|
* @param array $data Datos del componente
|
|
* @return string Bloque style con variables CSS y overrides
|
|
*/
|
|
private function renderLayoutCSS(array $data): string
|
|
{
|
|
$containerWidth = $data['layout']['container_max_width'] ?? '1320';
|
|
|
|
// Validar que el valor sea seguro
|
|
$allowedWidths = ['1140', '1200', '1320', '1400', '100%'];
|
|
if (!in_array($containerWidth, $allowedWidths, true)) {
|
|
$containerWidth = '1320'; // Fallback al default
|
|
}
|
|
|
|
// Generar el CSS
|
|
$widthValue = ($containerWidth === '100%') ? '100%' : $containerWidth . 'px';
|
|
$widthNumeric = ($containerWidth === '100%') ? '100vw' : $containerWidth . 'px';
|
|
|
|
// Siempre generar CSS variable para que otros componentes puedan usarla
|
|
$css = sprintf(
|
|
'<!-- Layout CSS (ROI Theme) -->
|
|
<style id="roi-theme-layout-css">
|
|
:root {
|
|
--roi-container-width: %s;
|
|
--roi-container-width-numeric: %s;
|
|
}',
|
|
esc_attr($widthValue),
|
|
esc_attr($widthNumeric)
|
|
);
|
|
|
|
// Solo añadir override de container si NO es el default
|
|
if ($containerWidth !== '1320') {
|
|
$css .= sprintf('
|
|
@media (min-width: 1200px) {
|
|
.container,
|
|
.container-lg,
|
|
.container-xl,
|
|
.container-xxl {
|
|
max-width: %s;
|
|
}
|
|
}',
|
|
esc_attr($widthValue)
|
|
);
|
|
}
|
|
|
|
$css .= '
|
|
</style>';
|
|
|
|
return $css;
|
|
}
|
|
|
|
/**
|
|
* Genera contenido para wp_footer
|
|
*
|
|
* Incluye:
|
|
* - Custom JS Footer (si configurado)
|
|
*
|
|
* @param array $data Datos del componente desde BD
|
|
* @return string Contenido para wp_footer
|
|
*/
|
|
public function renderFooterContent(array $data): string
|
|
{
|
|
return $this->renderCustomJSFooter($data);
|
|
}
|
|
|
|
/**
|
|
* Genera el JavaScript personalizado para header
|
|
*
|
|
* @param array $data Datos del componente
|
|
* @return string Bloque script o vacio si no hay JS
|
|
*/
|
|
private function renderCustomJSHeader(array $data): string
|
|
{
|
|
$js = trim($data['custom_code']['custom_js_header'] ?? '');
|
|
|
|
if (empty($js)) {
|
|
return '';
|
|
}
|
|
|
|
return sprintf(
|
|
'<!-- Custom JS Header (ROI Theme) -->
|
|
<script id="roi-theme-custom-js-header">
|
|
%s
|
|
</script>',
|
|
$js // No escapar JS - usuario avanzado responsable
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Genera el JavaScript personalizado para footer
|
|
*
|
|
* @param array $data Datos del componente
|
|
* @return string Bloque script o vacio si no hay JS
|
|
*/
|
|
private function renderCustomJSFooter(array $data): string
|
|
{
|
|
$js = trim($data['custom_code']['custom_js_footer'] ?? '');
|
|
|
|
if (empty($js)) {
|
|
return '';
|
|
}
|
|
|
|
return sprintf(
|
|
'<!-- Custom JS Footer (ROI Theme) -->
|
|
<script id="roi-theme-custom-js-footer">
|
|
%s
|
|
</script>',
|
|
$js // No escapar JS - usuario avanzado responsable
|
|
);
|
|
}
|
|
}
|