diff --git a/src/app/+login-page/login-page.component.html b/src/app/+login-page/login-page.component.html index 6dcb11fbb0..e2d8131431 100644 --- a/src/app/+login-page/login-page.component.html +++ b/src/app/+login-page/login-page.component.html @@ -3,7 +3,8 @@

{{"login.form.header" | translate}}

- + +
diff --git a/src/app/+login-page/login-page.module.ts b/src/app/+login-page/login-page.module.ts index f16f38d3bd..bd4c0a9a43 100644 --- a/src/app/+login-page/login-page.module.ts +++ b/src/app/+login-page/login-page.module.ts @@ -3,7 +3,7 @@ import { NgModule } from '@angular/core'; import { SharedModule } from '../shared/shared.module'; import { LoginPageComponent } from './login-page.component'; import { LoginPageRoutingModule } from './login-page-routing.module'; -import {ShibbolethComponent} from './shibboleth/shibboleth.component'; + @NgModule({ imports: [ @@ -13,8 +13,9 @@ import {ShibbolethComponent} from './shibboleth/shibboleth.component'; ], declarations: [ LoginPageComponent, - /* ShibbolethComponent*/ - ] + + ], + }) export class LoginPageModule { diff --git a/src/app/core/auth/models/auth-method.model.ts b/src/app/core/auth/models/auth-method.model.ts index 8cca76e1ae..b886b3120d 100644 --- a/src/app/core/auth/models/auth-method.model.ts +++ b/src/app/core/auth/models/auth-method.model.ts @@ -1,9 +1,33 @@ export class AuthMethodModel { authMethodName: string; location?: string; + authMethodConstant: AuthMethodConstants constructor(authMethodName: string, location?: string) { this.authMethodName = authMethodName; this.location = location; + switch (authMethodName) { + case 'password': { + this.authMethodConstant = AuthMethodConstants.PASSWORD; + break; + } + case 'shibboleth': { + this.authMethodConstant = AuthMethodConstants.SHIBBOLETH; + break; + } + case 'ldap': { + this.authMethodConstant = AuthMethodConstants.LDAP; + break; + } + default: { + break; + } + } } } + +export enum AuthMethodConstants { + PASSWORD, + SHIBBOLETH, + LDAP +} diff --git a/src/app/core/auth/selectors.ts b/src/app/core/auth/selectors.ts index 0b3504088e..d30f3ff27e 100644 --- a/src/app/core/auth/selectors.ts +++ b/src/app/core/auth/selectors.ts @@ -107,6 +107,17 @@ const _getRegistrationError = (state: AuthState) => state.error; */ const _getRedirectUrl = (state: AuthState) => state.redirectUrl; +// @Art: these two are the ones i added: +const _getAuthenticationMethods = (state: AuthState) => state.authMethods; + +/** + * Returns the authentication methods enabled at the backend + * @function getAuthenticationMethods + * @param {AuthState} state + * @param {any} props + * @return {any} + */ +export const getAuthenticationMethods = createSelector(getAuthState, _getAuthenticationMethods); /** * Returns the authenticated user diff --git a/src/app/shared/auth-nav-menu/auth-nav-menu.component.html b/src/app/shared/auth-nav-menu/auth-nav-menu.component.html index b560283ad5..65ee27a2d3 100644 --- a/src/app/shared/auth-nav-menu/auth-nav-menu.component.html +++ b/src/app/shared/auth-nav-menu/auth-nav-menu.component.html @@ -3,7 +3,8 @@
{{ 'nav.login' | translate }}
- + +
diff --git a/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.html b/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.html new file mode 100644 index 0000000000..c8a7eaef7d --- /dev/null +++ b/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.html @@ -0,0 +1 @@ +

This is the DynamicTestComponent

diff --git a/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.scss b/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.ts b/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.ts new file mode 100644 index 0000000000..6b328c4376 --- /dev/null +++ b/src/app/shared/log-in/DynamicTestComponent/dynamic-test.component.ts @@ -0,0 +1,21 @@ +/** + * /users/sign-in + * @class LogInComponent + */ +import {Component, OnInit} from '@angular/core'; + +@Component({ + selector: 'ds-dynamic-test', + templateUrl: './dynamic-test.component.html', + styleUrls: ['./dynamic-test.component.scss'], + +}) +export class DynamicTestComponent { + + /** + * @constructor + */ + constructor() { + // console.log('constructor of DynamicTestComponent called'); + } +} diff --git a/src/app/shared/log-in/log-in-container/log-in-container.component.html b/src/app/shared/log-in/log-in-container/log-in-container.component.html new file mode 100644 index 0000000000..e3d5e08a4e --- /dev/null +++ b/src/app/shared/log-in/log-in-container/log-in-container.component.html @@ -0,0 +1,12 @@ +
+
+ + + +
+ + + + + +
diff --git a/src/app/shared/log-in/log-in-container/log-in-container.component.ts b/src/app/shared/log-in/log-in-container/log-in-container.component.ts new file mode 100644 index 0000000000..e03b75d72c --- /dev/null +++ b/src/app/shared/log-in/log-in-container/log-in-container.component.ts @@ -0,0 +1,106 @@ +import {Component, Injector, OnDestroy, OnInit, ReflectiveInjector} from '@angular/core'; +import {AuthState} from '../../../core/auth/auth.reducer'; +import {Store} from '@ngrx/store'; +import {DynamicTestComponent} from '../DynamicTestComponent/dynamic-test.component'; +import {LogInComponent} from '../password/log-in.component'; +import {DynamicShibbolethComponent} from '../shibboleth/dynamic-shibboleth.component'; +import {getAuthenticationMethods} from '../../../core/auth/selectors'; +import {map, tap} from 'rxjs/operators'; +import {AppState} from '../../../app.reducer'; +import {Observable} from 'rxjs'; +import {DynamicLoginMethod} from './log-in-container.model'; +import {AuthMethodConstants, AuthMethodModel} from '../../../core/auth/models/auth-method.model'; +import {ShibbolethComponent} from '../../../+login-page/shibboleth/shibboleth.component'; + +@Component({ + selector: 'ds-log-in-container', + templateUrl: './log-in-container.component.html', + // styleUrls: ['./log-in.component.scss'], + +}) +export class LogInContainerComponent implements OnDestroy, OnInit { + + private dynamicLoginMethods: Observable; + private authInfoInjector: Injector; + /** + * Injector to inject a section component with the @Input parameters + * @type {Injector} + */ + public objectInjector: Injector; + private shibbolethUrl: string; + + /** + * @constructor + * @param {AuthService} authService + * @param {FormBuilder} formBuilder + * @param {Store} store + */ + constructor( + private store: Store, + private injector: Injector + + ) {} + + /** + * Lifecycle hook that is called after data-bound properties of a directive are initialized. + * @method ngOnInit + */ + public ngOnInit() { + + this.objectInjector = Injector.create({ + providers: [ + {provide: 'shibbolethUrlProvider', useFactory: () => (this.shibbolethUrl), deps: []}, + // {provide: 'sectionDataProvider', useFactory: () => (this.sectionData), deps: []}, + // {provide: 'submissionIdProvider', useFactory: () => (this.submissionId), deps: []}, + ], + parent: this.injector + }); + + this.dynamicLoginMethods = this.store.select(getAuthenticationMethods).pipe( + map(((authMethods) => authMethods.map((authMethod) => { + switch (authMethod.authMethodConstant) { + case AuthMethodConstants.PASSWORD: + return new DynamicLoginMethod(authMethod.authMethodName, LogInComponent) + break; + case AuthMethodConstants.SHIBBOLETH: + // this.shibbolethUrl = authMethod.location; + this.shibbolethUrl = 'https://fis.tiss.tuwien.ac.at/Shibboleth.sso/Login?target=https://fis.tiss.tuwien.ac.at/shibboleth'; + return new DynamicLoginMethod(authMethod.authMethodName, DynamicShibbolethComponent, authMethod.location) + break; + default: + break; + } + } + ) + ) + ) + ); + + } + + /* this.dynamicLoginMethods = this.dynamicLoginMethods = [ + { + label: 'PasswordComponent', + component: LogInComponent + }, + { + label: 'TestComponent', + component: DynamicTestComponent + }, + { + label: 'ShibbolethComponent', + component: DynamicShibbolethComponent + }, + + ]; + }*/ + + /** + * Lifecycle hook that is called when a directive, pipe or service is destroyed. + * @method ngOnDestroy + */ + public ngOnDestroy() { + console.log('ngOnDestroy() in LogInContainerComponent was called'); + } + +} diff --git a/src/app/shared/log-in/log-in-container/log-in-container.model.ts b/src/app/shared/log-in/log-in-container/log-in-container.model.ts new file mode 100644 index 0000000000..b47f4ce935 --- /dev/null +++ b/src/app/shared/log-in/log-in-container/log-in-container.model.ts @@ -0,0 +1,11 @@ +export class DynamicLoginMethod { + label: string; + component: any; + location?: string; + + constructor(label, component, location?) { + this.label = label; + this.component = component; + this.location = location; + } +} diff --git a/src/app/shared/log-in/log-in.component.html b/src/app/shared/log-in/password/log-in.component.html similarity index 99% rename from src/app/shared/log-in/log-in.component.html rename to src/app/shared/log-in/password/log-in.component.html index f6b81b89b6..139ffd276e 100644 --- a/src/app/shared/log-in/log-in.component.html +++ b/src/app/shared/log-in/password/log-in.component.html @@ -40,13 +40,15 @@ to make this work with your Shibboleth IdentityProvider and Service Provider. dspace.hostname = as in the backend config file "dspace.cfg". Do not change the following parts of href: "/Shibboleth.sso/Login?target=" and "/shibboleth" at the end of href --> -
+ + + diff --git a/src/app/shared/log-in/log-in.component.scss b/src/app/shared/log-in/password/log-in.component.scss similarity index 100% rename from src/app/shared/log-in/log-in.component.scss rename to src/app/shared/log-in/password/log-in.component.scss diff --git a/src/app/shared/log-in/log-in.component.spec.ts b/src/app/shared/log-in/password/log-in.component.spec.ts similarity index 89% rename from src/app/shared/log-in/log-in.component.spec.ts rename to src/app/shared/log-in/password/log-in.component.spec.ts index dd2aea35d5..29825711a1 100644 --- a/src/app/shared/log-in/log-in.component.spec.ts +++ b/src/app/shared/log-in/password/log-in.component.spec.ts @@ -6,13 +6,13 @@ import { By } from '@angular/platform-browser'; import { Store, StoreModule } from '@ngrx/store'; import { LogInComponent } from './log-in.component'; -import { authReducer } from '../../core/auth/auth.reducer'; -import { EPersonMock } from '../testing/eperson-mock'; -import { EPerson } from '../../core/eperson/models/eperson.model'; +import { authReducer } from '../../../core/auth/auth.reducer'; +import { EPersonMock } from '../../testing/eperson-mock'; +import { EPerson } from '../../../core/eperson/models/eperson.model'; import { TranslateModule } from '@ngx-translate/core'; -import { AuthService } from '../../core/auth/auth.service'; -import { AuthServiceStub } from '../testing/auth-service-stub'; -import { AppState } from '../../app.reducer'; +import { AuthService } from '../../../core/auth/auth.service'; +import { AuthServiceStub } from '../../testing/auth-service-stub'; +import { AppState } from '../../../app.reducer'; describe('LogInComponent', () => { diff --git a/src/app/shared/log-in/log-in.component.ts b/src/app/shared/log-in/password/log-in.component.ts similarity index 88% rename from src/app/shared/log-in/log-in.component.ts rename to src/app/shared/log-in/password/log-in.component.ts index d0b3f23b39..07dc525235 100644 --- a/src/app/shared/log-in/log-in.component.ts +++ b/src/app/shared/log-in/password/log-in.component.ts @@ -7,19 +7,20 @@ import {Observable} from 'rxjs'; import { AuthenticateAction, ResetAuthenticationMessagesAction, GetJWTafterShibbLoginAction -} from '../../core/auth/auth.actions'; +} from '../../../core/auth/auth.actions'; import { getAuthenticationError, getAuthenticationInfo, isAuthenticated, isAuthenticationLoading, -} from '../../core/auth/selectors'; -import {CoreState} from '../../core/core.reducers'; +} from '../../../core/auth/selectors'; +import {CoreState} from '../../../core/core.reducers'; -import {isNotEmpty} from '../empty.util'; -import {fadeOut} from '../animations/fade'; -import {AuthService} from '../../core/auth/auth.service'; +import {isNotEmpty} from '../../empty.util'; +import {fadeOut} from '../../animations/fade'; +import {AuthService} from '../../../core/auth/auth.service'; +import {DynamicTestComponent} from '../DynamicTestComponent/dynamic-test.component'; /** * /users/sign-in @@ -81,6 +82,8 @@ export class LogInComponent implements OnDestroy, OnInit { */ private alive = true; + dynamicLoginMethods: any; + /** * @constructor * @param {AuthService} authService @@ -91,7 +94,6 @@ export class LogInComponent implements OnDestroy, OnInit { private authService: AuthService, private formBuilder: FormBuilder, private store: Store, - ) { } @@ -100,7 +102,14 @@ export class LogInComponent implements OnDestroy, OnInit { * @method ngOnInit */ public ngOnInit() { - console.log('log-in.component.ngOnInit() called'); + + this.dynamicLoginMethods = this.dynamicLoginMethods = [ + { + label: 'TestComponent', + component: DynamicTestComponent + } + ]; + // set isAuthenticated this.isAuthenticated = this.store.pipe(select(isAuthenticated)); diff --git a/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.html b/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.html new file mode 100644 index 0000000000..92a03b1daf --- /dev/null +++ b/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.html @@ -0,0 +1,23 @@ + + + + +
+
+ Shibboleth +
+ + + diff --git a/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.scss b/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.scss new file mode 100644 index 0000000000..0eda382c0a --- /dev/null +++ b/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.scss @@ -0,0 +1,13 @@ +.form-login .form-control:focus { + z-index: 2; +} +.form-login input[type="email"] { + margin-bottom: -1px; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.form-login input[type="password"] { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + diff --git a/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.ts b/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.ts new file mode 100644 index 0000000000..a6369f09c3 --- /dev/null +++ b/src/app/shared/log-in/shibboleth/dynamic-shibboleth.component.ts @@ -0,0 +1,22 @@ +/** + * /users/sign-in + * @class LogInComponent + */ +import {Component, Inject, Input, OnInit} from '@angular/core'; +import {InputDecorator} from '@angular/core/src/metadata/directives'; +import {HttpClient} from '@angular/common/http'; + +@Component({ + selector: 'ds-dynamic-shibboleth', + templateUrl: './dynamic-shibboleth.component.html', + styleUrls: ['./dynamic-shibboleth.component.scss'], + +}) +export class DynamicShibbolethComponent { + + /** + * @constructor + */ + constructor(@Inject('shibbolethUrlProvider') public injectedShibbolethUrl: string) { + } +} diff --git a/src/app/shared/log-out/log-out.component.scss b/src/app/shared/log-out/log-out.component.scss index dcd67e092f..4807ef0a94 100644 --- a/src/app/shared/log-out/log-out.component.scss +++ b/src/app/shared/log-out/log-out.component.scss @@ -1 +1 @@ -@import '../log-in/log-in.component.scss'; +@import '../log-in/password/log-in.component'; diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts index 395dab9c87..3d0fe6c2b4 100644 --- a/src/app/shared/shared.module.ts +++ b/src/app/shared/shared.module.ts @@ -47,7 +47,7 @@ import { SearchResultGridElementComponent } from './object-grid/search-result-gr import { ViewModeSwitchComponent } from './view-mode-switch/view-mode-switch.component'; import { GridThumbnailComponent } from './object-grid/grid-thumbnail/grid-thumbnail.component'; import { VarDirective } from './utils/var.directive'; -import { LogInComponent } from './log-in/log-in.component'; +import { LogInComponent } from './log-in/password/log-in.component'; import { AuthNavMenuComponent } from './auth-nav-menu/auth-nav-menu.component'; import { LogOutComponent } from './log-out/log-out.component'; import { FormComponent } from './form/form.component'; @@ -138,6 +138,10 @@ import { RoleDirective } from './roles/role.directive'; import { UserMenuComponent } from './auth-nav-menu/user-menu/user-menu.component'; import { ClaimedTaskActionsReturnToPoolComponent } from './mydspace-actions/claimed-task/return-to-pool/claimed-task-actions-return-to-pool.component'; import { ItemDetailPreviewFieldComponent } from './object-detail/my-dspace-result-detail-element/item-detail-preview/item-detail-preview-field/item-detail-preview-field.component'; +import {DynamicTestComponent} from './log-in/DynamicTestComponent/dynamic-test.component'; +import {LogInContainerComponent} from './log-in/log-in-container/log-in-container.component'; +import {s} from '@angular/core/src/render3'; +import {DynamicShibbolethComponent} from './log-in/shibboleth/dynamic-shibboleth.component'; const MODULES = [ // Do NOT include UniversalModule, HttpModule, or JsonpModule here @@ -257,7 +261,9 @@ const COMPONENTS = [ ItemSearchResultListElementComponent, TypedItemSearchResultListElementComponent, ItemTypeSwitcherComponent, - BrowseByComponent + BrowseByComponent, + LogInContainerComponent, + DynamicShibbolethComponent ]; const ENTRY_COMPONENTS = [ @@ -300,7 +306,11 @@ const ENTRY_COMPONENTS = [ StartsWithTextComponent, PlainTextMetadataListElementComponent, ItemMetadataListElementComponent, - MetadataRepresentationListElementComponent + MetadataRepresentationListElementComponent, + DynamicTestComponent, + LogInComponent, + DynamicShibbolethComponent + ]; const SHARED_ITEM_PAGE_COMPONENTS = [