Skip to content

Commit

Permalink
CHE-3160 improve navbar menu
Browse files Browse the repository at this point in the history
Signed-off-by: Oleksii Orel <oorel@codenvy.com>
  • Loading branch information
Oleksii Orel committed Jan 10, 2017
1 parent 01fb27c commit 4afc78b
Show file tree
Hide file tree
Showing 7 changed files with 109 additions and 72 deletions.
4 changes: 2 additions & 2 deletions dashboard/src/app/navbar/navbar-config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
*/
'use strict';

import {CheNavBarCtrl} from './navbar.controller';
import {CheNavBarController} from './navbar.controller';
import {CheNavBar} from './navbar.directive';
import {NavBarSelectedCtrl} from './navbar-selected.controller';
import {NavBarSelected} from './navbar-selected.directive';
Expand All @@ -25,7 +25,7 @@ import {NavbarNotification} from './notification/navbar-notification.directive';
export class NavbarConfig {

constructor(register: che.IRegisterService) {
register.controller('CheNavBarCtrl', CheNavBarCtrl);
register.controller('CheNavBarController', CheNavBarController);
register.controller('NavBarSelectedCtrl', NavBarSelectedCtrl);
register.directive('cheNavBar', CheNavBar);
register.directive('navBarSelected', NavBarSelected);
Expand Down
58 changes: 33 additions & 25 deletions dashboard/src/app/navbar/navbar.controller.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,21 +9,43 @@
* Codenvy, S.A. - initial API and implementation
*/
'use strict';
import {CheAPI} from '../../components/api/che-api.factory';

export class CheNavBarCtrl {
export class CheNavBarController {
links = [{
href: '#/create-workspace',
name: 'New Workspace'
}];
menuItemUrl = {
dashboard: '#/',
workspaces: '#/workspaces',
administration: '#/administration',
// subsections
plugins: '#/admin/plugins',
account: '#/account',
stacks: '#/stacks'
};

private $mdSidenav: ng.material.ISidenavService;
private $scope: ng.IScope;
private $window: ng.IWindowService;
private $location: ng.ILocationService;
private $route: ng.route.IRouteService;
private cheAPI: CheAPI;
private profile: che.IProfile;
private email: string;

/**
* Default constructor
* @ngInject for Dependency injection
*/
constructor($mdSidenav, $scope, $location, $route, cheAPI, $window) {
this.mdSidenav = $mdSidenav;
constructor($mdSidenav: ng.material.ISidenavService, $scope: ng.IScope, $location: ng.ILocationService, $route: ng.route.IRouteService, cheAPI: CheAPI, $window: ng.IWindowService) {
this.$mdSidenav = $mdSidenav;
this.$scope = $scope;
this.$location = $location;
this.$route = $route;
this.cheAPI = cheAPI;
this.$window = $window;
this.links = [{href: '#/create-workspace', name: 'New Workspace'}];

this.profile = cheAPI.getProfile().getProfile();
if (this.profile.email) {
Expand All @@ -36,45 +58,31 @@ export class CheNavBarCtrl {
});
}

this.menuItemUrl = {
dashboard: '#/',
workspaces: '#/workspaces',
administration: '#/administration',
// subsections
plugins: '#/admin/plugins',
account: '#/account',
stacks: '#/stacks'
};

// highlight navbar menu item
$scope.$on('$locationChangeStart', () => {
let path = '#' + $location.path();
$scope.$broadcast('navbar-selected:set', path);
});

cheAPI.cheWorkspace.fetchWorkspaces();
}

isImsAvailable() {
return this.imsArtifactApi.isImsAvailable();
cheAPI.getWorkspace().fetchWorkspaces();
}

reload() {
reload(): void {
this.$route.reload();
}

/**
* Toggle the left menu
*/
toggleLeftMenu() {
this.mdSidenav('left').toggle();
toggleLeftMenu(): void {
this.$mdSidenav('left').toggle();
}

getWorkspacesNumber() {
return this.cheAPI.cheWorkspace.getWorkspaces().length;
getWorkspacesNumber(): number {
return this.cheAPI.getWorkspace().getWorkspaces().length;
}

openLinkInNewTab(url) {
openLinkInNewTab(url: string): void {
this.$window.open(url, '_blank');
}
}
9 changes: 7 additions & 2 deletions dashboard/src/app/navbar/navbar.directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,16 +15,21 @@
* @author Florent Benoit
*/
export class CheNavBar {
private replace: boolean;
private restrict: string;
private templateUrl: string;
private controller: string;
private controllerAs: string;

/**
* Default constructor that is using resource
* @ngInject for Dependency injection
*/
constructor () {
this.restrict='E';
this.restrict = 'E';
this.replace = false;
this.templateUrl = 'app/navbar/navbar.html';
this.controller = 'CheNavBarCtrl';
this.controller = 'CheNavBarController';
this.controllerAs = 'navbarCtrl';
}

Expand Down
9 changes: 4 additions & 5 deletions dashboard/src/app/navbar/navbar.html
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
<section class="left-sidebar-menu" layout="column" layout-align="center center">
<md-list layout="column">
<md-list-item flex class="navbar-subsection-item">
<md-button nav-bar-selected flex che-reload-href ng-href="{{navbarCtrl.menuItemUrl.dashboard}}" layout-align="left"
<md-button nav-bar-selected flex che-reload-href href="{{navbarCtrl.menuItemUrl.dashboard}}" layout-align="left"
target="_self">
<div class="navbar-item" layout="row" layout-align="start center">
<md-icon md-font-icon="navbar-icon chefont cheico-dashboard" aria-label="Dashboard"></md-icon>
Expand All @@ -32,8 +32,7 @@
</md-button>
</md-list-item>
<md-list-item flex class="navbar-subsection-item">
<md-button nav-bar-selected flex che-reload-href
ng-href="{{navbarCtrl.menuItemUrl.workspaces}}" layout-align="left">
<md-button nav-bar-selected flex che-reload-href href="{{navbarCtrl.menuItemUrl.workspaces}}" layout-align="left">
<div class="navbar-item" layout="row" layout-align="start center">
<md-icon md-font-icon="navbar-icon chefont cheico-workspace"></md-icon>
<span>Workspaces</span>
Expand All @@ -43,7 +42,7 @@
</md-list-item>
<md-list-item flex class="navbar-subsection-item">
<md-button nav-bar-selected flex che-reload-href
ng-href="{{navbarCtrl.menuItemUrl.stacks}}" layout-align="left">
href="{{navbarCtrl.menuItemUrl.stacks}}" layout-align="left">
<div class="navbar-item" layout="row" layout-align="start center">
<md-icon md-font-icon="navbar-icon material-design icon-ic_inbox_24px"></md-icon>
<span>Stacks</span>
Expand All @@ -52,7 +51,7 @@
</md-list-item>
<md-list-item flex class="navbar-subsection-item">
<md-button nav-bar-selected flex che-reload-href
ng-href="{{navbarCtrl.menuItemUrl.administration}}" layout-align="left">
href="{{navbarCtrl.menuItemUrl.administration}}" layout-align="left">
<div class="navbar-item" layout="row" layout-align="start center">
<md-icon md-font-icon="navbar-icon material-design icon-ic_settings_24px"></md-icon>
<span>Administration</span>
Expand Down
86 changes: 55 additions & 31 deletions dashboard/src/components/api/che-api.factory.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,19 @@
*/
import {CheSsh} from './che-ssh.factory';
'use strict';
import {CheWorkspace} from './che-workspace.factory';
import {CheProfile} from './che-profile.factory';
import {ChePreferences} from './che-preferences.factory';
import {CheProjectTemplate} from './che-project-template.factory';
import {CheWebsocket} from './che-websocket.factory';
import {CheService} from './che-service.factory';
import {CheAdminPlugins} from './che-admin-plugins.factory';
import {CheAdminService} from './che-admin-service.factory';
import {CheRecipe} from './che-recipe.factory';
import {CheRecipeTemplate} from './che-recipe-template.factory';
import {CheStack} from './che-stack.factory';
import {CheOAuthProvider} from './che-o-auth-provider.factory';
import {CheAgent} from './che-agent.factory';


/**
Expand All @@ -19,15 +32,26 @@ import {CheSsh} from './che-ssh.factory';
*/
export class CheAPI {


private cheSsh : CheSsh;
private cheWorkspace: CheWorkspace;
private cheProfile: CheProfile;
private chePreferences: ChePreferences;
private cheProjectTemplate: CheProjectTemplate;
private cheWebsocket: CheWebsocket;
private cheService: CheService;
private cheAdminPlugins: CheAdminPlugins;
private cheAdminService: CheAdminService;
private cheRecipe: CheRecipe;
private cheRecipeTemplate: CheRecipeTemplate;
private cheStack: CheStack;
private cheOAuthProvider: CheOAuthProvider;
private cheAgent: CheAgent;
private cheSsh: CheSsh;

/**
* Default constructor that is using resource
* @ngInject for Dependency injection
*/
constructor(cheWorkspace, cheProfile, chePreferences, cheProjectTemplate, cheWebsocket, cheService,
cheAdminPlugins, cheAdminService, cheRecipe, cheRecipeTemplate, cheStack, cheOAuthProvider, cheAgent, cheSsh : CheSsh) {
constructor(cheWorkspace: CheWorkspace, cheProfile: CheProfile, chePreferences: ChePreferences, cheProjectTemplate: CheProjectTemplate, cheWebsocket: CheWebsocket, cheService: CheService, cheAdminPlugins: CheAdminPlugins, cheAdminService: CheAdminService, cheRecipe: CheRecipe, cheRecipeTemplate: CheRecipeTemplate, cheStack: CheStack, cheOAuthProvider: CheOAuthProvider, cheAgent: CheAgent, cheSsh: CheSsh) {
this.cheWorkspace = cheWorkspace;
this.cheProfile = cheProfile;
this.chePreferences = chePreferences;
Expand All @@ -47,63 +71,63 @@ export class CheAPI {

/**
* The Che Workspace API
* @returns {CheAPI.cheWorkspace|*}
* @returns {CheAPI.cheWorkspace}
*/
getWorkspace() {
getWorkspace(): CheWorkspace {
return this.cheWorkspace;
}

/**
* The Che oAuth Provider API
* @returns {CheOAuthProvider|*}
* @returns {CheOAuthProvider}
*/
getOAuthProvider() {
getOAuthProvider(): CheOAuthProvider {
return this.cheOAuthProvider;
}

/**
* The Che Profile API
* @returns {CheProfile|*}
* @returns {CheProfile}
*/
getProfile() {
getProfile(): CheProfile {
return this.cheProfile;
}

/**
* The Che Preferences API
* @returns {ChePreferences|*}
* @returns {ChePreferences}
*/
getPreferences() {
getPreferences(): ChePreferences {
return this.chePreferences;
}

/**
* The Che Project Template API
* @returns {CheProjectTemplate|*}
* @returns {CheProjectTemplate}
*/
getProjectTemplate() {
getProjectTemplate(): CheProjectTemplate {
return this.cheProjectTemplate;
}

/**
* The Che Websocket API
* @returns {CheWebsocket|*}
* @returns {CheWebsocket}
*/
getWebsocket() {
getWebsocket(): CheWebsocket {
return this.cheWebsocket;
}

/**
* The Che Services API
* @returns {CheService|*}
* @returns {CheService}
*/
getService() {
getService(): CheService {
return this.cheService;
}

/**
* The Che Admin Services API
* @returns {CheAdminService|*}
* @returns {CheAdminService}
*/
getAdminService() {
return this.cheAdminService;
Expand All @@ -112,49 +136,49 @@ export class CheAPI {

/**
* The Che Admin plugins API
* @returns {CheAdminPlugins|*}
* @returns {CheAdminPlugins}
*/
getAdminPlugins() {
getAdminPlugins(): CheAdminPlugins {
return this.cheAdminPlugins;
}

/**
* The Che Recipe API
* @returns {CheRecipe|*}
* @returns {CheRecipe}
*/
getRecipe() {
getRecipe(): CheRecipe {
return this.cheRecipe;
}

/**
* The Che Recipe Template API
* @returns {CheRecipeTemplate|*}
* @returns {CheRecipeTemplate}
*/
getRecipeTemplate() {
getRecipeTemplate(): CheRecipeTemplate {
return this.cheRecipeTemplate;
}

/**
* The Che Stack API
* @returns {CheAPI.cheStack|*}
* @returns {CheStack}
*/
getStack() {
getStack(): CheStack {
return this.cheStack;
}

/**
* The Che Agent API
* @returns {CheAPI.cheAgent|*}
* @returns {CheAgent}
*/
getAgent() {
getAgent(): CheAgent {
return this.cheAgent;
}

/**
* Gets Che ssh API
* @returns {CheSsh}
*/
getSsh() {
*/
getSsh(): CheSsh {
return this.cheSsh;
}

Expand Down
8 changes: 8 additions & 0 deletions dashboard/src/components/typings/che.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -167,4 +167,12 @@ declare namespace _che {
isValid: boolean;
errors: Array<string>;
}

export interface IProfile {
attributes?: Object;
email: string;
links?: Array<any>;
userId: string;
$promise?: any;
}
}
Loading

0 comments on commit 4afc78b

Please sign in to comment.