diff --git a/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts b/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts
index ea706d349..f3880736e 100644
--- a/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts
+++ b/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts
@@ -23,7 +23,7 @@ import { DatasetWizardEditorModel } from '@app/ui/dataset/dataset-wizard/dataset
import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item';
import { IBreadCrumbComponent } from '@app/ui/misc/breadcrumb/definition/IBreadCrumbComponent';
import { DatasetDescriptionFormEditorModel } from '@app/ui/misc/dataset-description-form/dataset-description-form.model';
-import { LinkToScroll } from '@app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents';
+import { Link, LinkToScroll } from '@app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents';
import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service';
import { FormValidationErrorsDialogComponent } from '@common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component';
@@ -85,6 +85,8 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, IBr
datasetSavedLinks: any = null;
scrollTop: number;
+ tocScrollTop: number;
+ links: Link[] = [];
constructor(
private datasetWizardService: DatasetWizardService,
@@ -548,6 +550,7 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, IBr
submit(saveType?: SaveType) {
this.scrollTop = document.getElementById('dataset-editor-form').scrollTop;
+ this.tocScrollTop = document.getElementById('stepper-options').scrollTop;
this.datasetWizardService.createDataset(this.formGroup.getRawValue())
.pipe(takeUntil(this._destroyed))
.subscribe(
@@ -657,6 +660,7 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, IBr
setTimeout(() => {
document.getElementById('dataset-editor-form').scrollTop = this.scrollTop;
+ document.getElementById('stepper-options').scrollTop = this.tocScrollTop;
}, 500);
// this.router.navigate(['/reload']).then(() => { this.router.navigate(['/datasets', 'edit', data.id]); });
@@ -916,7 +920,7 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, IBr
return this.formGroup.get('label') && this.formGroup.get('label').valid && this.formGroup.get('profile') && this.formGroup.get('profile').valid;
}
- onLinksInit(event) {
- this.datasetSavedLinks = event;
+ getLinks(currentLinks: Link[]) {
+ this.links = currentLinks;
}
}
diff --git a/dmp-frontend/src/app/ui/dmp/clone/dmp-clone.component.html b/dmp-frontend/src/app/ui/dmp/clone/dmp-clone.component.html
index d98386bf5..c87df1925 100644
--- a/dmp-frontend/src/app/ui/dmp/clone/dmp-clone.component.html
+++ b/dmp-frontend/src/app/ui/dmp/clone/dmp-clone.component.html
@@ -60,7 +60,7 @@
{{'DMP-EDITOR.STEPPER.USER-GUIDE' | translate}}
-
+
- {{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (4)
- {{'DMP-EDITOR.STEPPER.FUNDING-INFO' | translate}} (3)
diff --git a/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.html b/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.html
index 94c168100..ea6fc8b49 100644
--- a/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.html
+++ b/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.html
@@ -31,7 +31,7 @@
{{'DMP-EDITOR.STEPPER.USER-GUIDE' | translate}}
-
+
- {{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (1)
- {{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (done)
diff --git a/dmp-frontend/src/app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents.ts b/dmp-frontend/src/app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents.ts
index 873d3023d..917a80f55 100644
--- a/dmp-frontend/src/app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents.ts
+++ b/dmp-frontend/src/app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents.ts
@@ -6,7 +6,7 @@ import { distinctUntilChanged } from 'rxjs/operators';
import { type } from 'os';
import { SimpleChanges } from '@angular/core';
-interface Link {
+export interface Link {
/* id of the section*/
id: string;
/* header type h3/h4 */
@@ -30,10 +30,11 @@ interface Link {
})
export class TableOfContents extends BaseComponent implements OnInit {
- links: Link[] = [];
+ @Input() links: Link[];
container: string;
headerSelectors = '.toc-page-header, .toc-section-header, .toc-compositeField-header';
@Output() stepFound = new EventEmitter();
+ @Output() currentLinks = new EventEmitter();
subscription: Subscription;
linksSubject: Subject = new Subject();
@@ -54,72 +55,75 @@ export class TableOfContents extends BaseComponent implements OnInit {
this.linksSubject.next(headers);
});
- this.linksSubject.asObservable()
- .pipe(distinctUntilChanged((p: HTMLElement[], q: HTMLElement[]) => JSON.stringify(p) == JSON.stringify(q)))
- .subscribe(headers => {
- const links: Array = [];
+ if (!this.links || this.links.length === 0) {
+ this.linksSubject.asObservable()
+ .pipe(distinctUntilChanged((p: HTMLElement[], q: HTMLElement[]) => JSON.stringify(p) == JSON.stringify(q)))
+ .subscribe(headers => {
+ const links: Array = [];
- if (headers.length) {
- let page;
- let section;
- let show
- for (const header of headers) {
- let name;
- let id;
- if (header.classList.contains('toc-page-header')) { // deprecated after removing stepper
- name = header.innerText.trim().replace(/^link/, '');
- id = header.id;
- page = header.id.split('_')[1];
- section = undefined;
- show = true;
- } else if (header.classList.contains('toc-section-header')) {
- name = header.childNodes[0].childNodes[0].childNodes[0].childNodes[0].childNodes[0].nodeValue.trim().replace(/^link/, '');
- id = header.id;
- page = header.id.split('.')[1];
- section = header.id;
- if (header.id.split('.')[4]) { show = false; }
- else { show = true; }
- } else if (header.classList.contains('toc-compositeField-header')) {
- name = (header.childNodes[0]).nodeValue.trim().replace(/^link/, '');
- id = header.id;
- // id = header.parentElement.parentElement.parentElement.id;
- show = false;
+ if (headers.length) {
+ let page;
+ let section;
+ let show
+ for (const header of headers) {
+ let name;
+ let id;
+ if (header.classList.contains('toc-page-header')) { // deprecated after removing stepper
+ name = header.innerText.trim().replace(/^link/, '');
+ id = header.id;
+ page = header.id.split('_')[1];
+ section = undefined;
+ show = true;
+ } else if (header.classList.contains('toc-section-header')) {
+ name = header.childNodes[0].childNodes[0].childNodes[0].childNodes[0].childNodes[0].nodeValue.trim().replace(/^link/, '');
+ id = header.id;
+ page = header.id.split('.')[1];
+ section = header.id;
+ if (header.id.split('.')[4]) { show = false; }
+ else { show = true; }
+ } else if (header.classList.contains('toc-compositeField-header')) {
+ name = (header.childNodes[0]).nodeValue.trim().replace(/^link/, '');
+ id = header.id;
+ // id = header.parentElement.parentElement.parentElement.id;
+ show = false;
+ }
+ const { top } = header.getBoundingClientRect();
+ links.push({
+ name,
+ id,
+ type: header.tagName.toLowerCase(),
+ top: top,
+ active: false,
+ page: page,
+ section: section,
+ show: show,
+ selected: false
+ });
}
- const { top } = header.getBoundingClientRect();
- links.push({
- name,
- id,
- type: header.tagName.toLowerCase(),
- top: top,
- active: false,
- page: page,
- section: section,
- show: show,
- selected: false
- });
}
- }
- this.links = links;
- // Initialize selected for button next on dataset wizard component editor
- this.links.length > 0 ? this.links[0].selected = true : null;
- })
+ this.links = links;
+ // Initialize selected for button next on dataset wizard component editor
+ this.links.length > 0 ? this.links[0].selected = true : null;
+ })
+ }
+
}
ngOnChanges(changes: SimpleChanges) {
- if (!this.isActive && this.links && this.links.length > 0) {
- this.links.forEach(link => {
- link.selected = false;
- })
- this.links[0].selected = true;
- }
+ // if (!this.isActive && this.links && this.links.length > 0) {
+ // this.links.forEach(link => {
+ // link.selected = false;
+ // })
+ // this.links[0].selected = true;
+ // }
}
goToStep(link: Link) {
- // this.selectedLinkId = link.id;
this.stepFound.emit({
page: link.page,
section: link.section
});
+ this.currentLinks.emit(this.links);
setTimeout(() => {
const target = document.getElementById(link.id);
@@ -133,15 +137,15 @@ export class TableOfContents extends BaseComponent implements OnInit {
}
toggle(headerLink: Link) {
- const headerPage = +headerLink.name.split(" ",1);
+ const headerPage = +headerLink.name.split(" ", 1);
let innerPage;
for (const link of this.links) {
link.selected = false;
if (link.type === 'mat-expansion-panel') {
- innerPage = +link.name.split(".",1)[0];
- if(isNaN(innerPage)) { innerPage = +link.name.split(" ",1) }
+ innerPage = +link.name.split(".", 1)[0];
+ if (isNaN(innerPage)) { innerPage = +link.name.split(" ", 1) }
} else if (link.type === 'h5') {
- innerPage = +link.name.split(".",1)[0];
+ innerPage = +link.name.split(".", 1)[0];
}
if (headerPage === innerPage && (link.type !== 'mat-expansion-panel' || (link.type === 'mat-expansion-panel' && link.id.split(".")[4]))) {
link.show = !link.show;