<?php
/**
 * Страница всех городов
 * @var $breadcrumbs bff\view\Breadcrumbs
 * @var $titleh1 string
 * @var $regions array
 * @var $seotext string
 */
?>
<div class="container">
	<?= $breadcrumbs; ?>
    <div class="l-page-head">
        <h1 class="l-page-title c-title"><?= $titleh1 ?></h1>
    </div>

    <div class="h-cats-list h-cat-level-1 j-collapse-list-box">
		<?php foreach ($regions as $v) { ?>
            <div class="h-cats-list-item j-collapse-list-item">
                <div class="h-cats-list-item-main">
					<?php if ($v['items']) { ?>
                        <a href="<?= $v['link'] ?>"><?= $v['title'] ?></a>
					<?php } else { ?>
                        <span class="hidden-link" data-link="<?= $v['link'] ?>"><?= $v['title'] ?></span>
					<?php } ?>
                    <span class="h-collapse-arrow j-collapse-list-mobile"></span>
                </div>
                <?php if (! empty($v['ch'])) { ?>
                <ul class="h-cat-level-2 j-collapse-list">
					<?php foreach ($v['ch'] as $vv) { ?>
                        <li>
							<?php if ($vv['items']) { ?>
                                <a href="<?= $vv['link'] ?>"><?= $vv['title'] ?></a>
							<?php } else { ?>
                                <span class="hidden-link" data-link="<?= $vv['link'] ?>"><?= $vv['title'] ?></span>
							<?php } ?>
                            <?php if (! empty($v['ch'])) { ?>
                                <ul class="h-cat-level-3"><?php foreach ($vv['ch'] as $vvv) { ?><li>
                                        <?php if ($vvv['items']) { ?>
                                            <a href="<?= $vvv['link'] ?>"><?= $vvv['title'] ?></a>
                                        <?php } else { ?>
                                            <span class="hidden-link" data-link="<?= $vvv['link'] ?>"><?= $vvv['title'] ?></span>
                                        <?php } ?>
                                    </li><?php } ?></ul>
                            <?php } ?>
                        </li>
					<?php } ?>
                </ul>
                <?php } ?>
            </div>
		<?php } ?>
    </div>
</div>
<?php /* Seotext */
if (!empty($seotext)) { ?>
	<?= $seotext ?>
<?php } ?>

<script>
    <?php View::package('masonry-layout'); ?>
	<?php js::start(); ?>
    /*init masonry*/
    if ($(window).width() > 767) {
        var $grid = $('.j-collapse-list-box').masonry({
            itemSelector: '.j-collapse-list-item',
            columnWidth: 300,
            horizontalOrder: true,
            initLayout: false,
            originLeft: !app.rtl
        });

        $grid.masonry('on', 'layoutComplete', function() {
            $grid.addClass('is-masonry')
        });

        $grid.masonry();
    }
	<?php js::stop(); ?>
</script>