<?php
/**
 * Mageplaza
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Mageplaza.com license that is
 * available through the world-wide-web at this URL:
 * https://www.mageplaza.com/LICENSE.txt
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade this extension to newer
 * version in the future.
 *
 * @category    Mageplaza
 * @package     Mageplaza_Faqs
 * @copyright   Copyright (c) Mageplaza (https://www.mageplaza.com/)
 * @license     https://www.mageplaza.com/LICENSE.txt
 */

use Mageplaza\Faqs\Block\Article\View;
use Mageplaza\Faqs\Model\Config\Source\IconType;

/** @var View $block */
$_article        = $block->getArticle();
$relatedArticles = $block->getRelatedArticlesCollection($_article->getId());
$helperData      = $block->getHelperData();
$tags            = $block->getTagList($_article);
?>

<div class="mpfaqs-container mpfaqs">
    <div class="section">
        <div class="mpfaqs-container__content">
            <div class="mpfaqs-container__content__header row">
                <div class="article-icon">
                    <?php if ((int) $_article->getIconType() === IconType::FONT_AWESOME) : ?>
                        <i class="<?= $block->escapeHtmlAttr($_article->getIcon()) ?> fa-3x grey-text"
                           aria-hidden="true">
                        </i>
                    <?php else : ?>
                        <?php
                        $iconUrl    = $helperData->getFileUrl($_article->getIconCustomPath());
                        $iconWidth  = $_article->getIconCustomWidth() ?: '50';
                        $iconHeight = $_article->getIconCustomHeight() ?: '20';
                        ?>
                        <?php if ($iconUrl !== '') : ?>
                            <img src="<?= $block->escapeUrl($iconUrl) ?>"
                                 width="<?= $block->escapeHtmlAttr($iconWidth . 'px') ?>"
                                <?= $iconHeight ?
                                    'height="' . $block->escapeHtmlAttr($iconHeight) . 'px"' : '' ?>>
                        <?php else : ?>
                            <i class="<?= $block->escapeHtmlAttr($_article->getIcon()) ?> fa-3x grey-text"
                               aria-hidden="true">
                            </i>
                        <?php endif; ?>
                    <?php endif; ?>
                </div>
                <div class="mpfaqs-container__content__header__information col xl11 m9 s12">
                    <h3><?= $block->escapeHtml($_article->getName()) ?></h3>
                    <div class="header-description grey-text">
                        <span><i
                                    class="far fa-eye"></i> <?= $block->escapeHtml($_article->getViews()) ?> <?= $block->escapeHtml(__("views")) ?></span>
                        <span><i class="far fa-calendar-alt"></i>
                            &nbsp<?= $block->escapeHtml($block->getDateFormat($_article->getCreatedAt(), "F j, Y")) ?>
                        </span>
                        <span class="like-count">
                            <i class="far fa-thumbs-up"></i>
                        </span>
                    </div>
                </div>
            </div>
            <div class="clearfix"></div>
            <div class="mpfaqs-container__content__body row">
                <?= ($block->helperData->getPageFilter($_article->getArticleContent())) ?: $block->escapeHtml(__('There is no answer for this question .')) ?>
            </div>
            <?php if ($tags) : ?>
                <h4><?= $block->escapeHtml(__('Tags')) ?></h4>
                <div class="section lighten-5 row" style="display: flex">
                    <?= /* @noEscape */
                    $tags ?>
                </div>
            <?php endif; ?>
        </div>
        <div class="mpfaqs-container__additional-info center">
            <div class="container mpfaqs-container__additional-info__social">
                <!-- Go to www.addthis.com/dashboard to customize your tools -->
                <script type="text/javascript"
                        src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-5b655696496841be"></script>
                <div id="mpfaqs-container__additional-info__social__sharing">
                    <div class="addthis_inline_share_toolbox" data-url="<?= $block->escapeUrl($block->getCurrentUrl()) ?>"></div>
                </div>
            </div>
            <hr>
            <div class="mpfaqs-container__additional-info__rating container">
                <?php if ($block->isShowHelpful()) : ?>
                    <?= $block->getChildHtml('helpfulrate') ?>
                <?php endif; ?>
                <?= $block->getChildHtml('form') ?>
            </div>
        </div>
        <?php if ($relatedArticles->getSize()) : ?>
            <div id="mpfaqs-list-container" class="mpfaqs-list mpfaqs">
                <h4><?= /** @noEscape */
                    __('Related Questions') ?></h4>
                <div class="section grey lighten-5 row mpfaqs-section_related_articles">
                    <?php foreach ($relatedArticles as $relatedArticle) : ?>
                        <div class="mpfaqs-list__block col m4 s12">
                            <div class="mpfaqs-list__block__category">
                                <h4>
                                    <a href="<?= $block->escapeUrl($relatedArticle->getUrl()) ?>">
                                        <?php if ((int) $relatedArticle->getIconType() === IconType::FONT_AWESOME) : ?>
                                            <i class="<?= $block->escapeHtmlAttr($relatedArticle->getIcon()) ?>"
                                               aria-hidden="true">
                                            </i>
                                        <?php else : ?>
                                            <?php
                                            $iconUrl    = $helperData->getFileUrl($relatedArticle->getIconCustomPath());
                                            $iconWidth  = $relatedArticle->getIconCustomWidth() ?: '50';
                                            $iconHeight = $relatedArticle->getIconCustomHeight() ?: '20';
                                            ?>
                                            <?php if ($iconUrl !== '') : ?>
                                                <img src="<?= $block->escapeUrl($iconUrl) ?>"
                                                     width="<?= $block->escapeHtmlAttr($iconWidth . 'px') ?>"
                                                    <?= $iconHeight ? 'height="' . $block->escapeHtmlAttr($iconHeight) .
                                                        'px"' : '' ?>>
                                            <?php else : ?>
                                                <i class="<?= $block->escapeHtmlAttr($relatedArticle->getIcon()) ?>"
                                                   aria-hidden="true">
                                                </i>
                                            <?php endif; ?>
                                        <?php endif; ?>
                                        <?= $block->escapeHtml($relatedArticle->getName()) ?>
                                    </a>
                                </h4>
                                <div class="header-description grey-text">
                            <span>
                                <i class="far fa-eye"></i>
                                <?= /** @noEscape */
                                $relatedArticle->getViews() ?> <?= $block->escapeHtml(__("views")) ?>
                            </span>
                                    <span>
                                <i class="far fa-calendar-alt"></i>&nbsp
                                <?= /** @noEscape */
                                $block->getDateFormat($relatedArticle->getCreatedAt(), "F j, Y") ?>
                            </span>
                                </div>
                                <hr>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        <?php endif; ?>
    </div>
</div>
<script type="text/javascript">
    require(['jquery', 'helpful_rate', 'materialize'], function ($, helpful_rate) {
        var config = {
            messengerBox: {
                voteSuccess: '<?= $block->getMessagesHtml('addsuccess', $helperData->getPositiveHelpful())?>',
                voteAlert: '<?= $block->getMessagesHtml('adderror', $helperData->getNegativeHelpful())?>'
            },
            articleId: '<?= /** @noEscape */ $_article->getId()?>',
            gifLoader: '<?= $block->escapeUrl($block->getViewFileUrl('Mageplaza_Faqs::media/images/icon-loader.gif')) ?>'
        };
        helpful_rate(config);
    });
</script>
