<?php
/*
Template name: Strona główna
*/

get_header();

// General
$color                      = get_field('color');
$footerVersion              = get_field('footer_version');
$sponsoredByLabel           = get_field('sponsored_by_label');
$downloadAppLabel           = get_field('download_app_label');
$downloadAppFromLabel       = get_field('download_app_from_label');

// Stores settings (icon, url, qr_code)
$appStoreSettings           = get_field('app_store_settings');
$googlePlaySettings         = get_field('google_play_settings');

// Header
$headerDescription          = get_field('header_description');

// Doctor (app_screen, photo, review, name)
$doctor                     = get_field('doctor');

// App info (header, slider, points_type, dot_points, icon_points)
$appInfo                    = get_field('app_info');

// Scheme items (header, column_amount, items, additional_list)
$scheme                     = get_field('scheme');

// Additional info
$additionalInfo             = get_field('additional_info');
$lastAppScreen              = get_field('last_app_screen');
$supportInfo                = get_field('support_info');

?>


<div class="c-header">
    <div class="o-wrap">
        <header>
            <?= $headerDescription ?>
        </header>

        <div class="c-download">
            <a href="#" class="o-btn" data-target="#download" data-offset="-100">
                <span><?= $downloadAppLabel ?></span>
            </a>

            <div class="c-download__buttons" style="position: relative; z-index: 9;">
                <a href="<?= $appStoreSettings['url'] ?>" target="_blank">
                    <?= wp_get_attachment_image($appStoreSettings['icon'], 'full') ?>
                </a>

                <a href="<?= $googlePlaySettings['url'] ?>" target="_blank">
                    <?= wp_get_attachment_image($googlePlaySettings['icon'], 'full') ?>
                </a>
            </div>
        </div>
    </div>
</div>


<div class="c-review" id="about">
    <div class="o-wrap">

        <div class="o-cols">
            <div class="o-cols__item">
                <?= wp_get_attachment_image($doctor['app_screen'], 'full') ?>
            </div>

            <div class="o-cols__item">
                <div class="c-cloud">
                    <div class="c-cloud__photo">
                        <?= wp_get_attachment_image($doctor['photo'], 'full') ?>
                    </div>

                    <blockquote>
                        <p>
                            <?= $doctor['review'] ?>
                        </p>

                        <?php if(!in_array($color, ['gray'])): ?>
                            <p class="author"><?= $doctor['name'] ?></p>
                        <?php endif; ?>
                    </blockquote>

                    <img src="<?= get_template_directory_uri() . '/' ?>src/img/review/cloud.png" alt="" width="1297" height="964" class="c-cloud__cloud">
                </div>
            </div>
        </div>

    </div>
</div>


<div class="c-app" id="content">
    <div class="o-wrap">

        <div class="o-circleicon">
            <img src="<?= get_template_directory_uri() . '/' ?>src/img/icons/stethoscope.png" alt="">
        </div>

        <header class="o-header">
            <?= $appInfo['header'] ?>
        </header>

        <div class="c-app__content">
            <div class="c-app__info <?= $appInfo['points_type'] ?>">
                <ul>
                    <?php
                    if($appInfo['points_type'] === 'c-app__info--icons') {
                        foreach($appInfo['icon_points'] as $item) {
                            echo sprintf(
                                '<li class="%s">%s</li>',
                                $item['icon'],
                                $item['item']
                            );
                        }
                    } else {
                        foreach($appInfo['dot_points'] as $item) {
                            echo sprintf(
                                '<li>%s</li>',
                                $item['item']
                            );
                        }
                    }
                    ?>
                </ul>
                <?php
                if($appInfo['additional_list']) {
                    echo '<div class="c-calc"><div class="o-cols o-cols--3">';

                    foreach($appInfo['additional_list'] as $item) {
                        echo sprintf(
                            '<div class="o-cols__item"><p>%s</p></div>',
                            $item['item']
                        );
                    }

                    echo '</div></div>';
                }
                ?>
            </div>

            <div class="c-app__slider">
                <div class="c-slider">
                    <div class="swiper-container js-appSlider">
                        <div class="swiper-wrapper">
                            <?php
                            foreach($appInfo['slider'] as $item) {
                                echo sprintf(
                                    '<div class="swiper-slide">%s</div>',
                                    wp_get_attachment_image($item, 'full')
                                );
                            }
                            ?>
                        </div>
                    </div>

                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>
            </div>
        </div>

        <div class="c-download">
            <a href="#" class="o-btn" data-target="#download" data-offset="-100">
                <span><?= $downloadAppLabel ?></span>
            </a>

            <div class="c-download__buttons" style="z-index: 9">
                <a href="<?= $appStoreSettings['url'] ?>" target="_blank">
                    <?= wp_get_attachment_image($appStoreSettings['icon'], 'full') ?>
                </a>

                <a href="<?= $googlePlaySettings['url'] ?>" target="_blank">
                    <?= wp_get_attachment_image($googlePlaySettings['icon'], 'full') ?>
                </a>
            </div>
        </div>


        <div class="c-scheme">
            <div class="o-circleicon">
                <?php if(in_array($color, ['gray'])): ?>
                    <img src="<?= get_template_directory_uri() . '/' ?>src/img/icons/stethoscope.png" alt="">
                <?php else: ?>
                    <img src="<?= get_template_directory_uri() . '/' ?>src/img/icons/hands.png" alt="">
                <?php endif ?>
            </div>

            <header class="o-header">
                <?= $scheme['header'] ?>
            </header>

            <div class="o-cols o-cols--<?= $scheme['column_amount'] ?>">
                <?php
                foreach($scheme['items'] as $item) {
                    echo sprintf(
                        '<figure class="o-cols__item">%s<figcaption>%s</figcaption></figure>',
                        wp_get_attachment_image($item['icon'], 'full'),
                        $item['item']
                    );
                }
                ?>
            </div>
        </div>

    </div>
</div>

<div class="c-partners" id="download">
    <div class="o-wrap">

        <i class="c-partners__arrow"></i>

        <div class="c-partners__proloque">
            <div class="o-article">
                <?= $additionalInfo ?>
            </div>
        </div>

        <div class="o-cols o-cols--3">
            <div class="o-cols__item">

                <div class="c-partners__logotypes">
                    <p><?= $sponsoredByLabel ?></p>

                    <p>&nbsp;</p>

                    <img src="<?= get_template_directory_uri() . '/' ?>src/img/partners/sandoz.png" alt="sandoz">

                    <p>&nbsp;</p>

                    <hr>
                </div>
            </div>

            <div class="o-cols__item phone">

                <div class="c-partners__phone">
                    <?= wp_get_attachment_image($lastAppScreen, 'full') ?>
                </div>

                <hr>
            </div>

            <div class="o-cols__item">

                <div class="c-partners__download">
                    <div>
                        <a href="<?= $appStoreSettings['url'] ?>" class="o-btn o-btn--download ios" target="_blank"><?= $downloadAppFromLabel ?>
                            <img src="<?= get_template_directory_uri() . '/' ?>src/img/icons/appstore.png" alt="appstore">
                        </a>

                        <div class="o-qr">
                            <?= wp_get_attachment_image($appStoreSettings['qr_code'], 'full') ?>
                        </div>
                    </div>

                    <div>
                        <a href="<?= $googlePlaySettings['url'] ?>" class="o-btn o-btn--download android" target="_blank"><?= $downloadAppFromLabel ?>
                            <img src="<?= get_template_directory_uri() . '/' ?>src/img/icons/googleplay.png" alt="googleplay">
                        </a>

                        <div class="o-qr">
                            <?= wp_get_attachment_image($googlePlaySettings['qr_code'], 'full') ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="c-partners__contact">
            <div class="o-article">
                <p>
                    <?= $supportInfo ?>
                    <script language="JavaScript">
                        var part1 = "support";
                        var part2 = Math.pow(2,6);
                        var part3 = String.fromCharCode(part2);
                        var part4 = "commoditech.pl";
                        var part5 = part1 + String.fromCharCode(part2) + part4;
                        document.write("<a href=" + "mai" + "lto" + ":"
                            + part5 + ">" + part1 + part3 + part4 + "</a>.");
                    </script>

                </p>
            </div>
        </div>
    </div>
</div>

<?php get_footer(); ?>
