Skip to content

Commit

Permalink
Lectures: Improve lecture attachment validation (ls1intum#9893)
Browse files Browse the repository at this point in the history
  • Loading branch information
@florian-glombik @laxerhd
florian-glombik authored and laxerhd committed Dec 5, 2024
1 parent 5d7b755 commit 3574056
Show file tree
Hide file tree
Showing 4 changed files with 169 additions and 91 deletions.
50 changes: 23 additions & 27 deletions src/main/webapp/app/lecture/lecture-attachments.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.attachments"></h4>
<th><span jhiTranslate="global.field.id"></span></th>
<th><span jhiTranslate="artemisApp.lecture.attachments.name"></span></th>
<th><span jhiTranslate="artemisApp.lecture.attachments.type"></span></th>
<th><span jhiTranslate="artemisApp.lecture.attachments.link"></span></th>
<th><span jhiTranslate="artemisApp.lecture.attachments.releaseDate"></span></th>
<th><span jhiTranslate="artemisApp.lecture.attachments.uploadDate"></span></th>
<th><span jhiTranslate="artemisApp.lecture.attachments.version"></span></th>
Expand All @@ -53,25 +52,25 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.attachments"></h4>
</thead>
<tbody>
@for (attachment of attachments; track trackId($index, attachment)) {
<tr [ngClass]="{ 'edit-overlay-container': attachmentToBeCreated?.id === attachment?.id }">
<tr [ngClass]="{ 'edit-overlay-container': attachmentToBeUpdatedOrCreated()?.id === attachment?.id }">
<td>
{{ attachment.id }}
</td>
<td>{{ attachment.name }}</td>
<td>{{ attachment.attachmentType }}</td>
<td>
@if (!isDownloadingAttachmentLink) {
<a class="text-primary" (click)="downloadAttachment(attachment.link || '')">
{{ attachment.name }}
</a>
}
@if (isDownloadingAttachmentLink === attachment.link) {
} @else if (isDownloadingAttachmentLink === attachment.link) {
<a class="text-primary">
<fa-icon [icon]="faSpinner" animation="spin" />
{{ 'artemisApp.courseOverview.lectureDetails.isDownloading' | artemisTranslate }}
</a>
} @else {
{{ attachment.name }}
}
</td>
<td>{{ attachment.attachmentType }}</td>
<td>{{ attachment.releaseDate | artemisDate }}</td>
<td>{{ attachment.uploadDate | artemisDate }}</td>
<td>
Expand All @@ -91,7 +90,7 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.attachments"></h4>
</button>
}
<button
[disabled]="attachmentToBeCreated?.id === attachment?.id"
[disabled]="attachmentToBeUpdatedOrCreated()?.id === attachment?.id"
type="button"
(click)="editAttachment(attachment)"
class="btn btn-primary btn-sm me-1"
Expand All @@ -102,7 +101,7 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.attachments"></h4>
@if (lecture().isAtLeastInstructor) {
<button
type="button"
[disabled]="attachmentToBeCreated?.id === attachment?.id"
[disabled]="attachmentToBeUpdatedOrCreated()?.id === attachment?.id"
jhiDeleteButton
[entityTitle]="attachment?.name || ''"
deleteQuestion="artemisApp.attachment.deleteQuestion"
Expand All @@ -114,7 +113,7 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.attachments"></h4>
}
</div>
</td>
@if (attachmentToBeCreated?.id === attachment?.id) {
@if (attachmentToBeUpdatedOrCreated()?.id === attachment?.id) {
<div class="edit-overlay" jhiTranslate="artemisApp.lecture.attachments.isBeingEdited"></div>
}
</tr>
Expand All @@ -125,11 +124,11 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.attachments"></h4>
}
</div>
</div>
@if (attachmentToBeCreated) {
<div>
@if (attachmentToBeUpdatedOrCreated()) {
<form [formGroup]="form">
<div class="row">
<div class="col-12">
@if (!attachmentToBeCreated.id) {
@if (!attachmentToBeUpdatedOrCreated()!.id) {
<h4 jhiTranslate="artemisApp.lecture.attachments.newAttachment"></h4>
} @else {
<h4 jhiTranslate="artemisApp.lecture.attachments.editAttachment"></h4>
Expand All @@ -140,11 +139,11 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.editAttachment"></h4>
<div class="col-12 col-md-6">
<div class="form-group">
<label for="attachmentName" jhiTranslate="artemisApp.lecture.attachments.name"></label>
<input type="text" class="form-control" id="attachmentName" name="attachmentName" [(ngModel)]="attachmentToBeCreated.name" />
<input type="text" class="form-control" id="attachmentName" name="attachmentName" formControlName="attachmentName" />
</div>
<div class="form-group">
<label
for="lectureAttachmentInput{{ attachmentToBeCreated.name }}"
for="lectureAttachmentInput{{ attachmentToBeUpdatedOrCreated()!.name }}"
class="form-control-label"
jhiTranslate="artemisApp.lecture.attachments.file"
>File</label
Expand All @@ -158,12 +157,15 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.editAttachment"></h4>
<div class="custom-file overflow-ellipsis">
<input
#fileInput
id="lectureAttachmentInput{{ attachmentToBeCreated.name }}"
id="lectureAttachmentInput{{ attachmentToBeUpdatedOrCreated()!.name }}"
type="file"
class="custom-file-input"
[accept]="acceptedFileExtensionsFileBrowser"
[placeholder]="'artemisApp.lecture.attachments.chooseFile' | artemisTranslate"
(change)="setLectureAttachment($event)"
[class.ng-invalid]="!isFileSelectionValid()"
[class.invalid-file-input-margin]="!isFileSelectionValid()"
formControlName="attachmentFileName"
aria-describedby="fileHelp"
/>
</div>
Expand All @@ -175,30 +177,25 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.editAttachment"></h4>
}
</div>
<div class="form-group">
<jhi-date-time-picker
labelName="{{ 'artemisApp.lecture.attachments.releaseDate' | artemisTranslate }}"
[(ngModel)]="attachmentToBeCreated.releaseDate"
name="endDate"
/>
<jhi-date-time-picker labelName="{{ 'artemisApp.lecture.attachments.releaseDate' | artemisTranslate }}" formControlName="releaseDate" />
</div>
@if (attachmentToBeCreated.id) {
@if (attachmentToBeUpdatedOrCreated()!.id) {
<div class="form-group">
<label for="attachmentName" jhiTranslate="artemisApp.lecture.attachments.notificationText"></label>
<input
type="text"
class="form-control"
id="notificationText"
name="attachmentName"
formControlName="notificationText"
[placeholder]="'artemisApp.lecture.attachments.notificationPlaceholder' | artemisTranslate"
[(ngModel)]="notificationText"
/>
</div>
}
</div>
</div>
<div class="row">
<div class="col-12">
<button id="upload-attachment" type="button" [disabled]="!isSubmitPossible" (click)="saveAttachment()" class="btn btn-primary me-2">
<button id="upload-attachment" type="button" [disabled]="!isFormValid()" (click)="saveAttachment()" class="btn btn-primary me-2">
<fa-icon [icon]="faPaperclip" />&nbsp;
<span jhiTranslate="entity.action.saveAttachment"></span>
</button>
Expand All @@ -207,9 +204,8 @@ <h4 jhiTranslate="artemisApp.lecture.attachments.editAttachment"></h4>
</button>
</div>
</div>
</div>
}
@if (!attachmentToBeCreated) {
</form>
} @else {
<div class="row">
<div class="col-12">
<button type="button" (click)="addAttachment()" class="btn btn-primary" id="add-attachment">
Expand Down
4 changes: 4 additions & 0 deletions src/main/webapp/app/lecture/lecture-attachments.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,7 @@
pointer-events: none;
cursor: default;
}

.invalid-file-input-margin {
padding-left: 0.5em;
}
Loading

0 comments on commit 3574056

Please sign in to comment.