<?php
/**
 * Frontend output for the AUX CTA Feature component
 * AUX documentation: https://aggieux.tamu.edu/?path=/docs/components-cta-feature-about-cta-features--docs
 *
 * Outline:
 * 1. Set variables to null
 * 2. Get fields from the post, if they have values, wrap in html
 * 3. Build the component html
 * 4. Sanitize and output
 *
 * @author Alejandro Viejo
 * @since 1.0.0
 */

/**
 * AUX CTA Feature template
 *
 * @param \WP_Post[] $featureItems The block settings and attributes.
 */

use WHOOP\Entities\Elements\A;
use WP_AUX\Entities\AuxCF\Fields\CtaFeature\CtaFeatureCtaFieldEntity;
use WP_AUX\Services\HtmlService;
use WP_AUX\Services\AuxFramework\ElementClassesService;

$ctaFeatureImage = false;
if (get_field('cta_feature_image')) {
  $ctaFeatureImage = get_field('cta_feature_image')['url'];
}

$ctaFeatureAlignment = get_field('cta_feature_alignement');

$ctaFeatureHeading = get_field('cta_feature_heading');

$ctaLink = '';
if ($cta = aux_get_field(CtaFeatureCtaFieldEntity::$name)) {
  $ctaLink = A::create($cta['title'], [
    'href' => $cta['url'],
    'class' => 'btn btn--primary',
    'target' => $cta['target'],
  ]);
}

// Sets class style for CTA Feature component
$ctaFeatureStyle = ElementClassesService::buildClasses('feature-cta', get_field('cta_feature_style'));

// Sets CTA Feature alignment if set to right
$ctaFeatureGradientDeg= '45deg';
if ($ctaFeatureAlignment == 'right'){
  $ctaFeatureStyle->addModifier('right');
  $ctaFeatureGradientDeg= '-45deg';
}

// If the description field has text in the WP post for this component, wrap it in a paragraph tag
$ctaFeatureDescription = HtmlService::formattedValue(get_field('cta_feature_description'), '<p class="feature-cta__description">%s</p>');

// Build the output html for the component
echo <<<HTML
   <div
    class="$ctaFeatureStyle"
    style="background-image:linear-gradient($ctaFeatureGradientDeg, rgba(0,0,0,0.8), rgba(0,0,0,0) 50%), url($ctaFeatureImage)"
    >
    <div class="feature-cta__content">
        <div class="content__container">
        <h2 class="feature-cta__heading">$ctaFeatureHeading</h2>
        $ctaFeatureDescription
        $ctaLink
        </div>
    </div>
    </div>
HTML;
