@@ -11329,6 +11329,8 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
11329
11329
* <li>.tooltip - (string) Tooltip to display for the badge
11330
11330
* <li>.badgeClass: - (string) Additional class(es) to add to the badge container
11331
11331
* </ul>
11332
+ * <li>.mobileOnly - (boolean) When set to 'true', menu item will only be displayed when browser is in mobile mode (<768px).
11333
+ * When <code>ignoreMobile</code> flag set to 'true', <code>mobileOnly</code> items are not displayed.
11332
11334
* </ul>
11333
11335
* @param {function} navigateCallback function(item) Callback method invoked on a navigation item click (one with no submenus)
11334
11336
* @param {function} itemClickCallback function(item) Callback method invoked on an item click
@@ -11370,7 +11372,7 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
11370
11372
<span class="caret"></span>
11371
11373
</a>
11372
11374
<ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
11373
- <li><a href="#">Preferences</a></li>
11375
+ <li><a href="#">User Preferences</a></li>
11374
11376
<li><a href="#">Logout</a></li>
11375
11377
</ul>
11376
11378
</li>
@@ -11686,9 +11688,19 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
11686
11688
href: "#/adipscing"
11687
11689
},
11688
11690
{
11689
- title: "Lorem",
11690
- iconClass: "fa fa-gamepad",
11691
- href: "#/lorem"
11691
+ title: "Help",
11692
+ iconClass: "fa pficon-help",
11693
+ href: "#/help",
11694
+ mobileOnly: true
11695
+ },
11696
+ {
11697
+ title: "User",
11698
+ iconClass: "fa pficon-user",
11699
+ mobileOnly: true,
11700
+ children: [
11701
+ { title: "User Preferences" },
11702
+ { title: "Logout" }
11703
+ ]
11692
11704
},
11693
11705
{
11694
11706
title: "Exit Demo"
@@ -11965,6 +11977,8 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
11965
11977
* </ul>
11966
11978
* <li>.uiSref - (string) Optional Angular UI Router state name. If specified, href must be not defined, and vice versa.
11967
11979
* <li>.uiSrefOptions - (object) Optional object to be passed to Angular UI Router $state.go() function
11980
+ * <li>.mobileOnly - (boolean) When set to 'true', menu item will only be displayed when browser is in mobile mode (<768px).
11981
+ * When <code>ignoreMobile</code> flag set to 'true', <code>mobileOnly</code> items are not displayed.
11968
11982
* </ul>
11969
11983
* @param {function} navigateCallback function(item) Callback method invoked on a navigation item click (one with no submenus)
11970
11984
* @param {function} itemClickCallback function(item) Callback method invoked on an item click
@@ -12006,7 +12020,7 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
12006
12020
<span class="caret"></span>
12007
12021
</a>
12008
12022
<ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
12009
- <li><a href="#">Preferences</a></li>
12023
+ <li><a href="#">User Preferences</a></li>
12010
12024
<li><a href="#">Logout</a></li>
12011
12025
</ul>
12012
12026
</li>
@@ -12064,6 +12078,36 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
12064
12078
</p>\
12065
12079
</div>\
12066
12080
</div>'
12081
+ })
12082
+ .state('help', {
12083
+ url: '/help',
12084
+ template: '<div class="card-pf card-pf-accented card-pf-aggregate-status" style="height: 89px;">\
12085
+ <div class="card-pf-body" style="height: 50px;">\
12086
+ <p class="card-pf-aggregate-status-notifications">\
12087
+ State: Help\
12088
+ </p>\
12089
+ </div>\
12090
+ </div>'
12091
+ })
12092
+ .state('user-prefs', {
12093
+ url: '/help',
12094
+ template: '<div class="card-pf card-pf-accented card-pf-aggregate-status" style="height: 89px;">\
12095
+ <div class="card-pf-body" style="height: 50px;">\
12096
+ <p class="card-pf-aggregate-status-notifications">\
12097
+ State: User Preferences\
12098
+ </p>\
12099
+ </div>\
12100
+ </div>'
12101
+ })
12102
+ .state('logout', {
12103
+ url: '/help',
12104
+ template: '<div class="card-pf card-pf-accented card-pf-aggregate-status" style="height: 89px;">\
12105
+ <div class="card-pf-body" style="height: 50px;">\
12106
+ <p class="card-pf-aggregate-status-notifications">\
12107
+ State: Logout\
12108
+ </p>\
12109
+ </div>\
12110
+ </div>'
12067
12111
});
12068
12112
})
12069
12113
.controller('vertNavWithRouterController', ['$scope',
@@ -12085,6 +12129,21 @@ angular.module('patternfly.navigation').component('pfApplicationLauncher', {
12085
12129
iconClass : "fa fa-space-shuttle",
12086
12130
uiSref: "ipsum"
12087
12131
},
12132
+ {
12133
+ title: "Help",
12134
+ iconClass: "fa pficon-help",
12135
+ uiSref: "help",
12136
+ mobileOnly: true
12137
+ },
12138
+ {
12139
+ title: "User",
12140
+ iconClass: "fa pficon-user",
12141
+ mobileOnly: true,
12142
+ children: [
12143
+ { title: "User Preferences", uiSref: "user-prefs" },
12144
+ { title: "Logout", uiSref: "logout" }
12145
+ ]
12146
+ },
12088
12147
{
12089
12148
title: "Exit Demo"
12090
12149
}
@@ -21176,7 +21235,8 @@ angular.module('patternfly.wizard').component('pfWizardSubstep', {
21176
21235
" 'active': item.isActive,\n" +
21177
21236
" 'is-hover': item.isHover,\n" +
21178
21237
" 'mobile-nav-item-pf': item.isMobileItem && $ctrl.showMobileSecondary,\n" +
21179
- " 'mobile-secondary-item-pf': item.isMobileItem && $ctrl.showMobileTertiary}\" ng-mouseenter=$ctrl.handlePrimaryHover(item) ng-mouseleave=$ctrl.handlePrimaryUnHover(item)><a ng-click=\"$ctrl.handlePrimaryClick(item, $event)\"><span class={{item.iconClass}} ng-if=item.iconClass ng-class=\"{hidden: $ctrl.hiddenIcons}\" uib-tooltip={{item.title}} tooltip-append-to-body=true tooltip-enable={{$ctrl.navCollapsed}} tooltip-placement=bottom tooltip-class=nav-pf-vertical-tooltip></span> <span class=list-group-item-value>{{item.title}}</span><div ng-if=\"$ctrl.showBadges && item.badges\" class=badge-container-pf><div class=\"badge {{badge.badgeClass}}\" ng-repeat=\"badge in item.badges\" uib-tooltip={{badge.tooltip}} tooltip-append-to-body=true tooltip-placement=right><span ng-if=\"badge.count && badge.iconClass\" class={{badge.iconClass}}></span> <span ng-if=badge.count>{{badge.count}}</span></div></div></a><div ng-if=\"item.children && item.children.length > 0\" class=nav-pf-secondary-nav><div class=nav-item-pf-header><a class=secondary-collapse-toggle-pf ng-click=\"$ctrl.collapseSecondaryNav(item, $event)\" ng-class=\"{'collapsed': item.secondaryCollapsed}\"></a> <span>{{item.title}}</span></div><ul class=list-group><li ng-repeat=\"secondaryItem in item.children\" class=list-group-item ng-class=\"{'tertiary-nav-item-pf': secondaryItem.children && secondaryItem.children.length > 0,\n" +
21238
+ " 'mobile-secondary-item-pf': item.isMobileItem && $ctrl.showMobileTertiary,\n" +
21239
+ " 'visible-xs': item.mobileOnly}\" ng-mouseenter=$ctrl.handlePrimaryHover(item) ng-mouseleave=$ctrl.handlePrimaryUnHover(item)><a ng-click=\"$ctrl.handlePrimaryClick(item, $event)\"><span class={{item.iconClass}} ng-if=item.iconClass ng-class=\"{hidden: $ctrl.hiddenIcons}\" uib-tooltip={{item.title}} tooltip-append-to-body=true tooltip-enable={{$ctrl.navCollapsed}} tooltip-placement=bottom tooltip-class=nav-pf-vertical-tooltip></span> <span class=list-group-item-value>{{item.title}}</span><div ng-if=\"$ctrl.showBadges && item.badges\" class=badge-container-pf><div class=\"badge {{badge.badgeClass}}\" ng-repeat=\"badge in item.badges\" uib-tooltip={{badge.tooltip}} tooltip-append-to-body=true tooltip-placement=right><span ng-if=\"badge.count && badge.iconClass\" class={{badge.iconClass}}></span> <span ng-if=badge.count>{{badge.count}}</span></div></div></a><div ng-if=\"item.children && item.children.length > 0\" class=nav-pf-secondary-nav><div class=nav-item-pf-header><a class=secondary-collapse-toggle-pf ng-click=\"$ctrl.collapseSecondaryNav(item, $event)\" ng-class=\"{'collapsed': item.secondaryCollapsed}\"></a> <span>{{item.title}}</span></div><ul class=list-group><li ng-repeat=\"secondaryItem in item.children\" class=list-group-item ng-class=\"{'tertiary-nav-item-pf': secondaryItem.children && secondaryItem.children.length > 0,\n" +
21180
21240
" 'active': secondaryItem.isActive,\n" +
21181
21241
" 'is-hover': secondaryItem.isHover,\n" +
21182
21242
" 'mobile-nav-item-pf': secondaryItem.isMobileItem}\" ng-mouseenter=$ctrl.handleSecondaryHover(secondaryItem) ng-mouseleave=$ctrl.handleSecondaryUnHover(secondaryItem)><a ng-click=\"$ctrl.handleSecondaryClick(item, secondaryItem, $event)\"><span class=list-group-item-value>{{secondaryItem.title}}</span><div ng-if=\"$ctrl.showBadges && secondaryItem.badges\" class=badge-container-pf><div class=\"badge {{badge.badgeClass}}\" ng-repeat=\"badge in secondaryItem.badges\" uib-tooltip={{badge.tooltip}} tooltip-append-to-body=true tooltip-placement=right><span ng-if=\"badge.count && badge.iconClass\" class={{badge.iconClass}}></span> <span ng-if=badge.count>{{badge.count}}</span></div></div></a><div ng-if=\"secondaryItem.children && secondaryItem.children.length > 0\" class=nav-pf-tertiary-nav><div class=nav-item-pf-header><a class=tertiary-collapse-toggle-pf ng-click=\"$ctrl.collapseTertiaryNav(secondaryItem, $event)\" ng-class=\"{'collapsed': secondaryItem.tertiaryCollapsed}\"></a> <span>{{secondaryItem.title}}</span></div><ul class=list-group><li ng-repeat=\"tertiaryItem in secondaryItem.children\" class=list-group-item ng-class=\"{'active': tertiaryItem.isActive}\"><a ng-click=\"$ctrl.handleTertiaryClick(item, secondaryItem, tertiaryItem, $event)\"><span class=list-group-item-value>{{tertiaryItem.title}}</span><div ng-if=\"$ctrl.showBadges && tertiaryItem.badges\" class=badge-container-pf><div class=\"badge {{badge.badgeClass}}\" ng-repeat=\"badge in tertiaryItem.badges\" uib-tooltip={{badge.tooltip}} tooltip-append-to-body=true tooltip-placement=right><span ng-if=\"badge.count && badge.iconClass\" class={{badge.iconClass}}></span> <span ng-if=badge.count>{{badge.count}}</span></div></div></a></li></ul></div></li></ul></div></li></ul></div></nav></div>"
0 commit comments