Skip to content

Instantly share code, notes, and snippets.

@dcfrancisco

dcfrancisco/main.js

Forked from farmerbradllc/main.js
Last active January 18, 2016 11:36
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save dcfrancisco/ba2f7c4fdbeb57b889a6 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save dcfrancisco/ba2f7c4fdbeb57b889a6 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
main.js
AUI().ready(
'liferay-hudcrumbs', 'liferay-navigation-interaction', 'liferay-sign-in-modal',
function(A) {
var navigation = A.one('#navigation');
var menu_toggle = navigation.one('#nav_toggle');
if (navigation) {
navigation.plug(Liferay.NavigationInteraction);
}
menu_toggle.on('click', function(event){
navigation.one('.collapse.nav-collapse').toggleClass('open');
});
var siteBreadcrumbs = A.one('#breadcrumbs');
if (siteBreadcrumbs) {
siteBreadcrumbs.plug(A.Hudcrumbs);
}
var signIn = A.one('li.sign-in a');
if (signIn && signIn.getData('redirect') !== 'true') {
signIn.plug(Liferay.SignInModal);
}
}
);
Raw
navigation.vm
<nav class="$nav_css_class navbar site-navigation" id="navigation" role="navigation">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" id="nav_toggle" data-navid="navCollapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<div class="collapse nav-collapse">
<ul aria-label="#language ("site-pages")" id="navCollapse" class="nav " role="menubar">
#foreach ($nav_item in $nav_items)
#set ($nav_item_attr_selected="")
#set ($nav_item_attr_has_popup="")
#set ($nav_item_caret="")
#set ($nav_item_css_class="lfr-nav-item")
#set ($nav_item_link_css_class="")
#if ($nav_item.isSelected())
#set ($nav_item_attr_selected="aria-selected='true'")
#set ($nav_item_css_class="$nav_item_css_class selected active")
#end
#if ($nav_item.hasChildren())
#set ($nav_item_attr_has_popup="aria-haspopup='true'")
#set ($nav_item_caret='<span class="lfr-nav-child-toggle"><i class="icon-caret-down"></i></span>')
#set ($nav_item_css_class="$nav_item_css_class dropdown")
#set ($nav_item_link_css_class="dropdown-toggle")
#end
<li class="$nav_item_css_class" id="layout_$nav_item.getLayoutId()" $nav_item_attr_selected role="presentation">
<a aria-labelledby="layout_$nav_item.getLayoutId()" $nav_item_attr_has_popup class="$nav_item_link_css_class" href="$nav_item.getURL()" $nav_item.getTarget() role="menuitem">
<span>$nav_item.icon() $nav_item.getName() $nav_item_caret</span>
</a>
#if ($nav_item.hasChildren())
<ul class="dropdown-menu child-menu" role="menu">
#foreach ($nav_child in $nav_item.getChildren())
#set ($nav_child_attr_selected="")
#set ($nav_child_css_class="lfr-nav-item")
#if ($nav_child.isSelected())
#set ($nav_child_attr_selected="aria-selected='true'")
#set ($nav_child_css_class="selected")
#end
<li class="$nav_child_css_class" id="layout_$nav_child.getLayoutId()" $nav_child_attr_selected role="presentation">
<a aria-labelledby="layout_$nav_child.getLayoutId()" href="$nav_child.getURL()" $nav_child.getTarget() role="menuitem">$nav_child.getName()</a>
</li>
#end
</ul>
#end
</li>
#end
</ul>
</div>
</div>
</div>
</nav>
<script>
Liferay.Data.NAV_LIST_SELECTOR = '.navbar-inner .nav-collapse > ul';
</script>
@nicolaebiz
Copy link

nicolaebiz commented Jan 18, 2016

Hello, pls can you tell me how make visible navbar in mobile?....for default navbar is hidden when resize ..... thank you

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment