<?php
/**
 * Copyright © Magefan (support@magefan.com). All rights reserved.
 * Please visit Magefan.com for license details (https://magefan.com/end-user-license-agreement).
 *
 * Glory to Ukraine! Glory to the heroes!
 */
?>
<?php
/**
 * Blog tag claud sidebar template
 *
 * @var $block \Magefan\Blog\Block\Sidebar\TagClaud
 */
?>
<?php $tags = $block->getTags(); ?>

<?php if (count($tags)) { ?>
<div class="widget block block-tagclaud" data-bind="scope: 'tagclaud'">
    <div class="block-title">
        <strong><?= $block->escapeHtml(__('Tags')) ?></strong>
    </div>

    <div id="blogSidebarCloudCanvasContainer">
        <canvas style="width:100%" height="<?= $block->escapeHtml($block->getConfigValue($block::CLOUD_HEIGHT)) ?>" id="blogSidebarCloudCanvas">
            <div class="tagclaud-hld">
                <?php foreach ($tags as $tag) { ?>
                    <?php $title = $tag->getTitle() ?>
                    <span class="<?= $block->escapeHtml($block->getTagClass($tag)) ?>">
                        <a href="<?= $block->escapeUrl($tag->getTagUrl()) ?>" title="<?= $block->escapeHtml($title) ?>">
                            <?= $block->escapeHtml($title) ?>
                         </a>
                    </span>
                <?php } ?>
            </div>
        </canvas>
    </div>
</div>

<script>
    require(['jquery', 'domReady!'], function($) {
        require(['Magefan_Blog/js/jquery.tagcanvas.min'], function(){
            if (  ! $('#blogSidebarCloudCanvas').tagcanvas(<?= /*@noEscape*/ $block->getAnimationConfig() ?>)) {
                $('#blogSidebarCloudCanvasContainer').hide();
            }
        });
    });
</script>
<?php } ?>


