<?php 
/* 
* Block name: Calculator
* Post Type: page, post
*/
?>
<?php if (isset($block['data']['previewImage'])): ?>
    <?php do_action('block_image', __FILE__); ?>
<?php else: ?>
    <?php

    // Block helper
    require \get_template_directory() . '/template-parts/base/block-helper.php';
    if (isset($disable) && $disable) {
        return;
    }

    // Load values and assing defaults
    $calculator = get_field('calculator') ?: false;
    $priceTitle = get_field('price_title') ?: false;
    $fixPriceLabel = get_field('fix_price_label') ?: false;
    $monthlyPriceLabel = get_field('monthly_price_label') ?: false;
    $currency = get_field('currency') ?: false;
    $priceDescription = get_field('description') ?: false;
    $facts = get_field('facts') ?: false;
    $uid = uniqid();
?>
    <section class="section calculator-section block <?php echo $className; ?>" 
        <?php if ($bgUrl): ?>
            style="background-image: url('<?php echo $bgUrl; ?>');"
            data-desktop-image="<?php echo $bgUrl; ?>"
        <?php endif; ?>
        <?php if ($mobileBgUrl): ?>
            data-mobile-image="<?php echo $mobileBgUrl; ?>"
        <?php endif; ?>
        <?php if ($sectionId): ?>
            id="<?php echo $sectionId; ?>"
        <?php endif; ?>
    >
        <div class="container">
            <div class="row">
                <div class="col-md-7">
                    <?php if ($title): ?>
                        <h2><?php echo $title; ?></h2>
                    <?php endif; ?>
                    <?php if ($text): ?>
                        <p class="text"><?php echo $text; ?></p>
                    <?php endif; ?>
                    <?php if ($calculator && is_array($calculator)): ?>
                        <div class="form js-calculator-form py-2">
                            <?php if (array_key_exists('project_type_label', $calculator) && $ptLabel = $calculator['project_type_label']): ?>
                                <label for="pt<?php echo $uid; ?>" class="form-label"><?php echo $ptLabel; ?></label>
                            <?php endif; ?>
                            <?php if (array_key_exists('project_type', $calculator) && $type = $calculator['project_type']): ?>
                                <?php if (is_array($type)): ?>
                                    <div class="mb-3">
                                        <select class="form-select js-type" name="type" id="pt<?php echo $uid; ?>" aria-label="<?php echo esc_html($title); ?>">
                                            <?php foreach ($type as $item): ?>
                                                <option value="<?php echo $item['value']; ?>"><?php echo $item['label']; ?></option>
                                            <?php endforeach; ?>
                                        </select>
                                    </div>
                                <?php endif; ?>
                            <?php endif; ?>
                            <?php if (array_key_exists('global_fields', $calculator) && $globalFields = $calculator['global_fields']): ?>
                                <?php if (is_array($globalFields)): ?>
                                    <?php foreach ($globalFields as $key => $item): ?>
                                        <?php $description = array_key_exists('description', $item) ? $item['description'] : false; ?>
                                        <div class="mb-3 form-check">
                                            <input type="checkbox" value="<?php echo $item['value']; ?>" class="form-check-input js-global-field" id="globalField<?php echo $key; ?><?php echo $uid; ?>">
                                            <label class="form-check-label <?php echo $description ? 'has-description' : ''; ?>" for="globalField<?php echo $key; ?><?php echo $uid; ?>">
                                                <?php echo $item['label']; ?>
                                            </label>
                                            <?php if ($description): ?>
                                            <?php endif; ?>
                                            <?php if ($description): ?>
                                                <span class="more js-toggle"><span class="arrow"></span></span>
                                                <div class="form-text d-none description"><?php echo $description; ?></div>
                                            <?php endif; ?>
                                        </div>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            <?php endif; ?>
                            <?php if (array_key_exists('value_related_fields', $calculator) && $relatedFields = $calculator['value_related_fields']): ?>
                                <?php if (is_array($relatedFields)): ?>
                                    <?php foreach ($relatedFields as $key => $item): ?>
                                        <?php
                                            $description = array_key_exists('description', $item) ? $item['description'] : false;
                                        ?>
                                        <div class="mb-3 form-check d-none js-trigger<?php echo $item['trigger']; ?>-<?php echo $item['hide'] ? 'show' : 'hide'; ?>">
                                            <input type="checkbox" value="<?php echo $item['value']; ?>" data-trigger="<?php echo $item['trigger']; ?>" class="form-check-input js-related-field" id="relatedField<?php echo $key; ?><?php echo $uid; ?>">
                                            <label class="form-check-label <?php echo $description ? 'has-description' : ''; ?>" for="relatedField<?php echo $key; ?><?php echo $uid; ?>"><?php echo $item['label']; ?></label>
                                            <?php if ($description): ?>
                                                <span class="more js-toggle"><span class="arrow"></span></span>
                                                <div class="form-text d-none description <?php echo $item['hide'] ? 'd-none' : ''; ?>"><?php echo $description; ?></div>
                                            <?php endif; ?>
                                        </div>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            <?php endif; ?>
                            <div class="js-period mb-3">
                                <?php $periodLabel = array_key_exists('period_label', $calculator) ? $calculator['period_label'] : false; ?>
                                <?php if ($periodLabel): ?>
                                    <label for="cPeriod<?php echo $uid; ?>" class="form-label"><?php echo $periodLabel; ?></label>
                                <?php endif; ?>
                                <?php if (array_key_exists('period', $calculator) && $period = $calculator['period']): ?>
                                    <select class="form-select js-period-field" aria-label="<?php echo esc_html($periodLabel); ?>" id="cPeriod<?php echo $uid; ?>">
                                        <?php foreach ($period as $key => $item): ?>
                                            <option value="<?php echo $key; ?>" data-selector=".js-period<?php echo $key; ?>-message" <?php echo $key == 2 ? 'selected' : ''?>><?php echo $item['label']; ?></option>
                                        <?php endforeach; ?>
                                    </select>
                                    <?php foreach ($period as $key => $item): ?>
                                        <?php if (array_key_exists('description', $item) && $description = $item['description']): ?>
                                            <div class="form-text d-none mt-2 text-danger js-period<?php echo $key; ?>-message"><?php echo $description; ?></div>
                                        <?php endif; ?>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            </div>
                            <?php if (array_key_exists('half_price_field', $calculator) && $halfPriceField = $calculator['half_price_field']): ?>
                                <div class="js-half-price mb-3 form-check">
                                    <?php if (is_array($halfPriceField) && isset($halfPriceField['label'], $halfPriceField['description'])): ?>
                                        <input type="checkbox" value="1" class="form-check-input js-half-price-field" id="cHalfPrice<?php echo $uid; ?>">
                                        <label class="form-check-label" for="cHalfPrice<?php echo $uid; ?>"><?php echo $halfPriceField['label']; ?></label>
                                        <span class="more js-toggle"><span class="arrow"></span></span>
                                        <div class="form-text description"><?php echo $halfPriceField['description']; ?></div>
                                    <?php endif; ?>
                                </div>
                            <?php endif; ?>
                        </div>
                    <?php endif; ?>
                </div>
                <div class="col-md-5 order-md-0 order-2">
                    <div class="price-container sticky-md-top bg-light">
                        <?php if ($priceTitle): ?>
                            <h3 class="h3 d-block"><?php echo $priceTitle; ?></h3>
                        <?php endif; ?>
                        <?php echo $fixPriceLabel; ?> <strong class="price js-fix-price">0</strong><?php echo $currency; ?><br />
                        <div class="js-monthly-price-container">
                            <?php echo $monthlyPriceLabel; ?> <strong class="price js-monthly-price">0</strong><?php echo $currency; ?>
                            <div class="js-monthly-price-message form-text" data-message="<?php echo esc_html($priceDescription); ?>"></div>
                        </div>
                        <?php if (is_array($cta) && !empty($cta)): ?>
                            <div class="cta pb-2">
                                <a href="<?php echo $cta['url']; ?>" target="<?php echo $cta['target']; ?>" class="button btn btn-primary"><?php echo $cta['title']; ?></a>
                            </div>
                        <?php endif; ?>
                        <?php if (isset($facts)): ?>
                            <div class="js-monthly-price-description form-text pt-3">
                                <?php foreach ($facts as $fact): ?>
                                    <?php if (array_key_exists('description', $fact) && $description = $fact['description']): ?>
                                        <div class="decription-wrapper <?php echo $fact['min'] > 0 ? 'd-none' : ''; ?> d-flex align-items-center" data-min="<?php echo $fact['min']; ?>" data-max="<?php echo $fact['max']; ?>">
                                            <i class="<?php echo $fact['icon_class']; ?> icon pe-2"></i><span class="description"><?php echo $description; ?></span>
                                        </div>
                                    <?php endif; ?>
                                <?php endforeach; ?>
                            </div>
                        <?php endif; ?>
                    </div>
                </div>
            </div>
        </div>
    </section>
<?php endif; ?>
