<?php

namespace Hecate\Components;

use Hecate\Components\ComponentsRepository;

abstract class ComponentContainerBase extends ComponentBase {


	//  public function getPartialRefreshSelector() {
	//      return sprintf( '[data-partial-refresh-setting="%s"] > .hecate-partial-refresh-meta', $this->prefix );
	//  }

	public function renderPartialRefreshContainer() {
		$this->renderFromCustomizer = true;
		$this->loadSettingsApi();
		$classes = array( 'position-relative', 'hecate-component', 'hecate-component--with-overlay', $this->getWrapperClass() );

		?>
		<div class="<?php echo esc_attr( implode( ' ', $classes ) ); ?>"
		 data-container-id="<?php echo esc_attr( $this->getSectionId() ); ?>"
			 data-partial-refresh-setting="<?php echo esc_attr( $this->getComponentId() ); ?>">
			<div class="hecate-partial-refresh-meta">
		  <?php $this->renderOverlay(); ?>
				 <?php $this->renderCSS(); ?>
				 <?php $this->renderBackgroundPartialRefresh(); ?>
			</div>
			<?php $this->renderTemplate(); ?>
		</div>
		<?php
	}

	public function getPartialRefreshContent() {
		static::$oldActiveComponent = ComponentsRepository::getActiveComponent();

		ComponentsRepository::setActiveComponent( $this );

		ob_start();
		$this->renderPartialRefreshContainer();
		$data = ob_get_clean();

		ComponentsRepository::setActiveComponent( static::$oldActiveComponent );
		return $data;
	}

	public function renderBackgroundPartialRefresh() {
		?>
		<div class="hecate-partial-refresh-background-container">
			<?php $this->renderBackgroundContent(); ?>
		</div>
		<?php
	}

	public function renderBackground() {
		if ( ! is_customize_preview() ) {
			$this->renderBackgroundContent();
		}
	}

	public function renderBackgroundContent() {
		if ( $this->getDesign( 'overlay.enabled', null, array( 'componentPart' => 'overlay' ) ) ) {
			?>
			<div class="hecate-background-layer">
				<div class="hecate-overlay-layer"></div>
			</div>
			<?php
		}
	}
}
