Skip to content

Commit a8cc46c

Browse files
atarix83atarix83
committed
Merge branch 'dspace-cris-2023_02_x' into ux-plus-2023_02_x
2 parents 13f1982 + 8230199 commit a8cc46c

18 files changed

Lines changed: 137 additions & 142 deletions

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dspace-angular",
3-
"version": "2023.02.02",
3+
"version": "2023.02.03-SNAPSHOT",
44
"scripts": {
55
"ng": "ng",
66
"config:watch": "nodemon",

‎src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metrics/cris-layout-metrics-box.component.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
<div class="{{box.style}} w-100">
2-
<div class="container" *ngIf="metricRows">
1+
<div [class]="box.style" class="w-100">
2+
<div *ngIf="metricRows">
33
<!-- PRINT ROWS -->
44
<div ds-metric-row
55
*ngFor="let metricRow of (metricRows | async)"
66
[metricRow]="metricRow"
7-
class="d-flex flex-wrap gap-3 mb-3">
7+
class="d-flex flex-row flex-wrap align-items-center gap-3">
88
</div>
99
</div>
1010
</div>

‎src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metrics/cris-layout-metrics-box.component.scss‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,12 @@
22
border: 1px solid black;
33
border-radius: 3px;
44
}
5-
:host {
6-
display: flex;
7-
// flex:1;
8-
}
95

106
ngb-accordion {
117
flex-grow: 1;
128
}
9+
10+
// This class should be applied to the altmetrics box in the CRIS layout tool
11+
.altmetrics-wrapper {
12+
padding: 15px 70px;
13+
}

‎src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metrics/cris-layout-metrics-box.component.ts‎

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -67,15 +67,18 @@ export class CrisLayoutMetricsBoxComponent extends CrisLayoutBoxModelComponent i
6767
if (isPlatformBrowser(this.platformId)) {
6868
this.metricsBoxConfiguration = this.box.configuration as MetricsBoxConfiguration;
6969
this.subs.push(
70-
this.itemService.getMetrics(this.item.uuid).pipe(getFirstSucceededRemoteDataPayload())
71-
.subscribe((result) => {
72-
const matchingMetrics = this.metricsComponentService.getMatchingMetrics(
73-
result.page,
74-
this.metricsBoxConfiguration.maxColumns,
75-
this.metricsBoxConfiguration.metrics
76-
);
77-
this.metricRows.next(matchingMetrics);
78-
}));
70+
this.itemService.getMetrics(this.item.uuid).pipe(
71+
getFirstSucceededRemoteDataPayload(),
72+
).subscribe((result) => {
73+
const matchingMetrics = this.metricsComponentService.getMatchingMetrics(
74+
result.page,
75+
this.metricsBoxConfiguration.maxColumns,
76+
this.metricsBoxConfiguration.metrics,
77+
);
78+
this.metricRows.next(matchingMetrics);
79+
},
80+
),
81+
);
7982
}
8083
}
8184

‎src/app/shared/metric/metric-altmetric/metric-altmetric.component.html‎

Lines changed: 15 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,24 @@
1-
<div class="row d-flex align-items-center"
1+
<div class="d-flex flex-nowrap flex-row gapx-3 align-items-center pr-3"
22
*ngIf="(!failed &&
33
canLoadScript &&
44
!(isHidden$ | async) &&
55
(remark | dsListMetricProps: 'data-badge-enabled':isListElement == true))"
66
>
7-
<div class="col-5 text-left">
8-
<div #metricChild>
9-
<div
10-
class="altmetric-embed"
11-
[attr.data-hide-no-mentions]="visibleWithoutData ? false : (remark | dsListMetricProps : 'data-hide-no-mentions' : isListElement)"
12-
[attr.data-hide-less-than]="remark | dsListMetricProps : 'data-hide-less-than' : isListElement"
13-
[attr.data-badge-details]="remark | dsListMetricProps : 'data-badge-details' : isListElement"
14-
[attr.data-badge-type]="remark | dsListMetricProps : 'badgeType' : isListElement"
15-
[attr.data-badge-popover]="remark | dsListMetricProps : 'popover' : isListElement"
16-
[attr.data-doi]="remark | dsListMetricProps : 'doiAttr' : isListElement"
17-
[attr.data-pmid]="remark | dsListMetricProps : 'pmidAttr' : isListElement"
18-
[attr.data-link-target]="remark | dsListMetricProps : 'data-link-target' : isListElement"
19-
></div>
20-
</div>
7+
<div #metricChild>
8+
<div
9+
class="altmetric-embed"
10+
[attr.data-hide-no-mentions]="visibleWithoutData ? false : (remark | dsListMetricProps : 'data-hide-no-mentions' : isListElement)"
11+
[attr.data-hide-less-than]="remark | dsListMetricProps : 'data-hide-less-than' : isListElement"
12+
[attr.data-badge-details]="remark | dsListMetricProps : 'data-badge-details' : isListElement"
13+
[attr.data-badge-type]="remark | dsListMetricProps : 'badgeType' : isListElement"
14+
[attr.data-badge-popover]="remark | dsListMetricProps : 'popover' : isListElement"
15+
[attr.data-doi]="remark | dsListMetricProps : 'doiAttr' : isListElement"
16+
[attr.data-pmid]="remark | dsListMetricProps : 'pmidAttr' : isListElement"
17+
[attr.data-link-target]="remark | dsListMetricProps : 'data-link-target' : isListElement"
18+
></div>
2119
</div>
22-
<div class="col-7" *ngIf="!hideLabel">
23-
<div class="font-weight-bold text-capitalize">
24-
{{ metric.metricType | translate }}
25-
</div>
20+
<div class="font-weight-bold" *ngIf="!hideLabel">
21+
{{ "item.page.metric.label." + metric.metricType | translate }}
2622
</div>
2723
</div>
2824
<div class="row d-flex align-items-center justify-content-center m-2" *ngIf="!canLoadScript && !isListElement">

‎src/app/shared/metric/metric-altmetric/metric-altmetric.component.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ describe('MetricAltmetricComponent', () => {
5050
expect(component).toBeTruthy();
5151
});
5252
it('should render badge div', () => {
53-
const div = fixture.debugElement.queryAll(By.css('div'))[3];
53+
const div = fixture.debugElement.queryAll(By.css('div'))[2];
5454
expect(div.nativeElement.className).toEqual('altmetric-embed');
5555
expect(div.nativeElement.dataset.badgePopover).toEqual('bottom');
5656
expect(div.nativeElement.dataset.doi).toEqual('10.1056/Test');

‎src/app/shared/metric/metric-dimensions/metric-dimensions.component.html‎

Lines changed: 12 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,24 @@
1-
<div class="row d-flex align-items-center"
1+
<div class="d-flex flex-nowrap flex-row gapx-3 align-items-center pr-3"
22
*ngIf="!(isHidden$ | async) &&
33
canLoadScript &&
44
!failed &&
55
(remark | dsListMetricProps: 'data-badge-enabled':isListElement == true)"
66
>
7-
<div class="col-5 text-left">
8-
<div
9-
#metricChild
10-
class="__dimensions_badge_embed__"
11-
[attr.data-hide-zero-citations]="visibleWithoutData ? false : (remark | dsListMetricProps: 'data-hide-zero-citations':isListElement)"
12-
[attr.data-pmid]="
7+
<div
8+
#metricChild
9+
class="__dimensions_badge_embed__"
10+
[attr.data-hide-zero-citations]="visibleWithoutData ? false : (remark | dsListMetricProps: 'data-hide-zero-citations':isListElement)"
11+
[attr.data-pmid]="
1312
(remark | dsListMetricProps: 'data-doi':isListElement)
1413
? null
1514
: (remark | dsListMetricProps: 'data-pmid':isListElement)
1615
"
17-
[attr.data-doi]="remark | dsListMetricProps: 'data-doi':isListElement"
18-
[attr.data-style]="remark | dsListMetricProps: 'data-style':isListElement"
19-
[attr.data-legend]="remark | dsListMetricProps: 'data-legend':isListElement"
20-
></div>
21-
</div>
22-
<div class="col-7" *ngIf="!hideLabel">
23-
<div class="font-weight-bold text-capitalize">
24-
{{ metric.metricType | translate }}
25-
</div>
16+
[attr.data-doi]="remark | dsListMetricProps: 'data-doi':isListElement"
17+
[attr.data-style]="remark | dsListMetricProps: 'data-style':isListElement"
18+
[attr.data-legend]="remark | dsListMetricProps: 'data-legend':isListElement"
19+
></div>
20+
<div class="font-weight-bold" *ngIf="!hideLabel">
21+
{{ "item.page.metric.label." + metric.metricType | translate }}
2622
</div>
2723
</div>
2824
<div class="row d-flex align-items-center justify-content-center m-2" *ngIf="!canLoadScript && !isListElement">

‎src/app/shared/metric/metric-dimensions/metric-dimensions.component.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ describe('MetricDimensionsComponent', () => {
4949
expect(component).toBeTruthy();
5050
});
5151
it('should render badge div', () => {
52-
const div = fixture.debugElement.queryAll(By.css('div'))[2];
52+
const div = fixture.debugElement.queryAll(By.css('div'))[1];
5353
expect(div.nativeElement.className).toEqual('__dimensions_badge_embed__');
5454
expect(div.nativeElement.dataset.doi).toEqual('10.1056/Test');
5555
expect(div.nativeElement.dataset.style).toEqual('small_rectangle');

‎src/app/shared/metric/metric-googlescholar/metric-googlescholar.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
</div>
77
<div class="col">
88
<div class="d-flex justify-content-center">
9-
<div class="font-weight-bold text-capitalize">
10-
{{ metric.metricType | translate }}
9+
<div class="font-weight-bold">
10+
{{ "item.page.metric.label." + metric.metricType | translate }}
1111
</div>
1212
</div>
1313
</div>

‎src/app/shared/metric/metric-loader/base-metric.component.scss‎

Lines changed: 65 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,14 @@
11
::ng-deep {
2-
.container.plumX.alert.metric-container,
3-
.container.altmetric.alert.metric-container,
4-
.container.dimensions.alert.metric-container {
5-
// .plumX & .altmetric & dimensions-> metricType dimensions
6-
display: contents;
7-
}
2+
.metric-container.alert {
83

9-
.container.alert.metric-container {
104
max-height: inherit;
115
min-height: 7.1em;
126
height: 100%;
137

8+
margin: 0;
9+
10+
width: 250px;
11+
1412
.btn-overlap-container {
1513
display: none !important;
1614
z-index: 1;
@@ -20,81 +18,87 @@
2018
color: inherit;
2119
text-decoration: auto;
2220
}
23-
}
2421

25-
.container.alert.metric-container:hover {
22+
&:hover {
2623
opacity: 0.7;
2724

28-
.btn-overlap-container {
29-
margin-top: 0.5em;
30-
display: inline-flex !important;
31-
z-index: 3;
32-
position: absolute;
33-
top: 50%;
34-
left: 50%;
35-
transform: translate(-50%, -50%);
36-
color: white;
37-
-webkit-box-shadow: inset 0 1px 0 rgb(255 255 255 / 15%),
25+
.btn-overlap-container {
26+
margin-top: 0.5em;
27+
display: inline-flex !important;
28+
z-index: 3;
29+
position: absolute;
30+
top: 50%;
31+
left: 50%;
32+
transform: translate(-50%, -50%);
33+
color: white;
34+
-webkit-box-shadow: inset 0 1px 0 rgb(255 255 255 / 15%),
3835
0 1px 1px rgb(0 0 0 / 8%);
39-
box-shadow: inset 0 1px 0 rgb(255 255 255 / 15%),
36+
box-shadow: inset 0 1px 0 rgb(255 255 255 / 15%),
4037
0 1px 1px rgb(0 0 0 / 8%);
38+
}
4139
}
42-
}
4340

44-
.alert.metric-container.alert-info {
45-
.btn-overlap-container {
46-
background-color: #113d4f;
47-
border-color: #113d4f;
41+
.plumX, .altmetric, .dimensions {
42+
// .plumX & .altmetric & dimensions-> metricType dimensions
43+
display: contents;
4844
}
49-
}
5045

51-
.alert.metric-container.alert-success {
52-
.btn-overlap-container {
53-
background-color: #4c6722;
54-
border-color: #4c6722;
46+
&.alert-info {
47+
.btn-overlap-container {
48+
background-color: #113d4f;
49+
border-color: #113d4f;
50+
}
5551
}
56-
}
5752

58-
.alert.metric-container.alert-danger {
59-
.btn-overlap-container {
60-
background-color: #6c2323;
61-
border-color: #6c2323;
53+
&.alert-success {
54+
.btn-overlap-container {
55+
background-color: #4c6722;
56+
border-color: #4c6722;
57+
}
6258
}
63-
}
6459

65-
.alert.metric-container.alert-primary {
66-
.btn-overlap-container {
67-
background-color: #004085;
68-
border-color: #004085;
60+
&.alert-danger {
61+
.btn-overlap-container {
62+
background-color: #6c2323;
63+
border-color: #6c2323;
64+
}
6965
}
70-
}
7166

72-
.alert.metric-container.alert-secondary {
73-
.btn-overlap-container {
74-
background-color: #383d41;
75-
border-color: #383d41;
67+
&.alert-primary {
68+
.btn-overlap-container {
69+
background-color: #004085;
70+
border-color: #004085;
71+
}
7672
}
77-
}
7873

79-
.alert.metric-container.alert-warning {
80-
.btn-overlap-container {
81-
background-color: #7b4d1b;
82-
border-color: #7b4d1b;
74+
&.alert-secondary {
75+
.btn-overlap-container {
76+
background-color: #383d41;
77+
border-color: #383d41;
78+
}
8379
}
84-
}
8580

86-
.alert.metric-container.alert-dark {
87-
.btn-overlap-container {
88-
background-color: #1b1e21;
89-
border-color: #1b1e21;
81+
&.alert-warning {
82+
.btn-overlap-container {
83+
background-color: #7b4d1b;
84+
border-color: #7b4d1b;
85+
}
9086
}
91-
}
9287

93-
.alert.metric-container.alert-light {
94-
.btn-overlap-container {
95-
background-color: #818182;
96-
border-color: #818182;
97-
color: black !important;
88+
&.alert-dark {
89+
.btn-overlap-container {
90+
background-color: #1b1e21;
91+
border-color: #1b1e21;
92+
}
9893
}
94+
95+
&.alert-light {
96+
.btn-overlap-container {
97+
background-color: #818182;
98+
border-color: #818182;
99+
color: black !important;
100+
}
101+
}
102+
99103
}
100104
}

0 commit comments

Comments
 (0)