From 0bc2268f718e5bb9870ee784f8a8bbd1e2823799 Mon Sep 17 00:00:00 2001 From: Jonathan Ostertag Date: Sun, 24 Sep 2023 17:54:47 +0200 Subject: [PATCH 1/5] feat: adjust scroll speed, show generation validation error, adjust draggable container height --- .../apollon-diagrams/apollon-diagram-detail.component.ts | 1 + .../drag-and-drop-question.component.html | 4 +++- .../drag-and-drop-question.component.scss | 2 +- src/main/webapp/i18n/de/apollonDiagram.json | 3 ++- src/main/webapp/i18n/en/apollonDiagram.json | 3 ++- 5 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts b/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts index 148f090c3863..ef3741283fba 100644 --- a/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts +++ b/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts @@ -154,6 +154,7 @@ export class ApollonDiagramDetailComponent implements OnInit, OnDestroy { */ async generateExercise() { if (!this.hasInteractive) { + this.alertService.error('artemisApp.apollonDiagram.create.validationError'); return; } diff --git a/src/main/webapp/app/exercises/quiz/shared/questions/drag-and-drop-question/drag-and-drop-question.component.html b/src/main/webapp/app/exercises/quiz/shared/questions/drag-and-drop-question/drag-and-drop-question.component.html index 08f652e0df4a..6f8f8d96dfb7 100644 --- a/src/main/webapp/app/exercises/quiz/shared/questions/drag-and-drop-question/drag-and-drop-question.component.html +++ b/src/main/webapp/app/exercises/quiz/shared/questions/drag-and-drop-question/drag-and-drop-question.component.html @@ -96,6 +96,7 @@

(onDragOver)="preventDefault($event)" (onDragLeave)="preventDefault($event)" cdkDropList + [cdkDropListAutoScrollStep]="60" > -
+
@@ -244,6 +245,7 @@

(onDragOver)="preventDefault($event)" (onDragLeave)="preventDefault($event)" cdkDropList + [cdkDropListAutoScrollStep]="60" > Date: Tue, 26 Sep 2023 16:31:55 +0200 Subject: [PATCH 2/5] feat: navigate to edit page after generating the dnd quiz --- .../apollon-diagrams/apollon-diagram-detail.component.ts | 4 +++- .../exercise-generation/quiz-exercise-generator.ts | 4 ++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts b/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts index 5296adde53e0..6caa91f19a16 100644 --- a/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts +++ b/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/apollon-diagram-detail.component.ts @@ -1,5 +1,5 @@ import { Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core'; -import { ActivatedRoute } from '@angular/router'; +import { ActivatedRoute, Router } from '@angular/router'; import { ApollonEditor, ApollonMode, Locale, UMLModel } from '@ls1intum/apollon'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; import { JhiLanguageHelper } from 'app/core/language/language.helper'; @@ -52,6 +52,7 @@ export class ApollonDiagramDetailComponent implements OnInit, OnDestroy { private languageHelper: JhiLanguageHelper, private modalService: NgbModal, private route: ActivatedRoute, + private router: Router, ) {} /** @@ -166,6 +167,7 @@ export class ApollonDiagramDetailComponent implements OnInit, OnDestroy { const result = await modalRef.result; if (result) { this.alertService.success('artemisApp.apollonDiagram.create.success', { title: result.title }); + this.router.navigate(['course-management', this.courseId, 'quiz-exercises', result.id, 'edit']); } } catch (error) { this.alertService.error('artemisApp.apollonDiagram.create.error'); diff --git a/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/exercise-generation/quiz-exercise-generator.ts b/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/exercise-generation/quiz-exercise-generator.ts index 10128f71a4d1..0222ed96cf77 100644 --- a/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/exercise-generation/quiz-exercise-generator.ts +++ b/src/main/webapp/app/exercises/quiz/manage/apollon-diagrams/exercise-generation/quiz-exercise-generator.ts @@ -68,9 +68,9 @@ export async function generateDragAndDropQuizExercise( const quizExercise = createDragAndDropQuizExercise(course, title, dragAndDropQuestion); // Save the quiz exercise - await lastValueFrom(quizExerciseService.create(quizExercise)); + const creationResponse = await lastValueFrom(quizExerciseService.create(quizExercise)); - return quizExercise; + return creationResponse.body ?? quizExercise; } /** From f048927d74bd5611db0c360c5ba1c9bdc509b212 Mon Sep 17 00:00:00 2001 From: Jonathan Ostertag Date: Tue, 26 Sep 2023 17:05:21 +0200 Subject: [PATCH 3/5] fix: tests --- .../quiz-exercise-generator.spec.ts | 18 ++---------------- 1 file changed, 2 insertions(+), 16 deletions(-) diff --git a/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts b/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts index 7a5e91fc8861..c652b8618cda 100644 --- a/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts +++ b/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts @@ -8,11 +8,10 @@ import { TranslateService } from '@ngx-translate/core'; import { Course } from 'app/entities/course.model'; import { DragAndDropQuestion } from 'app/entities/quiz/drag-and-drop-question.model'; import { QuizExercise } from 'app/entities/quiz/quiz-exercise.model'; -import { QuizQuestion, QuizQuestionType } from 'app/entities/quiz/quiz-question.model'; +import { QuizQuestionType } from 'app/entities/quiz/quiz-question.model'; import { generateDragAndDropQuizExercise } from 'app/exercises/quiz/manage/apollon-diagrams/exercise-generation/quiz-exercise-generator'; import { QuizExerciseService } from 'app/exercises/quiz/manage/quiz-exercise.service'; import { FileUploaderService } from 'app/shared/http/file-uploader.service'; -import dayjs from 'dayjs/esm'; import { MockProvider } from 'ng-mocks'; import { LocalStorageService, SessionStorageService } from 'ngx-webstorage'; import { of } from 'rxjs'; @@ -27,19 +26,6 @@ Text.size = () => { return { width: 0, height: 0 }; }; -const question1 = { id: 1, type: QuizQuestionType.DRAG_AND_DROP, points: 1 } as QuizQuestion; -const question2 = { id: 2, type: QuizQuestionType.MULTIPLE_CHOICE, points: 2, answerOptions: [], invalid: false, exportQuiz: false, randomizeOrder: true } as QuizQuestion; -const question3 = { id: 3, type: QuizQuestionType.SHORT_ANSWER, points: 3 } as QuizQuestion; -const now = dayjs(); - -const quizExercise = { - id: 1, - quizQuestions: [question1, question2, question3], - releaseDate: dayjs(now).subtract(2, 'minutes'), - dueDate: dayjs(now).add(2, 'minutes'), - quizStarted: true, -} as QuizExercise; - describe('QuizExercise Generator', () => { let quizExerciseService: QuizExerciseService; let fileUploaderService: FileUploaderService; @@ -80,7 +66,7 @@ describe('QuizExercise Generator', () => { configureServices(); const examplePath = '/path/to/file'; jest.spyOn(fileUploaderService, 'uploadFile').mockReturnValue(Promise.resolve({ path: examplePath })); - jest.spyOn(quizExerciseService, 'create').mockReturnValue(of({ body: quizExercise } as HttpResponse)); + jest.spyOn(quizExerciseService, 'create').mockImplementation((generatedExercise) => of(generatedExercise) as HttpResponse); jest.spyOn(svgRenderer, 'convertRenderedSVGToPNG').mockReturnValue(new Blob()); // @ts-ignore const classDiagram: UMLModel = testClassDiagram as UMLModel; From 8cb56fa92cf5c52271d7f9370a18aaf2dd69442e Mon Sep 17 00:00:00 2001 From: Jonathan Ostertag Date: Tue, 26 Sep 2023 17:17:32 +0200 Subject: [PATCH 4/5] fix: tests --- .../exercise-generation/quiz-exercise-generator.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts b/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts index c652b8618cda..b11c92750120 100644 --- a/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts +++ b/src/test/javascript/spec/component/apollon-diagrams/exercise-generation/quiz-exercise-generator.spec.ts @@ -66,7 +66,7 @@ describe('QuizExercise Generator', () => { configureServices(); const examplePath = '/path/to/file'; jest.spyOn(fileUploaderService, 'uploadFile').mockReturnValue(Promise.resolve({ path: examplePath })); - jest.spyOn(quizExerciseService, 'create').mockImplementation((generatedExercise) => of(generatedExercise) as HttpResponse); + jest.spyOn(quizExerciseService, 'create').mockImplementation((generatedExercise) => of({ body: generatedExercise } as HttpResponse)); jest.spyOn(svgRenderer, 'convertRenderedSVGToPNG').mockReturnValue(new Blob()); // @ts-ignore const classDiagram: UMLModel = testClassDiagram as UMLModel; From 806d09ebba4ee2806f5658211682bcbb2f02dcc8 Mon Sep 17 00:00:00 2001 From: Jonathan Ostertag Date: Mon, 2 Oct 2023 10:01:18 +0200 Subject: [PATCH 5/5] chore: adjust german translation --- src/main/webapp/i18n/de/apollonDiagram.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/main/webapp/i18n/de/apollonDiagram.json b/src/main/webapp/i18n/de/apollonDiagram.json index f5a11a0bc8a8..db0404ef0973 100644 --- a/src/main/webapp/i18n/de/apollonDiagram.json +++ b/src/main/webapp/i18n/de/apollonDiagram.json @@ -14,7 +14,7 @@ "create": { "success": "Apollon Diagram mit Titel {{ title }} wurde erfolgreich generiert", "error": "Fehler beim Erstellen des Apollon Diagramms", - "validationError": "Fehler beim Erstellen: Interaktive Elemente werden zum Generieren benötigt." + "validationError": "Validierungsfehler: Interaktive Elemente werden zum Generieren benötigt." }, "update": { "error": "Fehler beim Aktualisieren des Apollon Diagramms"