commit #13 - adding services to submit drafts and papers

ompp-api/src/main/java/com/diss/omppapp/api/MinutePaperController.java

@@ -2,13 +2,11 @@ package com.diss.omppapp.api;
 
 import com.diss.omppapp.entities.AnswerEntity;
 import com.diss.omppapp.entities.QuestionEntity;
+import com.diss.omppapp.pojo.StudentResponse;
 import com.diss.omppapp.services.MinutePaperService;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.http.MediaType;
-import org.springframework.web.bind.annotation.PostMapping;
-import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.ResponseBody;
-import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.bind.annotation.*;
 
 import java.util.List;
 import java.util.Map;
@@ -30,4 +28,12 @@ public class MinutePaperController {
     public List<AnswerEntity> getPaperAnswers(@RequestBody Map<String,String> request) {
         return minutePaperService.getAnswers(request.get("username"),request.get("paperId"));
     }
+
+    @PostMapping(value = "/saveDraft",consumes = MediaType.APPLICATION_JSON_VALUE)
+    @ResponseBody
+    public String saveDraft(@RequestBody List<StudentResponse> request) {
+        System.out.println(request.size());
+        System.out.println(request.get(0).getAnswerText());
+        return "heard";
+    }
 }

ompp-api/src/main/java/com/diss/omppapp/configurations/WebConfig.java

@@ -17,7 +17,7 @@ public class WebConfig implements WebMvcConfigurer {
             public void addCorsMappings(CorsRegistry registry) {
                 registry.addMapping("/**")
                         .allowedOrigins("*")
-                        .allowedMethods("PUT","DELETE","GET","POST","HEAD", "OPTIONS")
+                        .allowedMethods("POST, PUT, GET, OPTIONS, DELETE")
                         .allowedHeaders("Content-Type","X-Requested-With","accept","authorization","Origin","Access-Control-Request-Headers")
                         .maxAge(3600);
             }

ompp-api/src/main/java/com/diss/omppapp/pojo/StudentResponse.java

+package com.diss.omppapp.pojo;
+
+public class StudentResponse {
+    private String username;
+    private String paperId;
+    private String questionId;
+    private String answerText;
+
+    public StudentResponse(String username, String paperId, String questionId, String answerText) {
+        this.setUsername(username);
+        this.setPaperId(paperId);
+        this.setQuestionId(questionId);
+        this.setAnswerText(answerText);
+    }
+
+    public StudentResponse() {
+    }
+
+    public String getUsername() {
+        return username;
+    }
+
+    public void setUsername(String username) {
+        this.username = username;
+    }
+
+    public String getPaperId() {
+        return paperId;
+    }
+
+    public void setPaperId(String paperId) {
+        this.paperId = paperId;
+    }
+
+    public String getQuestionId() {
+        return questionId;
+    }
+
+    public void setQuestionId(String questionId) {
+        this.questionId = questionId;
+    }
+
+    public String getAnswerText() {
+        return answerText;
+    }
+
+    public void setAnswerText(String answerText) {
+        this.answerText = answerText;
+    }
+}

ompp-web/src/app/LoginComponents/login.component.html

@@ -3,7 +3,7 @@
     <h1>OMP+</h1>
   </div>
   <form [formGroup]="loginForm" (ngSubmit)="login()">
-    <div class="form-group">
+    <div>
       <label for="username">Username</label>
       <input id="username" type="text" formControlName="username" placeholder="username"
              value="" [ngClass]="{'is-invalid' : loginForm.controls.username.errors && isSubmitted}">
@@ -12,7 +12,7 @@
         <div *ngIf="loginForm.controls.username.errors.required">Username is required.</div>
       </div>
     </div>
-    <div class="form-group">
+    <div>
       <label for="password">Password</label>
       <input id="password" type="password" formControlName="password" class="form-control" placeholder="password"
              value="" [ngClass]="{'is-invalid' : loginForm.controls.password.errors && isSubmitted}">
@@ -21,7 +21,7 @@
           <div *ngIf="loginForm.controls.password.errors.required">Password is required.</div>
       </div>
     </div>
-    <div class="form-group">
+    <div>
       <div>
         <button class="btn btn-primary" type="submit" [disabled]="!loginForm.valid">Login</button>
       </div>

ompp-web/src/app/StudentComponents/StudentClassView/student-class-view.component.html

@@ -23,7 +23,7 @@
         <span class="row">Class Code: {{paper.classCode}} </span>
         <span class="row">Minute-paper Topic: {{paper.topic}}</span>
         <span class="row">Opened: {{paper.creationDate}}</span>
-        <span class="row"><button>Respond</button></span>
+        <span class="row"><button (click)="goToSubmissionView(paper.paperId)">Respond</button></span>
       </div>
     </div>
   </div>

ompp-web/src/app/StudentComponents/StudentClassView/student-class-view.component.ts

@@ -40,6 +40,12 @@ export class StudentClassViewComponent implements OnInit, OnDestroy {
     this.studentViewService.changeToClassView(false);
   }
 
+  private goToSubmissionView(paperId: String) {
+    this.studentDataService.currentPaper = this.getCurrentPaper(paperId);
+    this.studentViewService.changeToDashboard(false);
+    this.studentViewService.changeToSubmissionView(true);
+  }
+
   private getCurrentPaper(paperId: String) {
     let currentPaper: MinutePaperDao = null;
 

ompp-web/src/app/StudentComponents/StudentCompletedView/student-completed-view.component.ts

-import {AfterContentInit, Component, OnDestroy, OnInit} from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
 import {StudentViewService} from 'src/app/services/student-view.service';
 import {StudentDataService} from 'src/app/services/student-data.service';
 import {StudentInfoService} from 'src/app/services/student-info.service';
@@ -14,7 +14,6 @@ import {MinutePaperDao} from '../../dao/minute-paper.dao';
 })
 export class StudentCompletedViewComponent implements OnInit, OnDestroy {
 
-  private isAlive = true;
   public classCode: String;
   public currentPaper: MinutePaperDao;
   public studentId: String;
@@ -40,7 +39,6 @@ export class StudentCompletedViewComponent implements OnInit, OnDestroy {
   }
 
   ngOnDestroy(): void {
-    this.isAlive = false;
   }
 
   private organise() {

ompp-web/src/app/StudentComponents/StudentDashboardComponents/student-dashboard.component.html

@@ -24,7 +24,7 @@
         <span class="row">Class Code: {{paper.classCode}} </span>
         <span class="row">Minute-paper Topic: {{paper.topic}}</span>
         <span class="row">Opened: {{paper.creationDate}}</span>
-        <span class="row"><button>Respond</button></span>
+        <span class="row"><button (click)="goToSubmissionView(paper.paperId)">Respond</button></span>
       </div>
     </div>
   </div>

ompp-web/src/app/StudentComponents/StudentDashboardComponents/student-dashboard.component.ts

@@ -49,6 +49,22 @@ export class StudentDashboardComponent implements OnInit, OnDestroy {
     this.studentViewService.changeToClassView(true);
   }
 
+  private goToSubmissionView(paperId: String) {
+    this.studentDataService.currentPaper = this.getCurrentPaper(paperId);
+    this.studentViewService.changeToDashboard(false);
+    this.studentViewService.changeToSubmissionView(true);
+  }
+
+  private getCurrentPaper(paperId: String) {
+    let currentPaper: MinutePaperDao = null;
+    this.openPaperList.forEach(paper => {
+      if (paper.paperId === paperId) {
+        currentPaper = paper;
+      }
+    });
+    return currentPaper;
+  }
+
   private getClassList() {
     this.studentInfoService.getUserClasses(this.studentId).subscribe((data: OmpClassDao[]) => {
       data.forEach(c => this.classList.push(c));

ompp-web/src/app/StudentComponents/StudentSubmissionView/student-submission-view.component.html

+<div class="container">
+  <div>
+    <h4>Write a response about {{currentPaper.topic}} for {{currentPaper.classCode}}</h4>
+  </div>
+  <form [formGroup]="submissionForm">
+    <div formArrayName="questions">
+      <div *ngFor="let question of questionList; let i = index" [attr.data-index]="i">
+          <div class="row">
+            <span>Question {{i+1}}:</span>
+          </div>
+          <div class="row">
+            <label for="{{i}}">{{question.questionText}}</label>
+            <textarea id="{{i}}" [formControlName]="i" class="form-control" type="text" rows="3" placeholder="Start typing your response here.."></textarea>
+          </div>
+      </div>
+      <!-- Buttons  -->
+      <div class="row">
+        <button class="btn btn-primary" type="submit" (click)="submit()"> Submit Response </button>
+        <button class="btn btn-secondary" type="submit" (click)="save()"> Save As Draft </button>
+      </div>
+    </div>
+  </form>
+</div>

ompp-web/src/app/StudentComponents/StudentSubmissionView/student-submission-view.component.ts

-import {Component} from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
+import {StudentViewService} from '../../services/student-view.service';
+import {StudentInfoService} from '../../services/student-info.service';
+import {StudentDataService} from '../../services/student-data.service';
+import {QuestionDao} from '../../dao/question.dao';
+import {AnswerDao} from '../../dao/answer.dao';
+import {MinutePaperDao} from '../../dao/minute-paper.dao';
+import {FormArray, FormBuilder, FormGroup} from '@angular/forms';
+import {QuestionAnswerPairDao} from '../../dao/question-answer-pair.dao';
+import {StudentResponseDao} from '../../dao/student-response.dao';
 
 @Component({
     selector: 'app-student-submission-view',
     templateUrl: './student-submission-view.component.html',
     styleUrls: ['./student-submission-view.component.css']
 })
-export class StudentSubmissionViewComponent {
+export class StudentSubmissionViewComponent implements OnInit, OnDestroy {
 
-  constructor() {
+
+  private response: any;
+  private errorMessage: any;
+  private studentResponse: StudentResponseDao[];
+  public submissionForm: FormGroup;
+  public currentPaper: MinutePaperDao;
+  public studentId: String;
+  public answerList: AnswerDao[];
+  public questionList: QuestionDao[];
+
+  constructor(private studentViewService: StudentViewService,
+              private studentInfoService: StudentInfoService,
+              private studentDataService: StudentDataService,
+              private formBuilder: FormBuilder) {
+  }
+
+  ngOnInit(): void {
+    this.submissionForm = this.formBuilder.group({
+      questions: this.formBuilder.array([])
+    });
+    this.currentPaper = this.studentDataService.currentPaper;
+    this.studentId = this.studentDataService.studentId;
+    this.questionList = [];
+    this.answerList = [];
+    this.studentResponse = [];
+    this.getQuestions();
+    this.getAnswers();
+  }
+
+  ngOnDestroy(): void {
+  }
+
+  private submit() {
+    this.studentInfoService.submitResponse().subscribe(
+      response => this.response = response,
+      error => this.errorMessage = <any>error
+    );
+  }
+
+  private save() {
+    let index = 0;
+    this.questionList.forEach(q => {
+      if (this.submissionForm.get('questions').get(index.toString()) !== null) {
+        this.studentResponse.push(new StudentResponseDao(this.studentId, this.currentPaper.paperId,
+          q.questionId, this.submissionForm.get('questions').get(index.toString()).value));
+        index++;
+      }
+    });
+    this.studentInfoService.saveDraft(this.studentResponse).subscribe(
+      response => this.response = response,
+      error => this.errorMessage = <any>error
+    );
+  }
+
+  private getFormQuestions() {
+    return this.submissionForm.get('questions') as FormArray;
+  }
+
+  private organise() {
+    for (let i = 0; i < this.questionList.length; i++) {
+      if (this.questionList[i] && this.answerList[i]) {
+        this.getFormQuestions().push(this.formBuilder.control(this.answerList[i].answerText));
+      } else {
+        this.getFormQuestions().push(this.formBuilder.control(''));
+      }
+    }
+  }
+
+  private getQuestions() {
+    this.studentInfoService.getPaperQuestions(this.studentId, this.currentPaper.paperId).subscribe((data: QuestionDao[]) => {
+      data.forEach(e => this.questionList.push(e));
+      this.organise();
+    });
+  }
+
+  private getAnswers() {
+    this.studentInfoService.getPaperAnswers(this.studentId, this.currentPaper.paperId).subscribe((data: AnswerDao[]) => {
+      data.forEach(e => this.answerList.push(e));
+      this.organise();
+    });
   }
 
 }

ompp-web/src/app/dao/student-response.dao.ts

+
+export class StudentResponseDao {
+
+  username: String;
+  paperId: String;
+  questionId: String;
+  answerText: String;
+
+  constructor(username: String, paperId: String, questionId: String, answerText: String) {
+    this.username = username;
+    this.paperId = paperId;
+    this.questionId = questionId;
+    this.answerText = answerText;
+  }
+}

ompp-web/src/app/services/student-info.service.ts

@@ -3,6 +3,7 @@ import {HttpClient, HttpHeaders} from '@angular/common/http';
 import {HttpErrorService} from 'src/app/ErrorComponents/http-error.service';
 import {catchError} from 'rxjs/operators';
 import {Observable} from 'rxjs';
+import {StudentResponseDao} from '../dao/student-response.dao';
 
 const httpOptions = {
   headers: new HttpHeaders({
@@ -13,35 +14,47 @@ const httpOptions = {
 @Injectable()
 export class StudentInfoService {
 
-  constructor(private http: HttpClient, private errorService: HttpErrorService) {
+  constructor(private http$: HttpClient, private errorService: HttpErrorService) {
   }
 
   public getUserClasses(username: String): Observable<String | Object> {
-    return this.http.post('http://localhost:8080/getClassList', {username: username}, httpOptions).pipe(
+    return this.http$.post('http://localhost:8080/getClassList', {username: username}, httpOptions).pipe(
       catchError(this.errorService.handleError)
     );
   }
 
   public getOpenPapers(username: String): Observable<String | Object> {
-    return this.http.post('http://localhost:8080/getOpenPapers', {username: username}, httpOptions).pipe(
+    return this.http$.post('http://localhost:8080/getOpenPapers', {username: username}, httpOptions).pipe(
       catchError(this.errorService.handleError)
     );
   }
 
-  public getSubmittedPapers(username: String, classCode: String) {
-    return this.http.post('http://localhost:8080/getSubmittedClassPapers', {username: username, classCode: classCode}, httpOptions).pipe(
+  public getSubmittedPapers(username: String, classCode: String): Observable<String | Object> {
+    return this.http$.post('http://localhost:8080/getSubmittedClassPapers', {username: username, classCode: classCode}, httpOptions).pipe(
       catchError(this.errorService.handleError)
     );
   }
 
-  public getPaperQuestions(username: String, paperId: String) {
-    return this.http.post('http://localhost:8080/getPaperQuestions', {username: username, paperId: paperId}, httpOptions).pipe(
+  public getPaperQuestions(username: String, paperId: String): Observable<String | Object> {
+    return this.http$.post('http://localhost:8080/getPaperQuestions', {username: username, paperId: paperId}, httpOptions).pipe(
       catchError(this.errorService.handleError)
     );
   }
 
-  public getPaperAnswers(username: String, paperId: String) {
-    return this.http.post('http://localhost:8080/getPaperAnswers', {username: username, paperId: paperId}, httpOptions).pipe(
+  public getPaperAnswers(username: String, paperId: String): Observable<String | Object> {
+    return this.http$.post('http://localhost:8080/getPaperAnswers', {username: username, paperId: paperId}, httpOptions).pipe(
+      catchError(this.errorService.handleError)
+    );
+  }
+
+  public saveDraft(answers: StudentResponseDao[]): Observable<String | Object> {
+    return this.http$.post('http://localhost:8080/saveDraft', {answers: answers}, httpOptions).pipe(
+      catchError(this.errorService.handleError)
+    );
+  }
+
+  public submitResponse(): Observable<String | Object> {
+    return this.http$.post('http://localhost:8080/submitResponse', {}, httpOptions).pipe(
       catchError(this.errorService.handleError)
     );
   }