Merge branch 'develop' into feature/#599-Dedicated-File-Screen

CHANGELOG.md

@@ -16,16 +16,15 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - add vars to html-files
 - add translations to resource files
 - include translation for components
-
-### Changed
 - Migrate MatSnackBar to SnackBarService. [#724](https://github.com/h-da/geli/pull/724)
 - Reload user list after deleting an account. [#724](https://github.com/h-da/geli/pull/724)
 - Validate form before submit when creating a new course. [#724](https://github.com/h-da/geli/pull/724)
 - Validate :id for CourseController details route. [#724](https://github.com/h-da/geli/pull/724)
 - Another MatSnackBar to SnackBarService migration. [#730](https://github.com/h-da/geli/pull/730)
 - `getNotificationSettings` does not create new notification settings. [#731](https://github.com/h-da/geli/issues/731)
 - Remove `isCourseTeacherOrAdmin` and `isMemberOfCourse`from UserService. [#731](https://github.com/h-da/geli/issues/731)
-- Refactored save mechanism of unit forms. [#532](https://github.com/h-da/geli/issues/532)
+- Refactored save mechanism of unit edit form. [#532](https://github.com/h-da/geli/issues/532)
+- Moved the 'create course' into a Dialog. [#725](https://github.com/h-da/geli/issues/725)
 
 ### Fixed
 - Fixed broken notification settings. [#731](https://github.com/h-da/geli/issues/731)

app/webFrontend/src/app/course/course-new/course-new.component.html

@@ -1,6 +1,6 @@
-<div class="center-both">
-  <h1>{{ 'dashboard.addCourse' | translate }}</h1>
-  <mat-card>
+<h1>{{ 'dashboard.addCourse' | translate }}</h1>
+<mat-dialog-content>
+  <div class="center-both">
     <form class="course-form" (ngSubmit)="newCourse.valid && createCourse()" [formGroup]="newCourse">
       <mat-form-field class="full-width">
         <input matInput formControlName="name" [placeholder]="'course.placeholder.name' | translate">
@@ -14,6 +14,7 @@ <h1>{{ 'dashboard.addCourse' | translate }}</h1>
       </mat-form-field>
       <br/>
       <button mat-raised-button color="primary" class="mat-button" type="submit">{{ 'dashboard.addCourse' | translate }}</button>
+      <button class="mat-button" color="secondary" (click)="close()" type="reset">Cancel</button>
     </form>
-  </mat-card>
-</div>
+  </div>
+</mat-dialog-content>

app/webFrontend/src/app/course/course-new/course-new.component.scss

@@ -0,0 +1,3 @@
+.full-width {
+  width: 100%;
+}

app/webFrontend/src/app/course/course-new/course-new.component.ts

@@ -5,6 +5,7 @@ import {SnackBarService} from '../../shared/services/snack-bar.service';
 import {Router} from '@angular/router';
 import {errorCodes} from '../../../../../../api/src/config/errorCodes';
 import {TitleService} from '../../shared/services/title.service';
+import {MatDialogRef} from '@angular/material';
 
 @Component({
   selector: 'app-course-new',
@@ -20,7 +21,8 @@ export class CourseNewComponent implements OnInit {
               private formBuilder: FormBuilder,
               private courseService: CourseService,
               private snackBar: SnackBarService,
-              private titleService: TitleService) {
+              private titleService: TitleService,
+              public dialogRef: MatDialogRef<CourseNewComponent>) {
   }
 
   ngOnInit() {
@@ -44,6 +46,7 @@ export class CourseNewComponent implements OnInit {
         this.snackBar.open('Error creating course ' + err.error.message);
       }
     });
+    this.dialogRef.close();
   }
 
   generateForm() {
@@ -53,4 +56,7 @@ export class CourseNewComponent implements OnInit {
     });
   }
 
+  close() {
+    this.dialogRef.close();
+  }
 }

app/webFrontend/src/app/start/dashboard/dashboard-admin/dashboard-admin.component.html

@@ -4,5 +4,5 @@
 <app-mat-fab-menu class="add-course-fab" [open]="fabOpen" [onClick]="onFabClick"
                   [fabTooltip]="'dashboard.addCourse'|translate">
   <div (click)="onImportCourse()">{{ 'dashboard.importCourse'|translate }}</div>
-  <div routerLink="course/new">{{ 'dashboard.createCourse'|translate }}</div>
+  <div (click)="createCourse()">{{ 'dashboard.createCourse'|translate }}</div>
 </app-mat-fab-menu>

app/webFrontend/src/app/start/dashboard/dashboard-admin/dashboard-admin.component.ts

@@ -3,6 +3,8 @@ import {DashboardBaseComponent} from '../dashboard-base-component';
 import {SnackBarService} from '../../../shared/services/snack-bar.service';
 import {DialogService} from '../../../shared/services/dialog.service';
 import {Router} from '@angular/router';
+import {CourseNewComponent} from '../../../course/course-new/course-new.component';
+import {MatDialog} from '@angular/material';
 
 @Component({
   selector: 'app-dashboard-admin',
@@ -15,7 +17,8 @@ export class DashboardAdminComponent extends DashboardBaseComponent {
 
   constructor(private snackBar: SnackBarService,
               private router: Router,
-              private dialogService: DialogService) {
+              private dialogService: DialogService,
+              private dialog: MatDialog) {
     super();
   }
 
@@ -44,4 +47,12 @@ export class DashboardAdminComponent extends DashboardBaseComponent {
         }
       });
   }
+
+  createCourse() {
+    this.onFabClick();
+    this.dialog.open(CourseNewComponent, {
+      width: '400px',
+      maxWidth: '100%'}
+    );
+  }
 }

app/webFrontend/src/app/start/dashboard/dashboard-student/dashboard-student.component.ts

@@ -4,6 +4,8 @@ import {UserService} from '../../../shared/services/user.service';
 import {DashboardBaseComponent} from '../dashboard-base-component';
 import {SortUtil} from '../../../shared/utils/SortUtil';
 import {TranslateService} from '@ngx-translate/core';
+import {CourseNewComponent} from '../../../course/course-new/course-new.component';
+import {MatDialog} from '@angular/material';
 
 
 @Component({

app/webFrontend/src/app/start/dashboard/dashboard-teacher/dashboard-teacher.component.html

@@ -14,5 +14,5 @@
 <app-mat-fab-menu class="add-course-fab" [open]="fabOpen" [onClick]="onFabClick"
                   [fabTooltip]="'dashboard.addCourse'|translate">
   <div (click)="onImportCourse()">{{ 'dashboard.importCourse'|translate }}</div>
-  <div routerLink="course/new">{{ 'dashboard.createCourse'|translate }}</div>
+  <div (click)="createCourse()">{{ 'dashboard.createCourse'|translate }}</div>
 </app-mat-fab-menu>

app/webFrontend/src/app/start/dashboard/dashboard-teacher/dashboard-teacher.component.ts

@@ -6,6 +6,8 @@ import {SnackBarService} from '../../../shared/services/snack-bar.service';
 import {Router} from '@angular/router';
 import {DialogService} from '../../../shared/services/dialog.service';
 import {SortUtil} from '../../../shared/utils/SortUtil';
+import {MatDialog, MatDialogConfig} from '@angular/material';
+import {CourseNewComponent} from '../../../course/course-new/course-new.component';
 
 @Component({
   selector: 'app-dashboard-teacher',
@@ -23,7 +25,8 @@ export class DashboardTeacherComponent extends DashboardBaseComponent {
   constructor(public userService: UserService,
               private router: Router,
               private dialogService: DialogService,
-              private snackBar: SnackBarService) {
+              private snackBar: SnackBarService,
+              private dialog: MatDialog) {
     super();
   }
 
@@ -73,4 +76,12 @@ export class DashboardTeacherComponent extends DashboardBaseComponent {
         }
       });
   }
+
+  createCourse() {
+    this.onFabClick();
+    this.dialog.open(CourseNewComponent, {
+      width: '400px',
+      maxWidth: '100%'}
+    );
+  }
 }