From a4da9ff786f61231d647b0d9dc7e499dccf65089 Mon Sep 17 00:00:00 2001 From: Minh Tho DUONG Date: Tue, 26 Mar 2024 14:22:01 +1100 Subject: [PATCH 1/4] refactor: migrate the comments-modal - (initial) --- .../comments-modal/comments-modal.component.html | 0 .../comments-modal/comments-modal.component.scss | 0 .../modals/comments-modal/comments-modal.component.ts | 10 ++++++++++ .../modals/comments-modal/comments-modal.service.ts | 0 src/app/common/modals/modals.coffee | 1 - src/app/doubtfire-angular.module.ts | 2 ++ src/app/doubtfire-angularjs.module.ts | 3 ++- 7 files changed, 14 insertions(+), 2 deletions(-) create mode 100644 src/app/common/modals/comments-modal/comments-modal.component.html create mode 100644 src/app/common/modals/comments-modal/comments-modal.component.scss create mode 100644 src/app/common/modals/comments-modal/comments-modal.component.ts create mode 100644 src/app/common/modals/comments-modal/comments-modal.service.ts diff --git a/src/app/common/modals/comments-modal/comments-modal.component.html b/src/app/common/modals/comments-modal/comments-modal.component.html new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/common/modals/comments-modal/comments-modal.component.scss b/src/app/common/modals/comments-modal/comments-modal.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/common/modals/comments-modal/comments-modal.component.ts b/src/app/common/modals/comments-modal/comments-modal.component.ts new file mode 100644 index 000000000..0bba1ae9e --- /dev/null +++ b/src/app/common/modals/comments-modal/comments-modal.component.ts @@ -0,0 +1,10 @@ +import { Component, Input, Inject } from '@angular/core'; + +@Component({ + selector: 'comments-modal', + templateUrl: './comments-modal.component.html', + styleUrls: ['./comments-modal.component.scss'], +}) +export class CommentsModalComponent { + constructor() {} +} \ No newline at end of file diff --git a/src/app/common/modals/comments-modal/comments-modal.service.ts b/src/app/common/modals/comments-modal/comments-modal.service.ts new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/common/modals/modals.coffee b/src/app/common/modals/modals.coffee index 6c40a882d..c3a494b80 100644 --- a/src/app/common/modals/modals.coffee +++ b/src/app/common/modals/modals.coffee @@ -2,5 +2,4 @@ angular.module("doubtfire.common.modals", [ 'doubtfire.common.modals.csv-result-modal' 'doubtfire.common.modals.progress-modal' 'doubtfire.common.modals.confirmation-modal' - 'doubtfire.common.modals.comments-modal' ]) diff --git a/src/app/doubtfire-angular.module.ts b/src/app/doubtfire-angular.module.ts index 18cf37a91..9a1e0652a 100644 --- a/src/app/doubtfire-angular.module.ts +++ b/src/app/doubtfire-angular.module.ts @@ -95,6 +95,7 @@ import { ExtensionCommentComponent } from './tasks/task-comments-viewer/extensio import { CampusListComponent } from './admin/institution-settings/campuses/campus-list/campus-list.component'; import { ExtensionModalComponent } from './common/modals/extension-modal/extension-modal.component'; import { CalendarModalComponent } from './common/modals/calendar-modal/calendar-modal.component'; +import { CommentsModalComponent } from './common/modals/comments-modal/comments-modal.component'; import { MatRadioModule } from '@angular/material/radio'; import { MatButtonToggleModule } from '@angular/material/button-toggle'; import { MAT_DATE_LOCALE, MatOptionModule } from '@angular/material/core'; @@ -250,6 +251,7 @@ import { TasksViewerComponent } from './units/states/tasks/tasks-viewer/tasks-vi OverseerImageListComponent, ExtensionModalComponent, CalendarModalComponent, + CommentsModalComponent, InstitutionSettingsComponent, HomeComponent, CommentBubbleActionComponent, diff --git a/src/app/doubtfire-angularjs.module.ts b/src/app/doubtfire-angularjs.module.ts index e84dd192a..769e12c17 100644 --- a/src/app/doubtfire-angularjs.module.ts +++ b/src/app/doubtfire-angularjs.module.ts @@ -134,7 +134,6 @@ import 'build/src/app/common/filters/filters.js'; import 'build/src/app/common/content-editable/content-editable.js'; import 'build/src/app/common/alert-list/alert-list.js'; import 'build/src/app/common/modals/confirmation-modal/confirmation-modal.js'; -import 'build/src/app/common/modals/comments-modal/comments-modal.js'; import 'build/src/app/common/modals/csv-result-modal/csv-result-modal.js'; import 'build/src/app/common/modals/progress-modal/progress-modal.js'; import 'build/src/app/common/modals/modals.js'; @@ -174,6 +173,7 @@ import { ExtensionCommentComponent } from './tasks/task-comments-viewer/extensio import { TaskAssessmentCommentComponent } from './tasks/task-comments-viewer/task-assessment-comment/task-assessment-comment.component'; import { ExtensionModalService } from './common/modals/extension-modal/extension-modal.service'; import { CalendarModalService } from './common/modals/calendar-modal/calendar-modal.service'; +import { CommentsModalService } from './common/modals/comments-modal/comments-modal.service'; import { CampusListComponent } from './admin/institution-settings/campuses/campus-list/campus-list.component'; import { ActivityTypeListComponent } from './admin/institution-settings/activity-type-list/activity-type-list.component'; import { InstitutionSettingsComponent } from './admin/institution-settings/institution-settings.component'; @@ -264,6 +264,7 @@ DoubtfireAngularJSModule.factory( DoubtfireAngularJSModule.factory('DoubtfireConstants', downgradeInjectable(DoubtfireConstants)); DoubtfireAngularJSModule.factory('ExtensionModal', downgradeInjectable(ExtensionModalService)); DoubtfireAngularJSModule.factory('CalendarModal', downgradeInjectable(CalendarModalService)); +DoubtfireAngularJSModule.factory('CommentsModal', downgradeInjectable(CommentsModalService)); DoubtfireAngularJSModule.factory('TaskCommentService', downgradeInjectable(TaskCommentService)); DoubtfireAngularJSModule.factory('tutorialService', downgradeInjectable(TutorialService)); DoubtfireAngularJSModule.factory('streamService', downgradeInjectable(TutorialStreamService)); From 53f10d6b90922538aa67418ae5cfeb08df143352 Mon Sep 17 00:00:00 2001 From: Minh Tho DUONG Date: Thu, 4 Apr 2024 15:54:53 +1100 Subject: [PATCH 2/4] refactor: migrate the comments-modal - get variables commentResourceUrl and commentType --- .../comments-modal.component.html | 10 ++++++++++ .../comments-modal.component.scss | 15 +++++++++++++++ .../comments-modal.component.ts | 19 ++++++++++++++++--- .../comments-modal/comments-modal.service.ts | 18 ++++++++++++++++++ 4 files changed, 59 insertions(+), 3 deletions(-) diff --git a/src/app/common/modals/comments-modal/comments-modal.component.html b/src/app/common/modals/comments-modal/comments-modal.component.html index e69de29bb..bd302b689 100644 --- a/src/app/common/modals/comments-modal/comments-modal.component.html +++ b/src/app/common/modals/comments-modal/comments-modal.component.html @@ -0,0 +1,10 @@ +
+
+
+ +
+
+ +
+
+
\ No newline at end of file diff --git a/src/app/common/modals/comments-modal/comments-modal.component.scss b/src/app/common/modals/comments-modal/comments-modal.component.scss index e69de29bb..ea07f249e 100644 --- a/src/app/common/modals/comments-modal/comments-modal.component.scss +++ b/src/app/common/modals/comments-modal/comments-modal.component.scss @@ -0,0 +1,15 @@ +.modal-comment { + .image-comment { + width: 100%; + height: 100%; + align-content: center; + border-radius: 5px; + padding: 0; + border: none; + } + .pdf-comment { + width: 100%; + height: 80vh; + align-content: center; + } + } \ No newline at end of file diff --git a/src/app/common/modals/comments-modal/comments-modal.component.ts b/src/app/common/modals/comments-modal/comments-modal.component.ts index 0bba1ae9e..07f855a35 100644 --- a/src/app/common/modals/comments-modal/comments-modal.component.ts +++ b/src/app/common/modals/comments-modal/comments-modal.component.ts @@ -1,10 +1,23 @@ -import { Component, Input, Inject } from '@angular/core'; +import { Component, OnInit, Input, Inject} from '@angular/core'; +import { alertService } from 'src/app/ajs-upgraded-providers'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; @Component({ selector: 'comments-modal', templateUrl: './comments-modal.component.html', styleUrls: ['./comments-modal.component.scss'], }) -export class CommentsModalComponent { - constructor() {} +export class CommentsModalComponent implements OnInit { + @Input() commentResourceUrl: string; + @Input() commentType: string; + + constructor( + @Inject(alertService) private alertService: any, + public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data: any, + ) {} + + ngOnInit(): void { + console.log('comments-model ngOnInit()'); + } } \ No newline at end of file diff --git a/src/app/common/modals/comments-modal/comments-modal.service.ts b/src/app/common/modals/comments-modal/comments-modal.service.ts index e69de29bb..657a54bc6 100644 --- a/src/app/common/modals/comments-modal/comments-modal.service.ts +++ b/src/app/common/modals/comments-modal/comments-modal.service.ts @@ -0,0 +1,18 @@ +import { Injectable } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog'; +import { CommentsModalComponent } from './comments-modal.component'; + +@Injectable({ + providedIn: 'root', +}) +export class CommentsModalService { + constructor(public dialog: MatDialog) {} + + public show(commentResourceUrl: string, commentType: string) { + let dialogRef: MatDialogRef; + dialogRef = this.dialog.open(CommentsModalComponent); + dialogRef.updateSize('100%', '100%'); + dialogRef.componentInstance.commentResourceUrl = commentResourceUrl; + dialogRef.componentInstance.commentType = commentType; + } +} \ No newline at end of file From b37b7251576499e6749c92cc13fdcc4ece0960ff Mon Sep 17 00:00:00 2001 From: Minh Tho DUONG Date: Thu, 4 Apr 2024 16:08:21 +1100 Subject: [PATCH 3/4] refactor: migrate the comments-modal - update functions in TypeScript files --- src/app/common/file-downloader/file-downloader.service.ts | 2 ++ .../pdf-image-comment/pdf-image-comment.component.ts | 6 ++++-- .../task-comments-viewer/task-comments-viewer.component.ts | 4 ++-- 3 files changed, 8 insertions(+), 4 deletions(-) diff --git a/src/app/common/file-downloader/file-downloader.service.ts b/src/app/common/file-downloader/file-downloader.service.ts index ba49cd64d..f37330e4a 100644 --- a/src/app/common/file-downloader/file-downloader.service.ts +++ b/src/app/common/file-downloader/file-downloader.service.ts @@ -51,6 +51,8 @@ export class FileDownloaderService { downloadLink.click(); downloadLink.parentNode.removeChild(downloadLink); + + this.alerts.add('info', 'File downloaded.', 3000); }, (error: any) => { this.alerts.add('danger', `Error downloading file - ${error}`); diff --git a/src/app/tasks/task-comments-viewer/pdf-image-comment/pdf-image-comment.component.ts b/src/app/tasks/task-comments-viewer/pdf-image-comment/pdf-image-comment.component.ts index cc3817cf6..35c7a3e8e 100644 --- a/src/app/tasks/task-comments-viewer/pdf-image-comment/pdf-image-comment.component.ts +++ b/src/app/tasks/task-comments-viewer/pdf-image-comment/pdf-image-comment.component.ts @@ -46,10 +46,12 @@ export class PdfImageCommentComponent implements OnInit, OnDestroy { } public openCommentsModal() { - if (this.resourceUrl) { + if (this.comment.commentType == 'image') { this.commentsModalRef.show(this.resourceUrl, this.comment.commentType); } else { - this.downloadCommentResource(this.openCommentsModal.bind(this)); + if (this.comment.commentType === 'pdf') { + this.fileDownloaderService.downloadFile(this.comment.attachmentUrl, "view.pdf"); + } } } } diff --git a/src/app/tasks/task-comments-viewer/task-comments-viewer.component.ts b/src/app/tasks/task-comments-viewer/task-comments-viewer.component.ts index 3aa677152..3aa72a774 100644 --- a/src/app/tasks/task-comments-viewer/task-comments-viewer.component.ts +++ b/src/app/tasks/task-comments-viewer/task-comments-viewer.component.ts @@ -143,10 +143,10 @@ export class TaskCommentsViewerComponent implements OnChanges, OnInit { document.querySelector(`#comment-${commentID}`).scrollIntoView(); } - openCommentsModal(comment: TaskComment) { + /*openCommentsModal(comment: TaskComment) { const resourceUrl = comment.attachmentUrl; this.commentsModalRef.show(resourceUrl, comment.commentType); - } + }*/ shouldShowAuthorIcon(commentType: string) { return !(commentType === 'extension' || commentType === 'status' || commentType == 'assessment'); From 99031e29bc6a628acd7e5ad98976b7a0713c674c Mon Sep 17 00:00:00 2001 From: Minh Tho DUONG Date: Thu, 4 Apr 2024 16:11:41 +1100 Subject: [PATCH 4/4] refactor: remove old files --- .../comments-modal/comments-modal.coffee | 32 ------------------- .../modals/comments-modal/comments-modal.scss | 15 --------- .../comments-modal/comments-modal.tpl.html | 10 ------ 3 files changed, 57 deletions(-) delete mode 100644 src/app/common/modals/comments-modal/comments-modal.coffee delete mode 100644 src/app/common/modals/comments-modal/comments-modal.scss delete mode 100644 src/app/common/modals/comments-modal/comments-modal.tpl.html diff --git a/src/app/common/modals/comments-modal/comments-modal.coffee b/src/app/common/modals/comments-modal/comments-modal.coffee deleted file mode 100644 index 7ecd247bb..000000000 --- a/src/app/common/modals/comments-modal/comments-modal.coffee +++ /dev/null @@ -1,32 +0,0 @@ -angular.module("doubtfire.common.modals.comments-modal", []) -# -# Modal to contain an image used in user comments. -# -.factory("CommentsModal", ($modal) -> - CommentsModal = {} - CommentsModal.show = (commentResourceUrl, commentType) -> - $modal.open - templateUrl: 'common/modals/comments-modal/comments-modal.tpl.html' - controller: 'CommentsModalCtrl' - size: 'lg' - resolve: - commentResourceUrl: -> commentResourceUrl - commentType: -> commentType - CommentsModal -) -.controller("CommentsModalCtrl", ($scope, $modalInstance, $sce, commentResourceUrl, commentType, alertService, fileDownloaderService) -> - # $scope.commentResourceUrl = $sce.trustAsResourceUrl(commentResourceUrl) - $scope.commentType = commentType - $scope.close = -> - fileDownloaderService.releaseBlob($scope.rawResourceUrl) - $modalInstance.dismiss() - - fileDownloaderService.downloadBlob( - commentResourceUrl, - (url, response) -> - $scope.rawResourceUrl = url - $scope.commentResourceUrl = $sce.trustAsResourceUrl(url) - (error) -> - alertService.add('danger', "Error downloading comment: #{error}") - ) -) diff --git a/src/app/common/modals/comments-modal/comments-modal.scss b/src/app/common/modals/comments-modal/comments-modal.scss deleted file mode 100644 index 22ccacf4f..000000000 --- a/src/app/common/modals/comments-modal/comments-modal.scss +++ /dev/null @@ -1,15 +0,0 @@ -.modal-comment { - .image-comment { - width: 100%; - height: 100%; - align-content: center; - border-radius: 5px; - padding: 0; - border: none; - } - .pdf-comment { - width: 100%; - height: 80vh; - align-content: center; - } -} \ No newline at end of file diff --git a/src/app/common/modals/comments-modal/comments-modal.tpl.html b/src/app/common/modals/comments-modal/comments-modal.tpl.html deleted file mode 100644 index 59985945f..000000000 --- a/src/app/common/modals/comments-modal/comments-modal.tpl.html +++ /dev/null @@ -1,10 +0,0 @@ -
-
-
- -
-
-