Skip to content

Commit b72ce73

Browse files
AAwoutersAAwouters
committed
119602: Add Accessibility Settings page
1 parent 8f708d0 commit b72ce73

7 files changed

Lines changed: 119 additions & 3 deletions

File tree

‎src/app/footer/footer.component.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,10 @@ <h5 class="text-uppercase">Footer Content</h5>
7979
<a class="text-white"
8080
routerLink="info/feedback">{{ 'footer.link.feedback' | translate}}</a>
8181
</li>
82+
<li>
83+
<a class="text-white"
84+
routerLink="info/accessibility">{{ 'footer.link.accessibility' | translate }}</a>
85+
</li>
8286
</ul>
8387
</div>
8488
</div>

‎src/app/info/accessibility-settings/accessibility-settings.component.html‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<div class="container">
2+
<h2>{{ 'info.accessibility-settings.title' | translate }}</h2>
3+
4+
<form>
5+
<div *ngFor="let setting of accessibilitySettingsOptions" class="form-group row">
6+
<label [for]="setting + 'Input'" class="col-sm-2 col-form-label">
7+
{{ 'info.accessibility-settings.' + setting + '.label' | translate }}
8+
</label>
9+
10+
<div class="col-sm-10">
11+
<input [type]="getInputType(setting)" [id]="setting + 'Input'" class="form-control"
12+
[(ngModel)]="formValues[setting]" [ngModelOptions]="{ standalone: true }"
13+
[attr.aria-describedby]="setting + 'Hint'">
14+
15+
<small [id]="setting + 'Hint'" class="form-text text-muted">
16+
{{ 'info.accessibility-settings.' + setting + '.hint' | translate }}
17+
</small>
18+
</div>
19+
</div>
20+
21+
<button type="submit" (click)="saveSettings()" class="btn btn-primary">
22+
{{ 'info.accessibility-settings.submit' | translate }}
23+
</button>
24+
</form>
25+
26+
</div>

‎src/app/info/accessibility-settings/accessibility-settings.component.ts‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import { AuthService } from '../../core/auth/auth.service';
3+
import {
4+
AccessibilitySetting,
5+
AccessibilitySettingsService,
6+
AccessibilitySettings
7+
} from '../../accessibility/accessibility-settings.service';
8+
import { take } from 'rxjs';
9+
import { NotificationsService } from '../../shared/notifications/notifications.service';
10+
import { TranslateService } from '@ngx-translate/core';
11+
12+
@Component({
13+
selector: 'ds-accessibility-settings',
14+
templateUrl: './accessibility-settings.component.html'
15+
})
16+
export class AccessibilitySettingsComponent implements OnInit {
17+
18+
protected accessibilitySettingsOptions: AccessibilitySetting[];
19+
20+
protected formValues: AccessibilitySettings = { };
21+
22+
constructor(
23+
protected authService: AuthService,
24+
protected settingsService: AccessibilitySettingsService,
25+
protected notificationsService: NotificationsService,
26+
protected translateService: TranslateService,
27+
) {
28+
}
29+
30+
ngOnInit() {
31+
this.accessibilitySettingsOptions = this.settingsService.getAllAccessibilitySettingKeys();
32+
this.settingsService.getAll().pipe(take(1)).subscribe(currentSettings => {
33+
this.formValues = currentSettings;
34+
});
35+
}
36+
37+
getInputType(setting: AccessibilitySetting): string {
38+
return this.settingsService.getInputType(setting);
39+
}
40+
41+
saveSettings() {
42+
this.settingsService.setSettings(this.formValues).pipe(take(1)).subscribe(location => {
43+
this.notificationsService.success(null, this.translateService.instant('info.accessibility-settings.save-notification.' + location));
44+
});
45+
}
46+
47+
}

‎src/app/info/info-routing-paths.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { getInfoModulePath } from '../app-routing-paths';
33
export const END_USER_AGREEMENT_PATH = 'end-user-agreement';
44
export const PRIVACY_PATH = 'privacy';
55
export const FEEDBACK_PATH = 'feedback';
6+
export const ACCESSIBILITY_SETTINGS_PATH = 'accessibility';
67

78
export function getEndUserAgreementPath() {
89
return getSubPath(END_USER_AGREEMENT_PATH);
@@ -16,6 +17,10 @@ export function getFeedbackPath() {
1617
return getSubPath(FEEDBACK_PATH);
1718
}
1819

20+
export function getAccessibilitySettingsPath() {
21+
return getSubPath(ACCESSIBILITY_SETTINGS_PATH);
22+
}
23+
1924
function getSubPath(path: string) {
2025
return `${getInfoModulePath()}/${path}`;
2126
}

‎src/app/info/info-routing.module.ts‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,18 @@
11
import { NgModule } from '@angular/core';
22
import { RouterModule } from '@angular/router';
33
import { I18nBreadcrumbResolver } from '../core/breadcrumbs/i18n-breadcrumb.resolver';
4-
import { PRIVACY_PATH, END_USER_AGREEMENT_PATH, FEEDBACK_PATH } from './info-routing-paths';
4+
import {
5+
PRIVACY_PATH,
6+
END_USER_AGREEMENT_PATH,
7+
FEEDBACK_PATH,
8+
ACCESSIBILITY_SETTINGS_PATH
9+
} from './info-routing-paths';
510
import { ThemedEndUserAgreementComponent } from './end-user-agreement/themed-end-user-agreement.component';
611
import { ThemedPrivacyComponent } from './privacy/themed-privacy.component';
712
import { ThemedFeedbackComponent } from './feedback/themed-feedback.component';
813
import { FeedbackGuard } from '../core/feedback/feedback.guard';
914
import { environment } from '../../environments/environment';
15+
import { AccessibilitySettingsComponent } from './accessibility-settings/accessibility-settings.component';
1016

1117

1218
const imports = [
@@ -17,7 +23,13 @@ const imports = [
1723
resolve: { breadcrumb: I18nBreadcrumbResolver },
1824
data: { title: 'info.feedback.title', breadcrumbKey: 'info.feedback' },
1925
canActivate: [FeedbackGuard]
20-
}
26+
},
27+
{
28+
path: ACCESSIBILITY_SETTINGS_PATH,
29+
component: AccessibilitySettingsComponent,
30+
resolve: { breadcrumb: I18nBreadcrumbResolver },
31+
data: { title: 'info.accessibility-settings.title', breadcrumbKey: 'info.accessibility-settings' },
32+
},
2133
])
2234
];
2335

‎src/app/info/info.module.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { FeedbackFormComponent } from './feedback/feedback-form/feedback-form.co
1313
import { ThemedFeedbackFormComponent } from './feedback/feedback-form/themed-feedback-form.component';
1414
import { ThemedFeedbackComponent } from './feedback/themed-feedback.component';
1515
import { FeedbackGuard } from '../core/feedback/feedback.guard';
16+
import { AccessibilitySettingsComponent } from './accessibility-settings/accessibility-settings.component';
1617

1718

1819
const DECLARATIONS = [
@@ -25,7 +26,8 @@ const DECLARATIONS = [
2526
FeedbackComponent,
2627
FeedbackFormComponent,
2728
ThemedFeedbackFormComponent,
28-
ThemedFeedbackComponent
29+
ThemedFeedbackComponent,
30+
AccessibilitySettingsComponent,
2931
];
3032

3133
@NgModule({

‎src/assets/i18n/en.json5‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1618,6 +1618,8 @@
16181618

16191619
"footer.copyright": "copyright © 2002-{{ year }}",
16201620

1621+
"footer.link.accessibility": "Accessibility settings",
1622+
16211623
"footer.link.dspace": "DSpace software",
16221624

16231625
"footer.link.lyrasis": "LYRASIS",
@@ -1840,6 +1842,24 @@
18401842

18411843
"home.top-level-communities.help": "Select a community to browse its collections.",
18421844

1845+
"info.accessibility-settings.breadcrumbs": "Accessibility settings",
1846+
1847+
"info.accessibility-settings.liveRegionTimeOut.label": "Live region time-out",
1848+
1849+
"info.accessibility-settings.liveRegionTimeOut.hint": "The duration in milliseconds after which a message in the live region disappears.",
1850+
1851+
"info.accessibility-settings.notificationTimeOut.label": "Notification time-out",
1852+
1853+
"info.accessibility-settings.notificationTimeOut.hint": "The duration in milliseconds after which a notification disappears. Set to 0 for notifications to remain indefinitely.",
1854+
1855+
"info.accessibility-settings.save-notification.cookie": "Successfully saved settings locally.",
1856+
1857+
"info.accessibility-settings.save-notification.metadata": "Successfully saved settings on the user profile.",
1858+
1859+
"info.accessibility-settings.submit": "Save accessibility settings",
1860+
1861+
"info.accessibility-settings.title": "Accessibility settings",
1862+
18431863
"info.end-user-agreement.accept": "I have read and I agree to the End User Agreement",
18441864

18451865
"info.end-user-agreement.accept.error": "An error occurred accepting the End User Agreement",

0 commit comments

Comments
 (0)