Use route names to generate links on new menus

This commit is contained in:
Joe Fiorini 2015-05-13 13:03:54 -04:00
parent b329f314c2
commit 0aa37251c6
5 changed files with 24 additions and 20 deletions

View File

@ -1,6 +1,6 @@
<nav class="MainMenu MainMenu--fixedTop">
<a href="#/home" title="Home" class="MenuItem MenuItem--logo">
<img id="ansible-brand-logo" class="MenuItem-logo" src="/static/img/TowerLogo.svg">
<a link-to="dashboard" class="MenuItem MenuItem--logo">
<img id="ansible-brand-logo" alt="Ansible Tower" class="MenuItem-logo" src="/static/img/TowerLogo.svg">
<menu-toggle-button width="15" height="15" bar-height="2" class="MainMenu-toggle"></menu-toggle-button>
</a>
<include-partial ng-include="menuStylePartialUrl"></include-partial>

View File

@ -1,16 +1,16 @@
<a menu-item href="#/projects" title="Projects" class="MenuItem">
<a menu-item link-to="projects" title="Projects" class="MenuItem">
Projects
</a>
<a menu-item href="#/inventories" title="Inventories" class="MenuItem">
<a menu-item link-to="inventories" title="Inventories" class="MenuItem">
Inventories
</a>
<a menu-item href="#/job_templates" title="Job Templates" class="MenuItem">
<a menu-item link-to="jobTemplates" title="Job Templates" class="MenuItem">
Job Templates
</a>
<a menu-item href="#/jobs" title="Jobs" class="MenuItem">
<a menu-item link-to="jobs" title="Jobs" class="MenuItem">
Jobs
</a>
<a href="/#/users/{{currentUser.id}}" class="MenuItem MenuItem--right MenuItem--fixed MenuItem-username">
<a link-to="userEdit" model="{ user_id: currentUser }" class="MenuItem MenuItem--right MenuItem--fixed MenuItem-username">
<i class="MenuItem-icon MenuItem-icon--labelled">
<aw-icon name="User"></aw-icon>
</i>
@ -18,20 +18,20 @@
{{currentUser.username}}
</span>
</a>
<a href="#/setup" class="MenuItem MenuItem--fixed">
<a link-to="setup" class="MenuItem MenuItem--fixed">
<i class="MenuItem-icon" title="Setup" data-placement="bottom">
<aw-icon name="Setup"></aw-icon>
</i>
<span class="MenuItem-helpTitle">Setup</span>
</a>
<a portal-mode-link class="MenuItem MenuItem--fixed">
<a link-to="portal" portal-mode-link class="MenuItem MenuItem--fixed">
<i class="MenuItem-icon" title="Portal Mode" data-placement="bottom">
<aw-icon name="PortalMode"></aw-icon>
<!-- <img src="/static/img/PortalMode.svg" title="Portal Mode" data-placement="bottom" class="MenuItem-icon"> -->
</i>
<span class="MenuItem-helpTitle">Portal Mode</span>
</a>
<a href="#/logout"class="MenuItem MenuItem--fixed">
<a link-to="signOut" class="MenuItem MenuItem--fixed">
<i class="MenuItem-icon" title="Sign Out" data-placement="bottom">
<aw-icon name="Signout"></aw-icon>
<!-- <img src="/static/img/Signout.svg" title="Sign out" data-placement="bottom" class="MenuItem-icon"> -->

View File

@ -1,17 +1,20 @@
export default ['$location', function($location) {
/* jshint unused: vars */
export default ['$route', '$rootScope', function($route, $rootScope) {
return {
link: function(scope, element, attrs) {
var itemPath = attrs.href.replace(/^#/, '');
var routeName = attrs.linkTo;
scope.$watch(function() {
return $location.path();
}, function(currentPath) {
if (currentPath === itemPath) {
return $route.current.name;
}, function(nextRoute) {
if (nextRoute === routeName) {
element.addClass('MenuItem--active');
} else {
element.removeClass('MenuItem--active');
}
});
}
};
}];

View File

@ -1,6 +1,6 @@
<section id="htmlTemplate" class="Container">
<nav class="SetupMenu Container-main">
<a href="#/credentials" class="SetupItem HoverIcon Media">
<a link-to="credentials" class="SetupItem HoverIcon Media">
<i class="SetupItem-icon HoverIcon-icon HoverIcon-icon--color Media-figure">
<aw-icon name="Credentials"></aw-icon>
</i>
@ -9,7 +9,7 @@
<p class="SetupItem-description">Add passwords, SSH keys, etc. for Tower to use when launching jobs against machines, or syncing inventories or projects.</p>
</div>
</a>
<a href="#/users" class="SetupItem HoverIcon Media">
<a link-to="users" class="SetupItem HoverIcon Media">
<i class="SetupItem-icon HoverIcon-icon HoverIcon-icon--color Media-figure">
<aw-icon name="Users"></aw-icon>
</i>
@ -20,7 +20,7 @@
</p>
</div>
</a>
<a href="#/teams" class="SetupItem HoverIcon Media">
<a link-to="teams" class="SetupItem HoverIcon Media">
<i class="SetupItem-icon HoverIcon-icon HoverIcon-icon--color Media-figure">
<aw-icon name="Teams"></aw-icon>
</i>
@ -34,7 +34,7 @@
</nav>
<aside class="Container-aside">
<nav class="SetupMenu Menu Menu--vertical">
<a href="#/organizations" class="SetupItem SetupItem--aside HoverIcon Media">
<a link-to="organizations" class="SetupItem SetupItem--aside HoverIcon Media">
<i class="SetupItem-icon SetupItem-icon--aside HoverIcon-icon HoverIcon-icon--opacity Media-figure">
<aw-icon name="Organizations"></aw-icon>
</i>
@ -67,7 +67,7 @@
</p>
</div>
</button>
<button href="#/license" ng-click="showLicenseModal()" class="SetupItem SetupItem--button SetupItem--aside SetupItem--noIcon">
<button ng-click="showLicenseModal()" class="SetupItem SetupItem--button SetupItem--aside SetupItem--noIcon">
<h4 class="SetupItem-title SetupItem-title--aside">View your License</h4>
</button>
<button ng-click="showAboutModal()" class="SetupItem SetupItem--button SetupItem--aside SetupItem--noIcon">

View File

@ -1,6 +1,7 @@
import controller from './setup.controller';
export default {
name: 'setup',
route: '/setup',
controller: controller,
templateUrl: '/static/js/setup-menu/setup-menu.partial.html'