@@if (typeof pages !== 'undefined' && pages.length) {
<div class="@editorClass @classNames @widget.classNames" data-responsive-menu="@(widget.responsive.responsive !== 'none')" data-responsive-levels="@widget.responsive.levels">
    <div class="@widget.block.classNames bd-own-margins">
        @if (header) {
        <div class="@widget.block.blockHeader.classNames">
            <h4>@header</h4>
        </div>
        }
        @widget.vmenu.effects.openTag
        <div class="@widget.block.blockContent.classNames shape-only">
            <div class="@widget.vmenu.classNames">
                <div class="@containerInner">
                    @widget.vmenu.menu.effects.openTag
                    <ul class="@widget.vmenu.menu.classNames nav @widget.vmenu.menu.type">
                        @widget.vmenu.menu.item.effects.openTag
                        @@{
                            var pageParents = page.parents ? page.parents : [];
                            var filterItems = function (items) {
                                return items.filter(function (i) {
                                    return i.showInVMenu;
                                });
                            };

                            var inParents = function (id) {
                                return pageParents.some(function (i) {
                                    return i.id === id;
                                });
                            };
                        }
                        @@function renderVMenuLevels(items) {
                            @@{ var items = filterItems(items); }
                            @@if (items.length) {
                            <div class="@widget.vmenu.subMenu.Menu.name-@widget.vmenu.subMenu.Menu.id-popup">
                                @widget.vmenu.subMenu.Menu.effects.closeTag
                                <ul class="@widget.vmenu.subMenu.Menu.classNames">
                                    @@for (var i = 0; i < items.length; i++) {
                                        @@{
                                            var item = items[i];
                                            var isActive = inParents(item.id) || page.id === item.id;
                                            var itemHref = item.customUrl || (pathToRoot + item.filePath);
                                        }
                                        @widget.vmenu.subMenu.Menu.item.effects.closeTag
                                        <li class="@widget.vmenu.subMenu.Menu.item.classNames">
                                            <a @@if (isActive) { class="active" } title="@@(item.titleInBrowser)" href="@@(itemHref)" @@if (item.target) { target="@@(item.target)" }>@@(item.caption)</a>
                                            @@if (item.children) {
                                                @@(renderVMenuLevels(item.children))
                                            }
                                        </li>
                                        @widget.vmenu.subMenu.Menu.item.effects.closeTag
                                    }
                                </ul>
                                @widget.vmenu.subMenu.Menu.effects.closeTag
                            </div>
                            }
                        }
                        @@{ var items = filterItems(pages); }
                        @@for (var i = 0; i < items.length; i++) {
                            @@{
                                var item = items[i];
                                var isActive = inParents(item.id) || page.id === item.id;
                                var itemHref = item.customUrl || (pathToRoot + item.filePath);
                            }
                            @widget.vmenu.menu.item.effects.openTag
                            <li class="@widget.vmenu.menu.item.classNames">
                                <a @@if (isActive) { class="active" } title="@@(item.titleInBrowser)" href="@@(itemHref)" @@if (item.target) { target="@@(item.target)" }>@@(item.caption)</a>
                                @@if (item.children) {
                                    @@(renderVMenuLevels(item.children))
                                }
                            </li>
                            @widget.vmenu.menu.item.effects.closeTag
                        }
                    </ul>
                    @widget.vmenu.menu.effects.closeTag
                </div>
            </div>
        </div>
        @widget.vmenu.effects.closeTag
    </div>
</div>
}