Skip to content

Commit 74f89f2

Browse files
tdonohuetdonohue
authored
Merge pull request DSpace#3028 from sistedes/issue-3019
Add HTML support on system-wide alert (Fixes DSpace#3019)
2 parents d4e4143 + af19328 commit 74f89f2

2 files changed

Lines changed: 48 additions & 76 deletions

File tree

‎src/app/system-wide-alert/alert-banner/system-wide-alert-banner.component.html‎

Lines changed: 14 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,20 @@
22
<div class="rounded-0 alert alert-warning w100 m-0 px-1">
33
<div class="container">
44
<span class="font-weight-bold">
5-
<span *ngIf="(countDownDays|async) > 0 || (countDownHours| async) > 0 || (countDownMinutes|async) > 0 ">
6-
{{'system-wide-alert-banner.countdown.prefix' | translate }}
7-
</span>
8-
<span *ngIf="(countDownDays|async) > 0">
9-
{{'system-wide-alert-banner.countdown.days' | translate: {
10-
days: countDownDays|async
11-
} }}
12-
</span>
13-
<span *ngIf="(countDownDays|async) > 0 || (countDownHours| async) > 0 ">
14-
{{'system-wide-alert-banner.countdown.hours' | translate: {
15-
hours: countDownHours| async
16-
} }}
17-
</span>
18-
<span *ngIf="(countDownDays|async) > 0 || (countDownHours| async) > 0 || (countDownMinutes|async) > 0 ">
19-
{{'system-wide-alert-banner.countdown.minutes' | translate: {
20-
minutes: countDownMinutes|async
21-
} }}
22-
</span>
5+
<span *ngIf="(countDownDays|async) > 0 || (countDownHours| async) > 0 || (countDownMinutes|async) > 0 ">
6+
{{ 'system-wide-alert-banner.countdown.prefix' | translate }}
7+
</span>
8+
<span *ngIf="(countDownDays|async) > 0">
9+
{{ 'system-wide-alert-banner.countdown.days' | translate: { days: countDownDays|async } }}
10+
</span>
11+
<span *ngIf="(countDownDays|async) > 0 || (countDownHours| async) > 0 ">
12+
{{ 'system-wide-alert-banner.countdown.hours' | translate: { hours: countDownHours| async } }}
13+
</span>
14+
<span *ngIf="(countDownDays|async) > 0 || (countDownHours| async) > 0 || (countDownMinutes|async) > 0 ">
15+
{{ 'system-wide-alert-banner.countdown.minutes' | translate: { minutes: countDownMinutes|async } }}
16+
</span>
2317
</span>
24-
<span>{{(systemWideAlert$ |async)?.message}}</span>
18+
<span [innerHTML]="(systemWideAlert$ |async)?.message"></span>
2519
</div>
2620
</div>
27-
</div>
21+
</div>

‎src/app/system-wide-alert/alert-form/system-wide-alert-form.component.html‎

Lines changed: 34 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -5,53 +5,42 @@ <h1 id="header">{{'system-wide-alert.form.header' | translate}}</h1>
55
<div class="row mb-2">
66
<div class="col">
77
<ui-switch [checkedLabel]="'system-wide-alert.form.label.active' | translate"
8-
[uncheckedLabel]="'system-wide-alert.form.label.inactive' | translate"
9-
[checked]="formActive.value"
10-
(change)="setActive($event)"></ui-switch>
8+
[uncheckedLabel]="'system-wide-alert.form.label.inactive' | translate"
9+
[checked]="formActive.value" (change)="setActive($event)"></ui-switch>
1110
</div>
1211
</div>
1312
<div class="row">
1413
<div class="col">
1514
<label for="formMessage">{{ 'system-wide-alert.form.label.message' | translate }}</label>
1615
<textarea id="formMessage" rows="5"
17-
[className]="(formMessage.invalid) && (formMessage.dirty || formMessage.touched) ? 'form-control is-invalid' :'form-control'"
18-
formControlName="formMessage">
16+
[className]="(formMessage.invalid) && (formMessage.dirty || formMessage.touched) ? 'form-control is-invalid' :'form-control'"
17+
formControlName="formMessage">
1918
</textarea>
2019
<div *ngIf="formMessage.invalid && (formMessage.dirty || formMessage.touched)"
21-
class="invalid-feedback show-feedback">
22-
<span *ngIf="formMessage.errors">
23-
{{ 'system-wide-alert.form.error.message' | translate }}
24-
</span>
20+
class="invalid-feedback show-feedback">
21+
<span *ngIf="formMessage.errors">
22+
{{ 'system-wide-alert.form.error.message' | translate }}
23+
</span>
2524
</div>
2625
</div>
2726
</div>
2827
</div>
2928
</div>
3029
<div class="row">
3130
<div class="col mb-2 d-flex align-items-end">
32-
<ui-switch size="small"
33-
[ariaLabel]="'system-wide-alert.form.label.countdownTo.enable' | translate"
34-
[checked]="counterEnabled$ |async"
35-
(change)="setCounterEnabled($event)"></ui-switch>
31+
<ui-switch size="small" [ariaLabel]="'system-wide-alert.form.label.countdownTo.enable' | translate"
32+
[checked]="counterEnabled$ |async" (change)="setCounterEnabled($event)"></ui-switch>
3633
<span class="ml-2">{{ 'system-wide-alert.form.label.countdownTo.enable' | translate }}</span>
3734
</div>
3835
</div>
3936
<div *ngIf="counterEnabled$ |async">
4037
<div class="row">
4138
<div class="col-sm-12 col-md-6">
4239
<div class="input-group">
43-
<input
44-
class="form-control"
45-
placeholder="yyyy-mm-dd"
46-
name="dp"
47-
[(ngModel)]="date"
48-
[minDate]="minDate"
49-
ngbDatepicker
50-
#d="ngbDatepicker"
51-
(ngModelChange)="updatePreviewTime()"
52-
/>
40+
<input class="form-control" placeholder="yyyy-mm-dd" name="dp" [(ngModel)]="date"
41+
[minDate]="minDate" ngbDatepicker #d="ngbDatepicker" (ngModelChange)="updatePreviewTime()" />
5342
<button [attr.aria-label]="'system-wide-alert-form.select-date-by-calendar' | translate"
54-
(click)="d.toggle()" class="btn btn-outline-secondary fas fa-calendar" type="button">
43+
(click)="d.toggle()" class="btn btn-outline-secondary fas fa-calendar" type="button">
5544
</button>
5645
</div>
5746
</div>
@@ -68,49 +57,38 @@ <h1 id="header">{{'system-wide-alert.form.header' | translate}}</h1>
6857
</div>
6958
</div>
7059
<div class="mb-2">
71-
<span class="text-muted"> {{'system-wide-alert.form.label.countdownTo.hint' | translate}}</span>
60+
<span class="text-muted">{{ 'system-wide-alert.form.label.countdownTo.hint' | translate }}</span>
7261
</div>
73-
74-
7562
<div *ngIf="formMessage.value">
7663
<div class="row">
7764
<div class="col">
78-
<label>{{ 'system-wide-alert.form.label.preview' | translate }}</label>
65+
<label>{{ 'system-wide-alert.form.label.preview' | translate}}</label>
7966
</div>
8067
</div>
8168
<div class="rounded-0 alert alert-warning">
8269
<span class="font-weight-bold">
83-
<span *ngIf="previewDays > 0 || previewHours > 0 || previewMinutes > 0 ">
84-
{{'system-wide-alert-banner.countdown.prefix' | translate }}
85-
</span>
86-
<span *ngIf="previewDays > 0">
87-
{{'system-wide-alert-banner.countdown.days' | translate: {
88-
days: previewDays
89-
} }}
90-
</span>
91-
<span *ngIf="previewDays > 0 || previewHours > 0 ">
92-
{{'system-wide-alert-banner.countdown.hours' | translate: {
93-
hours: previewHours
94-
} }}
95-
</span>
96-
<span *ngIf="previewDays > 0 || previewHours > 0 || previewMinutes > 0 ">
97-
{{'system-wide-alert-banner.countdown.minutes' | translate: {
98-
minutes: previewMinutes
99-
} }}
100-
</span>
70+
<span *ngIf="previewDays > 0 || previewHours > 0 || previewMinutes > 0 ">
71+
{{ 'system-wide-alert-banner.countdown.prefix' | translate }}
72+
</span>
73+
<span *ngIf="previewDays > 0">
74+
{{ 'system-wide-alert-banner.countdown.days' | translate: { days: previewDays } }}
75+
</span>
76+
<span *ngIf="previewDays > 0 || previewHours > 0 ">
77+
{{ 'system-wide-alert-banner.countdown.hours' | translate: { hours: previewHours } }}
78+
</span>
79+
<span *ngIf="previewDays > 0 || previewHours > 0 || previewMinutes > 0 ">
80+
{{ 'system-wide-alert-banner.countdown.minutes' | translate: { minutes: previewMinutes } }}
81+
</span>
10182
</span>
102-
<span>{{formMessage.value}}</span>
83+
<span [innerHTML]="formMessage.value"></span>
10384
</div>
10485
</div>
105-
10686
<div class="btn-row float-right space-children-mr mt-2">
107-
<button (click)="back()"
108-
class="btn btn-outline-secondary"><i
109-
class="fas fa-arrow-left"></i> {{'system-wide-alert.form.cancel' | translate}}</button>
110-
<button class="btn btn-primary" [disabled]="alertForm.invalid"
111-
(click)="save()">
112-
<i class="fa fa-save"></i> {{ 'system-wide-alert.form.save' | translate}}
87+
<button (click)="back()" class="btn btn-outline-secondary">
88+
<i class="fas fa-arrow-left"></i> {{ 'system-wide-alert.form.cancel' | translate }}
89+
</button>
90+
<button class="btn btn-primary" [disabled]="alertForm.invalid" (click)="save()">
91+
<i class="fa fa-save"></i> {{ 'system-wide-alert.form.save' | translate }}
11392
</button>
11493
</div>
115-
116-
</div>
94+
</div>

0 commit comments

Comments
 (0)