UNPKG

@bennerinformatics/ember-fw-gc

Version:

A set of components, controllers, routes, and helpers used in all Group-Control managed FW App System applications

395 lines (361 loc) 20.4 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>FwGcNav - Ember-FW-GC</title> <meta name="description" content="A set of components, controllers, routes, and helpers used in all FW Kit applications."> <link rel="stylesheet" href="http://yui.yahooapis.com/3.9.1/build/cssgrids/cssgrids-min.css"> <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css"> <link rel="stylesheet" href="../assets/css/main.css" id="site_styles"> <link rel="stylesheet" href="../assets/css/custom.css"> <link rel="stylesheet" href="../assets/vendor/bootstrap/css/bootstrap.css"> <link rel="stylesheet" href="../assets/vendor/font-awesome/css/font-awesome.min.css"> <link rel="stylesheet" href="../assets/css/theme.css"> <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700' rel='stylesheet' type='text/css'> <!-- favicon information --> <link rel="apple-touch-icon" sizes="57x57" href="/assets/icons/apple-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="/assets/icons/apple-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="/assets/icons/apple-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="/assets/icons/apple-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="/assets/icons/apple-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="/assets/icons/apple-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="/assets/icons/apple-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="/assets/icons/apple-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="/assets/icons/apple-icon-180x180.png"> <link rel="icon" type="image/png" sizes="192x192" href="/assets/icons/android-icon-192x192.png"> <link rel="icon" type="image/png" sizes="32x32" href="/assets/icons/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="96x96" href="/assets/icons/favicon-96x96.png"> <link rel="icon" type="image/png" sizes="16x16" href="/assets/icons/favicon-16x16.png"> <link rel="manifest" href="/assets/icons/manifest.json"> <meta name="msapplication-TileImage" content="/assets/icons/ms-icon-144x144.png"> <style> body a { color: #7E3DB7; } body a:hover { color: #7E3DB7; opacity: 0.5; } .navbar.navbar-default .navbar-nav> li> a:focus, .navbar.navbar-default .navbar-nav> li> a:hover { color: #7E3DB7; } .navbar.navbar-default .navbar-nav> .active> a, .navbar.navbar-default .navbar-nav> .active> a:focus, .navbar.navbar-default .navbar-nav> .active> a:hover { color: #7E3DB7; } #docs-main .page-header { color: #7E3DB7; } #docs-main .page-section .nav-tabs { border-bottom: 1px solid #7E3DB7; } #docs-main .page-section .nav-tabs> li.active a { background: #7E3DB7; border: 1px solid #7E3DB7; } #sidebar li.panel .panel-body ol> li.active, #sidebar li.panel .panel-body ol> li:hover { background: #efefef; } </style> </head> <body> <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <a href="../" class="navbar-brand"> <img src="..\assets\img\fw-logo.png" alt="enterprise logo"> <span>Ember-FW-GC (API)</span> </a> </div> <div class="collapse navbar-collapse" id="nav"> <ul class="nav navbar-nav navbar-right"> <li><a href="https://linformatics.bitbucket.io/docs/">Docs</a></li> <li><a href="https://linformatics.bitbucket.io/downloads/">Downloads</a></li> <li><a href="https://linformatics.bitbucket.io/api/">API</a></li> <li><a href="https://bitbucket.org/linformatics/ember-fw-gc" class="fa fa-github github"></a></li> </ul> </div> </div> </nav> <div id="main-wrapper" class="row"> <div id="content-wrapper"> <ol class="panel-group" id="sidebar" role="tablist" aria-multiselectable="true"> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-search-heading"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" href="#sidebar-search" aria-expanded="true" aria-controls="collapseOne"> Search </a> </h4> </div> <div id="sidebar-search" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="sidebar-search-heading"> <div class="panel-body"> <div id="api-tabview-filter"> <input type="search" id="api-filter" placeholder="Search..."> </div> </div> </div> </li> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-version-heading"> <h4 class="panel-title"> <a role="button" href="https://bitbucket.org/linformatics/ember-fw-gc/commits/5e99b10c" target="_blank"> Tag: 2.1.16.5e99b10c </a> </h4> </div> </li> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-modules-heading"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" href="#sidebar-modules" aria-expanded="true" aria-controls="collapseOne"> Modules </a> </h4> </div> <div id="sidebar-modules" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="sidebar-modules-heading"> <div class="panel-body"> <ol> <li> <a href="../modules/Components.html">Components</a> </li> <li> <a href="../modules/Helpers.html">Helpers</a> </li> <li> <a href="../modules/Introduction.html">Introduction</a> </li> <li> <a href="../modules/Miscellaneous.html">Miscellaneous</a> </li> <li> <a href="../modules/Mixins.html">Mixins</a> </li> <li> <a href="../modules/Models.html">Models</a> </li> <li> <a href="../modules/Pages.html">Pages</a> </li> <li> <a href="../modules/Services.html">Services</a> </li> <li> <a href="../modules/Utils.html">Utils</a> </li> </ol> </div> </div> </li> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-classes-heading"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" href="#sidebar-classes" aria-expanded="true" aria-controls="collapseOne"> Classes </a> </h4> </div> <div id="sidebar-classes" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="sidebar-classes-heading"> <div class="panel-body"> <ol> <li> <a href="../classes/AboutAppModal.html">AboutAppModal</a> </li> <li> <a href="../classes/AjaxService.html">AjaxService</a> </li> <li> <a href="../classes/ApplicationControllerMixin.html">ApplicationControllerMixin</a> </li> <li> <a href="../classes/AppMeta.html">AppMeta</a> </li> <li> <a href="../classes/AppMetaService.html">AppMetaService</a> </li> <li> <a href="../classes/AppSwitchModal.html">AppSwitchModal</a> </li> <li> <a href="../classes/AuthBlock.html">AuthBlock</a> </li> <li> <a href="../classes/AuthButton.html">AuthButton</a> </li> <li> <a href="../classes/AuthCheckMixin.html">AuthCheckMixin</a> </li> <li> <a href="../classes/AuthComponentMixin.html">AuthComponentMixin</a> </li> <li> <a href="../classes/AuthRoute.html">AuthRoute</a> </li> <li> <a href="../classes/AuthRoute-Addon.html">AuthRoute-Addon</a> </li> <li> <a href="../classes/AuthRouteMixin.html">AuthRouteMixin</a> </li> <li> <a href="../classes/ChangePasswordModal.html">ChangePasswordModal</a> </li> <li> <a href="../classes/ConfigService.html">ConfigService</a> </li> <li> <a href="../classes/CurrentUserService.html">CurrentUserService</a> </li> <li> <a href="../classes/DepartmentTransitionMixin.html">DepartmentTransitionMixin</a> </li> <li> <a href="../classes/ForgotPage.html">ForgotPage</a> </li> <li> <a href="../classes/FwAppAdapter.html">FwAppAdapter</a> </li> <li> <a href="../classes/FwAppLink.html">FwAppLink</a> </li> <li> <a href="../classes/FwDocLink.html">FwDocLink</a> </li> <li> <a href="../classes/FwGcNav.html">FwGcNav</a> </li> <li> <a href="../classes/FwHeaderGc.html">FwHeaderGc</a> </li> <li> <a href="../classes/GroupControlAuthenticator.html">GroupControlAuthenticator</a> </li> <li> <a href="../classes/HasApp.html">HasApp</a> </li> <li> <a href="../classes/HasDepartment.html">HasDepartment</a> </li> <li> <a href="../classes/HasRole.html">HasRole</a> </li> <li> <a href="../classes/JokesService.html">JokesService</a> </li> <li> <a href="../classes/LoginPage.html">LoginPage</a> </li> <li> <a href="../classes/MatchUtil.html">MatchUtil</a> </li> <li> <a href="../classes/MixinIndexRoute.html">MixinIndexRoute</a> </li> <li> <a href="../classes/OptionalAppAdapter.html">OptionalAppAdapter</a> </li> <li> <a href="../classes/PermissionsMixin.html">PermissionsMixin</a> </li> <li> <a href="../classes/ProfilePage.html">ProfilePage</a> </li> <li> <a href="../classes/ReLoginModal.html">ReLoginModal</a> </li> <li> <a href="../classes/ResetPage.html">ResetPage</a> </li> <li> <a href="../classes/RestrictedRoute.html">RestrictedRoute</a> </li> <li> <a href="../classes/RestrictedRouteMixin.html">RestrictedRouteMixin</a> </li> <li> <a href="../classes/UserModel.html">UserModel</a> </li> </ol> </div> </div> </li> </ol> <div class="content-container"> <div class="apidocs"> <div id="docs-main"> <div class="content"> <div class="page-header"> <h1> <i class="fa fa-bookmark-o" aria-hidden="true"></i> FwGcNav Class <a class="pull-right file-edit" href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-gc-nav.js#L5" target="_blank"> <i class="fa fa-pencil" aria-hidden="true"></i> </a> </h1> </div> <div class="content-meta"> <div class="extends"> Extends: FwNav </div> Module: <a href="../modules/Components.html">Components</a> <div class="foundat"> Defined In: <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-gc-nav.js#L5">addon\components\fw-gc-nav.js:5</a> </div> </div> <div class="class-description"> <p>This component extends <a href="https://linformatics.bitbucket.io/docs/addons/client-api/ember-fw/classes/FwNav.html">FwNav</a>. It retains all the basic features of the navigation implemented by <code>FwNav</code>, but it also changes depending upon whether the user is authenticated or not. If the session is authenticated and the user has roles within the app, <code>FwGcNav</code> will yield what is passed into it into the <code>FwNav</code> component. If however, the session is authenticated and the user has no roles, the only page which will be displayed in the navigation is Index. If the session has not been authenticated, the Login page will be the only page displayed in the navigation bar. For more information about the login page, <a href="../classes/LoginPage.html">click here</a>.</p> <p>The usage of <code>FwGcNav</code> is identical to <code>FwNav</code>:</p> <pre class="code prettyprint"><code class="language-handlebars">&lt;FwGcNav&gt; &lt;ul&gt; &lt;li&gt; &lt;LinkTo @route="myPage"&gt;My Page&lt;/LinkTo&gt; &lt;/ul&gt; &lt;/FwGcNav&gt; </code></pre> </div> <div> <div class="page-section"> <!-- Nav tabs --> <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#tab_index" aria-controls="tab_index" role="tab" data-toggle="tab">Index</a></li> </ul> <!-- Tab panes --> <div class="tab-content"> <form id="options-form" class="form-inline"> Show: <label for="api-show-inherited" class="checkbox"> <input type="checkbox" id="api-show-inherited" checked> Inherited </label> <label for="api-show-protected" class="checkbox"> <input type="checkbox" id="api-show-protected"> Protected </label> <label for="api-show-private" class="checkbox"> <input type="checkbox" id="api-show-private"> Private </label> <label for="api-show-deprecated" class="checkbox"> <input type="checkbox" id="api-show-deprecated"> Deprecated </label> </form> <div id="tab_index" role="tabpanel" class="tab-pane active" > </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <script src="../assets/vendor/prettify/prettify-min.js"></script> <script>prettyPrint();</script> <script src="../assets/vendor/jquery/jquery.min.js"></script> <script src="../assets/vendor/jquery-ui/jquery-ui.min.js"></script> <script src="../assets/vendor/bootstrap/js/bootstrap.js"></script> <script src="../assets/vendor/github-slugger/slugger.js"></script> <script src="../assets/js/yuidoc-bootstrap.js"></script> </body> </html>