Skip to content

Commit 96a66a8

Browse files
[GLAM-610] Implemented new rendering type components when coordinates belong to METADATAGROUP
1 parent 7364ca3 commit 96a66a8

10 files changed

Lines changed: 340 additions & 1 deletion

File tree

src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/metadata-box.decorator.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@ export enum FieldRenderingType {
1919
HTML = 'HTML',
2020
GMAP = 'GOOGLEMAPS',
2121
OSMAP = 'OPENSTREETMAP',
22+
GMAPGROUP = 'GOOGLEMAPS-GROUP',
23+
OSMAPGROUP = 'OPENSTREETMAP-GROUP',
2224
BROWSE = 'BROWSE',
2325
TAGBROWSE = 'TAG-BROWSE',
2426
MARKDOWN = 'MARKDOWN',
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<div *ngIf="coordinates">
2+
<ds-googlemaps id="googlemap" [coordinates]="coordinates"></ds-googlemaps>
3+
</div>

src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/metadataGroup/googlemaps-group/googlemaps-group.component.scss

Whitespace-only changes.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
import { GooglemapsGroupComponent } from './googlemaps-group.component';
3+
import { Item } from '../../../../../../../../core/shared/item.model';
4+
import { of } from 'rxjs';
5+
import { LayoutField } from '../../../../../../../../core/layout/models/box.model';
6+
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
7+
import { TranslateLoaderMock } from '../../../../../../../../shared/mocks/translate-loader.mock';
8+
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
9+
import { LoadMoreService } from '../../../../../../../services/load-more.service';
10+
import { GooglemapsComponent } from '../../../../../../../../shared/googlemaps/googlemaps.component';
11+
import { NO_ERRORS_SCHEMA } from '@angular/core';
12+
import { ConfigurationDataService } from '../../../../../../../../core/data/configuration-data.service';
13+
import { createSuccessfulRemoteDataObject$ } from '../../../../../../../../shared/remote-data.utils';
14+
15+
describe('GooglemapsGroupComponent', () => {
16+
let component: GooglemapsGroupComponent;
17+
18+
let fixture: ComponentFixture<GooglemapsGroupComponent>;
19+
20+
const configurationDataService = jasmine.createSpyObj('configurationDataService', {
21+
findByPropertyName: jasmine.createSpy('findByPropertyName')
22+
});
23+
24+
const confResponse$ = createSuccessfulRemoteDataObject$({ values: ['valid-googlemap-key'] });
25+
26+
const testItem = Object.assign(new Item(), {
27+
bundles: of({}),
28+
metadata: {
29+
'dc.coverage.spatialgpdpy': [
30+
{
31+
value: '45.4899793'
32+
},
33+
],
34+
'dc.coverage.spatialgpdpx': [
35+
{
36+
value: '9.138292'
37+
},
38+
]
39+
}
40+
});
41+
42+
const mockField = Object.assign({
43+
id: 1,
44+
fieldType: 'METADATAGROUP',
45+
metadata: 'dc.coverage.spatialgpdpy',
46+
label: 'Coordinates',
47+
rendering: 'googlemaps-group',
48+
style: 'container row',
49+
styleLabel: 'font-weight-bold col-4',
50+
styleValue: 'col',
51+
metadataGroup: {
52+
leading: 'dc.coverage.spatialgpdpy',
53+
elements: [
54+
{
55+
metadata: 'dc.coverage.spatialgpdpy',
56+
label: 'Latitude',
57+
rendering: 'TEXT',
58+
fieldType: 'METADATA',
59+
style: null,
60+
styleLabel: 'font-weight-bold col-0',
61+
styleValue: 'col'
62+
},
63+
{
64+
metadata: 'dc.coverage.spatialgpdpx',
65+
label: 'Longitude',
66+
rendering: 'TEXT',
67+
fieldType: 'METADATA',
68+
style: null,
69+
styleLabel: 'font-weight-bold col-0',
70+
styleValue: 'col'
71+
}
72+
]
73+
}
74+
}) as LayoutField;
75+
76+
beforeEach(async () => {
77+
await TestBed.configureTestingModule({
78+
imports: [TranslateModule.forRoot({
79+
loader: {
80+
provide: TranslateLoader,
81+
useClass: TranslateLoaderMock
82+
}
83+
}), BrowserAnimationsModule],
84+
providers: [
85+
{ provide: 'fieldProvider', useValue: mockField },
86+
{ provide: 'itemProvider', useValue: testItem },
87+
{ provide: 'renderingSubTypeProvider', useValue: '' },
88+
{ provide: ConfigurationDataService, useValue: configurationDataService },
89+
{ provide: 'tabNameProvider', useValue: '' },
90+
LoadMoreService,
91+
],
92+
schemas: [NO_ERRORS_SCHEMA],
93+
declarations: [
94+
GooglemapsGroupComponent,
95+
GooglemapsComponent]
96+
})
97+
.compileComponents();
98+
99+
fixture = TestBed.createComponent(GooglemapsGroupComponent);
100+
component = fixture.componentInstance;
101+
configurationDataService.findByPropertyName.and.returnValues(confResponse$);
102+
fixture.detectChanges();
103+
});
104+
105+
it('should create', () => {
106+
expect(component).toBeTruthy();
107+
});
108+
109+
it('should populate coordinates', () => {
110+
expect(component.coordinates).not.toBeUndefined();
111+
const latitude = testItem.metadata['dc.coverage.spatialgpdpy'][0].value;
112+
const longitude = testItem.metadata['dc.coverage.spatialgpdpx'][0].value;
113+
expect(component.coordinates).toBe(`@${latitude},${longitude}`);
114+
});
115+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import { Component, Inject, OnInit } from '@angular/core';
2+
import { FieldRenderingType, MetadataBoxFieldRendering } from '../../metadata-box.decorator';
3+
import { MetadataGroupComponent } from '../metadata-group.component';
4+
import { LayoutField } from '../../../../../../../../core/layout/models/box.model';
5+
import { Item } from '../../../../../../../../core/shared/item.model';
6+
import { TranslateService } from '@ngx-translate/core';
7+
import { LoadMoreService, NestedMetadataGroupEntry } from '../../../../../../../services/load-more.service';
8+
9+
@Component({
10+
selector: 'ds-googlemaps-group',
11+
templateUrl: './googlemaps-group.component.html',
12+
styleUrls: ['./googlemaps-group.component.scss']
13+
})
14+
@MetadataBoxFieldRendering(FieldRenderingType.GMAPGROUP, true)
15+
export class GooglemapsGroupComponent extends MetadataGroupComponent implements OnInit {
16+
17+
coordinates: string;
18+
19+
constructor(
20+
@Inject('fieldProvider') public fieldProvider: LayoutField,
21+
@Inject('itemProvider') public itemProvider: Item,
22+
@Inject('renderingSubTypeProvider') public renderingSubTypeProvider: string,
23+
@Inject('tabNameProvider') public tabNameProvider: string,
24+
protected translateService: TranslateService,
25+
public loadMoreService: LoadMoreService
26+
) {
27+
super(fieldProvider, itemProvider, renderingSubTypeProvider, tabNameProvider, translateService, loadMoreService);
28+
}
29+
30+
ngOnInit(): void {
31+
super.ngOnInit();
32+
const coordinatesEntryMetadata = this.componentsToBeRenderedMap.get(0);
33+
const [latitude, longitude] = coordinatesEntryMetadata;
34+
const valueLatitude = this.getNestedMetadataValue(latitude);
35+
const valueLongitude = this.getNestedMetadataValue(longitude);
36+
this.coordinates = `@${valueLatitude},${valueLongitude}`;
37+
}
38+
getNestedMetadataValue(nestedMetadaGroupEntry: NestedMetadataGroupEntry){
39+
return nestedMetadaGroupEntry?.value?.value;
40+
}
41+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div *ngIf="coordinates">
2+
<ds-open-street-map
3+
[coordinates]="coordinates"
4+
[showControlsZoom]="true"
5+
[showDisplayName]="true"
6+
></ds-open-street-map>
7+
</div>

src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/metadataGroup/openstreetmap-group/openstreetmap-group.component.scss

Whitespace-only changes.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
import { OpenstreetmapGroupComponent } from './openstreetmap-group.component';
3+
import { Item } from '../../../../../../../../core/shared/item.model';
4+
import { of } from 'rxjs';
5+
import { LayoutField } from '../../../../../../../../core/layout/models/box.model';
6+
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
7+
import { TranslateLoaderMock } from '../../../../../../../../shared/mocks/translate-loader.mock';
8+
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
9+
import { LoadMoreService } from '../../../../../../../services/load-more.service';
10+
import { OpenStreetMapComponent } from '../../../../../../../../shared/open-street-map/open-street-map.component';
11+
import { NO_ERRORS_SCHEMA } from '@angular/core';
12+
import { LocationPlace, LocationService } from '../../../../../../../../core/services/location.service';
13+
14+
describe('OpenstreetmapGroupComponent', () => {
15+
let component: OpenstreetmapGroupComponent;
16+
17+
let fixture: ComponentFixture<OpenstreetmapGroupComponent>;
18+
19+
const locationService = jasmine.createSpyObj('locationService', {
20+
searchPlace: jasmine.createSpy('searchPlace'),
21+
searchCoordinates: jasmine.createSpy('searchCoordinates'),
22+
isValidCoordinateString: jasmine.createSpy('isValidCoordinateString'),
23+
parseCoordinates: jasmine.createSpy('parseCoordinates'),
24+
isCoordinateString: jasmine.createSpy('isCoordinateString'),
25+
});
26+
27+
const place: LocationPlace = {
28+
coordinates: {
29+
latitude: 52.520008,
30+
longitude: 13.404954,
31+
},
32+
displayName: '10178 Berlin, Germania'
33+
};
34+
35+
const testItem = Object.assign(new Item(), {
36+
bundles: of({}),
37+
metadata: {
38+
'dc.coverage.spatialgpdpy': [
39+
{
40+
value: '45.4899793'
41+
},
42+
],
43+
'dc.coverage.spatialgpdpx': [
44+
{
45+
value: '9.138292'
46+
},
47+
]
48+
}
49+
});
50+
51+
const mockField = Object.assign({
52+
id: 1,
53+
fieldType: 'METADATAGROUP',
54+
metadata: 'dc.coverage.spatialgpdpy',
55+
label: 'Coordinates',
56+
rendering: 'googlemaps-group',
57+
style: 'container row',
58+
styleLabel: 'font-weight-bold col-4',
59+
styleValue: 'col',
60+
metadataGroup: {
61+
leading: 'dc.coverage.spatialgpdpy',
62+
elements: [
63+
{
64+
metadata: 'dc.coverage.spatialgpdpy',
65+
label: 'Latitude',
66+
rendering: 'TEXT',
67+
fieldType: 'METADATA',
68+
style: null,
69+
styleLabel: 'font-weight-bold col-0',
70+
styleValue: 'col'
71+
},
72+
{
73+
metadata: 'dc.coverage.spatialgpdpx',
74+
label: 'Longitude',
75+
rendering: 'TEXT',
76+
fieldType: 'METADATA',
77+
style: null,
78+
styleLabel: 'font-weight-bold col-0',
79+
styleValue: 'col'
80+
}
81+
]
82+
}
83+
}) as LayoutField;
84+
85+
beforeEach(async () => {
86+
await TestBed.configureTestingModule({
87+
imports: [TranslateModule.forRoot({
88+
loader: {
89+
provide: TranslateLoader,
90+
useClass: TranslateLoaderMock
91+
}
92+
}), BrowserAnimationsModule],
93+
providers: [
94+
{ provide: 'fieldProvider', useValue: mockField },
95+
{ provide: 'itemProvider', useValue: testItem },
96+
{ provide: 'renderingSubTypeProvider', useValue: '' },
97+
{ provide: 'tabNameProvider', useValue: '' },
98+
{ provide: LocationService, useValue: locationService },
99+
LoadMoreService,
100+
],
101+
schemas: [NO_ERRORS_SCHEMA],
102+
declarations: [
103+
OpenstreetmapGroupComponent,
104+
OpenStreetMapComponent]
105+
})
106+
.compileComponents();
107+
108+
fixture = TestBed.createComponent(OpenstreetmapGroupComponent);
109+
component = fixture.componentInstance;
110+
locationService.isCoordinateString.and.returnValue(true);
111+
locationService.isValidCoordinateString.and.returnValue(true);
112+
locationService.parseCoordinates.and.returnValue(place.coordinates);
113+
locationService.searchCoordinates.and.returnValue(of(place.displayName));
114+
fixture.detectChanges();
115+
});
116+
117+
it('should create', () => {
118+
expect(component).toBeTruthy();
119+
});
120+
121+
it('should populate coordinates', () => {
122+
expect(component.coordinates).not.toBeUndefined();
123+
const latitude = testItem.metadata['dc.coverage.spatialgpdpy'][0].value;
124+
const longitude = testItem.metadata['dc.coverage.spatialgpdpx'][0].value;
125+
expect(component.coordinates).toBe(`${latitude},${longitude}`);
126+
});
127+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import { Component, Inject, OnInit } from '@angular/core';
2+
import { FieldRenderingType, MetadataBoxFieldRendering } from '../../metadata-box.decorator';
3+
import { MetadataGroupComponent } from '../metadata-group.component';
4+
import { LayoutField } from '../../../../../../../../core/layout/models/box.model';
5+
import { Item } from '../../../../../../../../core/shared/item.model';
6+
import { TranslateService } from '@ngx-translate/core';
7+
import { LoadMoreService, NestedMetadataGroupEntry } from '../../../../../../../services/load-more.service';
8+
9+
@Component({
10+
selector: 'ds-openstreetmap-group',
11+
templateUrl: './openstreetmap-group.component.html',
12+
styleUrls: ['./openstreetmap-group.component.scss']
13+
})
14+
@MetadataBoxFieldRendering(FieldRenderingType.OSMAPGROUP,true)
15+
export class OpenstreetmapGroupComponent extends MetadataGroupComponent implements OnInit {
16+
17+
coordinates: string;
18+
19+
constructor(
20+
@Inject('fieldProvider') public fieldProvider: LayoutField,
21+
@Inject('itemProvider') public itemProvider: Item,
22+
@Inject('renderingSubTypeProvider') public renderingSubTypeProvider: string,
23+
@Inject('tabNameProvider') public tabNameProvider: string,
24+
protected translateService: TranslateService,
25+
public loadMoreService: LoadMoreService
26+
) {
27+
super(fieldProvider, itemProvider, renderingSubTypeProvider, tabNameProvider, translateService, loadMoreService);
28+
}
29+
30+
ngOnInit(): void {
31+
super.ngOnInit();
32+
const coordinatesEntryMetadata = this.componentsToBeRenderedMap.get(0);
33+
const [latitude, longitude] = coordinatesEntryMetadata;
34+
const valueLatitude = this.getNestedMetadataValue(latitude);
35+
const valueLongitude = this.getNestedMetadataValue(longitude);
36+
this.coordinates = `${valueLatitude},${valueLongitude}`;
37+
}
38+
getNestedMetadataValue(nestedMetadaGroupEntry: NestedMetadataGroupEntry){
39+
return nestedMetadaGroupEntry?.value?.value;
40+
}
41+
}

src/app/cris-layout/cris-layout.module.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -147,7 +147,8 @@ import {
147147
import { MediaPlayerModule } from '../shared/media-player/media-player.module';
148148
import { OpenStreetMapModule } from '../shared/open-street-map/open-street-map.module';
149149
import { OpenStreetMapRenderingComponent } from './cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/open-street-map/open-street-map-rendering.component';
150-
150+
import { GooglemapsGroupComponent } from './cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/metadataGroup/googlemaps-group/googlemaps-group.component';
151+
import { OpenstreetmapGroupComponent } from './cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/metadataGroup/openstreetmap-group/openstreetmap-group.component';
151152
const ENTRY_COMPONENTS = [
152153
// put only entry components that use custom decorator
153154
CrisLayoutVerticalComponent,
@@ -210,6 +211,8 @@ const ENTRY_COMPONENTS = [
210211
MarkdownComponent,
211212
BitstreamAttachmentComponent,
212213
AttachmentRenderComponent,
214+
GooglemapsGroupComponent,
215+
OpenstreetmapGroupComponent,
213216
],
214217
providers:[ LoadMoreService, NgbActiveModal ],
215218
imports: [

0 commit comments

Comments
 (0)