Commit 079cca5f authored by Steven Zou's avatar Steven Zou
Browse files

merge latest ui code to fix block issues

parent 4d5b6d81
...@@ -118,7 +118,7 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked { ...@@ -118,7 +118,7 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked {
this.session.updateAccountSettings(this.account) this.session.updateAccountSettings(this.account)
.then(() => { .then(() => {
this.isOnCalling = false; this.isOnCalling = false;
this.close(); this.opened = false;
this.msgService.announceMessage(200, "PROFILE.SAVE_SUCCESS", AlertType.SUCCESS); this.msgService.announceMessage(200, "PROFILE.SAVE_SUCCESS", AlertType.SUCCESS);
}) })
.catch(error => { .catch(error => {
......
...@@ -117,7 +117,7 @@ export class PasswordSettingComponent implements AfterViewChecked { ...@@ -117,7 +117,7 @@ export class PasswordSettingComponent implements AfterViewChecked {
}) })
.then(() => { .then(() => {
this.onCalling = false; this.onCalling = false;
this.close(); this.opened = false;
this.msgService.announceMessage(200, "CHANGE_PWD.SAVE_SUCCESS", AlertType.SUCCESS); this.msgService.announceMessage(200, "CHANGE_PWD.SAVE_SUCCESS", AlertType.SUCCESS);
}) })
.catch(error => { .catch(error => {
......
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { Headers, Http, RequestOptions } from '@angular/http'; import { Headers, Http, RequestOptions, URLSearchParams } from '@angular/http';
import 'rxjs/add/operator/toPromise'; import 'rxjs/add/operator/toPromise';
import { PasswordSetting } from './password-setting'; import { PasswordSetting } from './password-setting';
...@@ -52,10 +52,18 @@ export class PasswordSettingService { ...@@ -52,10 +52,18 @@ export class PasswordSettingService {
return Promise.reject("Invalid reset uuid or password"); return Promise.reject("Invalid reset uuid or password");
} }
return this.http.post(resetPasswordEndpoint, JSON.stringify({ let formHeaders = new Headers({
"reset_uuid": uuid, "Content-Type": 'application/x-www-form-urlencoded'
"password": newPassword });
}), this.options) let formOptions: RequestOptions = new RequestOptions({
headers: formHeaders
});
let body: URLSearchParams = new URLSearchParams();
body.set("reset_uuid", uuid);
body.set("password", newPassword);
return this.http.post(resetPasswordEndpoint, body.toString(), formOptions)
.toPromise() .toPromise()
.then(response => response) .then(response => response)
.catch(error => { .catch(error => {
......
...@@ -44,7 +44,9 @@ export class ResetPasswordComponent implements OnInit{ ...@@ -44,7 +44,9 @@ export class ResetPasswordComponent implements OnInit{
} }
public getValidationState(key: string): boolean { public getValidationState(key: string): boolean {
return this.validationState && this.validationState[key]; return this.validationState &&
this.validationState[key] &&
key === 'reNewPassword'?this.samePassword():true;
} }
public open(): void { public open(): void {
...@@ -76,10 +78,12 @@ export class ResetPasswordComponent implements OnInit{ ...@@ -76,10 +78,12 @@ export class ResetPasswordComponent implements OnInit{
this.onGoing = true; this.onGoing = true;
this.pwdService.resetPassword(this.resetUuid, this.password) this.pwdService.resetPassword(this.resetUuid, this.password)
.then(() => { .then(() => {
this.onGoing = false;
this.resetOk = true; this.resetOk = true;
this.inlineAlert.showInlineSuccess({message:'RESET_PWD.RESET_OK'}); this.inlineAlert.showInlineSuccess({message:'RESET_PWD.RESET_OK'});
}) })
.catch(error => { .catch(error => {
this.onGoing = false;
if(accessErrorHandler(error, this.msgService)){ if(accessErrorHandler(error, this.msgService)){
this.close(); this.close();
}else{ }else{
......
...@@ -31,9 +31,9 @@ ...@@ -31,9 +31,9 @@
{{ 'SIGN_IN.INVALID_MSG' | translate }} {{ 'SIGN_IN.INVALID_MSG' | translate }}
</div> </div>
<button [disabled]="isOnGoing || !isValid" type="submit" class="btn btn-primary" (click)="signIn()">{{ 'BUTTON.LOG_IN' | translate }}</button> <button [disabled]="isOnGoing || !isValid" type="submit" class="btn btn-primary" (click)="signIn()">{{ 'BUTTON.LOG_IN' | translate }}</button>
<a href="javascript:void(0)" class="signup" (click)="signUp()">{{ 'BUTTON.SIGN_UP_LINK' | translate }}</a> <a href="javascript:void(0)" class="signup" (click)="signUp()" *ngIf="selfSignUp">{{ 'BUTTON.SIGN_UP_LINK' | translate }}</a>
</div> </div>
</form> </form>
</div> </div>
<sign-up #signupDialog></sign-up>> <sign-up #signupDialog></sign-up>
<forgot-password #forgotPwdDialog></forgot-password> <forgot-password #forgotPwdDialog></forgot-password>
\ No newline at end of file
...@@ -10,6 +10,9 @@ import { SignUpComponent } from '../sign-up/sign-up.component'; ...@@ -10,6 +10,9 @@ import { SignUpComponent } from '../sign-up/sign-up.component';
import { harborRootRoute } from '../../shared/shared.const'; import { harborRootRoute } from '../../shared/shared.const';
import { ForgotPasswordComponent } from '../password/forgot-password.component'; import { ForgotPasswordComponent } from '../password/forgot-password.component';
import { AppConfigService } from '../../app-config.service';
import { AppConfig } from '../../app-config';
//Define status flags for signing in states //Define status flags for signing in states
export const signInStatusNormal = 0; export const signInStatusNormal = 0;
export const signInStatusOnGoing = 1; export const signInStatusOnGoing = 1;
...@@ -23,6 +26,7 @@ export const signInStatusError = -1; ...@@ -23,6 +26,7 @@ export const signInStatusError = -1;
export class SignInComponent implements AfterViewChecked, OnInit { export class SignInComponent implements AfterViewChecked, OnInit {
private redirectUrl: string = ""; private redirectUrl: string = "";
private appConfig: AppConfig = new AppConfig();
//Form reference //Form reference
signInForm: NgForm; signInForm: NgForm;
@ViewChild('signInForm') currentForm: NgForm; @ViewChild('signInForm') currentForm: NgForm;
...@@ -41,13 +45,19 @@ export class SignInComponent implements AfterViewChecked, OnInit { ...@@ -41,13 +45,19 @@ export class SignInComponent implements AfterViewChecked, OnInit {
constructor( constructor(
private router: Router, private router: Router,
private session: SessionService, private session: SessionService,
private route: ActivatedRoute private route: ActivatedRoute,
private appConfigService: AppConfigService
) { } ) { }
ngOnInit(): void { ngOnInit(): void {
this.appConfig = this.appConfigService.getConfig();
this.route.queryParams this.route.queryParams
.subscribe(params => { .subscribe(params => {
this.redirectUrl = params["redirect_url"] || ""; this.redirectUrl = params["redirect_url"] || "";
let isSignUp = params["sign_up"] || "";
if (isSignUp != "") {
this.signUp();//Open sign up
}
}); });
} }
...@@ -65,6 +75,12 @@ export class SignInComponent implements AfterViewChecked, OnInit { ...@@ -65,6 +75,12 @@ export class SignInComponent implements AfterViewChecked, OnInit {
return this.currentForm.form.valid; return this.currentForm.form.valid;
} }
//Whether show the 'sign up' link
public get selfSignUp(): boolean {
return this.appConfig.auth_mode === 'db_auth'
&& this.appConfig.self_registration;
}
//General error handler //General error handler
private handleError(error) { private handleError(error) {
//Set error status //Set error status
...@@ -124,7 +140,7 @@ export class SignInComponent implements AfterViewChecked, OnInit { ...@@ -124,7 +140,7 @@ export class SignInComponent implements AfterViewChecked, OnInit {
if (this.redirectUrl === "") { if (this.redirectUrl === "") {
//Routing to the default location //Routing to the default location
this.router.navigateByUrl(harborRootRoute); this.router.navigateByUrl(harborRootRoute);
}else{ } else {
this.router.navigateByUrl(this.redirectUrl); this.router.navigateByUrl(this.redirectUrl);
} }
}) })
......
...@@ -9,6 +9,8 @@ import { UserService } from '../../user/user.service'; ...@@ -9,6 +9,8 @@ import { UserService } from '../../user/user.service';
import { errorHandler } from '../../shared/shared.utils'; import { errorHandler } from '../../shared/shared.utils';
import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.component'; import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.component';
import { Modal } from 'clarity-angular';
@Component({ @Component({
selector: 'sign-up', selector: 'sign-up',
templateUrl: "sign-up.component.html" templateUrl: "sign-up.component.html"
...@@ -30,6 +32,9 @@ export class SignUpComponent { ...@@ -30,6 +32,9 @@ export class SignUpComponent {
@ViewChild(InlineAlertComponent) @ViewChild(InlineAlertComponent)
private inlienAlert: InlineAlertComponent; private inlienAlert: InlineAlertComponent;
@ViewChild(Modal)
private modal: Modal;
private getNewUser(): User { private getNewUser(): User {
return this.newUserForm.getData(); return this.newUserForm.getData();
} }
...@@ -55,7 +60,7 @@ export class SignUpComponent { ...@@ -55,7 +60,7 @@ export class SignUpComponent {
open(): void { open(): void {
this.newUserForm.reset();//Reset form this.newUserForm.reset();//Reset form
this.formValueChanged = false; this.formValueChanged = false;
this.opened = true; this.modal.open();
} }
close(): void { close(): void {
...@@ -74,7 +79,7 @@ export class SignUpComponent { ...@@ -74,7 +79,7 @@ export class SignUpComponent {
} }
confirmCancel(): void { confirmCancel(): void {
this.opened = false; this.modal.close();
} }
//Create new user //Create new user
...@@ -97,7 +102,7 @@ export class SignUpComponent { ...@@ -97,7 +102,7 @@ export class SignUpComponent {
this.userService.addUser(u) this.userService.addUser(u)
.then(() => { .then(() => {
this.onGoing = false; this.onGoing = false;
this.close(); this.modal.close();
}) })
.catch(error => { .catch(error => {
this.onGoing = false; this.onGoing = false;
......
import { Injectable } from '@angular/core';
import { Headers, Http, RequestOptions } from '@angular/http';
import 'rxjs/add/operator/toPromise';
import { AppConfig } from './app-config';
export const systemInfoEndpoint = "/api/systeminfo";
/**
* Declare service to handle the bootstrap options
*
*
* @export
* @class GlobalSearchService
*/
@Injectable()
export class AppConfigService {
private headers = new Headers({
"Content-Type": 'application/json'
});
private options = new RequestOptions({
headers: this.headers
});
//Store the application configuration
private configurations: AppConfig = new AppConfig();
constructor(private http: Http) { }
public load(): Promise<AppConfig> {
return this.http.get(systemInfoEndpoint, this.options).toPromise()
.then(response => this.configurations = response.json() as AppConfig)
.catch(error => {
//Catch the error
console.error("Failed to load bootstrap options with error: ", error);
});
}
public getConfig(): AppConfig {
return this.configurations;
}
}
\ No newline at end of file
export class AppConfig {
constructor(){
//Set default value
this.with_notary = false;
this.with_admiral = false;
this.admiral_endpoint = "";
this.auth_mode = "db_auth";
this.registry_url = "";
this.project_creation_restriction = "everyone";
this.self_registration = true;
}
with_notary: boolean;
with_admiral: boolean;
admiral_endpoint: string;
auth_mode: string;
registry_url: string;
project_creation_restriction: string;
self_registration: boolean;
}
\ No newline at end of file
...@@ -16,17 +16,14 @@ import { MyMissingTranslationHandler } from './i18n/missing-trans.handler'; ...@@ -16,17 +16,14 @@ import { MyMissingTranslationHandler } from './i18n/missing-trans.handler';
import { TranslateHttpLoader } from '@ngx-translate/http-loader'; import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { Http } from '@angular/http'; import { Http } from '@angular/http';
import { SessionService } from './shared/session.service'; import { AppConfigService } from './app-config.service';
export function HttpLoaderFactory(http: Http) { export function HttpLoaderFactory(http: Http) {
return new TranslateHttpLoader(http, 'ng/i18n/lang/', '-lang.json'); return new TranslateHttpLoader(http, 'ng/i18n/lang/', '-lang.json');
} }
export function initConfig(session: SessionService) { export function initConfig(configService: AppConfigService) {
return () => { return () => configService.load();
console.info("app init here");
return Promise.resolve(true);
};
} }
@NgModule({ @NgModule({
...@@ -51,10 +48,12 @@ export function initConfig(session: SessionService) { ...@@ -51,10 +48,12 @@ export function initConfig(session: SessionService) {
} }
}) })
], ],
providers: [{ providers: [
AppConfigService,
{
provide: APP_INITIALIZER, provide: APP_INITIALIZER,
useFactory: initConfig, useFactory: initConfig,
deps: [SessionService], deps: [AppConfigService],
multi: true multi: true
}], }],
bootstrap: [AppComponent] bootstrap: [AppComponent]
......
...@@ -18,3 +18,12 @@ ...@@ -18,3 +18,12 @@
.lang-selected { .lang-selected {
font-weight: bold; font-weight: bold;
} }
.nav-divider {
display: inline-block;
width: 1px;
height: 40px;
background-color: #fafafa;
position: relative;
top: 10px;
}
\ No newline at end of file
...@@ -5,12 +5,19 @@ ...@@ -5,12 +5,19 @@
<span class="title">Harbor</span> <span class="title">Harbor</span>
</a> </a>
</div> </div>
<div class="header-nav">
<a href="{{admiralLink}}" class="nav-link" *ngIf="isIntegrationMode"><span class="nav-text">Management</span></a>
<a href="javascript:void(0)" routerLink="/harbor/dashboard" class="active nav-link" *ngIf="isIntegrationMode"><span class="nav-text">Registry</span></a>
</div>
<global-search></global-search> <global-search></global-search>
<div class="header-actions"> <div class="header-actions">
<a href="javascript:void(0)" class="nav-link nav-text" routerLink="/sign-in" routerLinkActive="active" *ngIf="isSessionValid === false">{{'SIGN_IN.HEADER_LINK' | translate}}</a>
<div class="nav-divider" *ngIf="!isSessionValid"></div>
<a href="javascript:void(0)" class="nav-link nav-text" (click)="openSignUp()" *ngIf="isSessionValid === false">{{'SIGN_UP.TITLE' | translate}}</a>
<clr-dropdown class="dropdown bottom-left"> <clr-dropdown class="dropdown bottom-left">
<button class="nav-icon" clrDropdownToggle style="width: 90px;"> <button class="nav-icon" clrDropdownToggle style="width: 98px;">
<clr-icon shape="world" style="left:-8px;"></clr-icon> <clr-icon shape="world" style="left:-8px;"></clr-icon>
<span>{{currentLang}}</span> <span style="padding-right: 8px;">{{currentLang}}</span>
<clr-icon shape="caret down"></clr-icon> <clr-icon shape="caret down"></clr-icon>
</button> </button>
<div class="dropdown-menu"> <div class="dropdown-menu">
......
import { Component, Output, EventEmitter, OnInit } from '@angular/core'; import { Component, Output, EventEmitter, OnInit, Inject } from '@angular/core';
import { Router } from '@angular/router'; import { Router, NavigationExtras } from '@angular/router';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { ModalEvent } from '../modal-event'; import { ModalEvent } from '../modal-event';
...@@ -9,7 +9,10 @@ import { SessionUser } from '../../shared/session-user'; ...@@ -9,7 +9,10 @@ import { SessionUser } from '../../shared/session-user';
import { SessionService } from '../../shared/session.service'; import { SessionService } from '../../shared/session.service';
import { CookieService } from 'angular2-cookie/core'; import { CookieService } from 'angular2-cookie/core';
import { supportedLangs, enLang, languageNames } from '../../shared/shared.const'; import { supportedLangs, enLang, languageNames, signInRoute } from '../../shared/shared.const';
import { AppConfigService } from '../../app-config.service';
import { AppConfig } from '../../app-config';
@Component({ @Component({
selector: 'navigator', selector: 'navigator',
...@@ -24,12 +27,14 @@ export class NavigatorComponent implements OnInit { ...@@ -24,12 +27,14 @@ export class NavigatorComponent implements OnInit {
private sessionUser: SessionUser = null; private sessionUser: SessionUser = null;
private selectedLang: string = enLang; private selectedLang: string = enLang;
private appConfig: AppConfig = new AppConfig();
constructor( constructor(
private session: SessionService, private session: SessionService,
private router: Router, private router: Router,
private translate: TranslateService, private translate: TranslateService,
private cookie: CookieService) { } private cookie: CookieService,
private appConfigService: AppConfigService) { }
ngOnInit(): void { ngOnInit(): void {
this.sessionUser = this.session.getCurrentUser(); this.sessionUser = this.session.getCurrentUser();
...@@ -39,6 +44,8 @@ export class NavigatorComponent implements OnInit { ...@@ -39,6 +44,8 @@ export class NavigatorComponent implements OnInit {
//Keep in cookie for next use //Keep in cookie for next use
this.cookie.put("harbor-lang", langChange.lang); this.cookie.put("harbor-lang", langChange.lang);
}); });
this.appConfig = this.appConfigService.getConfig();
} }
public get isSessionValid(): boolean { public get isSessionValid(): boolean {
...@@ -53,6 +60,19 @@ export class NavigatorComponent implements OnInit { ...@@ -53,6 +60,19 @@ export class NavigatorComponent implements OnInit {
return languageNames[this.selectedLang]; return languageNames[this.selectedLang];
} }
public get isIntegrationMode(): boolean {
return this.appConfig.with_admiral && this.appConfig.admiral_endpoint.trim() != "";
}
public get admiralLink(): string {
let routeSegments = [this.appConfig.admiral_endpoint,
"?registry_url=",
encodeURIComponent(window.location.href)
];
return routeSegments.join("");
}
matchLang(lang: string): boolean { matchLang(lang: string): boolean {
return lang.trim() === this.selectedLang; return lang.trim() === this.selectedLang;
} }
...@@ -94,12 +114,12 @@ export class NavigatorComponent implements OnInit { ...@@ -94,12 +114,12 @@ export class NavigatorComponent implements OnInit {
//Switch languages //Switch languages
switchLanguage(lang: string): void { switchLanguage(lang: string): void {
if (supportedLangs.find(supportedLang => supportedLang === lang.trim())){ if (supportedLangs.find(supportedLang => supportedLang === lang.trim())) {
this.translate.use(lang); this.translate.use(lang);
}else{ } else {
this.translate.use(enLang);//Use default this.translate.use(enLang);//Use default
//TODO: //TODO:
console.error('Language '+lang.trim()+' is not suppoted'); console.error('Language ' + lang.trim() + ' is not suppoted');
} }
//Try to switch backend lang //Try to switch backend lang
//this.session.switchLanguage(lang).catch(error => console.error(error)); //this.session.switchLanguage(lang).catch(error => console.error(error));
...@@ -107,12 +127,20 @@ export class NavigatorComponent implements OnInit { ...@@ -107,12 +127,20 @@ export class NavigatorComponent implements OnInit {
//Handle the home action //Handle the home action
homeAction(): void { homeAction(): void {
if(this.sessionUser != null){ if (this.sessionUser != null) {
//Navigate to default page //Navigate to default page
this.router.navigate(['harbor']); this.router.navigate(['harbor']);
}else{ } else {
//Naviagte to signin page //Naviagte to signin page
this.router.navigate(['sign-in']); this.router.navigate(['sign-in']);
} }
} }
openSignUp(): void {
let navigatorExtra: NavigationExtras = {
queryParams: { "sign_up": true }
};
this.router.navigate([signInRoute], navigatorExtra);
}
} }
\ No newline at end of file