-
+
+
+
-
-
-
-
-
+
+
\ No newline at end of file
diff --git a/src/ui/static/app/base/harbor-shell/harbor-shell.component.ts b/src/ui/static/app/base/harbor-shell/harbor-shell.component.ts
index fe46fb924..8ccf6c6b2 100644
--- a/src/ui/static/app/base/harbor-shell/harbor-shell.component.ts
+++ b/src/ui/static/app/base/harbor-shell/harbor-shell.component.ts
@@ -1,10 +1,87 @@
-import { Component } from '@angular/core';
-import { Router } from '@angular/router';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { Router, ActivatedRoute } from '@angular/router';
+
+import { ModalEvent } from '../modal-event';
+import { SearchEvent } from '../search-event';
+import { modalAccountSettings, modalPasswordSetting } from '../modal-events.const';
+
+import { AccountSettingsModalComponent } from '../../account/account-settings/account-settings-modal.component';
+import { SearchResultComponent } from '../global-search/search-result.component';
+import { PasswordSettingComponent } from '../../account/password/password-setting.component';
+import { NavigatorComponent } from '../navigator/navigator.component';
@Component({
selector: 'harbor-shell',
- templateUrl: 'harbor-shell.component.html'
+ templateUrl: 'harbor-shell.component.html',
+ styleUrls: ["harbor-shell.component.css"]
})
-export class HarborShellComponent {
-
+
+export class HarborShellComponent implements OnInit {
+
+ @ViewChild(AccountSettingsModalComponent)
+ private accountSettingsModal: AccountSettingsModalComponent;
+
+ @ViewChild(SearchResultComponent)
+ private searchResultComponet: SearchResultComponent;
+
+ @ViewChild(PasswordSettingComponent)
+ private pwdSetting: PasswordSettingComponent;
+
+ @ViewChild(NavigatorComponent)
+ private navigator: NavigatorComponent;
+
+ //To indicator whwther or not the search results page is displayed
+ //We need to use this property to do some overriding work
+ private isSearchResultsOpened: boolean = false;
+
+ constructor(private route: ActivatedRoute) { }
+
+ ngOnInit() {
+ this.route.data.subscribe(data => {
+ //dummy
+ });
+ }
+
+ public get showSearch(): boolean {
+ return this.isSearchResultsOpened;
+ }
+
+ //Open modal dialog
+ openModal(event: ModalEvent): void {
+ switch (event.modalName) {
+ case modalAccountSettings:
+ this.accountSettingsModal.open();
+ break;
+ case modalPasswordSetting:
+ this.pwdSetting.open();
+ break;
+ default:
+ break;
+ }
+ }
+
+ //Handle the global search event and then let the result page to trigger api
+ doSearch(event: SearchEvent): void {
+ //Once this method is called
+ //the search results page must be opened
+ this.isSearchResultsOpened = true;
+
+ //Call the child component to do the real work
+ this.searchResultComponet.doSearch(event.term);
+ }
+
+ //Search results page closed
+ //remove the related ovevriding things
+ searchClose(event: boolean): void {
+ if (event) {
+ this.isSearchResultsOpened = false;
+ }
+ }
+
+ //Watch password whether changed
+ watchPwdChange(event: any): void {
+ if (event) {
+ this.navigator.logOut(true);
+ }
+ }
}
\ No newline at end of file
diff --git a/src/ui/static/app/base/modal-event.ts b/src/ui/static/app/base/modal-event.ts
new file mode 100644
index 000000000..cef981802
--- /dev/null
+++ b/src/ui/static/app/base/modal-event.ts
@@ -0,0 +1,5 @@
+//Define a object to store the modal event
+export class ModalEvent {
+ modalName: string;
+ modalFlag: boolean; //true for open, false for close
+}
\ No newline at end of file
diff --git a/src/ui/static/app/base/modal-events.const.ts b/src/ui/static/app/base/modal-events.const.ts
new file mode 100644
index 000000000..6a8dca0ad
--- /dev/null
+++ b/src/ui/static/app/base/modal-events.const.ts
@@ -0,0 +1,2 @@
+export const modalAccountSettings= "account-settings";
+export const modalPasswordSetting = "password-setting";
\ No newline at end of file
diff --git a/src/ui/static/app/base/navigator/navigator.component.css b/src/ui/static/app/base/navigator/navigator.component.css
new file mode 100644
index 000000000..f567136a5
--- /dev/null
+++ b/src/ui/static/app/base/navigator/navigator.component.css
@@ -0,0 +1,16 @@
+.sign-in-override {
+ padding-left: 0px !important;
+ padding-right: 5px !important;
+}
+
+.sign-up-override {
+ padding-left: 5px !important;
+}
+
+.custom-divider {
+ display: inline-block;
+ border-right: 2px inset snow;
+ padding: 2px 0px 2px 0px;
+ vertical-align: middle;
+ height: 24px;
+}
\ No newline at end of file
diff --git a/src/ui/static/app/base/navigator/navigator.component.html b/src/ui/static/app/base/navigator/navigator.component.html
index c13091948..ecd7688e8 100644
--- a/src/ui/static/app/base/navigator/navigator.component.html
+++ b/src/ui/static/app/base/navigator/navigator.component.html
@@ -1,40 +1,51 @@
-
\ No newline at end of file
diff --git a/src/ui/static/app/project/member/member.component.ts b/src/ui/static/app/project/member/member.component.ts
index 6bb9e19c0..70773d6f8 100644
--- a/src/ui/static/app/project/member/member.component.ts
+++ b/src/ui/static/app/project/member/member.component.ts
@@ -1,18 +1,90 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute, Params } from '@angular/router';
+
+import { SessionUser } from '../../shared/session-user';
import { Member } from './member';
+import { MemberService } from './member.service';
+
+import { AddMemberComponent } from './add-member/add-member.component';
+
+import { MessageService } from '../../global-message/message.service';
+
+import { Observable } from 'rxjs/Observable';
+import 'rxjs/add/operator/switchMap';
+import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/map';
+import 'rxjs/add/observable/throw';
+
+export const roleInfo: {} = { 1: 'ProjectAdmin', 2: 'Developer', 3: 'Guest'};
@Component({
templateUrl: 'member.component.html'
})
export class MemberComponent implements OnInit {
+
+ currentUser: SessionUser;
members: Member[];
+ projectId: number;
+ roleInfo = roleInfo;
- ngOnInit(): void {
- this.members = [
- { name: 'Admin', role: 'Sys admin'},
- { name: 'user01', role: 'Project Admin'},
- { name: 'user02', role: 'Developer'},
- { name: 'user03', role: 'Guest'}
- ];
+ @ViewChild(AddMemberComponent)
+ addMemberComponent: AddMemberComponent;
+
+ constructor(private route: ActivatedRoute, private memberService: MemberService, private messageService: MessageService) {
+ //Get current user from registered resolver.
+ this.route.data.subscribe(data=>this.currentUser =