- {{ error.statusText }}
+
+ {{ error.statusText }}
+
diff --git a/projects/sandbox/src/app/wizard/wizard.component.scss b/projects/sandbox/src/app/wizard/wizard.component.scss
index 01157e023..7eb247daf 100644
--- a/projects/sandbox/src/app/wizard/wizard.component.scss
+++ b/projects/sandbox/src/app/wizard/wizard.component.scss
@@ -1,4 +1,3 @@
-@import 'shared-styles/assets/sass/scss/generic/variables';
@import 'shared-styles/assets/sass/scss/iconography/svg-icons-metis';
$wizard-border-radius: 1.5em;
@@ -15,13 +14,29 @@ $wizard-border-radius: 1.5em;
}
.errors {
+ background-color: $white;
+ border: 1px solid $eu-red;
+ font-size: 14px;
font-weight: bold;
margin-top: 0.75em;
+ padding: 0.5em;
.error-detail {
font-weight: normal;
list-style: disc;
- margin-left: 1em;
+ margin-left: 16px;
+ }
+
+ .heading {
+ position: relative;
+ &::before {
+ content: '';
+ display: inline-block;
+ height: 12px;
+ width: 13px;
+ background: svg-url-icon-warning($eu-red) center no-repeat;
+ margin: 2px 2px 0 0;
+ }
}
}
@@ -30,73 +45,15 @@ $wizard-border-radius: 1.5em;
margin-top: 1em;
}
-.hidden {
- display: none;
-}
-
select {
width: 100%;
}
-.wizard button {
- background: $eu-jade-classic;
- border-radius: $wizard-border-radius;
- font-weight: bold;
-
- &.next,
- &.previous {
- padding: 0;
- text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.5);
- &::after {
- content: '\25B2';
- transform-origin: top;
- }
- }
- &:hover {
- background-color: $white;
- color: $eu-jade-darker;
- }
- &:active {
- border-color: $eu-light-orange;
- color: $eu-light-orange;
- }
-
- &.next::after {
- left: 1rem;
- transform: rotate(90deg);
- }
- &.previous::after {
- left: -1rem;
- transform: rotate(270deg);
- text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.1), -1px -1px 1px rgba(0, 0, 0, 0.5);
- }
-
- &.submit {
- &:hover {
- box-shadow: rgba(25, 115, 36, 0.35) 0px 5px 15px;
- text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.5);
- }
-
- &[disabled] {
- cursor: default;
- background: $gray-lighter;
- border-color: $gray-light;
- color: $gray-light;
- pointer-events: none;
- }
- }
-}
-
-.wizard,
-.wizard button {
- border: 1px solid $eu-jade-dark;
-}
-
.wizard {
background-color: $eu-light-jade-classic;
border: 1px solid $eu-jade-dark;
border-radius: $wizard-border-radius;
- margin: 1.5rem auto;
+ margin: 7rem auto 1.5rem auto;
max-width: 50em;
width: 80%;
}
@@ -124,218 +81,17 @@ select {
}
}
-.wizard-status {
- display: flex;
- justify-content: space-evenly;
- width: 100%;
-
- li {
- position: relative;
- top: 2em;
- }
-}
-
-.orb-status {
- background-color: $eu-jade-light;
- border-color: $eu-jade-dark;
- margin: 0;
- transition: 0.3s ease-in border-radius;
-
- &::after {
- font-size: 1.25em;
- }
- &.next {
- margin-left: 0.25em;
- }
-}
-
-.orb-status.labelled {
- border-radius: $wizard-border-radius;
- height: 3em;
- min-width: 3em;
- width: 3em;
-
- &::after {
- content: attr(data-label);
- }
-
- &.orb-square {
- border-radius: 0;
- }
-
- &.spinner::after {
- content: '';
- }
-
- &.indicator-orb::before {
- border: 1px solid $eu-jade-dark;
- border-radius: 1em;
- position: absolute;
- left: 50%;
- top: 100%;
- transform: translate(-50%, -25%);
- width: 1em;
- height: 1em;
- }
-
- &.progress-orb::before,
- &.submitted-orb::before {
- background: svg-url-icon-tick('#{$white}') center 75% / 75% no-repeat $eu-jade-light;
- }
-
- &.is-set {
- background-color: $eu-light-orange;
- border-color: $white;
- &:hover {
- border-color: $eu-light-orange;
- }
- &.indicator-orb::before {
- border-color: $white;
- background-color: $eu-light-orange;
- }
- &.progress-orb::before {
- background-image: svg-url-icon-tick('#{$white}');
- }
- &.indicator-orb:hover::before {
- border-color: $eu-light-orange;
- background-color: $white;
- }
- &.progress-orb:hover::before {
- background-image: svg-url-icon-tick('#000');
- }
- &:active {
- color: $eu-light-orange;
- }
- &.indicator-orb:active::before {
- background-color: $white;
- }
- &.progress-orb:active::before {
- background-image: svg-url-icon-tick('#{$eu-light-orange}');
- }
- }
-
- &:hover {
- background-color: $white;
- box-shadow: rgba(25, 115, 36, 0.35) 0px 5px 15px;
- &.indicator-orb::before {
- background-color: $white;
- }
- &.progress-orb::before,
- &.submitted-orb::before {
- background-image: svg-url-icon-tick('#000');
- }
- }
-
- &:active {
- background-color: $white;
- border-color: $eu-light-orange;
- color: $eu-light-orange;
-
- &.indicator-orb::before {
- border-color: $eu-light-orange;
- }
- &.progress-orb::before,
- &.submitted-orb::before {
- background-image: svg-url-icon-tick('#{$eu-light-orange}');
- }
- }
-
- &.is-active {
- border-width: 2px;
- border-color: $eu-yellow;
- pointer-events: none;
-
- &.indicator-orb::before {
- border-color: $eu-yellow;
- border-width: 2px;
- }
- }
-
- &.spinner,
- &.indicate-polling {
- &.indicator-orb::before {
- background-position: center;
- background-repeat: no-repeat;
- }
- &.progress-orb::before,
- &.submitted-orb::before {
- background-image: svg-url-icon-spin('#{$white}');
- }
-
- &.progress-orb:hover::before,
- &.submitted-orb:hover::before {
- background-image: svg-url-icon-spin('#000');
- }
-
- &.progress-orb:active::before,
- &.submitted-orb:active::before {
- background-image: svg-url-icon-spin('#{$eu-light-orange}');
- }
- }
-
- &:not(.spinner) {
- &.progress-orb::after {
- background: svg-url-icon-dataset('#{$white}') center / 1.75rem no-repeat;
- content: '';
- height: 100%;
- width: 100%;
- }
-
- &.progress-orb:hover::after {
- background-image: svg-url-icon-dataset('#000');
- }
-
- &.progress-orb:active::after {
- background-image: svg-url-icon-dataset('#{$eu-light-orange}');
- }
- }
-
- &.is-active.is-set {
- border-color: $white;
- &:hover {
- border-color: $eu-light-orange;
- }
- &::before {
- border-color: $white;
- }
- }
-
- &.indicate-complete,
- &.indicate-polling,
- &.spinner {
- &::before {
- content: '';
- }
- }
-}
-
-.orbs-hidden {
- .orb-container:not(.progress-orb-container) .orb-status.labelled {
- display: none;
- }
-
- .progress-orb-container {
- flex-basis: 100%;
- text-align: center;
- .orb-status.is-active {
- pointer-events: all;
- }
- }
-}
-
-.spinner {
- background: svg-url-icon-spin('#{$white}') center / 2em no-repeat $eu-jade-light;
- &:hover {
- background-image: svg-url-icon-spin('#000');
- }
- &:active {
- background-image: svg-url-icon-spin('#{$eu-light-orange}');
+.wizard-section {
+ display: none;
+ &.active {
+ display: block;
}
}
-.submit-track-id {
+.submit-id-ctrls {
display: flex;
button {
+ flex-basis: 5.75em;
margin-left: 0.5rem;
text-shadow: none;
white-space: nowrap;
diff --git a/projects/sandbox/src/app/wizard/wizard.component.spec.ts b/projects/sandbox/src/app/wizard/wizard.component.spec.ts
index d8020a8bf..2e246c556 100644
--- a/projects/sandbox/src/app/wizard/wizard.component.spec.ts
+++ b/projects/sandbox/src/app/wizard/wizard.component.spec.ts
@@ -2,9 +2,18 @@ import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
-import { of } from 'rxjs';
+import { ActivatedRoute, Params } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { BehaviorSubject, of } from 'rxjs';
+// sonar-disable-next-statement (sonar doesn't read tsconfig paths entry)
+import { FileUploadComponent, ProtocolFieldSetComponent, ProtocolType } from 'shared';
import { apiSettings } from '../../environments/apisettings';
-import { mockDataset, MockSandboxService, MockSandboxServiceErrors } from '../_mocked';
+import {
+ mockDataset,
+ mockRecordReport,
+ MockSandboxService,
+ MockSandboxServiceErrors
+} from '../_mocked';
import { DatasetStatus, WizardStep, WizardStepType } from '../_models';
import { SandboxService } from '../_services';
import { WizardComponent } from './wizard.component';
@@ -14,15 +23,23 @@ describe('WizardComponent', () => {
let fixture: ComponentFixture
;
let sandbox: SandboxService;
const testFile = new File([], 'file.zip', { type: 'zip' });
+ const params = new BehaviorSubject({} as Params);
+ const queryParams = new BehaviorSubject({} as Params);
+ const formNameDatasetId = 'datasetToTrack';
+ const formNameRecordId = 'recordToTrack';
const configureTestbed = (errorMode = false): void => {
TestBed.configureTestingModule({
- declarations: [WizardComponent],
- imports: [HttpClientTestingModule, ReactiveFormsModule],
+ declarations: [FileUploadComponent, ProtocolFieldSetComponent, WizardComponent],
+ imports: [HttpClientTestingModule, ReactiveFormsModule, RouterTestingModule],
providers: [
{
provide: SandboxService,
useClass: errorMode ? MockSandboxServiceErrors : MockSandboxService
+ },
+ {
+ provide: ActivatedRoute,
+ useValue: { params: params, queryParams: queryParams }
}
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
@@ -33,14 +50,21 @@ describe('WizardComponent', () => {
const b4Each = (): void => {
fixture = TestBed.createComponent(WizardComponent);
component = fixture.componentInstance;
+ params.next({});
fixture.detectChanges();
};
- const fillUploadForm = (): void => {
+ const fillUploadForm = (useHarvestUrl = false): void => {
(component.formUpload.get('name') as FormControl).setValue('A');
(component.formUpload.get('country') as FormControl).setValue('Greece');
(component.formUpload.get('language') as FormControl).setValue('Greek');
(component.formUpload.get('dataset') as FormControl).setValue(testFile);
+
+ if (useHarvestUrl) {
+ (component.formUpload.get('harvestUrl') as FormControl).setValue('http://x');
+ } else {
+ (component.formUpload.get('url') as FormControl).setValue('http://x');
+ }
expect(component.formUpload.valid).toBeTruthy();
};
@@ -52,6 +76,55 @@ describe('WizardComponent', () => {
expect(component).toBeTruthy();
});
+ it('should subscribe to parameter changes', () => {
+ expect(component.trackDatasetId).toBeFalsy();
+ params.next({ id: '1' });
+ fixture.detectChanges();
+ expect(component.trackDatasetId).toBeTruthy();
+ expect(component.trackRecordId).toBeFalsy();
+
+ params.next({ id: '1' });
+ queryParams.next({ recordId: '2' });
+
+ expect(component.trackDatasetId).toBeTruthy();
+ expect(component.trackRecordId).toBeTruthy();
+ });
+
+ it('should get the connect classes', () => {
+ let cClasses = component.getConnectClasses('top');
+ expect(cClasses.error).toBeFalsy();
+
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('1');
+ fixture.detectChanges();
+ cClasses = component.getConnectClasses('top');
+ expect(cClasses.error).toBeFalsy();
+ expect(cClasses.top).toBeFalsy();
+
+ (component.formRecord.get(formNameRecordId) as FormControl).setValue('/1/23');
+ fixture.detectChanges();
+ cClasses = component.getConnectClasses('top');
+ expect(cClasses.error).toBeFalsy();
+ expect(cClasses.top).toBeTruthy();
+
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('2');
+ fixture.detectChanges();
+ cClasses = component.getConnectClasses('top');
+ expect(cClasses.error).toBeTruthy();
+ expect(cClasses.top).toBeTruthy();
+
+ (component.formRecord.get(formNameRecordId) as FormControl).setValue('/2/23');
+ fixture.detectChanges();
+ cClasses = component.getConnectClasses('top');
+ expect(cClasses.error).toBeFalsy();
+ expect(cClasses.top).toBeTruthy();
+
+ (component.formRecord.get(formNameRecordId) as FormControl).setValue('/BBB/23');
+ fixture.detectChanges();
+ cClasses = component.getConnectClasses('top');
+ expect(cClasses.error).toBeFalsy();
+ expect(cClasses.top).toBeFalsy();
+ });
+
it('should get the form group', () => {
expect(
component.getFormGroup({ stepType: WizardStepType.PROGRESS_TRACK } as WizardStep)
@@ -63,11 +136,11 @@ describe('WizardComponent', () => {
it('should reset the busy flags', fakeAsync(() => {
component.isBusy = true;
- component.isPolling = true;
+ component.isPollingProgress = true;
component.resetBusy();
tick(component.resetBusyDelay);
expect(component.isBusy).toBeFalsy();
- expect(component.isPolling).toBeFalsy();
+ expect(component.isPollingProgress).toBeFalsy();
}));
it('should tell if the progress is complete', () => {
@@ -80,25 +153,39 @@ describe('WizardComponent', () => {
});
it('should tell if the steps are complete', () => {
+ const form = component.formUpload;
+
expect(component.stepIsComplete(0)).toBeFalsy();
- (component.formUpload.get('name') as FormControl).setValue('A');
+ (form.get('name') as FormControl).setValue('A');
expect(component.stepIsComplete(0)).toBeTruthy();
- (component.formUpload.get('name') as FormControl).setValue(' ');
+ (form.get('name') as FormControl).setValue(' ');
expect(component.stepIsComplete(0)).toBeFalsy();
expect(component.stepIsComplete(1)).toBeFalsy();
- (component.formUpload.get('country') as FormControl).setValue('Greece');
- (component.formUpload.get('language') as FormControl).setValue('Greek');
+ (form.get('country') as FormControl).setValue('Greece');
+ (form.get('language') as FormControl).setValue('Greek');
expect(component.stepIsComplete(1)).toBeTruthy();
expect(component.stepIsComplete(2)).toBeFalsy();
- (component.formUpload.get('dataset') as FormControl).setValue(testFile);
+
+ (form.get('uploadProtocol') as FormControl).setValue(ProtocolType.ZIP_UPLOAD);
+ (form.get('dataset') as FormControl).setValue(testFile);
+
+ (component.formUpload.get('uploadProtocol') as FormControl).setValue(
+ ProtocolType.HTTP_HARVEST
+ );
+ expect(component.stepIsComplete(2)).toBeFalsy();
+
+ (form.get('url') as FormControl).setValue('http://x');
+ (form.get('harvestUrl') as FormControl).setValue('http://x');
+
+ fixture.detectChanges();
expect(component.stepIsComplete(2)).toBeTruthy();
expect(component.stepIsComplete(3)).toBeFalsy();
- (component.formProgress.get('idToTrack') as FormControl).setValue('1');
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('1');
expect(component.stepIsComplete(3)).toBeTruthy();
- (component.formProgress.get('idToTrack') as FormControl).setValue(' ');
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue(' ');
expect(component.stepIsComplete(3)).toBeFalsy();
});
@@ -110,6 +197,26 @@ describe('WizardComponent', () => {
expect(component.stepIsComplete(0)).toBeFalsy();
});
+ it('should validate conditionally', () => {
+ const ctrlFile = component.formUpload.get(component.xsltFileFormName) as FormControl;
+ const ctrlCB = component.formUpload.get('sendXSLT') as FormControl;
+
+ component.updateConditionalXSLValidator();
+ expect(ctrlFile.valid).toBeTruthy();
+
+ ctrlCB.setValue(true);
+ component.updateConditionalXSLValidator();
+ expect(ctrlFile.valid).toBeFalsy();
+
+ ctrlCB.setValue(false);
+ component.updateConditionalXSLValidator();
+ expect(ctrlFile.valid).toBeTruthy();
+
+ component.formUpload.removeControl('sendXSLT');
+ component.updateConditionalXSLValidator();
+ expect(ctrlFile.valid).toBeTruthy();
+ });
+
it('should tell if the steps are submittable', () => {
const assertSubmittable = (value: boolean): void => {
Array.from(Array(3).keys()).forEach((i: number) => {
@@ -120,17 +227,36 @@ describe('WizardComponent', () => {
assertSubmittable(false);
fillUploadForm();
assertSubmittable(true);
-
(component.formUpload.get('country') as FormControl).setValue(null);
-
assertSubmittable(false);
});
+ it('should tell if the steps are submitted', () => {
+ const conf = component.wizardConf;
+ [0, 1, 2].forEach((n: number) => {
+ expect(component.getStepIsSubmitted(conf[n])).toBeFalsy();
+ });
+ component.formUpload.disable();
+ [0, 1, 2].forEach((n: number) => {
+ expect(component.getStepIsSubmitted(conf[n])).toBeTruthy();
+ });
+
+ component.trackDatasetId = undefined;
+ expect(component.getStepIsSubmitted(conf[3])).toBeFalsy();
+ component.trackDatasetId = '123';
+ expect(component.getStepIsSubmitted(conf[3])).toBeTruthy();
+
+ component.trackRecordId = undefined;
+ expect(component.getStepIsSubmitted(conf[4])).toBeFalsy();
+ component.trackRecordId = '123';
+ expect(component.getStepIsSubmitted(conf[4])).toBeTruthy();
+ });
+
it('should submit the progress form, clearing the polling before and when complete', fakeAsync(() => {
spyOn(component, 'clearDataPollers');
component.onSubmitProgress();
expect(component.clearDataPollers).not.toHaveBeenCalled();
- (component.formProgress.get('idToTrack') as FormControl).setValue('1');
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('1');
component.onSubmitProgress();
expect(component.clearDataPollers).toHaveBeenCalledTimes(1);
tick(1);
@@ -139,28 +265,72 @@ describe('WizardComponent', () => {
// clear and re-submit
spyOn(component, 'progressComplete').and.callFake(() => false);
- (component.formProgress.get('idToTrack') as FormControl).setValue('1');
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('1');
component.onSubmitProgress();
expect(component.clearDataPollers).toHaveBeenCalledTimes(3);
tick(1);
expect(component.clearDataPollers).toHaveBeenCalledTimes(3);
+
+ // with location update
+
+ component.onSubmitProgress(true);
+ tick(1);
+ expect(component.clearDataPollers).toHaveBeenCalledTimes(5);
+ component.onSubmitProgress(true);
+ tick(1);
+ expect(component.clearDataPollers).toHaveBeenCalledTimes(6);
+
component.cleanup();
tick(apiSettings.interval);
}));
- it('should submit the dataset form', fakeAsync(() => {
+ it('should submit the dataset form (url)', fakeAsync(() => {
expect(component.isBusy).toBeFalsy();
component.onSubmitDataset();
expect(component.isBusy).toBeFalsy();
- fillUploadForm();
+ fillUploadForm(false);
component.onSubmitDataset();
tick(1);
expect(component.isBusy).toBeTruthy();
expect(component.trackDatasetId).toBeTruthy();
+
component.cleanup();
tick(apiSettings.interval);
}));
+ it('should get the outer orb config', () => {
+ Object.keys(new Array(5).fill(null)).forEach((i: string) => {
+ expect(component.getNavOrbConfigOuter(parseInt(i))).toBeTruthy();
+ });
+ });
+
+ it('should get the outer orb config', () => {
+ Object.keys(new Array(5).fill(null)).forEach((i: string) => {
+ expect(component.getNavOrbConfigInner(parseInt(i))).toBeTruthy();
+ });
+ expect(component.getNavOrbConfigInner(3)['indicate-polling']).toBeFalsy();
+ component.isPollingProgress = true;
+ expect(component.getNavOrbConfigInner(3)['indicate-polling']).toBeTruthy();
+
+ expect(component.getNavOrbConfigInner(4)['indicate-polling']).toBeFalsy();
+ component.isPollingRecord = true;
+ expect(component.getNavOrbConfigInner(4)['indicate-polling']).toBeTruthy();
+ });
+
+ it('should get if the step is progress or report', () => {
+ component.currentStepIndex = 0;
+ expect(component.getIsRecordTrack(0)).toEqual(false);
+ expect(component.getIsProgressTrack(0)).toEqual(false);
+ expect(component.getIsProgressTrackOrReport(0)).toEqual(false);
+ expect(component.getIsProgressTrackOrReport()).toEqual(false);
+ expect(component.getIsProgressTrackOrReport(3)).toEqual(true);
+ expect(component.getIsProgressTrackOrReport(4)).toEqual(true);
+ component.currentStepIndex = 3;
+ expect(component.getIsProgressTrackOrReport()).toEqual(true);
+ component.currentStepIndex = 4;
+ expect(component.getIsProgressTrackOrReport()).toEqual(true);
+ });
+
it('should get if the step is submittable', () => {
component.setStep(0);
const wizardStep = component.wizardConf[0];
@@ -174,11 +344,12 @@ describe('WizardComponent', () => {
it('should set the step', () => {
const form = component.formUpload;
+
spyOn(form, 'enable');
- expect(component.orbsHidden).toBeTruthy();
+ expect(component.datasetOrbsHidden).toBeTruthy();
expect(component.currentStepIndex).toEqual(3);
component.setStep(0);
- expect(component.orbsHidden).toBeFalsy();
+ expect(component.datasetOrbsHidden).toBeFalsy();
expect(component.currentStepIndex).toEqual(0);
expect(form.enable).not.toHaveBeenCalled();
component.setStep(0, true);
@@ -186,6 +357,10 @@ describe('WizardComponent', () => {
form.disable();
component.setStep(0, true);
expect(form.enable).toHaveBeenCalled();
+
+ spyOn(component, 'updateLocation');
+ component.setStep(4);
+ expect(component.updateLocation).toHaveBeenCalled();
});
it('should calculate if it can go to the previous step', () => {
@@ -224,6 +399,35 @@ describe('WizardComponent', () => {
});
});
+ it('should validate the record id', () => {
+ const recordId = component.formRecord.get(formNameRecordId) as FormControl;
+ const datasetId = component.formProgress.get(formNameDatasetId) as FormControl;
+
+ ['0', '1'].forEach((val: string) => {
+ recordId.setValue(val);
+ expect(component.validateRecordId(recordId)).toBeTruthy();
+ });
+
+ datasetId.setValue('1 1'); // invalid related
+
+ ['0', '1'].forEach((val: string) => {
+ recordId.setValue(val);
+ expect(component.validateRecordId(recordId)).toBeTruthy();
+ });
+
+ datasetId.setValue('1'); // valid related
+
+ ['0', '1'].forEach((val: string) => {
+ recordId.setValue(val);
+ expect(component.validateRecordId(recordId)).toBeFalsy();
+ });
+
+ recordId.setValue('1 1'); // invalid
+ expect(component.validateRecordId(recordId)).toBeTruthy();
+
+ expect(component.validateRecordId(({} as unknown) as FormControl)).toBeFalsy();
+ });
+
it('should validate the dataset name', () => {
const frmCtrl = (val: string): FormControl => {
return ({ value: val } as unknown) as FormControl;
@@ -245,12 +449,14 @@ describe('WizardComponent', () => {
beforeEach(b4Each);
it('should handle progress form errors', fakeAsync(() => {
+ component.progressData = mockDataset;
expect(component.error).toBeFalsy();
- (component.formProgress.get('idToTrack') as FormControl).setValue('1');
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('1');
component.onSubmitProgress();
tick(1);
expect(component.error).toBeTruthy();
- expect(component.formProgress.value.idToTrack).toBeTruthy();
+ expect(component.progressData).toBeFalsy();
+ expect(component.formProgress.value.datasetToTrack).toBeTruthy();
component.cleanup();
tick(apiSettings.interval);
}));
@@ -258,6 +464,7 @@ describe('WizardComponent', () => {
it('should handle upload form errors', fakeAsync(() => {
expect(component.error).toBeFalsy();
fillUploadForm();
+ expect(component.error).toBeFalsy();
component.onSubmitDataset();
tick(1);
expect(component.error).toBeTruthy();
@@ -272,6 +479,7 @@ describe('WizardComponent', () => {
fillUploadForm();
component.onSubmitDataset();
tick(1);
+
expect(component.isBusy).toBeTruthy();
expect(component.error).toBeFalsy();
tick(component.resetBusyDelay);
@@ -279,5 +487,36 @@ describe('WizardComponent', () => {
component.cleanup();
tick(apiSettings.interval);
}));
+
+ it('should handle upload form errors (harvest url)', fakeAsync(() => {
+ spyOn(sandbox, 'submitDataset').and.callFake(() => {
+ return of({});
+ });
+ fillUploadForm(true);
+ component.onSubmitDataset();
+ tick(1);
+
+ expect(component.isBusy).toBeTruthy();
+ expect(component.error).toBeFalsy();
+ tick(component.resetBusyDelay);
+ expect(component.isBusy).toBeFalsy();
+ component.cleanup();
+ tick(apiSettings.interval);
+ }));
+
+ it('should handle record form errors', fakeAsync(() => {
+ component.recordReport = mockRecordReport;
+ expect(component.error).toBeFalsy();
+ component.onSubmitRecord();
+ expect(component.error).toBeFalsy();
+ (component.formProgress.get(formNameDatasetId) as FormControl).setValue('1');
+ (component.formRecord.get(formNameRecordId) as FormControl).setValue('2');
+ component.onSubmitRecord();
+ tick(1);
+ expect(component.error).toBeTruthy();
+ expect(component.recordReport).toBeFalsy();
+ component.cleanup();
+ tick(apiSettings.interval);
+ }));
});
});
diff --git a/projects/sandbox/src/app/wizard/wizard.component.ts b/projects/sandbox/src/app/wizard/wizard.component.ts
index 2ef7c7695..80c9eec74 100644
--- a/projects/sandbox/src/app/wizard/wizard.component.ts
+++ b/projects/sandbox/src/app/wizard/wizard.component.ts
@@ -1,16 +1,28 @@
-import { Component } from '@angular/core';
-import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { Location, PopStateEvent } from '@angular/common';
+import { FormBuilder, FormControl, FormGroup, ValidationErrors, Validators } from '@angular/forms';
+import { ActivatedRoute } from '@angular/router';
import { HttpErrorResponse } from '@angular/common/http';
-import { merge, Observable, timer } from 'rxjs';
+import { combineLatest, merge, Observable, timer } from 'rxjs';
+import { map } from 'rxjs/operators';
// sonar-disable-next-statement (sonar doesn't read tsconfig paths entry)
-import { DataPollingComponent, ProtocolType } from 'shared';
+import {
+ DataPollingComponent,
+ FileUploadComponent,
+ ProtocolFieldSetComponent,
+ ProtocolType
+} from 'shared';
+
import { apiSettings } from '../../environments/apisettings';
import {
+ ClassMap,
Dataset,
DatasetStatus,
FieldOption,
FixedLengthArray,
+ RecordReport,
SubmissionResponseData,
+ SubmissionResponseDataWrapped,
WizardStep,
WizardStepType
} from '../_models';
@@ -21,23 +33,35 @@ import { SandboxService } from '../_services';
templateUrl: './wizard.component.html',
styleUrls: ['./wizard.component.scss']
})
-export class WizardComponent extends DataPollingComponent {
+export class WizardComponent extends DataPollingComponent implements OnInit {
+ @ViewChild(ProtocolFieldSetComponent, { static: true })
+ protocolFields: ProtocolFieldSetComponent;
+ @ViewChild(FileUploadComponent, { static: true }) xslFileField: FileUploadComponent;
+
error: HttpErrorResponse | undefined;
- fileFormName = 'dataset';
+ zipFileFormName = 'dataset';
+ xsltFileFormName = 'xsltFile';
formProgress: FormGroup;
+ formRecord: FormGroup;
formUpload: FormGroup;
resetBusyDelay = 1000;
isBusy = false;
isBusyProgress = false;
- isPolling = false;
- orbsHidden = true;
+ isBusyProgressLinks = false;
+ isBusyReport = false;
+ isPollingProgress = false;
+ isPollingRecord = false;
+ datasetOrbsHidden = true;
+ progressOrbHidden = false;
EnumProtocolType = ProtocolType;
EnumWizardStepType = WizardStepType;
- progressData: Dataset;
- trackDatasetId: string;
+ progressData?: Dataset;
+ recordReport?: RecordReport;
+ trackDatasetId?: string;
+ trackRecordId?: string;
countryList: Array;
languageList: Array;
- wizardConf: FixedLengthArray = [
+ wizardConf: FixedLengthArray = [
{
stepType: WizardStepType.SET_NAME,
fields: ['name']
@@ -48,16 +72,39 @@ export class WizardComponent extends DataPollingComponent {
},
{
stepType: WizardStepType.PROTOCOL_SELECT,
- fields: ['uploadProtocol', 'dataset']
+ fields: [
+ 'uploadProtocol',
+ 'dataset',
+ 'url',
+ 'sendXSLT',
+ this.xsltFileFormName,
+ 'harvestUrl',
+ 'setSpec',
+ 'metadataFormat'
+ ]
},
{
stepType: WizardStepType.PROGRESS_TRACK,
- fields: ['idToTrack']
+ fields: ['datasetToTrack']
+ },
+ {
+ stepType: WizardStepType.REPORT,
+ fields: ['recordToTrack']
}
];
- currentStepIndex = this.wizardConf.length - 1;
- constructor(private readonly fb: FormBuilder, private readonly sandbox: SandboxService) {
+ stepIndexProgress = this.wizardConf.findIndex((step) => {
+ return step.stepType === WizardStepType.PROGRESS_TRACK;
+ });
+
+ currentStepIndex = this.stepIndexProgress;
+
+ constructor(
+ private readonly fb: FormBuilder,
+ private readonly sandbox: SandboxService,
+ private readonly route: ActivatedRoute,
+ private readonly location: Location
+ ) {
super();
this.subs.push(
this.sandbox.getCountries().subscribe((countries: Array) => {
@@ -72,13 +119,132 @@ export class WizardComponent extends DataPollingComponent {
this.buildForms();
}
+ /**
+ * getNavOrbConfigOuter
+ *
+ * configure the status orbs
+ *
+ * @param { number } i - the orb index
+ * @returns ngClass-compatible Map
+ **/
+ getNavOrbConfigOuter(i: number): ClassMap {
+ return {
+ 'progress-orb-container': this.getIsProgressTrack(i),
+ 'report-orb-container': this.getIsRecordTrack(i),
+ hidden:
+ (this.getIsRecordTrack(i) && !this.trackRecordId) ||
+ (this.getIsProgressTrack(i) && this.progressOrbHidden)
+ };
+ }
+
+ /**
+ * getNavOrbConfigInner
+ *
+ * configure the status orbs
+ *
+ * @param { number } i - the orb index
+ * @returns ngClass-compatible Map
+ **/
+ getNavOrbConfigInner(i: number): ClassMap {
+ const stepConf = this.wizardConf[i];
+ const isProgressTrack = this.getIsProgressTrack(i);
+ const isRecordTrack = this.getIsRecordTrack(i);
+ const isLoading =
+ (isProgressTrack && this.isBusyProgress) ||
+ (isRecordTrack && this.isBusyReport) ||
+ this.isBusy;
+ return {
+ 'is-set': this.stepIsComplete(i),
+ 'is-active': this.currentStepIndex === i,
+ 'orb-square': this.getStepIsSubmittable(stepConf),
+ 'progress-orb': isProgressTrack,
+ 'report-orb': isRecordTrack,
+ 'indicator-orb': this.getStepIsIndicator(i),
+ 'submitted-orb': this.getStepIsSubmitted(stepConf),
+ spinner: isLoading,
+ 'indicate-complete':
+ (!isRecordTrack && this.progressComplete()) || (isRecordTrack && !!this.recordReport),
+ 'indicate-polling':
+ (this.isPollingProgress && isProgressTrack) || (this.isPollingRecord && isRecordTrack)
+ };
+ }
+
+ /**
+ * ngOnInit
+ * handle route parameters
+ **/
+ ngOnInit(): void {
+ this.subs.push(
+ combineLatest([this.route.params, this.route.queryParams])
+ .pipe(
+ map((results) => {
+ return {
+ params: results[0],
+ queryParams: results[1]
+ };
+ })
+ )
+ .subscribe((combined) => {
+ const params = combined.params;
+ const queryParams = combined.queryParams;
+
+ const preloadDatasetId = params.id;
+ const preloadRecordId = queryParams.recordId;
+
+ if (preloadDatasetId && preloadRecordId) {
+ this.trackDatasetId = preloadDatasetId;
+ this.trackRecordId = decodeURIComponent(preloadRecordId);
+ this.progressOrbHidden = true;
+ this.fillAndSubmitRecordForm();
+ } else if (preloadDatasetId) {
+ this.trackDatasetId = preloadDatasetId;
+ this.fillAndSubmitProgressForm();
+ }
+ })
+ );
+
+ // capture "back" and "forward" events / sync with form data
+ this.location.subscribe((state: PopStateEvent) => {
+ const url = `${state.url}`;
+ const ids = url.split('/').filter((s: string) => {
+ return s.length > 0;
+ });
+
+ if (ids.length === 0) {
+ // clear the data, form data, pollers / set step to progress
+ this.progressData = undefined;
+ this.trackDatasetId = '';
+ this.trackRecordId = '';
+ this.buildForms();
+ this.clearDataPollers();
+ this.setStep(this.stepIndexProgress, true);
+ } else {
+ this.trackDatasetId = ids[0];
+
+ const queryParamRegex = /\S+\?recordId=(\S+)/;
+ const queryParamMatch: RegExpMatchArray | null = url.match(queryParamRegex);
+
+ if (queryParamMatch) {
+ this.trackRecordId = decodeURIComponent(queryParamMatch[1]);
+ this.fillAndSubmitRecordForm(false);
+ } else {
+ this.fillAndSubmitProgressForm(false);
+ }
+ }
+ });
+ }
+
/**
* buildForms
* builds the two forms
**/
buildForms(): void {
this.formProgress = this.fb.group({
- idToTrack: ['', [Validators.required, this.validateDatasetId]]
+ datasetToTrack: ['', [Validators.required, this.validateDatasetId.bind(this)]]
+ });
+
+ this.formRecord = this.fb.group({
+ recordToTrack: ['', [Validators.required, this.validateRecordId.bind(this)]]
});
this.formUpload = this.fb.group({
@@ -86,8 +252,14 @@ export class WizardComponent extends DataPollingComponent {
country: ['', [Validators.required]],
language: ['', [Validators.required]],
uploadProtocol: [ProtocolType.ZIP_UPLOAD, [Validators.required]],
- dataset: ['', [Validators.required]]
+ url: ['', [Validators.required]],
+ dataset: ['', [Validators.required]],
+ harvestUrl: ['', [Validators.required]],
+ setSpec: [''],
+ metadataFormat: [''],
+ sendXSLT: ['']
});
+ this.formUpload.addControl(this.xsltFileFormName, new FormControl(''));
this.subs.push(
merge(this.formProgress.valueChanges, this.formUpload.valueChanges).subscribe(() => {
@@ -99,16 +271,51 @@ export class WizardComponent extends DataPollingComponent {
/**
* validateDatasetId
*
- * form validator implementation for dataset id field
+ * form validator implementation for dataset id field (non-decimal numeric)
*
* @param { FormControl } control - the control to validate
- * @returns null or a code-keyed boolean
+ * @returns ValidationErrors object or null
**/
- validateDatasetId(control: FormControl): { [key: string]: boolean } | null {
+ validateDatasetId(control: FormControl): ValidationErrors | null {
const val = control.value;
+ const enableRecordForm = (enable: boolean): void => {
+ if (this.formRecord) {
+ if (enable) {
+ this.formRecord.enable();
+ } else {
+ this.formRecord.disable();
+ }
+ }
+ };
+
if (val) {
const matches = `${val}`.match(/[0-9]+/);
if (!matches || matches[0] !== val) {
+ enableRecordForm(false);
+ return { invalid: true };
+ } else {
+ enableRecordForm(true);
+ }
+ } else {
+ enableRecordForm(false);
+ }
+ return null;
+ }
+
+ /** validateRecordId
+ * form validator implementation for record id field (no whitespace)
+ *
+ * @param {FormControl} control - the input control to validate
+ * @returns ValidationErrors object or null
+ */
+ validateRecordId(control: FormControl): ValidationErrors | null {
+ const val = control.value;
+ if (val) {
+ if (!val.match(/^\S+$/)) {
+ return { invalid: true };
+ }
+ const datasetIdCtrl = this.formProgress.get('datasetToTrack') as FormControl;
+ if (!(datasetIdCtrl.value && datasetIdCtrl.valid)) {
return { invalid: true };
}
}
@@ -123,7 +330,7 @@ export class WizardComponent extends DataPollingComponent {
* @param { FormControl } control - the control to validate
* @returns null or a code-keyed boolean
**/
- validateDatasetName(control: FormControl): { [key: string]: boolean } | null {
+ validateDatasetName(control: FormControl): ValidationErrors | null {
const val = control.value;
if (val) {
const matches = `${val}`.match(/[a-zA-Z0-9_]+/);
@@ -134,6 +341,28 @@ export class WizardComponent extends DataPollingComponent {
return null;
}
+ /**
+ * updateConditionalXSLValidator
+ * Removes or adds the required validator in formUpload for the 'xsltFile' depending on the value of 'sendXSLT'
+ **/
+ updateConditionalXSLValidator(): void {
+ const fn = (): void => {
+ const ctrlFile = this.formUpload.get(this.xsltFileFormName);
+ const ctrl = this.formUpload.get('sendXSLT');
+
+ if (ctrl && ctrlFile) {
+ if (ctrl.value) {
+ ctrlFile.setValidators([Validators.required]);
+ } else {
+ ctrlFile.setValidators(null);
+ }
+ ctrlFile.updateValueAndValidity({ onlySelf: false, emitEvent: false });
+ }
+ };
+ this.subs.push(this.formUpload.valueChanges.subscribe(fn));
+ fn();
+ }
+
/**
* getFormGroup
* Returns the correct form for the given WizardStep
@@ -142,9 +371,13 @@ export class WizardComponent extends DataPollingComponent {
* @returns FormGroup
**/
getFormGroup(stepConf: WizardStep): FormGroup {
- return stepConf.stepType === WizardStepType.PROGRESS_TRACK
- ? this.formProgress
- : this.formUpload;
+ if (stepConf.stepType === WizardStepType.PROGRESS_TRACK) {
+ return this.formProgress;
+ } else if (stepConf.stepType === WizardStepType.REPORT) {
+ return this.formRecord;
+ } else {
+ return this.formUpload;
+ }
}
/**
@@ -157,6 +390,48 @@ export class WizardComponent extends DataPollingComponent {
return this.getFormGroup(step).valid;
}
+ /**
+ * getStepIsSubmitted
+ *
+ * Template utility for setting 'submitted-orb' class on the step orbs
+ * @param { number } stepIndex - the WizardStep index
+ *
+ * @returns boolean
+ **/
+ getStepIsSubmitted(step: WizardStep): boolean {
+ if (
+ [
+ WizardStepType.SET_NAME,
+ WizardStepType.SET_LANG_LOCATION,
+ WizardStepType.PROTOCOL_SELECT
+ ].includes(step.stepType) &&
+ this.formUpload.disabled
+ ) {
+ return true;
+ } else if (step.stepType === WizardStepType.REPORT) {
+ return !!this.trackRecordId;
+ }
+ return !!this.trackDatasetId;
+ }
+
+ /**
+ * getStepIsIndicator
+ *
+ * Template utility for setting 'indicator-orb' class on the step orbs
+ * @param { number } stepIndex - the WizardStep index
+ *
+ * @returns boolean
+ **/
+ getStepIsIndicator(stepIndex: number): boolean {
+ if (this.getIsProgressTrack(stepIndex)) {
+ return true;
+ }
+ if (this.wizardConf[stepIndex].stepType === WizardStepType.REPORT) {
+ return !!this.trackRecordId;
+ }
+ return this.formUpload.disabled;
+ }
+
/**
* getIsProgressTrack
* Returns if the WizardStep at the given conf index's stepType is PROGRESS_TRACK
@@ -168,9 +443,31 @@ export class WizardComponent extends DataPollingComponent {
return this.wizardConf[stepIndex].stepType === WizardStepType.PROGRESS_TRACK;
}
+ /**
+ * getIsRecordTrack
+ * Returns if the WizardStep at the given conf index's stepType is REPORT
+ *
+ * @param { number } stepIndex - the config index to evaluate
+ * @returns boolean
+ **/
+ getIsRecordTrack(stepIndex: number): boolean {
+ return this.wizardConf[stepIndex].stepType === WizardStepType.REPORT;
+ }
+
+ /**
+ * getIsProgressTrackOrReport
+ * Returns true if the WizardStep at currentStepIndex is PROGRESS_TRACK in REPORT
+ *
+ * @returns boolean
+ **/
+ getIsProgressTrackOrReport(stepIndex?: number): boolean {
+ const index = stepIndex ? stepIndex : this.currentStepIndex;
+ return this.getIsRecordTrack(index) || this.getIsProgressTrack(index);
+ }
+
/**
* setStep
- * Sets the currentStepIndex and sets orbsHidden to false.
+ * Sets the currentStepIndex and sets datasetOrbsHidden to false.
* Optionally resets the form
*
* @param { number } stepIndex - the value to set
@@ -181,10 +478,23 @@ export class WizardComponent extends DataPollingComponent {
const form = this.getFormGroup(this.wizardConf[stepIndex]);
if (form.disabled) {
form.enable();
+ this.protocolFields.clearFileValue();
+ this.xslFileField.clearFileValue();
this.buildForms();
}
}
- this.orbsHidden = false;
+
+ if (stepIndex < this.stepIndexProgress) {
+ this.datasetOrbsHidden = false;
+ this.updateLocation(false, false);
+ } else if (stepIndex + 1 < this.wizardConf.length) {
+ // initial enabling of progress tracker
+ this.progressOrbHidden = false;
+ this.updateLocation(true, false);
+ } else {
+ // record report
+ this.updateLocation(true, true);
+ }
this.currentStepIndex = stepIndex;
}
@@ -195,10 +505,10 @@ export class WizardComponent extends DataPollingComponent {
* @returns boolean
**/
canGoToPrevious(): boolean {
- if ([1, 2].includes(this.currentStepIndex)) {
+ if (this.currentStepIndex > 0 && this.currentStepIndex < this.stepIndexProgress) {
return true;
}
- return this.currentStepIndex === 3 && this.formUpload.disabled;
+ return this.currentStepIndex === this.stepIndexProgress && this.formUpload.disabled;
}
/**
@@ -208,10 +518,10 @@ export class WizardComponent extends DataPollingComponent {
* @returns boolean
**/
canGoToNext(): boolean {
- if (this.currentStepIndex === 2) {
+ if (this.currentStepIndex === this.stepIndexProgress - 1) {
return this.formUpload.disabled;
} else {
- return this.currentStepIndex < this.wizardConf.length - 1;
+ return this.currentStepIndex < this.stepIndexProgress;
}
}
@@ -224,7 +534,9 @@ export class WizardComponent extends DataPollingComponent {
const sub = timer(this.resetBusyDelay).subscribe(() => {
this.isBusy = false;
this.isBusyProgress = false;
- this.isPolling = false;
+ this.isBusyReport = false;
+ this.isPollingProgress = false;
+ this.isPollingRecord = false;
sub.unsubscribe();
});
}
@@ -235,7 +547,30 @@ export class WizardComponent extends DataPollingComponent {
*
**/
progressComplete(): boolean {
- return this.progressData && this.progressData.status === DatasetStatus.COMPLETED;
+ return !!this.progressData && this.progressData.status === DatasetStatus.COMPLETED;
+ }
+
+ /**
+ * getConnectClasses
+ *
+ * @param { string } other - additional class to include with non-empty result
+ **/
+ getConnectClasses(other: string): ClassMap {
+ if (!(this.formProgress.valid && this.formRecord.valid)) {
+ return {};
+ }
+ const valD = this.formProgress.value.datasetToTrack;
+ const valR = this.formRecord.value.recordToTrack;
+ const match = valR.match(/\/(\d+)\/\S/);
+ const connect = valD.length && valR.length && match;
+ const res: ClassMap = {
+ connect: connect,
+ error: connect && match[1] !== valD
+ };
+ if (connect) {
+ res[other] = true;
+ }
+ return res;
}
/**
@@ -243,31 +578,62 @@ export class WizardComponent extends DataPollingComponent {
* Submits the formProgress data if valid
*
**/
- onSubmitProgress(): void {
+ onSubmitProgress(updateLocation = false): void {
const form = this.formProgress;
if (form.valid) {
- const ctrl = this.formProgress.get('idToTrack') as FormControl;
- const idToTrack = ctrl.value;
+ const ctrl = this.formProgress.get('datasetToTrack') as FormControl;
+ const datasetToTrack = ctrl.value;
+
+ this.trackDatasetId = datasetToTrack;
+
+ if (updateLocation) {
+ const newPath = `/${datasetToTrack}`;
+ const splitPath = this.location.path().split('?');
+ if (splitPath.length > 1 || splitPath[0] !== newPath) {
+ this.setStep(this.stepIndexProgress);
+ }
+ }
this.isBusyProgress = true;
+ this.isBusyProgressLinks = true;
+ this.isPollingProgress = true;
+
this.clearDataPollers();
this.createNewDataPoller(
apiSettings.interval,
(): Observable => {
- this.isPolling = true;
- return this.sandbox.requestProgress(idToTrack);
+ return this.sandbox.requestProgress(datasetToTrack).pipe(
+ // temporary removal of back-end info
+ map((dataset: Dataset) => {
+ const nullString =
+ 'A review URL will be generated when the dataset has finished processing';
+ if (dataset['portal-preview'] === nullString) {
+ delete dataset['portal-preview'];
+ }
+ if (dataset['portal-publish'] === nullString) {
+ delete dataset['portal-publish'];
+ }
+ return dataset;
+ })
+ );
},
(progressInfo: Dataset) => {
this.progressData = progressInfo;
- this.trackDatasetId = idToTrack;
+
if (this.progressComplete()) {
- this.clearDataPollers();
+ this.resetBusy();
+
+ if (this.progressData['portal-preview'] && this.progressData['portal-publish']) {
+ this.isBusyProgressLinks = false;
+ this.clearDataPollers();
+ }
}
- this.resetBusy();
+ this.error = undefined;
},
(err: HttpErrorResponse) => {
+ this.progressData = undefined;
this.error = err;
this.resetBusy();
return err;
@@ -276,6 +642,93 @@ export class WizardComponent extends DataPollingComponent {
}
}
+ /**
+ * onSubmitRecord
+ * Submits the formRecord data if valid, optionally calls updateLocation
+ *
+ * @param { boolean } updateLocation - flag if updateLocation function should be called
+ **/
+ onSubmitRecord(updateLocation = false): void {
+ const form = this.formRecord;
+
+ if (form.valid) {
+ this.trackRecordId = encodeURIComponent(this.formRecord.value.recordToTrack);
+ this.trackDatasetId = this.formProgress.value.datasetToTrack;
+ this.isBusyReport = true;
+ this.isPollingRecord = true;
+
+ this.subs.push(
+ this.sandbox.getRecordReport(`${this.trackDatasetId}`, `${this.trackRecordId}`).subscribe(
+ (report: RecordReport) => {
+ this.recordReport = report;
+ this.resetBusy();
+ this.error = undefined;
+ },
+ (err: HttpErrorResponse): void => {
+ this.recordReport = undefined;
+ this.error = err;
+ this.resetBusy();
+ }
+ )
+ );
+ if (updateLocation) {
+ this.setStep(this.wizardConf.length - 1);
+ }
+ }
+ }
+
+ /**
+ * updateLocation
+ * update page url (without invoking router)
+ *
+ * @param { true } progress - include the dataset id
+ * @param { true } record - include the record id
+ * @returns boolean
+ **/
+ updateLocation(progress = true, record = true): void {
+ let newPath = '';
+ if (progress) {
+ newPath += `/${this.trackDatasetId}`;
+ if (record) {
+ newPath += `?recordId=${this.trackRecordId}`;
+ }
+ }
+
+ // avoid pushing duplicate states to history
+ if (this.location.path() !== newPath) {
+ this.location.go(newPath);
+ }
+ }
+
+ /**
+ * fillAndSubmitProgressForm
+ * sets the datasetToTrack value in the progress form
+ * submits the progress form (flags to update window location)
+ * sets currentStepIndex to track the progress
+ *
+ * @param { true } updateLocation - flag onSubmitProgress to update url location
+ **/
+ fillAndSubmitProgressForm(updateLocation = true): void {
+ (this.formProgress.get('datasetToTrack') as FormControl).setValue(this.trackDatasetId);
+ this.onSubmitProgress(updateLocation);
+ this.currentStepIndex = this.stepIndexProgress;
+ this.progressOrbHidden = false;
+ }
+
+ /**
+ * fillAndSubmitRecordForm
+ * sets the recordToTrack value in the record form
+ * submits the record form
+ * sets currentStepIndex to the report
+ * @param { true } updateLocation - flag onSubmitRecord to update url location
+ **/
+ fillAndSubmitRecordForm(updateLocation = true): void {
+ (this.formProgress.get('datasetToTrack') as FormControl).setValue(this.trackDatasetId);
+ (this.formRecord.get('recordToTrack') as FormControl).setValue(this.trackRecordId);
+ this.onSubmitRecord(updateLocation);
+ this.currentStepIndex = this.wizardConf.length - 1;
+ }
+
/**
* onSubmitDataset
* Submits the formUpload data if valid
@@ -287,29 +740,26 @@ export class WizardComponent extends DataPollingComponent {
form.disable();
this.isBusy = true;
this.subs.push(
- this.sandbox
- .submitDataset(
- form.value.name,
- form.value.country,
- form.value.language,
- this.fileFormName,
- (form.get(this.fileFormName) as FormControl).value
- )
- .subscribe(
- (res: SubmissionResponseData) => {
- this.resetBusy();
- if (res.body) {
- this.trackDatasetId = res.body['dataset-id'];
- (this.formProgress.get('idToTrack') as FormControl).setValue(this.trackDatasetId);
- this.onSubmitProgress();
- this.currentStepIndex = this.wizardConf.length - 1;
- }
- },
- (err: HttpErrorResponse): void => {
- this.error = err;
- this.resetBusy();
+ this.sandbox.submitDataset(form, [this.zipFileFormName, this.xsltFileFormName]).subscribe(
+ (res: SubmissionResponseData | SubmissionResponseDataWrapped) => {
+ this.resetBusy();
+
+ // treat as SubmissionResponseDataWrapped
+ res = (res as unknown) as SubmissionResponseDataWrapped;
+
+ if (res.body) {
+ this.trackDatasetId = res.body['dataset-id'];
+ this.fillAndSubmitProgressForm();
+ } else if (form.value.url || form.value.harvestUrl) {
+ this.trackDatasetId = ((res as unknown) as SubmissionResponseData)['dataset-id'];
+ this.fillAndSubmitProgressForm();
}
- )
+ },
+ (err: HttpErrorResponse): void => {
+ this.error = err;
+ this.resetBusy();
+ }
+ )
);
}
}
diff --git a/projects/sandbox/src/assets/sass/connections.scss b/projects/sandbox/src/assets/sass/connections.scss
new file mode 100644
index 000000000..4ae81c19a
--- /dev/null
+++ b/projects/sandbox/src/assets/sass/connections.scss
@@ -0,0 +1,38 @@
+@import 'shared-styles/assets/sass/scss/generic/variables';
+
+$width: 12px;
+
+.connect {
+ position: relative;
+ &::after {
+ border-left: 1px solid $eu-jade-dark;
+ content: '';
+ display: block;
+ height: 44px;
+ left: -$width;
+ position: absolute;
+ width: $width;
+ }
+ &.bottom::after {
+ border-bottom: 1px solid $eu-jade-dark;
+ bottom: 16px;
+ }
+ &.top::after {
+ border-top: 1px solid $eu-jade-dark;
+ top: 16px;
+ }
+ &.error {
+ input {
+ border: 1px solid red;
+ }
+ &::after {
+ border-left: 1px solid red;
+ }
+ &.bottom::after {
+ border-bottom: 1px solid red;
+ }
+ &.top::after {
+ border-top: 1px solid red;
+ }
+ }
+}
diff --git a/projects/sandbox/src/assets/sass/links.scss b/projects/sandbox/src/assets/sass/links.scss
new file mode 100644
index 000000000..8541c61c3
--- /dev/null
+++ b/projects/sandbox/src/assets/sass/links.scss
@@ -0,0 +1,88 @@
+@import 'shared-styles/assets/sass/scss/generic/variables';
+@import 'shared-styles/assets/sass/scss/iconography/svg-icons-metis';
+
+.copy {
+ display: none;
+ font-size: 8px;
+ font-weight: bold;
+ height: 100%;
+ padding-right: 4px;
+ position: absolute;
+ right: 100%;
+ top: 0.8em;
+ white-space: nowrap;
+
+ &:hover {
+ color: $eu-jade-darkest;
+ display: inline;
+ }
+
+ .msg-copied {
+ display: none;
+ }
+
+ &.copied {
+ .msg-copied {
+ display: inline;
+ }
+ .msg-copy {
+ display: none;
+ }
+ }
+}
+
+.copy,
+.external-link {
+ word-break: break-all;
+}
+
+.copyable-link-item {
+ align-items: center;
+ display: flex;
+ position: relative;
+}
+
+.external-link {
+ position: relative;
+ &::after {
+ background-repeat: no-repeat;
+ content: '';
+ display: block;
+ height: 1em;
+ top: 0.425em;
+ position: absolute;
+ width: 1em;
+ }
+}
+
+.external-link {
+ display: inline-block;
+ transition: 0.5s ease-in-out color;
+ &::after {
+ background-image: svg-url-icon-external('#{$eu-jade-classic}');
+ right: -1.35em;
+ }
+
+ &:hover {
+ &::after {
+ background-image: svg-url-icon-external('#{$eu-jade-darkest}');
+ }
+ & + .copy {
+ display: inline;
+ }
+ }
+
+ &.pending {
+ color: $eu-jade-disabled;
+ cursor: default;
+ &::after,
+ &:hover::after {
+ background-image: svg-url-icon-spin('#{$eu-jade-classic}');
+ background-size: 0.85em;
+ right: -1.2em;
+ }
+ &:hover {
+ color: $eu-jade-disabled;
+ }
+ }
+}
diff --git a/projects/sandbox/src/assets/sass/orbs.scss b/projects/sandbox/src/assets/sass/orbs.scss
new file mode 100644
index 000000000..47914a072
--- /dev/null
+++ b/projects/sandbox/src/assets/sass/orbs.scss
@@ -0,0 +1,439 @@
+@import 'shared-styles/assets/sass/scss/generic/variables';
+@import 'shared-styles/assets/sass/scss/iconography/svg-icons-metis';
+
+$orb-border-radius: 1.5em;
+
+.nav-orb {
+ background-color: $eu-jade-light;
+ border-color: $eu-jade-dark;
+ border-radius: $orb-border-radius;
+ border-style: solid;
+ border-width: 1px;
+
+ color: $white;
+ display: inline-block;
+ height: 3em;
+ margin: 0;
+ min-width: 3em;
+ position: relative;
+ text-align: left;
+ transition: 0.3s ease-in border-radius;
+ width: 3em;
+
+ &::after {
+ font-size: 1.25em;
+ }
+ &.next {
+ margin-left: 0.25em;
+ }
+
+ &::after {
+ content: attr(data-label);
+ }
+
+ &.indicate-tier::before {
+ content: attr(data-indicator);
+ background-color: $eu-jade-light;
+ line-height: 16px;
+ text-align: center;
+ font-size: 16px;
+ padding: 1px;
+ }
+
+ &.labelled {
+ &:after {
+ font-weight: bold;
+ position: absolute;
+ text-align: center;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 100%;
+ }
+ }
+
+ &.orb-square {
+ border-radius: 0;
+ }
+
+ &.spinner::after {
+ content: '';
+ }
+
+ &.indicator-orb::before {
+ border: 1px solid $eu-jade-dark;
+ border-radius: 1em;
+ position: absolute;
+ left: 50%;
+ top: 100%;
+ transform: translate(-50%, -25%);
+ width: 1em;
+ height: 1em;
+ }
+
+ &.progress-orb::before,
+ &.report-orb::before,
+ &.submitted-orb::before {
+ background: svg-url-icon-tick('#{$white}') center 75% / 75% no-repeat $eu-jade-light;
+ }
+
+ &.is-set {
+ background-color: $eu-light-orange;
+ border-color: $white;
+ &:hover {
+ border-color: $eu-light-orange;
+ }
+ &.indicator-orb::before {
+ border-color: $white;
+ background-color: $eu-light-orange;
+ }
+ &.progress-orb::before {
+ background-image: svg-url-icon-tick('#{$white}');
+ }
+ &.indicator-orb:hover::before {
+ border-color: $eu-light-orange;
+ background-color: $white;
+ }
+ &.progress-orb:hover::before {
+ background-image: svg-url-icon-tick('#000');
+ }
+ &:active {
+ color: $eu-light-orange;
+ }
+ &.indicator-orb:active::before {
+ background-color: $white;
+ }
+ &.progress-orb:active::before {
+ background-image: svg-url-icon-tick('#{$eu-light-orange}');
+ }
+ }
+
+ &:hover {
+ background-color: $white;
+ box-shadow: rgba(25, 115, 36, 0.35) 0px 5px 15px;
+ &.indicator-orb::before {
+ background-color: $white;
+ }
+ &.progress-orb::before,
+ &.submitted-orb::before {
+ background-image: svg-url-icon-tick('#000');
+ }
+ }
+
+ &:active {
+ background-color: $white;
+ border-color: $eu-light-orange;
+ color: $eu-light-orange;
+
+ &.indicator-orb::before {
+ border-color: $eu-light-orange;
+ }
+ &.progress-orb::before,
+ &.submitted-orb::before {
+ background-image: svg-url-icon-tick('#{$eu-light-orange}');
+ }
+ }
+
+ &.is-active {
+ border-width: 2px;
+ border-color: $eu-yellow;
+ pointer-events: none;
+
+ &.indicator-orb::before {
+ border-color: $eu-yellow;
+ border-width: 2px;
+ }
+ }
+
+ &.spinner,
+ &.indicate-polling {
+ &.indicator-orb::before {
+ background-position: center;
+ background-repeat: no-repeat;
+ }
+ &.progress-orb::before,
+ &.submitted-orb::before {
+ background-image: svg-url-icon-spin('#{$white}');
+ }
+
+ &.progress-orb:hover::before,
+ &.submitted-orb:hover::before {
+ background-image: svg-url-icon-spin('#000');
+ }
+
+ &.progress-orb:active::before,
+ &.submitted-orb:active::before {
+ background-image: svg-url-icon-spin('#{$eu-light-orange}');
+ }
+ }
+
+ &:not(.spinner) {
+ &.progress-orb::after {
+ background: svg-url-icon-dataset('#{$white}') center / 1.75rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.progress-orb:hover::after {
+ background-image: svg-url-icon-dataset('#000');
+ }
+
+ &.progress-orb:active::after {
+ background-image: svg-url-icon-dataset('#{$eu-light-orange}');
+ }
+
+ &.report-orb::after {
+ background: svg-url-icon-record-report('#{$white}') center / 1.5rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.report-orb:hover::after {
+ background-image: svg-url-icon-record-report('#000');
+ }
+
+ &.report-orb:active::after {
+ background-image: svg-url-icon-record-report('#{$eu-light-orange}');
+ }
+
+ &.content-tier-orb::after {
+ background: svg-url-icon-content-tier('#{$white}') center / 1.85rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.content-tier-orb:hover::after {
+ background-image: svg-url-icon-content-tier('#000');
+ }
+
+ &.content-tier-orb:active::after {
+ background-image: svg-url-icon-content-tier('#{$eu-light-orange}');
+ }
+
+ &.metadata-tier-orb::after {
+ background: svg-url-icon-metadata('#{$white}') center / 2.05rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.metadata-tier-orb:hover::after {
+ background-image: svg-url-icon-metadata('#000');
+ }
+
+ &.metadata-tier-orb:active::after {
+ background-image: svg-url-icon-metadata('#{$eu-light-orange}');
+ }
+
+ // 3D
+
+ &.orb-media-3d::after {
+ background: svg-url-icon-media-3d('#{$white}') center / 1.8rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.orb-media-3d:hover::after {
+ background-image: svg-url-icon-media-3d('#000');
+ }
+
+ &.orb-media-3d:active::after {
+ background-image: svg-url-icon-media-3d('#{$eu-light-orange}');
+ }
+
+ // AUDIO
+
+ &.orb-media-audio::after {
+ background: svg-url-icon-media-audio('#{$white}') center / 1.8rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.orb-media-audio:hover::after {
+ background-image: svg-url-icon-media-audio('#000');
+ }
+
+ &.orb-media-audio:active::after {
+ background-image: svg-url-icon-media-audio('#{$eu-light-orange}');
+ }
+
+ // IMAGE
+
+ &.orb-media-image::after {
+ background: svg-url-icon-media-image('#{$white}') center / 1.8rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.orb-media-image:hover::after {
+ background-image: svg-url-icon-media-image('#000');
+ }
+
+ &.orb-media-image:active::after {
+ background-image: svg-url-icon-media-image('#{$eu-light-orange}');
+ }
+
+ // TEXT
+
+ &.orb-media-text::after {
+ background: svg-url-icon-media-text('#{$white}') center / 1.8rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.orb-media-text:hover::after {
+ background-image: svg-url-icon-media-text('#000');
+ }
+
+ &.orb-media-text:active::after {
+ background-image: svg-url-icon-media-text('#{$eu-light-orange}');
+ }
+
+ // VIDEO
+
+ &.orb-media-video::after {
+ background: svg-url-icon-media-video('#{$white}') center / 1.8rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.orb-media-video:hover::after {
+ background-image: svg-url-icon-media-video('#000');
+ }
+
+ &.orb-media-video:active::after {
+ background-image: svg-url-icon-media-video('#{$eu-light-orange}');
+ }
+
+ // UNKNOWN
+
+ &.orb-media-unknown::after {
+ content: '?';
+ }
+
+ // Speech bubble
+
+ &.language-orb::after {
+ background: svg-url-icon-speech-bubble('#{$white}') center / 1.5rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.language-orb:hover::after {
+ background-image: svg-url-icon-speech-bubble('#000');
+ }
+
+ &.language-orb:active::after {
+ background-image: svg-url-icon-speech-bubble('#{$eu-light-orange}');
+ }
+
+ // Elements
+
+ &.element-orb::after {
+ background: svg-url-icon-xml('#{$white}') center / 1.8rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.element-orb:hover::after {
+ background-image: svg-url-icon-xml('#000');
+ }
+
+ &.element-orb:active::after {
+ background-image: svg-url-icon-xml('#{$eu-light-orange}');
+ }
+
+ // Classes
+
+ &.classes-orb::after {
+ background: svg-url-icon-classes('#{$white}') center 35% / 2.2rem no-repeat;
+ content: '';
+ height: 100%;
+ width: 100%;
+ }
+
+ &.classes-orb:hover::after {
+ background-image: svg-url-icon-classes('#000');
+ }
+
+ &.classes-orb:active::after {
+ background-image: svg-url-icon-classes('#{$eu-light-orange}');
+ }
+ }
+
+ &.is-active.is-set {
+ border-color: $white;
+ &:hover {
+ border-color: $eu-light-orange;
+ }
+ &::before {
+ border-color: $white;
+ }
+ }
+
+ &.indicate-complete,
+ &.indicate-polling,
+ &.spinner {
+ &::before {
+ content: '';
+ }
+ }
+
+ @keyframes fadein {
+ 0% {
+ opacity: 1;
+ }
+ 50% {
+ opacity: 0;
+ }
+ 100% {
+ opacity: 1;
+ }
+ }
+
+ &.indicate-polling::before {
+ animation: fadein 2000ms infinite;
+ }
+}
+
+.dataset-orbs-hidden {
+ .orb-container:not(.progress-orb-container, .report-orb-container) .nav-orb.labelled {
+ display: none;
+ }
+
+ .report-orb-container,
+ .progress-orb-container {
+ flex-basis: 100%;
+ text-align: center;
+ }
+}
+
+.spinner {
+ background: svg-url-icon-spin('#{$white}') center / 2em no-repeat $eu-jade-light;
+ &:hover {
+ background-image: svg-url-icon-spin('#000');
+ }
+ &:active {
+ background-image: svg-url-icon-spin('#{$eu-light-orange}');
+ }
+}
+
+.wizard-status {
+ display: flex;
+ justify-content: space-evenly;
+ width: 100%;
+}
+
+.wizard-head .wizard-status li {
+ position: relative;
+ top: 2em;
+}
diff --git a/projects/sandbox/src/environments/environment.ts b/projects/sandbox/src/environments/environment.ts
index 7b4f817ad..30d7bccb1 100644
--- a/projects/sandbox/src/environments/environment.ts
+++ b/projects/sandbox/src/environments/environment.ts
@@ -13,4 +13,4 @@ export const environment = {
* This import should be commented out in production mode because it will have a negative impact
* on performance if an error is thrown.
*/
-// import 'zone.js/dist/zone-error'; // Included with Angular CLI.
+// import 'zone.js/plugins/zone-error'; // Included with Angular CLI.
diff --git a/projects/sandbox/src/polyfills.ts b/projects/sandbox/src/polyfills.ts
index 02a33669f..d5db2f163 100644
--- a/projects/sandbox/src/polyfills.ts
+++ b/projects/sandbox/src/polyfills.ts
@@ -38,7 +38,7 @@ import 'core-js/es7/reflect';
/***************************************************************************************************
* Zone JS is required by Angular itself.
*/
-import 'zone.js/dist/zone'; // Included with Angular CLI.
+import 'zone.js'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
diff --git a/projects/sandbox/src/styles.scss b/projects/sandbox/src/styles.scss
index 5c261e671..f9f62da98 100644
--- a/projects/sandbox/src/styles.scss
+++ b/projects/sandbox/src/styles.scss
@@ -38,8 +38,13 @@ $textcolour_highlight: $accent;
@import 'shared-styles/assets/sass/pandora/components/modal';
@import 'shared-styles/assets/sass/pandora/components/status-bullet';
+@import 'assets/sass/connections';
+@import 'assets/sass/links';
+@import 'assets/sass/orbs';
+
a {
color: $eu-jade-dark;
+
&.link-internal {
font-weight: bold;
}
@@ -49,6 +54,9 @@ a {
&:active {
color: $eu-light-orange;
}
+ &:focus-visible {
+ outline: 1px dotted $eu-jade;
+ }
}
input,
@@ -61,6 +69,10 @@ label {
}
}
+.error-message {
+ color: $eu-red;
+}
+
.form-group {
color: $eu-jade-dark;
margin: 0 auto 1rem;
@@ -70,6 +82,76 @@ label {
height: $fixed-header-height;
}
+.hidden {
+ display: none;
+}
+
+.wizard button {
+ background: $eu-jade-classic;
+ border: 1px solid $eu-jade-dark;
+ border-radius: 1.5em;
+ font-weight: bold;
+
+ &.next,
+ &.previous {
+ padding: 0;
+ text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.5);
+ &::after {
+ content: '\25B2';
+ transform-origin: top;
+ }
+ }
+ &:hover {
+ background-color: $white;
+ color: $eu-jade-darker;
+ }
+
+ &:active {
+ border-color: $eu-light-orange;
+ color: $eu-light-orange;
+ }
+
+ &:focus-visible {
+ outline: 1px solid $eu-light-orange;
+ }
+
+ &.next::after {
+ left: 1rem;
+ transform: rotate(90deg);
+ }
+ &.previous::after {
+ left: -1rem;
+ transform: rotate(270deg);
+ text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.1), -1px -1px 1px rgba(0, 0, 0, 0.5);
+ }
+
+ &.submit {
+ &:hover {
+ box-shadow: rgba(25, 115, 36, 0.35) 0px 5px 15px;
+ text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.5);
+ }
+
+ &[disabled] {
+ cursor: default;
+ background: $gray-lighter;
+ border-color: $gray-light;
+ color: $gray-light;
+ pointer-events: none;
+ }
+ }
+}
+
+.tick::after {
+ background-image: svg-url-icon-tick('#{$eu-jade-classic}');
+ width: 1em;
+ height: 1em;
+ content: '';
+ display: inline-block;
+ position: relative;
+ transform: scale(0.8);
+ top: 0.175em;
+}
+
.wizard input[type='file'] {
box-shadow: none;
border-color: $eu-jade-classic;
diff --git a/projects/sandbox/src/test.ts b/projects/sandbox/src/test.ts
index 1f88d9590..380480164 100644
--- a/projects/sandbox/src/test.ts
+++ b/projects/sandbox/src/test.ts
@@ -1,6 +1,6 @@
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-import 'zone.js/dist/zone-testing';
+import 'zone.js/testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
diff --git a/projects/sandbox/test-data/index.ts b/projects/sandbox/test-data/index.ts
index 40bebf1b5..8aa461c69 100644
--- a/projects/sandbox/test-data/index.ts
+++ b/projects/sandbox/test-data/index.ts
@@ -10,12 +10,14 @@ import {
SubmissionResponseData
} from '../src/app/_models';
import { ProgressByStepStatus, TimedTarget } from './models/models';
+import { ReportGenerator } from './report-generator';
new (class extends TestDataServer {
serverName = 'sandbox';
errorCodes: Array;
newId = 0;
timedTargets: Map = new Map();
+ reportGenerator: ReportGenerator;
/**
* constructor
@@ -26,6 +28,8 @@ new (class extends TestDataServer {
constructor() {
super();
+ this.reportGenerator = new ReportGenerator();
+
const generateRange = (start: number, end: number): Array => {
return [...Array(1 + end - start).keys()].map((v: number) => {
return `${start + v}`;
@@ -36,6 +40,7 @@ new (class extends TestDataServer {
const fn = (): void => {
this.timedTargets.forEach((tgt: TimedTarget) => {
+ tgt.timesCalled += 1;
this.makeProgress(tgt);
});
};
@@ -45,7 +50,7 @@ new (class extends TestDataServer {
/**
* handle404
*
- * Handles 404 errors by displaying a message
+ * Handles 404 errors by setting the response status code and ending it with a message
*
* @param {string} route - the invalid route
* @param {ServerResponse} response - the response object
@@ -56,6 +61,7 @@ new (class extends TestDataServer {
const urlPOST = '/dataset/my-dataset-name/process' + urlParams;
const urlGET = '/dataset/1';
this.headerText(response);
+ response.statusCode = 404;
response.end(
super.get404() +
`here )
);
} else {
- const regxDataset = route.match(/\/dataset\/([A-Za-z0-9_]+)$/);
- if (!regxDataset) {
+ const regResRecord = route.match(
+ /\/dataset\/([A-Za-z0-9_]+)\/record\/compute-tier-calculation\?recordId=(\S+)/
+ );
+
+ if (regResRecord && regResRecord.length > 2) {
+ const recordIdUnparsed = decodeURIComponent(regResRecord[2]);
+ const recordId = parseInt(recordIdUnparsed);
+
+ if (isNaN(recordId)) {
+ // check for mismatches between europeana records and the parent dataset
+
+ const europeanaId = recordIdUnparsed.match(/^\/(\d)\/\S+/);
+ if (europeanaId) {
+ const recordDataset = parseInt(europeanaId[1]);
+ const datasetParam = parseInt(regResRecord[1]);
+ if (recordDataset !== datasetParam) {
+ this.handle404(route, response);
+ return;
+ }
+ }
+ }
+
+ if (recordId === 404) {
+ this.handle404(route, response);
+ } else {
+ const report = this.reportGenerator.generateReport(recordIdUnparsed);
+ if (recordId > 999) {
+ setTimeout(() => {
+ response.end(report);
+ }, recordId);
+ } else {
+ response.end(report);
+ }
+ }
+ return;
+ }
+
+ const regResDataset = route.match(/\/dataset\/([A-Za-z0-9_]+)$/);
+
+ if (!regResDataset) {
this.handle404(route, response);
} else {
- const id = regxDataset[1];
+ const id = regResDataset[1];
if (this.errorCodes.indexOf(id) > -1) {
response.statusCode = parseInt(id);
response.end();
diff --git a/projects/sandbox/test-data/models/models.ts b/projects/sandbox/test-data/models/models.ts
index f409acacd..d53375d8a 100644
--- a/projects/sandbox/test-data/models/models.ts
+++ b/projects/sandbox/test-data/models/models.ts
@@ -17,4 +17,5 @@ export enum ProgressByStepStatus {
export interface TimedTarget {
progressBurndown: ProgressBurndown;
datasetInfo: Dataset;
+ timesCalled: number;
}
diff --git a/projects/sandbox/test-data/report-generator.ts b/projects/sandbox/test-data/report-generator.ts
new file mode 100644
index 000000000..d5415dff6
--- /dev/null
+++ b/projects/sandbox/test-data/report-generator.ts
@@ -0,0 +1,182 @@
+import { LicenseType, MediaDataItem, RecordMediaType, RecordReport } from '../src/app/_models';
+
+export class ReportGenerator {
+ stacktrace = [
+ 'eu.europeana.metis.sandbox.common.exception.RecordValidationException:',
+ 'Record: [Missing record identifier for EDM record] Node: [null] Message:',
+ '[java.net.MalformedURLException: no protocol: ]\n\t at',
+ 'eu.europeana.metis.sandbox.service.workflow.ExternalValidationServiceImpl',
+ '.validate(ExternalValidationServiceImpl.java:43)\n\tat',
+ 'eu.europeana.metis.sandbox.consumer.workflow.CreatedConsumer',
+ '.lambda$validateExternal$0(CreatedConsumer.java:32)\n\tat',
+ 'eu.europeana.metis.sandbox.consumer.workflow.StepConsumer.consume',
+ '(StepConsumer.java:35)'
+ ].join(' ');
+
+ errorList = [
+ {
+ errorMessage: 'Null Pointer Exception somewhere in the processing.',
+ stacktrace: this.stacktrace
+ },
+ {
+ errorMessage: 'Large error: very dangerous.',
+ stacktrace: this.stacktrace
+ },
+ {
+ errorMessage: 'Message..',
+ stacktrace: this.stacktrace
+ },
+ {
+ errorMessage: 'Nerdy stuff.',
+ stacktrace: this.stacktrace
+ },
+ {
+ errorMessage: 'Levis.',
+ stacktrace: this.stacktrace
+ },
+ {
+ errorMessage: 'Another Stacktrace',
+ stacktrace: this.stacktrace
+ }
+ ];
+
+ generateMediaResources(num: number): Array {
+ return Array.from(Array(num).keys()).map((i: number) => {
+ return this.generateMediaResource(i);
+ });
+ }
+
+ generateMediaResource(num: number): MediaDataItem {
+ const itemType = this.generateType(num);
+ return {
+ resourceUrl: `https://my-${itemType}-resource-url.com`,
+ mediaTier: num % 4,
+ mediaType: itemType,
+ mimeType: `mime ${num % 5}`,
+ elementLinkTypes: ['edm:isShownBy'],
+ imageResolution: num * 123456789,
+ imageResolutionTier: 1,
+ verticalResolution: num * 76,
+ verticalResolutionTier: num % 3,
+ licenseType: this.generateLicenseType(num)
+ };
+ }
+
+ generateLicenseType = (num: number): LicenseType => {
+ const types = [LicenseType.OPEN, LicenseType.CLOSED, LicenseType.RESTRICTED];
+ return types[num % types.length];
+ };
+
+ generateType = (num: number): RecordMediaType => {
+ const types = [
+ RecordMediaType.THREE_D,
+ RecordMediaType.AUDIO,
+ RecordMediaType.IMAGE,
+ RecordMediaType.TEXT,
+ RecordMediaType.VIDEO,
+ RecordMediaType.OTHER
+ ];
+ return types[num % types.length];
+ };
+
+ generateReport = (id: string): string => {
+ let idAsInt = parseInt(id);
+ let idAsFloat = parseFloat(id);
+
+ if (isNaN(idAsInt)) {
+ idAsInt = id.length;
+ }
+ if (isNaN(idAsFloat)) {
+ idAsFloat = id.length;
+ }
+
+ let media: Array = [];
+ let errors = this.errorList.slice();
+ let errorMode = false;
+ let listLimit = 9;
+
+ if (id.indexOf('.') > 0) {
+ // use the decimal part as the list limit
+ listLimit = parseInt(`${(parseFloat(idAsFloat.toFixed(1)) % 1) * 10}`);
+ }
+
+ const ctVals = [0, 1, 2, 3, 4];
+ const ctVal = ctVals[idAsInt % ctVals.length];
+
+ const mdVals = ['A', 'B', 'C', 'D'];
+ const mdVal = mdVals[idAsInt % mdVals.length];
+
+ if (idAsInt === 0) {
+ media = [];
+ } else if (idAsInt >= 100) {
+ media = this.generateMediaResources(10);
+ } else if (idAsInt % 2 === 0) {
+ media = this.generateMediaResources(1);
+ errors = errors.slice(0, 2);
+ } else {
+ media = this.generateMediaResources(5);
+ }
+
+ if (idAsInt === 13) {
+ media.forEach((item: MediaDataItem) => {
+ item.mediaType = '';
+ });
+ errorMode = true;
+ }
+
+ const realReport: RecordReport = {
+ recordTierCalculationSummary: {
+ europeanaRecordId: `${id}-eu`,
+ providerRecordId: `${id}-provider`,
+ contentTier: `${ctVal}`,
+ metadataTier: mdVal,
+ portalRecordLink: 'https://portal.record.link'
+ },
+ contentTierBreakdown: {
+ recordType: this.generateType(idAsInt),
+ licenseType: LicenseType.OPEN,
+ thumbnailAvailable: idAsInt % 4 === 0,
+ landingPageAvailable: !errorMode,
+ embeddableMediaAvailable: !errorMode,
+ mediaResourceTechnicalMetadataList: media,
+ processingErrorsList: idAsInt === 0 ? undefined : errors
+ },
+ metadataTierBreakdown: {
+ languageBreakdown: {
+ qualifiedElements: 42,
+ qualifiedElementsWithLanguage: 34,
+ qualifiedElementsWithLanguagePercentage: 81,
+ qualifiedElementsWithoutLanguageList: ['this', 'that', 'the', 'other'].slice(
+ 0,
+ listLimit
+ ),
+ metadataTier: mdVal
+ },
+ enablingElements: {
+ distinctEnablingElementsList: [
+ 'dc:creator',
+ 'edm:currentLocation',
+ 'this',
+ 'that',
+ 'the',
+ 'other'
+ ].slice(0, listLimit),
+ metadataGroupsList: ['Agent', 'Place', 'this', 'that', 'the', 'other'].slice(
+ 0,
+ listLimit
+ ),
+ metadataTier: mdVal
+ },
+ contextualClasses: {
+ completeContextualResources: 5,
+ distinctClassesList: ['edm:TimeSpan', 'edm:Place', 'this', 'that', 'the', 'other'].slice(
+ 0,
+ listLimit
+ ),
+ metadataTier: mdVal
+ }
+ }
+ };
+ return JSON.stringify(realReport);
+ };
+}
diff --git a/projects/shared/src/lib/form/file-upload/file-upload.component.html b/projects/shared/src/lib/form/file-upload/file-upload.component.html
index 9b53659bd..34be59d74 100644
--- a/projects/shared/src/lib/form/file-upload/file-upload.component.html
+++ b/projects/shared/src/lib/form/file-upload/file-upload.component.html
@@ -1 +1,7 @@
-) {}
- /** writeValue
+ /** clearFileValue
/* clear file input
*/
+ clearFileValue(): void {
+ this.fileUpload.nativeElement.value = '';
+ }
+
+ /** writeValue
+ /* default implementaion of ControlValueAccessor.writeValue
+ */
writeValue(): void {
this.host.nativeElement.value = '';
}
diff --git a/projects/shared/src/lib/form/protocol-field-set/harvest.validator.spec.ts b/projects/shared/src/lib/form/protocol-field-set/harvest.validator.spec.ts
index 4a925ed8e..2e9dd767d 100644
--- a/projects/shared/src/lib/form/protocol-field-set/harvest.validator.spec.ts
+++ b/projects/shared/src/lib/form/protocol-field-set/harvest.validator.spec.ts
@@ -11,6 +11,7 @@ describe('harvest validator', () => {
it('should accept urls', () => {
expect(harvestValidator(makeControl('http://example.com'))).toBe(null);
expect(harvestValidator(makeControl('https://europeana.eu/data/set/test'))).toBe(null);
+ expect(harvestValidator(makeControl('ftp://example.com'))).toBe(null);
});
it('should not accept urls with query params', () => {
diff --git a/projects/shared/src/lib/form/protocol-field-set/harvest.validator.ts b/projects/shared/src/lib/form/protocol-field-set/harvest.validator.ts
index da6b6437c..bfb1aeb40 100644
--- a/projects/shared/src/lib/form/protocol-field-set/harvest.validator.ts
+++ b/projects/shared/src/lib/form/protocol-field-set/harvest.validator.ts
@@ -8,7 +8,7 @@ export function harvestValidator(control: AbstractControl): ValidationErrors | n
return { validParameter: true };
}
- const regex = /(http(s?))\:\/\//g;
+ const regex = /(http(s?)|ftp)\:\/\//g;
if (!regex.test(control.value)) {
return { validUrl: true };
}
diff --git a/projects/shared/src/lib/form/protocol-field-set/protocol-field-set.component.html b/projects/shared/src/lib/form/protocol-field-set/protocol-field-set.component.html
index b2b6c6585..b6c02d296 100644
--- a/projects/shared/src/lib/form/protocol-field-set/protocol-field-set.component.html
+++ b/projects/shared/src/lib/form/protocol-field-set/protocol-field-set.component.html
@@ -43,7 +43,11 @@