From a13d1a4000caf3e62046ec95c5f19a42636f23ac Mon Sep 17 00:00:00 2001 From: Sofia Papacharalampous Date: Fri, 17 May 2024 17:46:08 +0300 Subject: [PATCH] description template toc reordering fixes --- .../description-template-table-of-contents.ts | 50 +++++++++++-------- dmp-frontend/src/assets/i18n/en.json | 1 + 2 files changed, 30 insertions(+), 21 deletions(-) diff --git a/dmp-frontend/src/app/ui/admin/description-template/editor/table-of-contents/description-template-table-of-contents.ts b/dmp-frontend/src/app/ui/admin/description-template/editor/table-of-contents/description-template-table-of-contents.ts index 3f6f4313e..81128906e 100644 --- a/dmp-frontend/src/app/ui/admin/description-template/editor/table-of-contents/description-template-table-of-contents.ts +++ b/dmp-frontend/src/app/ui/admin/description-template/editor/table-of-contents/description-template-table-of-contents.ts @@ -54,10 +54,10 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements this.dragSubscriptions.push( dragulaService.drag(this.DRAG_GROUP).subscribe(({ el }) => { - this._dragStartedAt = new Date().getTime(); - // console.log('drag fired'); - this.isDragging = true; - this.draggingItemId = (el.id as string).replace(this.DRAGULA_ITEM_ID_PREFIX, ''); + this._dragStartedAt = new Date().getTime(); + // console.log('drag fired'); + this.isDragging = true; + this.draggingItemId = (el.id as string).replace(this.DRAGULA_ITEM_ID_PREFIX, ''); }) ); @@ -65,18 +65,23 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements dragulaService.drop(this.DRAG_GROUP).subscribe(({ el, target, source, sibling }) => { if (this._dragStartedAt) { const timeNow = new Date().getTime(); - if (timeNow - this._dragStartedAt > this.VALID_DROP_TIME) { // console.log('timenow: ', timeNow); // console.log('timestarted', this._dragStartedAt); this._dragStartedAt = null; } else { + const message = this.language.instant('DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.GENERIC-GRAD-AND-DROP-ERROR'); + this.notifyUser(message); this.dataNeedsRefresh.emit();// even though the data is not changed the TABLE DRAG may has changed + dragulaService.find(this.DRAG_GROUP).drake.cancel(true); return; } } else { + const message = this.language.instant('DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.GENERIC-GRAD-AND-DROP-ERROR'); + this.notifyUser(message); this.dataNeedsRefresh.emit();// even though the data is not changed the TABLE DRAG may has changed + dragulaService.find(this.DRAG_GROUP).drake.cancel(true); return; } @@ -86,19 +91,21 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements if (!(elementId && targetId && sourceId)) { - console.info('Elements do not have an id'); + const message = this.language.instant('DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.GENERIC-GRAD-AND-DROP-ERROR'); + this.notifyUser(message); this.dataNeedsRefresh.emit(); + dragulaService.find(this.DRAG_GROUP).drake.cancel(true); return; } const element: ToCEntry = this._findTocEntryById(elementId, this.links); const targetContainer: ToCEntry = this._findTocEntryById(targetId, this.links); const sourceContainer: ToCEntry = this._findTocEntryById(sourceId, this.links); - if (!(element && (targetContainer || ((element.type === ToCEntryType.Page) && (targetId === this.ROOT_ID))) && (sourceContainer || ((element.type === ToCEntryType.Page) && (sourceId === this.ROOT_ID))))) { - // console.info('Could not find elements'); + const message = this.language.instant('DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.GENERIC-GRAD-AND-DROP-ERROR'); + this.notifyUser(message); this.dataNeedsRefresh.emit(); - //TODO: angular update //drake.cancel(true); + dragulaService.find(this.DRAG_GROUP).drake.cancel(true); return; } @@ -259,13 +266,14 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements } else if (targetContainer.type === ToCEntryType.Page) { - const rootform = targetContainer.form.root; + const rootform = targetContainer.form; + // const rootform = targetContainer.form.root; const sectionForm = element.form; const parentSections = sectionForm.parent as UntypedFormArray; let parentIndex = -1; parentSections.controls.forEach((section, i) => { - if (section.get('id').value === elementId) { + if (section.get('id')?.value === elementId) { parentIndex = i } }) @@ -278,10 +286,10 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements } //update parent sections ordinal - parentSections.controls.filter(section => section.get('ordinal').value >= sectionForm.get('ordinal').value).forEach(section => { + parentSections.controls.filter(section => section.get('ordinal')?.value >= sectionForm.get('ordinal')?.value).forEach(section => { const ordinal = section.get('ordinal'); - const updatedOrdinalVal = ordinal.value ? ordinal.value - 1 : 0; - ordinal.setValue(updatedOrdinalVal); + const updatedOrdinalVal = ordinal?.value ? ordinal?.value - 1 : 0; + ordinal?.setValue(updatedOrdinalVal); }) parentSections.removeAt(parentIndex); @@ -301,18 +309,18 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements let indx = -1; targetContainer.subEntries.forEach((e, i) => { - if (e.form.get('id').value === siblingId) { + if (e.form.get('id')?.value === siblingId) { indx = i; - position = e.form.get('ordinal').value; + position = e.form.get('ordinal')?.value; } }); if (indx >= 0) { // e.form.get('ordinal').setValue(i+1); - targetContainer.subEntries.filter(e => e.form.get('ordinal').value >= position).forEach(e => { + targetContainer.subEntries.filter(e => e.form?.get('ordinal').value >= position).forEach(e => { const ordinal = e.form.get('ordinal'); - const updatedOrdinalVal = ordinal.value + 1; - ordinal.setValue(updatedOrdinalVal); + const updatedOrdinalVal = ordinal?.value + 1; + ordinal?.setValue(updatedOrdinalVal); }); } @@ -320,8 +328,8 @@ export class DescriptionTemplateTableOfContents extends BaseComponent implements console.info('No sibling found'); } - sectionForm.get('ordinal').setValue(position); - sectionForm.get('page').setValue(targetContainer.id); + sectionForm.get('ordinal')?.setValue(position); + sectionForm.get('page')?.setValue(targetContainer.id); targetSectionsArray.push(sectionForm); } else { diff --git a/dmp-frontend/src/assets/i18n/en.json b/dmp-frontend/src/assets/i18n/en.json index 50fa874ac..56db303f3 100644 --- a/dmp-frontend/src/assets/i18n/en.json +++ b/dmp-frontend/src/assets/i18n/en.json @@ -545,6 +545,7 @@ }, "TABLE-OF-CONTENTS": { "ERROR-MESSAGES": { + "GENERIC-GRAD-AND-DROP-ERROR": "Invalid action.", "FIELDSET-MUST-HAVE-PARENT-SECTION": "Question can only be child of section.", "INPUT-SECTION-SAME-LEVEL": "Cannot have question and section on the same level.", "DRAG-NOT-SUPPORTED": "Drag n drop of section not supported to target container.",