<?php
/*
Template Name: Main Page
*/
get_header();
?>
<aside class="sidebar-left">
    <nav class="menu table-contents__menu">
        <button class="button table-contents-menu__button">
            <?php pll_e('Navigation'); ?>
            <?php
            $sidebar = get_field('sidebar', 'option');
            $icon = $sidebar['icon'];
            ?>
            <img class="sidebar__arrow" src="<?php echo esc_url($icon['url']); ?>" alt="<?php echo esc_attr($icon['alt']); ?>" title="<?php echo esc_attr($icon['title']); ?>" />
        </button>
        <ul class="table-contents-menu__list active" id="menuContent">
            <?php $block_4 = get_field('block_4');
            $i = 0;
            foreach ($block_4 as $row) :
                $i++;
                $title = $row['title'];
            ?>
                <li>
                    <a href="#content-<?php echo $i; ?>"><?php echo esc_html($title); ?></a>
                </li>
            <?php endforeach; ?>
            <?php $block_5 = get_field('block_5');
            $title = $block_5['title']; ?>

            <li><a href="#rating"><?php echo esc_html($title); ?></a></li>

            <?php $faq_section = get_field('faq_section');
            $title = $faq_section['title']; ?>
            <li><a href="#10"><?php echo esc_html($title); ?></a></li>
        </ul>
    </nav>
</aside>
<?php
$block_1 = get_field('block_1');
$bg_image = $block_1['bg_image'];
$up_title = $block_1['up_title'];
$rating = $block_1['rating'];
$top_rating = $block_1['top_rating'];
$title = $block_1['title'];
$text = $block_1['text'];
?>
<section class="banner banner__main">
    <div class="background banner__background">
        <img
            src="<?php echo esc_url($bg_image['url']); ?>"
            alt="<?php echo esc_attr($bg_image['alt']); ?>"
            title="<?php echo esc_attr($bg_image['title']); ?>" />
    </div>
    <div class="banner__wrap">
        <div class="banner__content">
            <p class="banner__rating"><span><?php echo esc_html($up_title); ?> <?php echo esc_html($rating); ?>/<?php echo esc_html($top_rating); ?></p>
            <h1 class="title general banner__title"><?php echo $title; ?></h1>
            <p class="banner__text">
                <?php echo $text; ?>
            </p>
            <a href="<?php echo esc_url($ref_link); ?>" class="button banner__button"><?php pll_e('Register now'); ?></a>
        </div>
    </div>
</section>

<main class="main">
    <?php $block_2 = get_field('block_2');
    $content = $block_2['content']; ?>
    <section class="content article">
        <?php echo $content; ?>
    </section>

    <?php $block_3_1 = get_field('block_3_1');
    $cards = $block_3_1['cards'];
    /* ---------------------------------------- */
    $game_title = $block_3_1['game_title'];
    $games = $block_3_1['games'];
    /* ---------------------------------------- */
    $bottom_list = $block_3_1['bottom_list'];
    ?>
    <section class="top-games">
        <h2 class="title high"><?php echo $game_title; ?></h2>
        <div class="top-games__cards">
            <?php foreach ($games as $row) :
                $image = $row['image'];
            ?>
                <div class="top-games-wrapper">
                    <div class="top-games-card">
                        <div class="top-games-card__image">
                            <img
                                src="<?php echo esc_url($image['url']); ?>"
                                alt="<?php echo esc_attr($image['alt']); ?>"
                                title="<?php echo esc_attr($image['title']); ?>" />
                        </div>
                        <div class="top-games-card__buttons">
                            <a href="<?php echo esc_url($ref_link); ?>" class="button top-games-card__button"><?php pll_e('Play'); ?></a>
                            <a href="<?php echo esc_url($ref_link); ?>" class="button top-games-card__button"><?php pll_e('Demo'); ?></a>
                        </div>
                    </div>
                </div>
            <?php endforeach; ?>
        </div>
    </section>
    <section class="features">
        <div class="features__content">
            <div class="features__advantages">
                <table>
                    <tbody>
                        <?php foreach ($cards as $row) :
                            $lable = $row['lable'];
                            $icon = $row['icon'];
                        ?>
                            <tr>
                                <td>
                                    <img src="<?php echo esc_url($icon['url']); ?>"
                                        alt="<?php echo esc_attr($icon['alt']); ?>"
                                        title="<?php echo esc_attr($icon['title']); ?>" />
                                    <?php echo $lable; ?>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
            <div class="features__categories">
                <table>
                    <tbody>
                        <?php foreach ($bottom_list as $row) :
                            $lable = $row['lable'];
                            $value = $row['value'];
                        ?>
                            <tr>
                                <td><?php echo $lable; ?></td>
                                <td><?php echo $value; ?></td>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </section>

    <?php
    $block_3 = get_field('block_3');
    $title = $block_3['title'];
    $text = $block_3['text'];
    $bg_image = $block_3['bg_image'];
    ?>
    <section class="bonus">
        <div class="background bonus__background">
            <img
                src="<?php echo esc_url($bg_image['url']); ?>"
                alt="<?php echo esc_attr($bg_image['alt']); ?>"
                title="<?php echo esc_attr($bg_image['title']); ?>" />
        </div>
        <div class="bonus__wrap">
            <div class="bonus__content">
                <p class="title bonus__title"><?php echo $title; ?></p>
                <p class="bonus__text">
                    <?php echo $text; ?>
                </p>

                <a href="<?php echo esc_url($ref_link); ?>" class="button"><?php pll_e('Get bonus'); ?></a>
            </div>
        </div>
    </section>

    <?php
    $content_image = get_field('content_image');
    $content_image_2 = get_field('content_image_2');
    $block_4 = get_field('block_4');
    $total = count($block_4);
    $i = 0;
    foreach ($block_4 as $row) :
        $i++;
        $title = $row['title'];
        $content = $row['content'];

    ?>
        <article class="content article <?php echo (($i % 2 === 0) ? 'description' : ''); ?>" id="content-<?php echo esc_attr($i); ?>">
            <h2 class="title high features__title"><?php echo esc_html($title); ?></h2>
            <?php
            if ($i === 1 && $content_image) :
            ?>
                <div class="image article__image">
                    <img src="<?php echo esc_url($content_image['url']); ?>"
                        alt="<?php echo esc_attr($content_image['alt']); ?>"
                        title="<?php echo esc_attr($content_image['title']); ?>" />
                </div>
            <?php
            elseif ($i === 3 && $content_image_2) :
            ?>
                <div class="image article__image">
                    <img src="<?php echo esc_url($content_image_2['url']); ?>"
                        alt="<?php echo esc_attr($content_image_2['alt']); ?>"
                        title="<?php echo esc_attr($content_image_2['title']); ?>" />
                </div>
            <?php endif; ?>
            <?php echo $content; ?>
            <?php if ($i % 2 === 0):
            ?>
                <a href="<?php echo esc_url($ref_link); ?>" class="button article__button">
                    <?php pll_e('Sign Up'); ?>
                </a>
            <?php endif; ?>
        </article>
    <?php endforeach; ?>

    <?php $block_5 = get_field('block_5');
    $title = $block_5['title'];
    $icon = $block_5['icon'];
    $items = $block_5['items'];
    ?>
    <section class="rating__content" id="rating">
        <h2 class="title high features__title"><?php echo esc_html($title); ?></h2>
        <div class="rating__card">
            <table class="rating-table">
                <tbody>
                    <?php foreach ($items as $row) :
                        $title = $row['title'];
                        $rating = $row['rating'];
                        $top_rating = $row['top_rating'];
                        $empty_count = $top_rating - $rating;
                    ?>
                        <tr>
                            <td>
                                <div class="rating-content">
                                    <p><?php echo esc_html($title); ?></p>
                                </div>
                            </td>
                            <td>
                                <div class="rating-stars">
                                    <?php for ($i = 0; $i < $rating; $i++) : ?>
                                        <img
                                            src="<?php echo esc_url($icon['url']); ?>"
                                            alt="<?php echo esc_attr($icon['alt']); ?>"
                                            title="<?php echo esc_attr($icon['title']); ?>" />
                                    <?php endfor; ?>
                                    <?php for ($i = 0; $i < $empty_count; $i++) : ?>
                                        <img src="<?php echo get_template_directory_uri(); ?>/assets/img/rating/icon-grey.png"
                                            alt="<?php echo esc_attr($icon['alt']); ?>"
                                            title="<?php echo esc_attr($icon['title']); ?>" />
                                    <?php endfor; ?>
                                </div>
                            </td>
                            <td>
                                <p><span><?php echo esc_html($rating); ?></span>/<?php echo esc_html($top_rating); ?></p>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
        <a href="<?php echo esc_url($ref_link); ?>" class="button article__button"><?php pll_e('Get bonus'); ?></a>
    </section>

    <?php
    $faq_section = get_field('faq_section');
    $title = $faq_section['title'];
    $faq = $faq_section['faq'];
    if ($faq_section) :
    ?>
        <section class="faq" id="10">
            <h2 class="title high features__title"><?php echo esc_html($title); ?></h2>
            <ul class="faq__list">

                <?php
                $i = 0;
                foreach ($faq as $row) :
                    $i++;
                    $title = $row['title'];
                    $text = $row['text'];
                ?>
                    <li class="faq__item">
                        <button data-tab="tab-<?php echo ($i); ?>" class="faq__question">
                            <?php echo ($title); ?>
                            <div class="image faq-question__image">
                                <?php $faq_icon = get_field('faq_icon', "option"); ?>
                                <img
                                    src="<?php echo esc_url($faq_icon['url']); ?>"
                                    alt="<?php echo esc_attr($faq_icon['alt']); ?>"
                                    title="<?php echo esc_attr($faq_icon['title']); ?>" />
                            </div>
                        </button>
                        <div id="tab-<?php echo ($i); ?>" class="faq__answer">
                            <p>
                                <?php echo esc_html($text); ?>
                            </p>
                        </div>
                    </li>
                <?php endforeach; ?>
            </ul>
        </section>
    <?php endif; ?>
</main>
</div>
<?php
get_footer();
